Update docs (15693)

Signed-off-by: Nester.zhou <ester.zhou@huawei.com>

en/application-dev/reference/arkui-ts/ts-basic-components-datepicker.md

@@ -20,33 +20,45 @@ Creates a date picker in the given date range.
 
 **Parameters**
 
-| Name| Type| Mandatory | Description|
-| -------- | -------- | ------------- | -------- |
-| start    | Date | No | Start date of the picker.<br>Default value: **Date('1970-1-1')**|
+| Name     | Type| Mandatory  | Description                                  |
+| -------- | ---- | ---- | -------------------------------------- |
+| start    | Date | No   | Start date of the picker.<br>Default value: **Date('1970-1-1')**  |
 | end      | Date | No   | End date of the picker.<br>Default value: **Date('2100-12-31')**|
 | selected | Date | No   | Date of the selected item.<br>Default value: current system date              |
 
-
 ## Attributes
 
+In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
+
 | Name                              | Type                                    | Description                                      |
-| ------| -------------- | -------- |
+| -------------------------------- | ---------------------------------------- | ---------------------------------------- |
 | lunar                            | boolean                                  | Whether to display the lunar calendar.<br>- **true**: Display the lunar calendar.<br>- **false**: Do not display the lunar calendar.<br>Default value: **false**|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](#pickertextstyle10) | Font color, font size, and font width for the top and bottom items.          |
+| textStyle<sup>10+</sup>          | [PickerTextStyle](#pickertextstyle10) | Font color, font size, and font width of all items except the top, bottom, and selected items.      |
+| selectedTextStyle<sup>10+</sup>  | [PickerTextStyle](#pickertextstyle10) | Font color, font size, and font width of the selected item.                     |
+
+## PickerTextStyle<sup>10+</sup>
 
+| Name  | Type                                    | Mandatory  | Description                     |
+| ----- | ---------------------------------------- | ---- | ------------------------- |
+| color | [ResourceColor](ts-types.md#resourcecolor) | No   | Font color.                    |
+| font  | [Font](ts-types.md#font)                 | No   | Text style. Only the font size and font width are supported.|
 
 ## Events
 
-| Name| Description|
-| -------- | -------- |
+In addition to the [universal events](ts-universal-events-click.md), the following events are supported.
+
+| Name                                      | Description       |
+| ---------------------------------------- | ----------- |
 | onChange(callback: (value: DatePickerResult) =&gt; void) | Triggered when a date is selected.|
 
 ## DatePickerResult
 
-| Name| Type| Description|
-| -------- | -------- | -------- |
-| year | number | Year of the selected date.|
+| Name   | Type  | Description                         |
+| ----- | ------ | --------------------------- |
+| year  | number | Year of the selected date.                    |
 | month | number | Month of the selected date. The value ranges from 0 to 11. The value **0** indicates January, and **11** indicates December.|
-| day | number | Day of the selected date.|
+| day   | number | Day of the selected date.                    |
 
 
 ## Example
@@ -63,7 +75,7 @@ struct DatePickerExample {
   build() {
     Column() {
       Button('Switch Calendar')
-        .margin({ top: 30 })
+        .margin({ top: 30, bottom: 30 })
         .onClick(() => {
           this.isLunar = !this.isLunar
         })

en/application-dev/reference/arkui-ts/ts-basic-components-textpicker.md

@@ -14,7 +14,7 @@ Not supported
 
 ## APIs
 
-TextPicker(options?: {range: string[]|Resource, selected?: number, value?: string})
+TextPicker(options?: {range: string[]|Resource|TextPickerRangeContent[], selected?: number, value?: string})
 
 Creates a text picker based on the selection range specified by **range**.
 
@@ -22,15 +22,27 @@ Creates a text picker based on the selection range specified by **range**.
 
 | Name| Type| Mandatory| Description|
 | -------- | -------- | -------- | -------- |
-| range | string[] \| [Resource](ts-types.md#resource)| Yes| Data selection range of the picker.|
+| range | string[] \| [Resource](ts-types.md#resource)\|[TextPickerRangeContent](#textpickerrangecontent10)[]<sup>10+</sup> | Yes| Data selection range of the picker. This parameter cannot be set to an empty array. If set to an empty array, it will not be displayed. If it is dynamically changed to an empty array, the current value remains displayed.|
 | selected | number | No| Index of the default item in the range.<br>Default value: **0**|
-| value | string | No| Value of the default item in the range. The priority of this parameter is lower than that of **selected**.<br>Default value: value of the first item|
+| value | string | No| Value of the default item in the range. The priority of this parameter is lower than that of **selected**.<br>Default value: value of the first item<br>**NOTE**\<br>This parameter works only for a text list. It does not work for an image list or a list consisting of text and images.|
+
+## TextPickerRangeContent<sup>10+</sup>
+
+| Name| Type                                                | Mandatory| Description  |
+| ------ | -------------------------------------------------------- | ---- | ---------- |
+| icon   | string \| [Resource](ts-types.md#resource) | Yes  | Image resource.|
+| text   | string \| [Resource](ts-types.md#resource) | No  | Text information.|
 
 ## Attributes
 
+In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
+
 | Name| Type| Description|
 | -------- | -------- | -------- |
 | defaultPickerItemHeight | number \| string | Height of each item in the picker.|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width for the top and bottom items.|
+| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width of all items except the top, bottom, and selected items.|
+| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width of the selected item.|
 
 ## Events
 
@@ -38,7 +50,7 @@ In addition to the [universal events](ts-universal-events-click.md), the followi
 
 | Name| Description|
 | -------- | -------- |
-| onChange(callback: (value: string, index: number) =&gt; void) | Triggered when an item in the picker is selected.<br>- **value**: value of the selected item.<br>- **index**: index of the selected item.|
+| onChange(callback: (value: string, index: number) =&gt; void) | Triggered when an item in the picker is selected.<br>- **value**: value of the selected item.<br>**NOTE**<br>For a text list or a list consisting of text and images, **value** indicates the text value of the selected item. For an image list, **value** is empty.<br>- **index**: index of the selected item. |
 
 
 ## Example

en/application-dev/reference/arkui-ts/ts-basic-components-timepicker.md

 # TimePicker
 
-The **\<TimePicker>** component allows users to select a time from the given range.
+The **\<TimePicker>** component allows users to select a time (with the hour and minute) from the given range.
 
 >  **NOTE**
 >
@@ -20,20 +20,25 @@ Creates a time picker, which is in 24-hour format by default.
 
 **Parameters**
 
-| Name| Type| Mandatory| Description|
-| -------- | -------- | -------- | -------- |
-| selected | Date | No| Time of the selected item.<br>Default value: current system time|
-
+| Name     | Type| Mandatory  | Description                    |
+| -------- | ---- | ---- | ------------------------ |
+| selected | Date | No   | Time of the selected item.<br>Default value: current system time|
 
 ## Attributes
 
-| Name| Type| Description|
-| -------- | -------- | -------- |
-| useMilitaryTime | boolean | Whether to display time in 24-hour format. The value cannot be modified dynamically.<br>Default value: **false**|
+In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
 
+| Name                              | Type                                    | Description                                 |
+| -------------------------------- | ---------------------------------------- | ----------------------------------- |
+| useMilitaryTime                  | boolean                                  | Whether to display time in 24-hour format. The value cannot be modified dynamically.<br>Default value: **false**|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width for the top and bottom items.     |
+| textStyle<sup>10+</sup>          | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width of all items except the top, bottom, and selected items. |
+| selectedTextStyle<sup>10+</sup>  | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | Font color, font size, and font width of the selected item.                |
 
 ## Events
 
+In addition to the [universal events](ts-universal-events-click.md), the following events are supported.
+
 | Name                                      | Description       |
 | ---------------------------------------- | ----------- |
 | onChange(callback: (value: TimePickerResult ) =&gt; void) | Triggered when a time is selected.|
@@ -48,9 +53,6 @@ Creates a time picker, which is in 24-hour format by default.
 
 ## Example
 
-
-### Time Picker
-
 ```ts
 // xxx.ets
 @Entry

en/application-dev/reference/arkui-ts/ts-methods-datepicker-dialog.md

@@ -21,6 +21,11 @@ Shows a date picker dialog box.
 | end | Date | No| Date('2100-12-31') | End date of the picker.|
 | selected | Date | No| Current system date| Selected date.|
 | lunar | boolean | No| false | Whether to display the lunar calendar.|
+| showTime<sup>10+</sup> | boolean | No| false | Whether to display the time item.|
+| useMilitaryTime<sup>10+</sup> | boolean | No| false | Whether to display time in 24-hour format.|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| - | Font color, font size, and font width for the top and bottom items.|
+| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| - | Font color, font size, and font width of all items except the top, bottom, and selected items.|
+| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| - | Font color, font size, and font width of the selected item.|
 | onAccept | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult)) => void | No| - | Callback invoked when the OK button in the dialog box is clicked.|
 | onCancel | () => void | No| - | Callback invoked when the Cancel button in the dialog box is clicked.|
 | onChange | (value: [DatePickerResult](ts-basic-components-datepicker.md#DatePickerResult)) => void | No| - | Callback invoked when the selected item in the picker changes.|

en/application-dev/reference/arkui-ts/ts-methods-textpicker-dialog.md

@@ -17,10 +17,13 @@ Shows a text picker in the given settings.
 
 | Name| Type| Mandatory|  Description|
 | -------- | -------- | -------- |  -------- |
-| range | string[] \| [Resource](ts-types.md#resource) | Yes|  Data selection range of the picker.|
+| range | string[] \| [Resource](ts-types.md#resource)\|[TextPickerRangeContent](ts-basic-components-textpicker.md#textpickerrangecontent10)[]<sup>10+</sup> | Yes|  Data selection range of the picker. This parameter cannot be set to an empty array. If set to an empty array, it will not be displayed.|
 | selected | number | No|  Index of the selected item.<br>Default value: **0**|
 | value       | string           | No   | Text of the selected item. This parameter does not take effect when the **selected** parameter is set. If the value is not within the range, the first item in the range is used instead.|
 | defaultPickerItemHeight | number \| string | No| Height of the picker item.|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width for the top and bottom items.|
+| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width of all items except the top, bottom, and selected items.|
+| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width of the selected item.|
 | onAccept | (value: [TextPickerResult](#textpickerresult)) => void | No|  Callback invoked when the OK button in the dialog box is clicked.|
 | onCancel | () => void | No| Callback invoked when the Cancel button in the dialog box is clicked.|
 | onChange | (value: [TextPickerResult](#textpickerresult)) => void | No|  Callback invoked when the selected item changes.|
@@ -29,7 +32,7 @@ Shows a text picker in the given settings.
 
 | Name| Type| Description|
 | -------- | -------- | -------- |
-| value | string | Text of the selected item.|
+| value | string | Text of the selected item.<br>**NOTE**<br>For a text list or a list consisting of text and images, **value** indicates the text value of the selected item.<br>For an image list, **value** is empty.|
 | index | number | Index of the selected item in the range.|
 
 ## Example

en/application-dev/reference/arkui-ts/ts-methods-timepicker-dialog.md

@@ -19,6 +19,9 @@ Shows a time picker dialog box.
 | -------- | -------- | -------- | -------- |
 | selected | Date | No| Selected time.<br>Default value: current system time|
 | useMilitaryTime | boolean | No| Whether to display time in 24-hour format. The 12-hour format is used by default.<br>Default value: **false**|
+| disappearTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width for the top and bottom items.|
+| textStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width of all items except the top, bottom, and selected items.|
+| selectedTextStyle<sup>10+</sup> | [PickerTextStyle](ts-basic-components-datepicker.md#pickertextstyle10) | No| Font color, font size, and font width of the selected item.|
 | onAccept | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult)) => void | No| Callback invoked when the OK button in the dialog box is clicked.|
 | onCancel | () => void | No| Callback invoked when the Cancel button in the dialog box is clicked.|
 | onChange | (value: [TimePickerResult](ts-basic-components-timepicker.md#TimePickerResult)) => void | No| Callback invoked when the selected time changes.|