update docs (8498)

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

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

 #  Search
 
+The **\<Search>** component provides an input area for users to search.
+
 > **NOTE**
 >
 > This component is supported since API version 8. Updates will be marked with a superscript to indicate their earliest API version.
 
-The **\<Search>** component provides an input area for users to search.
-
 ## Required Permissions
 
 None
@@ -18,34 +18,34 @@ Not supported
 
 Search(options?: { value?: string; placeholder?: string; icon?: string; controller?: SearchController })
 
-- Parameters
+**Parameters**
 
-  | Name | Type | Mandatory | Default Value | Description |
-  | -------- | -------- | -------- | -------- | -------- |
-  | value  | string | No| - | Text input in the search text box. |
-  | placeholder  | string | No  | - | Text displayed when there is no input. |
-  | icon | string | No| - | Path to the search icon. By default, the system search icon is used. The supported icon formats are .svg, .jpg, and .png. |
-  | controller | SearchController | No| - | Controller. |
+| Name        | Type            | Mandatory  | Default Value | Description                                    |
+| ----------- | ---------------- | ---- | ---- | ---------------------------------------- |
+| value       | string           | No   | -    | Text input in the search text box.                                  |
+| placeholder | string           | No   | -    | Text displayed when there is no input.                              |
+| icon        | string           | No   | -    | Path to the search icon. By default, the system search icon is used. The supported icon formats are .svg, .jpg, and .png.|
+| controller  | SearchController | No   | -    | Controller.                                    |
 
 
 ## Attributes
 
-| Name | Type | Default Value | Description |
-| -------- | -------- | -------- | -------- |
-| searchButton | string | –| Text on the search button located next to the search text box. By default, there is no search button. |
-| placeholderColor | [ResourceColor](../../ui/ts-types.md) | - | Placeholder text color. |
-| placeholderFont | [Font](../../ui/ts-types.md) | - | Placeholder text style. |
-| textFont | [Font](../../ui/ts-types.md) | - | Text font for the search text box. |
+| Name                     | Type                                    | Default Value | Description                   |
+| ----------------------- | ---------------------------------------- | ---- | --------------------- |
+| searchButton            | string                                   | –   | Text on the search button located next to the search text box. By default, there is no search button.|
+| placeholderColor        | [ResourceColor](ts-types.md#resourcecolor8)    | -    | Placeholder text color.     |
+| placeholderFont         | [Font](ts-types.md#font)             | -    | Placeholder text style.   |
+| textFont                | [Font](ts-types.md#font)                 | -    | Text font for the search text box.          |
 
 ## Events
 
-| Name | Description |
-| -------- | -------- |
-| onSubmit(callback: (value: string) => void) | Triggered when users click the search icon or the search button, or tap the search button on a soft keyboard.<br> - **value**: current text input. |
-| onChange(callback: (value: string) => void) | Triggered when the input in the text box changes.<br> - **value**: current text input. |
-| onCopy(callback: (value: string) => void) | Triggered when data is copied to the pasteboard.<br> - **value**: text copied. |
-| onCut(callback: (value: string) => void) | Triggered when data is cut from the pasteboard.<br> - **value**: text cut. |
-| onPaste(callback: (value: string) => void) | Triggered when data is pasted from the pasteboard.<br> - **value**: text pasted. |
+| Name                                      | Description                                    |
+| ---------------------------------------- | ---------------------------------------- |
+| onSubmit(callback: (value: string) => void) | Triggered when users click the search icon or the search button, or touch the search button on a soft keyboard.<br> -**value**: current text input.|
+| onChange(callback: (value: string) => void) | Triggered when the input in the text box changes.<br> -**value**: current text input. |
+| onCopy(callback: (value: string) => void) | Triggered when data is copied to the pasteboard.<br> -**value**: text copied.     |
+| onCut(callback: (value: string) => void) | Triggered when data is cut from the pasteboard.<br> -**value**: text cut.     |
+| onPaste(callback: (value: string) => void) | Triggered when data is pasted from the pasteboard.<br> -**value**: text pasted.     |
 
 ## SearchController
 
@@ -61,11 +61,11 @@ caretPosition(value: number): void
 
 Sets the position of the caret.
 
-- Parameters
+**Parameters**
 
-  | Name | Type | Mandatory | Default Value | Description |
-  | ---- | ------ | ---- | ---- | --------------------- |
-  | value | number | Yes   | - | Length from the start of the text string to the position where the caret is located. |
+| Name  | Type  | Mandatory  | Default Value | Description             |
+| ----- | ------ | ---- | ---- | ----------------- |
+| value | number | Yes   | -    | Length from the start of the character string to the position where the caret is located.|
 
 
 
@@ -76,29 +76,30 @@ Sets the position of the caret.
 @Entry
 @Component
 struct SearchExample {
-  @State changevalue: string = ''
-  @State submitvalue: string = ''
+  @State changeValue: string = ''
+  @State submitValue: string = ''
   controller: SearchController = new SearchController()
 
   build() {
     Flex({ direction: FlexDirection.Row, justifyContent: FlexAlign.Center, alignItems: ItemAlign.Center }) {
-      Text(this.submitvalue)
-      Text(this.changevalue)
-      Search({value: '', placeholder: 'Type to search', controller: this.controller})
+      Text(this.submitValue)
+      Text(this.changeValue)
+      Search({value: this.changeValue, placeholder: 'Type to search', controller: this.controller})
         .searchButton('Search')
         .width(400)
         .height(35)
         .backgroundColor(Color.White)
         .placeholderColor(Color.Grey)
-        .placeholderFont({ size: 50, weight: 10, family: 'serif', style: FontStyle.Normal })
+        .placeholderFont({ size: 26, weight: 10, family: 'serif', style: FontStyle.Normal })
         .onSubmit((value: string) => {
-          this.submitvalue = value
+          this.submitValue = value
         })
         .onChange((value: string) => {
-          this.changevalue = value
+          this.changeValue = value
         })
-        .margin({ top: 30 })
+        .margin({ top: 30, left:10, right:10 })
     }
   }
 }
 ```
+![search](figures/search.png)

en/application-dev/ui/ts-application-states-appstorage.md

@@ -21,7 +21,7 @@ By default, the attributes in the AppStorage are changeable. If needed, AppStora
 | Set | key: string,<br/>newValue: T | void | Replaces the value of a saved key. |
 | Link | key: string | @Link | Returns two-way binding to this attribute if there is data with a given key. This means that attribute changes made by a variable or component will be synchronized to the AppStorage, and attribute changes made through the AppStorage will be synchronized to the variable or component. If the attribute with this key does not exist or is read-only, undefined is returned. |
 | SetAndProp | propName: string,<br/>defaultValue: S | @Prop | Works in a way similar to the Prop API. If the current key is stored in the AppStorage, the value corresponding to the key is returned. If the key has not been created, a Prop instance corresponding to the default value is created and returned. |
-| Prop | key: string | @Prop | Returns one-way binding to an attribute with a given key if the attribute exists. This means that attribute changes made through the AppStorage will be synchronized to the variable or component, but attribute changes made by the variable or component will be synchronized to the AppStorage. The variable returned by this method is an immutable one, which is applicable both to the variable and immutable state attributes. If the attribute with the specified key does not exist, undefined is returned.<br/>> ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE**:<br/>> The attribute value used in the prop method must be of a simple type. |
+| Prop | key: string | @Prop | Returns one-way binding to an attribute with a given key if the attribute exists. This means that attribute changes made through the AppStorage will be synchronized to the variable or component, but attribute changes made by the variable or component will be synchronized to the AppStorage. The variable returned by this method is an immutable one, which is applicable both to the variable and immutable state attributes. If the attribute with the specified key does not exist, undefined is returned.<br/>**NOTE**<br/>The attribute value used in the prop method must be of a simple type. |
 | SetOrCreate | key: string,<br/>newValue: T | boolean | If an attribute that has the same name as the specified key exists: replaces the value of the attribute and returns true when the attribute can be modified; retains the original value of the attribute and returns false otherwise.<br/>If an attribute that has the same name as the specified key does not exist: creates an attribute whose key is key and value is newValue. The values null and undefined are not supported. |
 | Get | key: string | T or undefined | Obtains the value of the specified key. |
 | Has | propName: string | boolean | Checks whether the attribute corresponding to the specified key value exists. |
@@ -51,9 +51,8 @@ One-way data binding can be established between components and the AppStorage th
 ## Example
 
 
-```
-let varA = AppStorage.Link('varA')
-let envLang = AppStorage.Prop('languageCode')
+```ts
+// xxx.ets
 
 @Entry
 @Component