| onReady(callback: () => void) | Triggered when initialization of the component is completed.|
| onSelect(callback: (value: [RichEditorSelection](#richeditorselection)) => void) | Triggered when selection (by clicking the left mouse button, highlighting the text to select, and releasing the left mouse button) is performed.<br>- **value**: information about all selected spans.|
| aboutToIMEInput(callback: (value: [RichEditorInsertValue](#richeditorinsertvalue)) => boolean) | Triggered when content is about to be entered in the input method.<br>- **value**: content to be entered in the input method.|
| onIMEInputComplete(callback: (value: [RichEditorTextSpanResult](#richeditortextspanresult)) => void) | Triggered when text input is completed.<br>- **value**: text span information after text input is completed.|
| aboutToDelete(callback: (value: [RichEditorDeleteValue](#richeditordeletevalue)) => boolean) | Triggered when content is about to be deleted in the input method.<br>- **value**: information about the text span where the content to be deleted is located.|
| onDeleteComplete(callback: () => void) | Triggered when deletion in the input method is completed.|
## RichEditorInsertValue
Describes the text to be inserted.
| Name| Type| Mandatory| Description|
| -------- | -------- | -------- | -------- |
| insertOffset | number | Yes| Offset of the text to be inserted.|
| insertValue | string | Yes| Content of the text to be inserted.|
## RichEditorDeleteValue
| Name| Type| Mandatory| Description|
| -------- | -------- | -------- | -------- |
| offset | number | Yes| Offset of the text to be deleted.|
| direction | [RichEditorDeleteDirection](#richeditordeletedirection) | Yes| Direction of the delete operation.|
| length | number | Yes| Length of the content to be deleted.|
| richEditorDeleteSpans | Array<[RichEditorTextSpanResult](#richeditortextspanresult)\|[RichEditorImageSpanResult](#richeditorimagespanresult)> | Yes| Information about the text or image spans to be deleted.|
## RichEditorDeleteDirection
Enumerates the directions of the delete operation.
| fontColor | [ResourceColor](ts-types.md#resourcecolor) | Yes| Font color.|
| fontSize | number | Yes| Font size.|
| fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | Yes| Font style.|
| fontWeight | number | Yes| Font weight.|
| fontFamily | string | Yes| Font family.|
| decoration | {<br>type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br>color?: [ResourceColor](ts-types.md#resourcecolor)<br>} | Yes| Style and color of the text decorative line.|
## RichEditorImageSpanResult
Provides the image span style information returned by the backend.
| value | [RichEditorUpdateTextSpanStyleOptions](#richeditorupdatetextspanstyleoptions)\|[RichEditorUpdateImageSpanStyleOptions](#richeditorupdatetextspanstyleoptions) | Yes| Text or image span style options.|
| value | [RichEditorRange](#richeditorrange) | No | Range of the target span.|
**Return value**
| Type | Description |
| ----------------------- | ---------------- |
| Array<[RichEditorTextSpanResult](#richeditortextspanresult)\|[RichEditorImageSpanResult](#richeditorimagespanresult)> | Text and image span information.|
### deleteSpans
deleteSpans(value?: RichEditorRange): void
Deletes the text and image spans in a specified range.
| value | [RichEditorRange](#richeditorrange) | No| Range of the target spans. If this parameter is omitted, all text and image spans will be deleted.|
| start | number | No| Start position of the text span whose style needs to be updated. If this parameter is omitted, the value **0** will be used.|
| end | number | No| End position of the text span whose style needs to be updated. If this parameter is omitted, it indicates the end of the text span.|
| textStyle | [RichEditorTextStyle](#richeditortextstyle) | Yes| Text style.|
| start | number | No| Start position of the image span whose style needs to be updated. If this parameter is omitted, the value **0** will be used.|
| end | number | No| End position of the image span whose style needs to be updated. If this parameter is omitted, it indicates the end of the image span.|
| offset | number | No | Position of the text span to be added. If this parameter is omitted, the text span will be added to the end of all text strings.|
| style | [RichEditorTextStyle](#richeditortextstyle) | No | Style of the text span to be added. If this parameter is omitted, the default text style will be used.|
| fontColor | [ResourceColor](ts-types.md#resourcecolor) | No| Font color.|
| fontSize | [Length](ts-types.md#length)\| number | No| Font size.|
| fontStyle | [FontStyle](ts-appendix-enums.md#fontstyle) | No| Font style.|
| fontWeight | [FontWeight](ts-appendix-enums.md#fontweight)\| number \| string | No| Font weight.|
| fontFamily | [ResourceStr](ts-types.md#resourcestr)\| number \| string | No| Font family. Default value: **'HarmonyOS Sans'**.<br>Currently, only the default font is supported.|
| decoration | {<br>type: [TextDecorationType](ts-appendix-enums.md#textdecorationtype),<br>color?: [ResourceColor](ts-types.md#resourcecolor)<br>} \| number \| string | No| Style and color of the text decorative line.|
| offset | number | No | Position of the image span to be added. If this parameter is omitted, the image span will be added to the end of all text strings.|
| imageStyle | [RichEditorImageSpanStyle](#richeditorimagespanstyle) | No | Image style. If this parameter is omitted, the default image style will be used.|
A component that is used to control the application window, providing the component animator and application window linkage animator during application startup and exit.
The **\<FormLink>** component is provided for interactions between static widgets and widget providers. It supports three types of events: router, message, and call.
> **NOTE**
>
> - This component is supported since API version 10. Updates will be marked with a superscript to indicate their earliest API version.
>
> - This component can be used only in static widgets.
| action | string | Yes | Action type.<br>- **"router"**: redirection to the specified UIAbility of the widget provider.<br>- **"message"**: custom message. If this type of action is triggered, the [onFormEvent()](../apis/js-apis-app-form-formExtensionAbility.md#onformevent) lifecycle callback of the provider FormExtensionAbility is called.<br>- **"call"**: launch of the widget provider in the background. If this type of action is triggered, the specified UIAbility (whose [launch type](../../application-models/uiability-launch-type.md) must be singleton) of the widget provider is started in the background, but not displayed in the foreground. This action type requires that the widget provider should have the [ohos.permission.KEEP_BACKGROUND_RUNNING](../../security/permission-list.md#ohospermissionkeep_background_running) permission.|
| moduleName | string | No | Name of the target module when **action** is **"router"** or **"call"**. This parameter is optional. |
| bundleName | string | No | Name of the target bundle when **action** is **"router"** or **"call"**. This parameter is optional. |
| abilityName | string | Yes | Name of the target UIAbility when **action** is **"router"** or **"call"**. This parameter is mandatory.|
| params | Object | Yes | Additional parameters carried in the current action. The value is a key-value pair in JSON format. For the **"call"** action type, the **method** parameter (mandatory) must be set and its value type must be string.|
## Attributes
The [universal attributes](ts-universal-attributes-size.md) are supported.
## Events
The [universal events](ts-universal-events-click.md) are not supported.
## Example
```ts
@Entry
@Component
structFormLinkDemo{
build(){
Column(){
Text("This is a static widget").fontSize(20).margin(10)
// The router event is used to redirect to the specified UIAbility from the static widget.
FormLink({
action:"router",
abilityName:"EntryAbility",
params:{
'message':'testForRouter'// Customize the message to send.
}
}){
Button("router event").width(120)
}.margin(10)
// The message event triggers the onFormEvent callback of FormExtensionAbility.
FormLink({
action:"message",
abilityName:"EntryAbility",
params:{
'message':'messageEvent'// Customize the message to send.
}
}){
Button("message event").width(120)
}.margin(10)
// The call event is used to call the specified method in the UIAbility.
FormLink({
action:"call",
abilityName:"EntryAbility",
params:{
'method':'funA',// Set the name of the method to call in the EntryAbility.
| expandSafeArea | type?: Array <[SafeAreaType](ts-types.md#safeareatype10)>,<br>edges?: Array <[SafeAreaEdge](ts-types.md#safeareaedge10)> | Safe area to be expanded to.<br>Default value:<br>type: [SafeAreaType.SYSTEM, SafeAreaType.CUTOUT, SafeAreaType.KEYBOARD],<br>edges: [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM, SafeAreaEdge.START, SafeAreaEdge.END]<br>The default value expands the safe area to all available areas.<br>**type**: indicates the type of the extended security zone. This parameter is optional.<br>**edges**: edge for expanding the safe area. This parameter is optional.|
## Example
### Example 1
```
// xxx.ets
@Entry
@Component
struct SafeAreaExample1 {
@State text: string = ''
controller: TextInputController = new TextInputController()
You can apply foreground blur effects to a component.
> **NOTE**
>
> This attribute is supported since API version 10. Updates will be marked with a superscript to indicate their earliest API version.
## Attributes
| Name| Type| Description|
| -------- | -------- | -------- |
| foregroundBlurStyle | value:[BlurStyle](ts-appendix-enums.md#blurstyle9),<br>options?:[ForegroundBlurStyleOptions](#foregroundblurstyleoptions10) | Foreground blur style applied to the component.<br>**value**: settings of the foreground blur style, including the blur radius, mask color, mask opacity, saturation, and brightness.<br>**options**: foreground blur options. This parameter is optional.|
| colorMode | [ThemeColorMode](ts-appendix-enums.md#themecolormode10) | No | Color mode used for the foreground blur.<br>Default value: **ThemeColorMode.System**|
| adaptiveColor | [AdaptiveColor](ts-appendix-enums.md#adaptivecolor10) | No | Adaptive color mode.<br>Default value: **AdaptiveColor.Default**|
| scale | number | No | Foreground blur scale. This API is a system API.<br>Default value: **1.0**<br>Value range: [0.0, 1.0]<br>|