diff --git a/BUILD.gn b/BUILD.gn
index 8386556495fcb4f056eeea3d6c3d224a64de8cb0..a88bb2958bd48a46a59ed52175a1ec828ea0f0fc 100644
--- a/BUILD.gn
+++ b/BUILD.gn
@@ -29,7 +29,6 @@ ohos_copy("ets_internal_api") {
 ohos_copy("ets_component") {
   sources = [
     "api/@internal/component/ets/ability_component.d.ts",
-    "api/@internal/component/ets/action_sheet.d.ts",
     "api/@internal/component/ets/alert_dialog.d.ts",
     "api/@internal/component/ets/alphabet_indexer.d.ts",
     "api/@internal/component/ets/animator.d.ts",
@@ -37,22 +36,22 @@ ohos_copy("ets_component") {
     "api/@internal/component/ets/blank.d.ts",
     "api/@internal/component/ets/button.d.ts",
     "api/@internal/component/ets/calendar.d.ts",
-    "api/@internal/component/ets/camera.d.ts",
     "api/@internal/component/ets/circle.d.ts",
     "api/@internal/component/ets/column.d.ts",
     "api/@internal/component/ets/column_split.d.ts",
     "api/@internal/component/ets/common.d.ts",
     "api/@internal/component/ets/counter.d.ts",
     "api/@internal/component/ets/custom_dialog_controller.d.ts",
-    "api/@internal/component/ets/datapanel.d.ts",
-    "api/@internal/component/ets/datePicker.d.ts",
+    "api/@internal/component/ets/data_panel.d.ts",
+    "api/@internal/component/ets/date_picker.d.ts",
     "api/@internal/component/ets/divider.d.ts",
     "api/@internal/component/ets/ellipse.d.ts",
+    "api/@internal/component/ets/enums.d.ts",
     "api/@internal/component/ets/flex.d.ts",
     "api/@internal/component/ets/forEach.d.ts",
     "api/@internal/component/ets/form_component.d.ts",
     "api/@internal/component/ets/gauge.d.ts",
-    "api/@internal/component/ets/geometryView.d.ts",
+    "api/@internal/component/ets/geometry_view.d.ts",
     "api/@internal/component/ets/gesture.d.ts",
     "api/@internal/component/ets/grid.d.ts",
     "api/@internal/component/ets/gridItem.d.ts",
@@ -65,12 +64,10 @@ ohos_copy("ets_component") {
     "api/@internal/component/ets/line.d.ts",
     "api/@internal/component/ets/list.d.ts",
     "api/@internal/component/ets/listItem.d.ts",
-    "api/@internal/component/ets/loadingProgress.d.ts",
+    "api/@internal/component/ets/loading_progress.d.ts",
     "api/@internal/component/ets/marquee.d.ts",
-    "api/@internal/component/ets/menu.d.ts",
+    "api/@internal/component/ets/navigation.d.ts",
     "api/@internal/component/ets/navigator.d.ts",
-    "api/@internal/component/ets/navigatorView.d.ts",
-    "api/@internal/component/ets/option.d.ts",
     "api/@internal/component/ets/pageTransition.d.ts",
     "api/@internal/component/ets/panel.d.ts",
     "api/@internal/component/ets/path.d.ts",
@@ -96,10 +93,11 @@ ohos_copy("ets_component") {
     "api/@internal/component/ets/tab_content.d.ts",
     "api/@internal/component/ets/tabs.d.ts",
     "api/@internal/component/ets/text.d.ts",
-    "api/@internal/component/ets/textPicker.d.ts",
-    "api/@internal/component/ets/textarea.d.ts",
-    "api/@internal/component/ets/textinput.d.ts",
+    "api/@internal/component/ets/text_area.d.ts",
+    "api/@internal/component/ets/text_input.d.ts",
+    "api/@internal/component/ets/text_picker.d.ts",
     "api/@internal/component/ets/toggle.d.ts",
+    "api/@internal/component/ets/units.d.ts",
     "api/@internal/component/ets/video.d.ts",
     "api/@internal/component/ets/web.d.ts",
   ]
diff --git a/api/@internal/component/ets/ability_component.d.ts b/api/@internal/component/ets/ability_component.d.ts
index 9c5cb73a2855dbafa99ee28534ae686c1ce3c07e..6375574cc39f560f6a56539ff71a1e00758b4385 100644
--- a/api/@internal/component/ets/ability_component.d.ts
+++ b/api/@internal/component/ets/ability_component.d.ts
@@ -1,119 +1,107 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod} from "./common";
-import {Want} from "../api/common/ability/want";
-
-/**
- * controller of ability.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class AbilityController {
-    /**
-     * constructor.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    constructor();
-
-    /**
-     * load the ability in the AbilityComponent.
-     * Want: Capability description to be loaded
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    startAbility(value: Want);
-
-    /**
-     * Perform a return operation inside the AbilityComponent.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    performBackPress();
-
-    /**
-     * Obtains the number of tasks in the internal task stack of the AbilityComponent.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    getStackCount();
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class AbilityComponentExtend<T> extends AbilityComponentAttribute<T> {
-}
-
-/**
- * AbilityComponent inheritance abilitycomponentattribute.
- * Want: Capability description to be loaded.
- * controller: Ability Controller.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface AbilityComponent extends AbilityComponentAttribute<AbilityComponent> {
-  (value: { want: Want, controller?: AbilityController }): AbilityComponent;
-}
-
-/**
- * The attribute of ability.
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class AbilityComponentAttribute<T> extends CommonMethod<T> {
-  /**
-   * Callback when the abilityComponent environment starts up, after which the abilityController methods can be used.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onReady(event: () => void): T;
-
-  /**
-   * Callback when the abilityComponent environment is destroyed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onDestroy(event: () => void): T;
-
-  /**
-   * This event is triggered when the abilityComponent loads the mobility. Name indicates the Ability name.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onAbilityCreated(event: (name: string) => void): T;
-
-  /**
-   * Internal to the AbilityComponent, which is triggered when the Ability moves to the foreground.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onAbilityMoveToFront(event: () => void): T;
-
-  /**
-   * Internal to the AbilityComponent, which is triggered before the Mobility is removed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onAbilityWillRemove(event: () => void): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const AbilityComponentInterface: AbilityComponent;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { Want } from "../api/common/ability/want";
+
+/**
+ * controller of ability.
+ * @since 7
+ * @systemapi
+ */
+export declare class AbilityController {
+  /**
+   * constructor.
+   */
+  constructor();
+
+  /**
+   * load the ability in the AbilityComponent.
+   * Want: Capability description to be loaded
+   */
+  startAbility(value: Want);
+
+  /**
+   * Perform a return operation inside the AbilityComponent.
+   */
+  performBackPress();
+
+  /**
+   * Obtains the number of tasks in the internal task stack of the AbilityComponent.
+   */
+  getStackCount();
+}
+
+/**
+ * AbilityComponent constructor params.
+ * @since 7
+ * @systemapi
+ */
+export declare interface AbilityComponentOptions {
+  /**
+   * Capability description to be loaded.
+   */
+  want: Want;
+
+  /**
+   * controller: Ability Controller.
+   */
+  controller?: AbilityController;
+}
+
+/**
+ * AbilityComponent inheritance abilitycomponentattribute.
+ * @since 7
+ * @systemapi
+ */
+interface AbilityComponent extends AbilityComponentAttribute<AbilityComponent> {
+  (value: AbilityComponentOptions): AbilityComponent;
+}
+
+/**
+ * The attribute of ability.
+ * @since 7
+ * @systemapi
+ */
+declare class AbilityComponentAttribute<T> extends CommonMethod<T> {
+  /**
+   * Callback when the abilityComponent environment starts up, after which the abilityController methods can be used.
+   */
+  onReady(event: () => void): T;
+
+  /**
+   * Callback when the abilityComponent environment is destroyed.
+   */
+  onDestroy(event: () => void): T;
+
+  /**
+   * This event is triggered when the abilityComponent loads the mobility. Name indicates the Ability name.
+   */
+  onAbilityCreated(event: (name: string) => void): T;
+
+  /**
+   * Internal to the AbilityComponent, which is triggered when the Ability moves to the foreground.
+   */
+  onAbilityMoveToFront(event: () => void): T;
+
+  /**
+   * Internal to the AbilityComponent, which is triggered before the Mobility is removed.
+   */
+  onAbilityWillRemove(event: () => void): T;
+}
+
+// Used for IDE.
+export declare class AbilityComponentExtend<T> extends AbilityComponentAttribute<T> {}
+export declare const AbilityComponentInterface: AbilityComponent;
diff --git a/api/@internal/component/ets/action_sheet.d.ts b/api/@internal/component/ets/action_sheet.d.ts
deleted file mode 100644
index cffda349124564c3bbc28f1e150418497b8c4226..0000000000000000000000000000000000000000
--- a/api/@internal/component/ets/action_sheet.d.ts
+++ /dev/null
@@ -1,93 +0,0 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { DialogAlignment } from "./alert_dialog";
-import {CommonMethod, Resource} from "./common"
-
-/**
- * The information of sheet.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface SheetInfo {
-  /**
-   * Title Properties
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  title: string | Resource;
-
-  /**
-   * Icon Properties.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  icon?: string | Resource;
-
-  /**
-   * Callback method after the operation.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  action: () => void;
-}
-
-/**
- * Callback method after the operation.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ActionSheetExtend<T> extends ActionSheetAttribute<T> {
-}
-
-/**
- * create ActionSheet.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface ActionSheet extends ActionSheetAttribute<ActionSheet> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class ActionSheetAttribute<T> extends CommonMethod<T> {
-  /**
-   * Invoking method display.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  show(value: {
-    title: string | Resource;
-    message: string | Resource;
-    confirm?: {
-      value: string | Resource;
-      action: () => void;
-    };
-    cancel?: () => void;
-    sheets: Array<SheetInfo>;
-    autoCancel?: boolean;
-    alignment?: DialogAlignment;
-    offset?: { dx: number | string | Resource, dy: number | string | Resource };
-  });
-}
-
-/**
- * Definitions ActionSheetInterface.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const ActionSheetInterface: ActionSheet;
diff --git a/api/@internal/component/ets/alert_dialog.d.ts b/api/@internal/component/ets/alert_dialog.d.ts
index f87e0485b4816e0f0d40d6177156fdda93e47a52..632988ed228461bbdb926bb7990f4400a2e10448 100644
--- a/api/@internal/component/ets/alert_dialog.d.ts
+++ b/api/@internal/component/ets/alert_dialog.d.ts
@@ -1,219 +1,205 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod, Resource} from "./common"
-
-/**
- * The alignment of dialog,
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum DialogAlignment {
-  /**
-   * Vertical top alignment.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Top,
-
-  /**
-   * Align vertically to the center.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Center,
-
-  /**
-   * Vertical bottom alignment.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Bottom,
-
-  /**
-   * Default alignment.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Default
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-interface AlertDialog {
-  /**
-   * Invoking method display.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  show(value: {
-    /**
-     * Title Properties
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    title?: string | Resource;
-
-    /**
-     * message Properties
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    message: string | Resource;
-
-    /**
-     * Allows users to click the mask layer to exit.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    autoCancel?: boolean;
-
-    /**
-     * Invoke the commit function.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    confirm?: {
-
-      /**
-       * Text content of the confirmation button.
-       * @devices phone, tablet, car.
-       * @since 7
-       */
-      value: string | Resource;
-
-      /**
-       * Method executed by the callback.
-       * @devices phone, tablet, car.
-       * @since 7
-       */
-      action: () => void;
-    };
-
-    /**
-     * Execute Cancel Function.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    cancel?: () => void;
-
-    /**
-     * Alignment in the vertical direction.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    alignment?: DialogAlignment;
-
-    /**
-     * Offset of the pop-up window relative to the alignment position.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    offset?: { dx: number | string | Resource, dy: number | string | Resource };
-  } | {
-
-  /**
-   * Title Properties
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-    title?: string | Resource;
-
-    /**
-    * message Properties
-    * @devices phone, tablet, car.
-    * @since 7
-    */
-    message: string | Resource;
-
-    /**
-     * Allows users to click the mask layer to exit.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    autoCancel?: boolean;
-
-    /**
-     * First button.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    primaryButton: {
-      /**
-       * Text content of the confirmation button.
-       * @devices phone, tablet, car.
-       * @since 7
-       */
-       value: string | Resource;
-
-       /**
-        * Method executed by the callback.
-        * @devices phone, tablet, car.
-        * @since 7
-        */
-       action: () => void;
-    };
-
-    /**
-     * Second button.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    secondaryButton: {
-      /**
-       * Text content of the confirmation button.
-       * @devices phone, tablet, car.
-       * @since 7
-       */
-      value: string | Resource;
-
-      /**
-       * Method executed by the callback.
-       * @devices phone, tablet, car.
-       * @since 7
-       */
-      action: () => void;
-    };
-
-    /**
-     * Execute Cancel Function.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    cancel?: () => void;
-
-    /**
-      * Alignment in the vertical direction.
-      * @devices phone, tablet, car.
-      * @since 7
-      */
-    alignment?: DialogAlignment;
-
-    /**
-      * Offset of the pop-up window relative to the alignment position.
-      * @devices phone, tablet, car.
-      * @since 7
-      */
-    offset?: { dx: number | string | Resource, dy: number | string | Resource };
-  });
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const AlertDialogInterface: AlertDialog;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { ResourceColor } from ".";
+import { Offset, ResourceStr } from "./units";
+
+/**
+ * The alignment of dialog,
+ * @since 7
+ */
+export declare enum DialogAlignment {
+  /**
+   * Vertical top alignment.
+   * @since 7
+   */
+  Top,
+
+  /**
+   * Align vertically to the center.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * Vertical bottom alignment.
+   * @since 7
+   */
+  Bottom,
+
+  /**
+   * Default alignment.
+   * @since 7
+   */
+  Default,
+}
+
+/**
+ * Base param used for AlertDialog.show method.
+ * @since 7
+ */
+export declare interface AlertDialogParam {
+  /**
+   * Title Properties
+   * @since 7
+   */
+  title?: ResourceStr;
+
+  /**
+   * message Properties
+   * @since 7
+   */
+  message: ResourceStr;
+
+  /**
+   * Allows users to click the mask layer to exit.
+   * @since 7
+   */
+  autoCancel?: boolean;
+
+  /**
+   * Execute Cancel Function.
+   * @since 7
+   */
+  cancel?: () => void;
+
+  /**
+   * Alignment in the vertical direction.
+   * @since 7
+   */
+  alignment?: DialogAlignment;
+
+  /**
+   * Offset of the pop-up window relative to the alignment position.
+   * @since 7
+   */
+  offset?: Offset;
+
+  /**
+   * Grid count of dialog.
+   * @since 7
+   */
+  gridCount?: number;
+}
+
+/**
+ * Defines the AlertDialog with confirm button.
+ * @since 7
+ */
+export declare interface AlertDialogParamWithConfirm extends AlertDialogParam {
+  /**
+   * Invoke the commit function.
+   * @since 7
+   */
+  confirm?: {
+    /**
+     * Text content of the confirmation button.
+     * @since 7
+     */
+    value: ResourceStr;
+
+    /**
+     * Text color of the confirmation button.
+     * @since 7
+     */
+    fontColor?: ResourceColor;
+
+    /**
+     * Backgound color of the confirmation button.
+     * @since 7
+     */
+    backgroundColor?: ResourceColor;
+
+    /**
+     * Method executed by the callback.
+     * @since 7
+     */
+    action: () => void;
+  };
+}
+
+export declare interface AlertDialogParamWithButtons extends AlertDialogParam {
+  /**
+   * First button.
+   * @since 7
+   */
+  primaryButton: {
+    /**
+     * Text content of the confirmation button.
+     * @since 7
+     */
+    value: ResourceStr;
+
+    /**
+     * Text color of the confirmation button.
+     * @since 7
+     */
+    fontColor?: ResourceColor;
+
+    /**
+     * Backgound color of the confirmation button.
+     * @since 7
+     */
+    backgroundColor?: ResourceColor;
+
+    /**
+     * Method executed by the callback.
+     * @since 7
+     */
+    action: () => void;
+  };
+
+  /**
+   * Second button.
+   * @since 7
+   */
+  secondaryButton: {
+    /**
+     * Text content of the confirmation button.
+     * @since 7
+     */
+    value: ResourceStr;
+
+    /**
+     * Text color of the confirmation button.
+     * @since 7
+     */
+    fontColor?: ResourceColor;
+
+    /**
+     * Backgound color of the confirmation button.
+     * @since 7
+     */
+    backgroundColor?: ResourceColor;
+
+    /**
+     * Method executed by the callback.
+     * @since 7
+     */
+    action: () => void;
+  };
+}
+
+/**
+ * Defines AlertDialog which uses show method to show alert dialog.
+ * @since 7
+ */
+export declare class AlertDialog {
+  /**
+   * Invoking method display.
+   * @since 7
+   */
+  static show(value: AlertDialogParamWithConfirm | AlertDialogParamWithButtons);
+}
diff --git a/api/@internal/component/ets/alphabet_indexer.d.ts b/api/@internal/component/ets/alphabet_indexer.d.ts
index 62d06cf8a5a937c1877562cf389d3e60505a79fe..57aa49bc45496317188e5d3510b2ced89af72bb8 100644
--- a/api/@internal/component/ets/alphabet_indexer.d.ts
+++ b/api/@internal/component/ets/alphabet_indexer.d.ts
@@ -13,144 +13,117 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
-import {FontWeight, FontStyle} from "./text";
+import { CommonMethod } from "./common";
+import { ResourceColor, Font } from "./units";
 
 /**
- * @devices phone, tablet, car.
+ * indexer align property.
  * @since 7
  */
 export declare enum IndexerAlign {
   /**
    * A dialog box is displayed on the right of the index bar.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Left,
 
   /**
    * A dialog box is displayed on the left of the index bar.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Right
+  Right,
 }
 
 /**
  * Alphabet index bar.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class AlphabetIndexerExtend<T> extends AlphabetIndexerAttribute<T> {
-}
-
-/**
- * Alphabet index bar.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface AlphabetIndexer extends AlphabetIndexerAttribute<AlphabetIndexer> {
   /**
    * ArrayValue: Alphabetical index string array.
    * selected: ID of the selected item.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value: {ArrayValue : Array<string>, selected : number}): AlphabetIndexer;
+  (value: { arrayValue: Array<string>; selected: number }): AlphabetIndexer;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the alphabet index bar attribute functions.
  * @since 7
  */
 declare class AlphabetIndexerAttribute<T> extends CommonMethod<T> {
   /**
    * Index bar selection callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onSelected(event: (index: number) => void): T;
 
   /**
    * Definitions color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 
   /**
    * Select the text color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  selectedColor(value: Color | number | string | Resource): T;
+  selectedColor(value: ResourceColor): T;
 
   /**
    * Font color of the pop-up prompt text.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  popupColor(value: Color | number | string | Resource): T;
+  popupColor(value: ResourceColor): T;
 
   /**
    * Select the text background color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  selectedBackgroundColor(value: Color | number | string | Resource): T;
+  selectedBackgroundColor(value: ResourceColor): T;
 
   /**
    * Background color of the pop-up window index.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  popupBackground(value: Color | number | string | Resource): T;
+  popupBackground(value: ResourceColor): T;
 
   /**
    * Whether to use pop-up index hints.
-   * @devices phone, tablet, car.
    * @since 7
    */
   usingPopup(value: boolean): T;
 
   /**
    * Select the text text style,
-   * @devices phone, tablet, car.
    * @since 7
    */
-  selectedFont(value: { size?: number, weight?: FontWeight, family?: string, style?: FontStyle}): T;
+  selectedFont(value: Font): T;
 
   /**
    * Select the text background color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  popupFont(value: { size?: number, weight?: FontWeight, family?: string, style?: FontStyle}): T;
+  popupFont(value: Font): T;
 
   /**
    * Size of the letter area on the letter index bar. The letter area is a square. Set the length of the square side.
-   * @devices phone, tablet, car.
    * @since 7
    */
   itemSize(value: string | number): T;
 
   /**
    * Definitions fonts.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  font(value: { size?: number, weight?: FontWeight, family?: string, style?: FontStyle}): T;
+  font(value: Font): T;
 
   /**
    * Alphabet index bar alignment style. The left and right alignment styles are supported, which affects the pop-up position of the pop-up window.
-   * @devices phone, tablet, car.
    * @since 7
    */
   alignStyle(value: IndexerAlign): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const AlphabetIndexerInterface: AlphabetIndexer;
+export declare class AlphabetIndexerExtend<T> extends AlphabetIndexerAttribute<T> {}
diff --git a/api/@internal/component/ets/animator.d.ts b/api/@internal/component/ets/animator.d.ts
index 8af79b70894682b05f7137e666f91c0fbca73e21..55c27f5f673644ef8c0e040663572119fc1bdb29 100644
--- a/api/@internal/component/ets/animator.d.ts
+++ b/api/@internal/component/ets/animator.d.ts
@@ -13,185 +13,183 @@
  * limitations under the License.
  */
 
-import {CommonMethod, AnimationStatus, Curve, FillMode, PlayMode} from "./common";
+import { CommonMethod } from "./common";
+import { AnimationStatus, Curve, FillMode, PlayMode } from "./enums";
 
 /**
  * Customize spring properties.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export declare class SpringProp {
   /**
    * Constructor parameters
-   * @devices object, tablet.
    * @since 7
+   * @systemapi
    */
   constructor(mass: number, stiffness: number, damping: number);
 }
 
 /**
  * Spring animation model. You can build a spring animation based on the start point, end point, initial speed, and spring attributes.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export declare class SpringMotion {
   /**
    * Constructor parameters
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   constructor(start: number, end: number, velocity: number, prop: SpringProp);
 }
 
 /**
  * Friction animation model. You can build friction animation by friction force, initial position, and initial velocity.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export declare class FrictionMotion {
   /**
    * Constructor parameters
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   constructor(friction: number, position: number, velocity: number);
 }
 
 /**
  * Rolling animation model: You can build rolling animation based on the initial position, initial speed, boundary position, and spring attributes.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export declare class ScrollMotion {
   /**
    * Constructor parameters
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   constructor(position: number, velocity: number, min: number, max: number, prop: SpringProp);
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class AnimatorExtend<T> extends AnimatorAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
+ * Defines Animtor.
  * @since 7
+ * @systemapi
  */
 interface Animator extends AnimatorAttribute<Animator> {
+  /**
+   * Constructor parameters
+   * @since 7
+   * @systemapi
+   */
   (value: string): Animator;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines AnimatorAttribute.
  * @since 7
+ * @systemapi
  */
 declare class AnimatorAttribute<T> extends CommonMethod<T> {
   /**
    * Controls the playback status. The default value is the initial state.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   state(value: AnimationStatus): T;
 
   /**
    * Animation duration, in milliseconds.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   duration(value: number): T;
 
   /**
    * Animation curve, default to linear curve
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   curve(value: Curve): T;
 
   /**
    * Delayed animation playback duration, in milliseconds. By default, the animation is not delayed.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   delay(value: number): T;
 
   /**
    * Sets the state before and after the animation starts.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   fillMode(value: FillMode): T;
 
   /**
    * The default playback is once. If the value is -1, the playback is unlimited.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   iterations(value: number): T;
 
   /**
    * Sets the animation playback mode. By default, the animation starts to play again after the playback is complete.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   playMode(value: PlayMode): T;
 
   /**
    * Configure the physical animation algorithm.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   motion(value: SpringMotion | FrictionMotion | ScrollMotion): T;
 
   /**
    * Status callback, which is triggered when the animation starts to play.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onStart(event: () => void): T;
 
   /**
    * Status callback, triggered when the animation pauses.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onPause(event: () => void): T;
 
   /**
    * Status callback, triggered when the animation is replayed.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onRepeat(event: () => void): T;
 
   /**
    * Status callback, which is triggered when the animation is canceled.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onCancel(event: () => void): T;
 
   /**
    * Status callback, which is triggered when the animation playback is complete.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onFinish(event: () => void): T;
 
   /**
    * The callback input parameter is the interpolation during animation playback.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onFrame(event: (value: number) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const AnimatorInterface: Animator;
\ No newline at end of file
+export declare class AnimatorExtend<T> extends AnimatorAttribute<T> {}
+export declare const AnimatorInterface: Animator;
diff --git a/api/@internal/component/ets/badge.d.ts b/api/@internal/component/ets/badge.d.ts
index b29e7a7f32f52fa730619900ead5a8f2838a7b01..8b955feb71a2e526e139d3d2613d493cdc4ec93c 100644
--- a/api/@internal/component/ets/badge.d.ts
+++ b/api/@internal/component/ets/badge.d.ts
@@ -1,124 +1,152 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color, Resource} from "./common"
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare enum BadgePosition {
-  /**
-   * The dot is displayed vertically centered on the right.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  RightTop,
-
-  /**
-   * Dots are displayed in the upper right corner.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Right,
-
-  /**
-   * The dot is displayed in the left vertical center.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Left
-}
-
-/**
- * BadgeStyle object
- * @devices phone, tablet, car.
- * @since 7
- */
-interface BadgeStyle {
-  /**
-   * Text Color
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  color?: Color | number | string | Resource;
-
-  /**
-   * Text size.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  fontSize?: number | string;
-
-  /**
-   * Size of a badge.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  badgeSize: number | string;
-
-  /**
-   * Color of the badge.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  badgeColor: Color | number | string | Resource;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class BadgeExtend<T> extends BadgeAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Badge extends BadgeAttribute<Badge> {
-  /**
-   * position: Set the display position of the prompt point.
-   * maxCount: Maximum number of messages. If the number of messages exceeds the maximum, only maxCount+ is displayed.
-   * count: Set the number of reminder messages.
-   * style: You can set the style of the Badge component, including the text color, size, dot color, and size.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (value: {count: number, position?: BadgePosition, maxCount?: number, style: BadgeStyle}): Badge;
-
-  /**
-   * value: Text string of the prompt content.
-   * position: Set the display position of the prompt point.
-   * maxCount: Maximum number of messages. If the number of messages exceeds the maximum, only maxCount+ is displayed.
-   * style: You can set the style of the Badge component, including the text color, size, dot color, and size.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (value: {value: string, position?: BadgePosition, maxCount?: number, style: BadgeStyle}): Badge;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class BadgeAttribute<T> extends CommonMethod<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const BadgeInterface: Badge
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
+
+/**
+ * Defines the badge position property.
+ * @since 7
+ */
+export declare enum BadgePosition {
+  /**
+   * The dot is displayed vertically centered on the right.
+   * @since 7
+   */
+  RightTop,
+
+  /**
+   * Dots are displayed in the upper right corner.
+   * @since 7
+   */
+  Right,
+
+  /**
+   * The dot is displayed in the left vertical center.
+   * @since 7
+   */
+  Left,
+}
+
+/**
+ * BadgeStyle object
+ * @since 7
+ */
+export declare interface BadgeStyle {
+  /**
+   * Text Color
+   * @since 7
+   */
+  color?: ResourceColor;
+
+  /**
+   * Text size.
+   * @since 7
+   */
+  fontSize?: number | string;
+
+  /**
+   * Size of a badge.
+   * @since 7
+   */
+  badgeSize?: number | string;
+
+  /**
+   * Color of the badge.
+   * @since 7
+   */
+  badgeColor?: ResourceColor;
+}
+
+/**
+ * Defines the base param of badge.
+ * @since 7
+ */
+export declare interface BadgeParam {
+  /**
+   * Set the display position of the prompt point.
+   * @since 7
+   */
+  position?: BadgePosition;
+
+  /**
+   * Defines the style of the Badge component, including the text color, size, dot color, and size.
+   * @since 7
+   */
+  style: BadgeStyle;
+}
+
+/**
+ * Defines the badge param with count and maxCount.
+ * @since 7
+ */
+export declare interface BadgeParamWithNumber extends BadgeParam {
+  /**
+   * Set the number of reminder messages.
+   * @since 7
+   */
+  count: number;
+
+  /**
+   * Maximum number of messages. If the number of messages exceeds the maximum, only maxCount+ is displayed.
+   * @since 7
+   */
+  maxCount?: number;
+}
+
+/**
+ * Defines the badge param with string value.
+ * @since 7
+ */
+export declare interface BadgeParamWithString extends BadgeParam {
+  /**
+   * Text string of the prompt content.
+   * @since 7
+   */
+  value: string;
+}
+
+/**
+ * Defines Badge Componrnt.
+ * @since 7
+ */
+interface Badge extends BadgeAttribute<Badge> {
+  /**
+   * position: Set the display position of the prompt point.
+   * maxCount: Maximum number of messages. If the number of messages exceeds the maximum, only maxCount+ is displayed.
+   * count: Set the number of reminder messages.
+   * style: You can set the style of the Badge component, including the text color, size, dot color, and size.
+   * @since 7
+   */
+  (value: BadgeParamWithNumber): Badge;
+
+  /**
+   * value: Text string of the prompt content.
+   * position: Set the display position of the prompt point.
+   * maxCount: Maximum number of messages. If the number of messages exceeds the maximum, only maxCount+ is displayed.
+   * style: You can set the style of the Badge component, including the text color, size, dot color, and size.
+   * @since 7
+   */
+  (value: BadgeParamWithString): Badge;
+}
+
+/**
+ * Defines Badge Componrnt attribute.
+ * @since 7
+ */
+declare class BadgeAttribute<T> extends CommonMethod<T> {}
+
+export declare class BadgeExtend<T> extends BadgeAttribute<T> {}
+export declare const BadgeInterface: Badge;
diff --git a/api/@internal/component/ets/blank.d.ts b/api/@internal/component/ets/blank.d.ts
index 322e46cd5495ce0c5062b4ba540acba43a035ff7..782cf284d358d31b6fe8f024728e09efd3114b4b 100644
--- a/api/@internal/component/ets/blank.d.ts
+++ b/api/@internal/component/ets/blank.d.ts
@@ -13,45 +13,32 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common"
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class BlankExtend<T> extends BlankAttribute<T> {
-}
-
-/**
- * Create Blank
- * @devices phone, tablet, car.
+ * Create Blank.
  * @since 7
  */
 interface Blank extends BlankAttribute<Blank> {
   /**
    * The minimum size of the blank fill assembly on the container spindle.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (min?: number | string): Blank;
 }
 
 /**
- * inheritance CommonMethod Set Styles
- * @devices phone, tablet, car.
+ * Inheritance CommonMethod Set Styles
  * @since 7
  */
 declare class BlankAttribute<T> extends CommonMethod<T> {
   /**
    * color: set color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const BlankInterface: Blank
\ No newline at end of file
+export declare class BlankExtend<T> extends BlankAttribute<T> {}
+export declare const BlankInterface: Blank;
diff --git a/api/@internal/component/ets/button.d.ts b/api/@internal/component/ets/button.d.ts
index 68404dbb96affa5ea08a94810436aa30ffaed798..8eab0ed01ace07c182085ccdc22b55e3f2c48d3b 100644
--- a/api/@internal/component/ets/button.d.ts
+++ b/api/@internal/component/ets/button.d.ts
@@ -13,124 +13,111 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common"
-import {FontWeight} from "./text"
+import { CommonMethod } from "./common";
+import { FontWeight } from "./enums";
+import { Length, ResourceColor, ResourceStr } from "./units";
 
 /**
  * Provides a button component.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ButtonType {
   /**
    * Capsule button (rounded corners default to half the height).
-   * @devices phone, tablet, car.
    * @since 7
    */
   Capsule,
 
   /**
    * Round buttons.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Circle,
 
-  /**
-   * Arc Button.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Arc,
-
   /**
    * Common button (no rounded corners by default).
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Normal
+  Normal,
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the button options.
  * @since 7
  */
-export declare class ButtonExtend<T> extends ButtonAttribute<T> {
+export declare interface ButtonOption {
+  /**
+   * Describes the button style.
+   * @since 7
+   */
+  type?: ButtonType;
+
+  /**
+   * Indicates whether to enable the switchover effect when the button is pressed. When the status is set to false, the switchover effect is disabled.
+   * @since 7
+   */
+  stateEffect?: boolean;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the Button Component.
  * @since 7
  */
 interface Button extends ButtonAttribute<Button> {
   /**
    * Button object
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): Button;
 
   /**
-   * Describes the button style.
-   * stateEffect: Indicates whether to enable the switchover effect when the button is pressed. When the status is set to false, the switchover effect is disabled.
-   * @devices phone, tablet, car.
+   * Create Button with Text child.
    * @since 7
    */
-  (options: { type?: ButtonType, stateEffect?: boolean }): Button;
+  (options: ButtonOption): Button;
 
   /**
-   * Button text content.
-   * type: Describes the button style.
-   * stateEffect: Indicates whether to enable the switchover effect when the button is pressed. When the status is set to false, the switchover effect is disabled.
-   * @devices phone, tablet, car.
+   * Create Button with inner text label.
    * @since 7
    */
-  (label: string | Resource, options?: { type?: ButtonType, stateEffect?: boolean }): Button;
+  (label: ResourceStr, options?: ButtonOption): Button;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the button attibute functions.
  * @since 7
  */
 declare class ButtonAttribute<T> extends CommonMethod<T> {
   /**
    * Describes the button style.
-   * @devices phone, tablet, car.
    * @since 7
    */
   type(value: ButtonType): T;
 
   /**
    * Indicates whether to enable the switchover effect when the button is pressed. When the status is set to false, the switchover effect is disabled.
-   * @devices phone, tablet, car.
    * @since 7
    */
   stateEffect(value: boolean): T;
 
   /**
    * Text color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fontColor(value: Color | number | string | Resource): T;
+  fontColor(value: ResourceColor): T;
 
   /**
    * Text size.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fontSize(value: number | string | Resource): T;
+  fontSize(value: Length): T;
 
   /**
    * fonse weight
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontWeight(value: number | FontWeight | string): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const ButtonInterface: Button
+export declare class ButtonExtend<T> extends ButtonAttribute<T> {}
+export declare const ButtonInterface: Button;
diff --git a/api/@internal/component/ets/calendar.d.ts b/api/@internal/component/ets/calendar.d.ts
index 3688329c5990a405031e33522b75f876eb060a3b..7ae38972140f39cd57c1227d846778ea21c0cd6c 100644
--- a/api/@internal/component/ets/calendar.d.ts
+++ b/api/@internal/component/ets/calendar.d.ts
@@ -13,622 +13,626 @@
  * limitations under the License.
  */
 
-import {Axis, Color, Resource} from "./common";
+import { Axis } from "./enums";
+import { ResourceColor } from "./units";
 
 /**
  * Provides a monthly view component to display information such as date, shift break, and schedule.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface CalendarDay {
   /**
    * Indicates the sequence number of the 7 x 7 (7 x 6) grid layout on a calendar page by row.
    * The week sequence is one, two, three, four, five, six.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   index: number;
 
   /**
    * Lunar moon.
    * The week sequence is one, two, three, four, five, six.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   lunarMonth: string;
 
   /**
    * Lunar day.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   lunarDay: string;
 
   /**
    * Day.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayMark: string;
 
   /**
    * Indicates the off-duty flag information. The options are work and off.By default, the off-duty flag information is not required.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayMarkValue: string;
 
   /**
    * Gregorian calendar year.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   year: number;
 
   /**
    * Gregorian calendar month.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   month: number;
 
   /**
    * Gregorian calendar day.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   day: number;
 
   /**
    *
    * Indicates whether the default value is Lunar calendar.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   isFirstOfLunar: boolean;
 
   /**
    * Indicates whether to display has Schedule.
    * The week sequence is one, two, three, four, five, six.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   hasSchedule: boolean;
 
   /**
    * Display Lunar Date.The week sequence is one, two, three, four, five, six.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   markLunarDay: boolean;
 }
 
 /**
  *  Date object.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface MonthData {
   /**
    * Gregorian calendar year.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   year: number;
 
   /**
    * Gregorian calendar month.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   month: number;
 
   /**
    * CalendarDay.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   data: CalendarDay[];
 }
 
 /**
  * CurrentDayStyle object.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface CurrentDayStyle {
   /**
    * Text color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  dayColor?: Color | number | string | Resource;
+  dayColor?: ResourceColor;
 
   /**
    * lunar Text color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  lunarColor?: Color | number | string | Resource;
+  lunarColor?: ResourceColor;
 
   /**
    * lunar  Work and rest  text color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  markLunarColor?: Color | number | string | Resource;
+  markLunarColor?: ResourceColor;
 
   /**
    * Text fontSize.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayFontSize?: number;
 
   /**
    * lunar text fontSize.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   lunarDayFontSize?: number;
 
   /**
    * Single date height.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayHeight?: number;
 
   /**
    * Single date width.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayWidth?: number;
 
   /**
    * Gregorian calendar height.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   gregorianCalendarHeight?: number;
 
   /**
    * Data y axis Off set.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dayYAxisOffset?: number;
 
   /**
    * Lunar data y axis Off set.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   lunarDayYAxisOffset?: number;
 
   /**
    * Under score X Axis Off set.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   underscoreXAxisOffset?: number;
 
   /**
    * Under score Y Axis Off set
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   underscoreYAxisOffset?: number;
 
   /**
    * Schedule marker X axis Off set
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   scheduleMarkerXAxisOffset?: number;
 
   /**
    * schedule Marker Y Axis Off set
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   scheduleMarkerYAxisOffset?: number;
 
   /**
    * Number of columns.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   colSpace?: number;
 
   /**
    * Daily five row space.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dailyFiveRowSpace?: number;
 
   /**
    * Daily six row space.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dailySixRowSpace?: number;
 
   /**
    * Sigle lunar height.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   lunarHeight?: number;
 
   /**
    * Under score width.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   underscoreWidth?: number;
 
   /**
    * Under score length.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   underscoreLength?: number;
 
   /**
    * Schedule marker radius.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   scheduleMarkerRadius?: number;
 
   /**
    * Boun dary row offset.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   boundaryRowOffset?: number;
 
   /**
    * Boundary col offsett.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   boundaryColOffset?: number;
 }
 
 /**
  * Non current day style.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface NonCurrentDayStyle {
   /**
    * Non-current month day color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  nonCurrentMonthDayColor?: Color | number | string | Resource;
+  nonCurrentMonthDayColor?: ResourceColor;
 
   /**
    * Lunar style of non-current month.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  nonCurrentMonthLunarColor?: Color | number | string | Resource;
+  nonCurrentMonthLunarColor?: ResourceColor;
 
   /**
    * Non-Current Month Workday Marker Color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  nonCurrentMonthWorkDayMarkColor?: Color | number | string | Resource;
+  nonCurrentMonthWorkDayMarkColor?: ResourceColor;
 
   /**
    * Non-Current Month Off Day Marker Color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  nonCurrentMonthOffDayMarkColor?: Color | number | string | Resource;
+  nonCurrentMonthOffDayMarkColor?: ResourceColor;
 }
 
 /**
  * Non current day style.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface TodayStyle {
   /**
    * Style of focus color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  focusedDayColor?: Color | number | string | Resource;
+  focusedDayColor?: ResourceColor;
 
   /**
    * Focus on Lunar Colors.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  focusedLunarColor?: Color | number | string | Resource;
+  focusedLunarColor?: ResourceColor;
 
   /**
    * Background color of the focus area.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  focusedAreaBackgroundColor?: Color | number | string | Resource;
+  focusedAreaBackgroundColor?: ResourceColor;
 
   /**
    * Focus area radius.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   focusedAreaRadius?: number;
 }
 
 /**
  * Week Style.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface WeekStyle {
   /**
    * Style of week color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  weekColor?: Color | number | string | Resource;
+  weekColor?: ResourceColor;
 
   /**
    * Style of week day color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  weekendDayColor?: Color | number | string | Resource;
+  weekendDayColor?: ResourceColor;
 
   /**
    * Style of lunar color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  weekendLunarColor?: Color | number | string | Resource;
+  weekendLunarColor?: ResourceColor;
 
   /**
    * Style of week font size.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   weekFontSize?: number;
 
   /**
    * Style of week height.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   weekHeight?: number;
 
   /**
    * Style of week width.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   weekWidth?: number;
 
   /**
    * Style of week space.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   weekAndDayRowSpace?: number;
 }
 
 /**
  * Work state style.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 export interface WorkStateStyle {
   /**
    * Style of day color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  workDayMarkColor?: Color | number | string | Resource;
+  workDayMarkColor?: ResourceColor;
 
   /**
    * Style of day color.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  offDayMarkColor?: Color | number | string | Resource;
+  offDayMarkColor?: ResourceColor;
 
   /**
    * Style of day size.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   workDayMarkSize?: number;
 
   /**
    * Style of day size.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   offDayMarkSize?: number;
 
   /**
    * Style of width.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   workStateWidth?: number;
 
   /**
    * Style of distance.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   workStateHorizontalMovingDistance?: number;
 
   /**
    * Style of distance.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   workStateVerticalMovingDistance?: number;
 }
 
 /**
  * Calendar controller.
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 declare class CalendarController {
   /**
    * Constructor.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   constructor();
 
   /**
    * Back to day.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   backToToday();
 
   /**
    * To the specified element.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  goTo(value: { year: number, month: number, day: number });
+  goTo(value: { year: number; month: number; day: number });
 }
 
 /**
- * Create calendar.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class CalendarExtend<T> extends CalendarAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 interface Calendar extends CalendarAttribute<Calendar> {
   /**
    * Set value.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  (value: { date: { year: number, month: number, day: number }, currentData: MonthData, preData: MonthData, nextData: MonthData, controller?: CalendarController }): Calendar;
+  (value: {
+    date: { year: number; month: number; day: number };
+    currentData: MonthData;
+    preData: MonthData;
+    nextData: MonthData;
+    controller?: CalendarController;
+  }): Calendar;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 declare class CalendarAttribute<T> {
   /**
    * Specifies whether the component displays the lunar calendar information.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   showLunar(value: boolean): T;
 
   /**
    * Setting whether to display holiday information
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   showHoliday(value: boolean): T;
 
   /**
    * Indicates whether the page can be scrolled.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   needSlide(value: boolean): T;
 
   /**
    * Set the start day of the week for the calendar.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   startOfWeek(value: number): T;
 
   /**
    * Set weekend. The default value is Sunday and Saturday.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   offDays(value: number): T;
 
   /**
    * Sets the sliding direction.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   direction(value: Axis): T;
 
   /**
    * Sets the date style in the current month.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   currentDayStyle(value: CurrentDayStyle): T;
 
   /**
    * Sets the non-monthly date style.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   nonCurrentDayStyle(value: NonCurrentDayStyle): T;
 
   /**
    * Set the date style for today.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   todayStyle(value: TodayStyle): T;
 
   /**
    * Sets the date style for the weekend.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   weekStyle(value: WeekStyle): T;
 
   /**
    * Sets the style of the working state.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   workStateStyle(value: WorkStateStyle): T;
 
   /**
    * Click a date to return the information about the date you clicked.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  onSelectChange(event: (event: { year: number, month: number, day: number }) => void): T;
+  onSelectChange(event: (event: { year: number; month: number; day: number }) => void): T;
 
   /**
    * When you swipe to switch months, the information about the previous month and the next month is requested.
-   * @devices phone, tablet, car.
    * @since 7
-   */
-  onRequestData(event: (event: { year: number, month: number, currentYear: number, currentMonth: number, monthState: number }) => void): T;
+   * @systemapi
+   */
+  onRequestData(
+    event: (event: {
+      year: number;
+      month: number;
+      currentYear: number;
+      currentMonth: number;
+      monthState: number;
+    }) => void,
+  ): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const CalendarInterface: Calendar
+export declare class CalendarExtend<T> extends CalendarAttribute<T> {}
+export declare const CalendarInterface: Calendar;
diff --git a/api/@internal/component/ets/circle.d.ts b/api/@internal/component/ets/circle.d.ts
index e825c09ef6fc4fede756b3838921743011f59bd2..15f39269be70b07179d039699ebf9edbdcc55477 100644
--- a/api/@internal/component/ets/circle.d.ts
+++ b/api/@internal/component/ets/circle.d.ts
@@ -13,47 +13,43 @@
  * limitations under the License.
  */
 
-import {CommonShapeMethod} from "./common";
+import { CommonShapeMethod } from "./common";
 
 /**
- * @devices phone, tablet, car.
+ * Defines circle option for Circle component.
  * @since 7
  */
-export declare class CircleExtend<T> extends CircleAttribute<T> {
-}
-
-/**
- * new Circle component.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Circle extends CircleAttribute<Circle> {
-
+export declare interface CircleOption {
   /**
-   * Set new value..
-   * @devices phone, tablet, car.
+   * Defines the width property.
    * @since 7
    */
-  new (value?: { width?: string | number, height?: string | number }): Circle;
+  width?: string | number;
 
   /**
-   * Set the value..
-   * @devices phone, tablet, car.
+   * Defines the height property.
    * @since 7
    */
-  (value?: { width?: string | number, height?: string | number }): Circle;
+  height?: string | number;
 }
 
 /**
- * Circle drawing component.
- * @devices phone, tablet, car.
+ * Defines circle component.
  * @since 7
  */
-declare class CircleAttribute<T> extends CommonShapeMethod<T> {
+interface Circle extends CircleAttribute<Circle> {
+  /**
+   * Set the value..
+   * @since 7
+   */
+  (value?: CircleOption): Circle;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Circle drawing component attribute functions.
  * @since 7
  */
+declare class CircleAttribute<T> extends CommonShapeMethod<T> {}
+
+export declare class CircleExtend<T> extends CircleAttribute<T> {}
 export declare const CircleInterface: Circle;
diff --git a/api/@internal/component/ets/column.d.ts b/api/@internal/component/ets/column.d.ts
index 992db6b77e428f4d517f671fe0ce0227bb54bdf1..5307dcd5aad3c4098f10f7d5d12401c9d783c5ff 100644
--- a/api/@internal/component/ets/column.d.ts
+++ b/api/@internal/component/ets/column.d.ts
@@ -13,18 +13,11 @@
  * limitations under the License.
  */
 
-import {CommonMethod, HorizontalAlignDeclaration, HorizontalAlign} from "./common";
+import { CommonMethod } from "./common";
+import { HorizontalAlign } from "./enums";
 
 /**
- * Containers laid out vertically.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ColumnExtend<T> extends ColumnAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
+ * Defines the Column Component.
  * @since 7
  */
 interface Column extends ColumnAttribute<Column> {
@@ -32,27 +25,22 @@ interface Column extends ColumnAttribute<Column> {
    * Set the value.
    * useAlign:Use a custom alignment.
    * space: Vertical layout element spacing.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { useAlign?: HorizontalAlignDeclaration, space?: string | number }): Column;
+  (value?: { space?: string | number }): Column;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the Column component attribute functions.
  * @since 7
  */
 export declare class ColumnAttribute<T> extends CommonMethod<T> {
   /**
    * Sets the alignment format of the subassembly in the horizontal direction.
-   * @devices phone, tablet, car.
    * @since 7
    */
   alignItems(value: HorizontalAlign): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class ColumnExtend<T> extends ColumnAttribute<T> {}
 export declare const ColumnInterface: Column;
diff --git a/api/@internal/component/ets/column_split.d.ts b/api/@internal/component/ets/column_split.d.ts
index e4768e6e48ef68c4bdb6b528e12880a93ddbad46..e7e78831044325a544052bc8be727c0e70d0606b 100644
--- a/api/@internal/component/ets/column_split.d.ts
+++ b/api/@internal/component/ets/column_split.d.ts
@@ -13,43 +13,31 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ColumnSplitExtend<T> extends ColumnSplitAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
+ * Defines the ColumnSplit component.
  * @since 7
  */
 interface ColumnSplit extends ColumnSplitAttribute<ColumnSplit> {
   /**
    * Layout the subassemblies vertically and insert a horizontal divider line between each subassemblies.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): ColumnSplit;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the ColumnSplit component attribute functions.
  * @since 7
  */
 declare class ColumnSplitAttribute<T> extends CommonMethod<T> {
   /**
    * Indicates whether the split line can be dragged. The default value is false.
-   * @devices phone, tablet, car.
    * @since 7
    */
   resizeable(value: boolean): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const ColumnSplitInterface: ColumnSplit;
+export declare class ColumnSplitExtend<T> extends ColumnSplitAttribute<T> {}
diff --git a/api/@internal/component/ets/common.d.ts b/api/@internal/component/ets/common.d.ts
index b561748e5da25c61241f9d3ac8434ff7e73c1454..1ad7e09b6b194625f05c858a70e132818e635c24 100644
--- a/api/@internal/component/ets/common.d.ts
+++ b/api/@internal/component/ets/common.d.ts
@@ -13,2017 +13,504 @@
  * limitations under the License.
  */
 
-import {GestureType, GestureMask} from "./gesture"
-import {Circle} from "./circle";
-import {Ellipse} from "./ellipse";
-import {Path} from "./path";
-import {Rect} from "./rect";
-
-/**
- * Defining Component ClassDecorator
- * @devices phone, tablet, car
- * @since 7
+import { GestureType, GestureMask } from "./gesture";
+import { Circle } from "./circle";
+import { Ellipse } from "./ellipse";
+import { Path } from "./path";
+import { Rect } from "./rect";
+import { Resource, Length, Padding, Margin } from "./units";
+import {
+  Alignment,
+  BorderStyle,
+  Color,
+  Curve,
+  Direction,
+  GradientDirection,
+  ImageRepeat,
+  ImageSize,
+  ItemAlign,
+  KeySource,
+  LineCapStyle,
+  LineJoinStyle,
+  PlayMode,
+  SharedTransitionEffectType,
+  TransitionType,
+  Visibility,
+} from "./enums";
+
+/**
+ * Defining Component ClassDecorator * @since 7
  */
 export declare const Component: ClassDecorator;
 
 /**
  * Defining Entry ClassDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Entry: ClassDecorator;
 
 /**
  * Defining Observed ClassDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Observed: ClassDecorator;
 
 /**
  * Defining Preview ClassDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Preview: ClassDecorator;
 
 /**
  * Defining State PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const State: PropertyDecorator;
 
 /**
  * Defining Prop PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Prop: PropertyDecorator;
 
 /**
  * Defining Link PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Link: PropertyDecorator;
 
 /**
  * Defining ObjectLink PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const ObjectLink: PropertyDecorator;
 
 /**
  * Defining Provide PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Provide: PropertyDecorator & ((value: string) => PropertyDecorator);
 
 /**
  * Defining Consume PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Consume: PropertyDecorator & ((value: string) => PropertyDecorator);
 
 /**
  * Defining StorageProp PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const StorageProp: (value: string) => PropertyDecorator;
 
 /**
  * Defining StorageLink PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const StorageLink: (value: string) => PropertyDecorator;
 
 /**
  * Defining Watch PropertyDecorator.
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Watch: (value: string) => PropertyDecorator;
 
 /**
  * Defining Builder MethodDecorator
- * @devices phone, tablet, car
  * @since 7
  */
 export declare const Builder: MethodDecorator;
 
 /**
  * Defining  CustomDialog ClassDecorator
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const CustomDialog: ClassDecorator;
-
-/**
- * Defines the data type of the interface restriction.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare interface Resource {
-  /**
-   * Set id.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  readonly id: number;
-
-  /**
-   * Set type.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  readonly type: number;
-
-  /**
-   * Set params.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  readonly params?: any[];
-}
-
-/**
- * Defines the data type of the interface restriction.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare interface Configuration {
-  /**
-   * Set colorMode.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  readonly colorMode: string;
-
-  /**
-   * Set fontScale.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  readonly fontScale: number;
-}
-
-/**
- * Defining isSystemplugin Constants.
- * @devices phone, tablet, car
- * @since 7
- */
-declare const isSystemplugin: Function;
-
-/**
- * global $s function
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function $s(value: string, params?: object | Array<any> | number): string;
-
-/**
- * global $m function
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function $m(value: string): string;
-
-/**
- * global $r function
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function $r(value: string, ...params: any[]): Resource;
-
-/**
- * global $rawfile function
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function $rawfile(value: string): Resource;
-
-/**
- * Defining animation function.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function animateTo(value: {
-  duration?: number, tempo?: number, curve?: Curve | string,
-  delay?: number, iterations?: number, playMode?: PlayMode, onFinish?: () => void
-}, event: () => void): void;
-
-/**
- * Converts a value in vp units to a value in px.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function vp2px(value: number): number;
-
-/**
- * Converts a number in units of px to a number in units of vp.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function px2vp(value: number): number;
-
-/**
- * Converts a number in fp units to a number in px.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function fp2px(value: number): number;
-
-/**
- * Converts a number in units of px to a number in units of fp.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function px2fp(value: number): number;
-
-/**
- * Converts a number in units of lpx to a number in units of px.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function lpx2px(value: number): number;
-
-/**
- * Converts a number in units of px to a number in units of lpx.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare function px2lpx(value: number): number;
-
-/**
- * common enum of color
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum Color {
-  /**
-   * White.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  White,
-
-  /**
-   * Black.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Black,
-
-  /**
-   * Blue.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Blue,
-
-  /**
-   * Brown.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Brown,
-
-  /**
-   * Gray.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Gray,
-
-  /**
-   * Green.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Green,
-
-  /**
-   * Grey.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Grey,
-
-  /**
-   * Orange.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Orange,
-
-  /**
-   * color.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Pink,
-
-  /**
-   * Red.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Red,
-
-  /**
-   * Yellow.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Yellow
-}
-
-/**
- * Image display mode
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum ImageFit {
-  /**
-   * Keep the aspect ratio to zoom out or zoom in so that the image is completely displayed within the display boundary.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Contain,
-
-  /**
-   * Keep the aspect ratio to zoom out or zoom in so that both sides of the image are greater than or equal to the display boundary.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Cover,
-
-  /**
-   * Adaptive display
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Auto,
-
-  /**
-   * Zoom in or out without maintaining the aspect ratio so that the image fills the display boundary.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Fill,
-
-  /**
-   * Keep the aspect ratio displayed, and the image zooms out or remains unchanged.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  ScaleDown,
-
-  /**
-   * Keep the original size and display it in the center.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  None
-}
-
-/**
- * Border Style
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum BorderStyle {
-  /**
-   * Displays as a series of dots with a radius of half the borderWidth.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Dotted,
-
-  /**
-   * Shows as a series of short square dashed lines.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Dashed,
-
-  /**
-   * Shows as a solid line.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Solid
-}
-
-/**
- * Line Join Style
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum LineJoinStyle {
-  /**
-   * Connect path segments using bevels.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Miter,
-
-  /**
-   * Connect path segments using sharp corners.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Round,
-
-  /**
-   * Connect path segments using fillets.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Bevel
-}
-
-/**
- * Function Called by Touch
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum TouchType {
-  /**
-   * Triggered when the finger is pressed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Down,
-
-  /**
-   * Triggered when the finger is raised.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Up,
-
-  /**
-   * Triggered when the finger presses on the screen.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Move,
-
-  /**
-   * Triggers when the touch event cancels.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Cancel
-}
-
-/**
- * Animation status.
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare enum AnimationStatus {
-  /**
-   * Initial state of the animation.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Initial,
-
-  /**
-   * The animation is playing.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Running,
-
-  /**
-   * The animation is paused.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Paused,
-
-  /**
-   * The animation is stopped.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Stopped
-}
-
-/**
- * Sets the animation playback mode. By default, the animation starts to play again after the playback is complete.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum Curve {
-  /**
-   * Indicates that the speed of the animation is the same from start to finish.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Linear,
-
-  /**
-   * Indicates that the animation starts at a low speed, then accelerates, and then slows down before it ends, CubicBezier(0.25, 0.1, 0.25, 1.0).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Ease,
-
-  /**
-   * Indicates that the animation starts at a low speed, CubicBezier(0.42, 0.0, 1.0, 1.0).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  EaseIn,
-
-  /**
-   * Indicates that the animation ends at a low speed, CubicBezier(0.0, 0.0, 0.78, 1.0).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  EaseOut,
-
-  /**
-   * Indicates that the animation starts and ends at a slow speed, CubicBezier(0.42, 0.0, 0.78, 1.0).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  EaseInOut,
-
-  /**
-   * Slow-in, fast-out
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  FastOutSlowIn,
-
-  /**
-   * Linear Out Slow In
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LinearOutSlowIn,
-
-  /**
-   * Fast OutL inear In.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  FastOutLinearIn,
-
-  /**
-   * Extreme Deceleration.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  ExtremeDeceleration,
-
-  /**
-   * Sharp.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Sharp,
-
-  /**
-   * Rhythm.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Rhythm,
-
-  /**
-   * Smooth.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Smooth,
-
-  /**
-   * Damping curve, CubicBezier(0.2, 0.0, 0.2, 1.0).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Friction
-}
-
-/**
- * Sets the state before and after the animation starts.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum FillMode {
-  /**
-   * Restores to the initial state after the playback is complete.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  None,
-
-  /**
-   * Retains the state at the end of the animation when the playback is complete.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Forwards,
-
-  /**
-   * Applies the start attribute value for the period specified by animation-delay before the animation is displayed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Backwards,
-
-  /**
-   * Both forward and backward fill modes are applied.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Both
-}
-
-/**
- * Play Mode
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum PlayMode {
-  /**
-   * The animation plays normally.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Normal,
-
-  /**
-   * The animation plays backwards.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Reverse,
-
-  /**
-   * The animation plays forward on odd numbers (1, 3, 7...) and backward on even numbers (2, 4, 6...).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Alternate,
-
-  /**
-   * The animation plays backwards on odd numbers (1, 3, 7...) and forwards on even numbers (2, 4, 6...)..
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  AlternateReverse
-}
-
-/**
- * This style allows you to set the window blurring degree and blurring style of the current component layout range,
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum BlurStyle {
-  /**
-   * Small range glow effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  SmallLight,
-
-  /**
-   * Medium range glow effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  MediumLight,
-
-  /**
-   * Wide range of luminous effects.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LargeLight,
-
-  /**
-   * Super-range luminous effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  XlargeLight,
-
-  /**
-   * Small range of dark effects.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  SmallDark,
-
-  /**
-   * Medium range dark effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  MediumDark,
-
-  /**
-   * Wide range of dark effects.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LargeDark,
-
-  /**
-   * Extra large range of dark effects.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  XlargeDark
-}
-
-/**
- * Type of a key.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum KeyType {
-  /**
-   * Press the key.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Down,
-
-  /**
-   * The key is released.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Up,
-
-  /**
-   * Press and hold.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LongPress
-}
-
-/**
- * Type of the input device that triggers the current key.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum KeySource {
-  /**
-   * The input device type is unknown.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Unknown,
-
-  /**
-   * Set Device Type to Keyboard.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Keyboard,
-
-  /**
-   * Voice input
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Mouse,
-
-  /**
-   * Dpad.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Dpad,
-
-  /**
-   * Gamepad.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Gamepad,
-
-  /**
-   * Joystick.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Joystick,
-
-  /**
-   * Press and hold.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  TouchScreen,
-
-  /**
-   * Touch screen.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  TouchPad,
-
-  /**
-   * Stylus.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Stylus,
-
-  /**
-   * Trackball.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Trackball,
-
-  /**
-   * Knob.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Knob,
-
-  /**
-   * Press and hold.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Any
-}
-
-/**
- * Edge.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum Edge {
-  /**
-   * The top is centered horizontally.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Top,
-
-  /**
-   * Center horizontal and vertical.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Center,
-
-  /**
-   * The bottom is centered horizontally.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Bottom,
-
-  /**
-   * Cross axis direction text baseline alignment.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Baseline,
-
-  /**
-   * Align the head of the cross axis direction.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Start,
-
-  /**
-   * Middle
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Middle,
-
-  /**
-   * Align the head of the cross axis direction.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  End
-}
-
-/**
- * Set Weekend
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum Week {
-  /**
-   * Monday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Mon,
-
-  /**
-   * Tuesday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Tue,
-
-  /**
-   * Wednesday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Wed,
-
-  /**
-   * Thursday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Thur,
-
-  /**
-   * Friday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Fri,
-
-  /**
-   * Saturday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Sat,
-
-  /**
-   * Sunday.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Sun,
-}
-
-/**
- * Sets the horizontal layout of elements.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum Direction {
-  /**
-   * Elements are laid out from left to right.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Ltr,
-
-  /**
-   * Elements are laid out from right to left.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Rtl,
-
-  /**
-   * Use the default layout direction.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Auto
-}
-
-/**
- * Used to set the status of the scroll bar.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum BarState {
-  /**
-   * Not displayed.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Off,
-
-  /**
-   * On-demand display (displayed when you touch it and disappears after 2 seconds).
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Auto,
-
-  /**
-   * Resident display.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  On
-}
-
-/**
- * Sliding effect
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum EdgeEffect {
-  /**
-   * Elastic physical action, sliding to the edge can continue to slide for a distance based on the initial speed or touch event, and spring back when released.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Spring,
-
-  /**
-   * Fade.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Fade,
-
-  /**
-   * Sliding to the edge has no effect.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  None
-}
-
-/**
- * The tap action triggers this method invocation.
- * @devices phone, tablet, car
- * @since 7
- */
-export interface ClickEvent {
-  /**
-   * X coordinate of the click point relative to the left edge of the device screen.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  screenX: number;
-
-  /**
-   * The Y coordinate of the touch point relative to the upper edge of the device screen.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  screenY: number;
-
-  /**
-   * X coordinate of the click point relative to the left edge of the clicked element.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  x: number;
-
-  /**
-   * Y coordinate of the click point relative to the upper edge of the clicked element.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  y: number;
-
-  /**
-   * Event timestamp.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  timestamp: number;
-}
-
-/**
- * Type of the touch event.
- * @devices phone, tablet, car
- * @since 7
- */
-export interface TouchObject {
-  /**
-   * Type of the touch event.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  type: TouchType;
-
-  /**
-   * Finger unique identifier.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  id: number;
-
-  /**
-   * X coordinate of the touch point relative to the left edge of the device screen.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  screenX: number;
-
-  /**
-   * The Y coordinate of the touch point relative to the upper edge of the device screen.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  screenY: number;
-
-  /**
-   * X coordinate of the touch point relative to the left edge of the touched element.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  x: number;
-
-  /**
-   * Y coordinate of the touch point relative to the upper edge of the touched element.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  y: number;
-}
-
-/**
- * Touch Action Function Parameters
- * @devices phone, tablet, car
- * @since 7
- */
-export interface TouchEvent {
-  /**
-   * Type of the touch event.
-   * @since 7
-   */
-  type: TouchType;
-
-  /**
-   * All finger information.
-   * @since 7
-   */
-  touches: TouchObject[];
-
-  /**
-   * Indicates the current changed finger information.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  changedTouches: TouchObject[];
-
-  /**
-   * Event timestamp.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  timestamp: number;
-
-  /**
-   * The blocking event pops up.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  stopPropagation?: () => void;
-}
-
-/**
- * Description of the PasteData object
- * @devices phone, tablet, car
- * @since 7
- */
-export interface PasteData {
-  /**
-   * Gets the clipboard text data.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  getPlainText(): string;
-
-  /**
-   * Sets the clipboard text data.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  setPlainText(value: string);
-}
-
-/**
- * Floating Window Object
- * @devices phone, tablet, car
- * @since 7
- */
-export declare class PixelMap {
-  /**
-   * release function.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  release(): void;
-}
-
-/**
- * DragEvent object description
- * @devices phone, tablet, car
- * @since 7
- */
-export interface DragEvent {
-  /**
-   * Gets the current clipboard data object.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  getPasteData(): PasteData;
-
-  /**
-   * Obtains the X coordinate of the drag window, in vp.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  getX(): number;
-
-  /**
-   * Obtains the Y coordinate of the drag window, in vp.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  getY(): number;
-
-  /**
-   * Obtains the drag description.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  getDescription(): string;
-
-  /**
-   * Set the drag description.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  setDescription(value: string);
-
-  /**
-   * Set the floating window object. Value: floating window object.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  setPixmap(value: PixelMap);
-}
-
-/**
- * KeyEvent object description:
- * @devices phone, tablet, car
- * @since 7
- */
-export interface KeyEvent {
-  /**
-   * Type of a key.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  type: KeyType;
-
-  /**
-   * Key code of a key
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  keyCode: number;
-
-  /**
-   * Key value of a key.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  keyText: string;
-
-  /**
-   * Type of the input device that triggers the current key, such as the keyboard or handle.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  keySource: KeySource;
-
-  /**
-   * Indicates the ID of the input device that triggers the current key.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  deviceId: number;
-
-  /**
-   * Indicates the status of the key when the key is pressed.
-   * The value 1 indicates the pressed state, and the value 0 indicates the unpressed state.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  metaKey: number;
-
-  /**
-   * Timestamp when the key was pressed.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  timestamp: number;
-
-  /**
-   * Block event bubbling.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  stopPropagation?: () => void;
-}
-
-/**
- * Alignment enumeration description.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum Alignment {
-  /**
-   * Top Start.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  TopStart,
-
-  /**
-   * The top is centered horizontally.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Top,
-
-  /**
-   * Top tail end.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  TopEnd,
-
-  /**
-   * The starting end is centered longitudinally.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Start,
-
-  /**
-   * Center horizontal and vertical.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Center,
-
-  /**
-   * The tail end is centered longitudinally.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  End,
-
-  /**
-   * Bottom starting end.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  BottomStart,
-
-  /**
-   * The bottom is centered horizontally.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Bottom,
-
-  /**
-   * Bottom end.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  BottomEnd
-}
-
-/**
- * TransitionType enumeration descriptio.
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum TransitionType {
-  /**
-   * Specifies that the current transition action takes effect in all change scenarios of the component.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  All,
-
-  /**
-   * Specifies the insertion scenario in which the current transition action takes effect.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Insert,
-
-  /**
-   * Specifies the deletion scenario in which the current transition action takes effect.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Delete
-}
+export declare const CustomDialog: ClassDecorator;
 
 /**
- * RelateType enumeration description
- * @devices phone, tablet, car
+ * Defines the data type of the interface restriction.
  * @since 7
  */
-export declare enum RelateType {
-
+export declare interface Configuration {
   /**
-   * Scales the current component to fill the parent component.
-   * @devices phone, tablet, car
+   * Set colorMode.
    * @since 7
    */
-  FILL,
+  readonly colorMode: string;
 
   /**
-   * Scales the current component to fit the parent component.
-   * @devices phone, tablet, car
+   * Set fontScale.
    * @since 7
    */
-  FIT
+  readonly fontScale: number;
 }
 
 /**
- * Controls the display or hide of the current component
- * @devices phone, tablet, car
+ * Defining isSystemplugin Constants.
  * @since 7
  */
-export declare enum Visibility {
+declare const isSystemplugin: Function;
 
-  /**
-   * Show
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Visible,
+/**
+ * global $r function
+ * @since 7
+ */
+export declare function $r(value: string, ...params: any[]): Resource;
 
-  /**
-   * Hide, but participate in layout for placeholder.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Hidden,
+/**
+ * global $rawfile function
+ * @since 7
+ */
+export declare function $rawfile(value: string): Resource;
 
-  /**
-   * Hides but does not participate in layout and does not take place.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  None
+export interface AnimateToParam {
+  duration?: number;
+  tempo?: number;
+  curve?: Curve | string;
+  delay?: number;
+  iterations?: number;
+  playMode?: PlayMode;
+  onFinish?: () => void;
 }
 
 /**
- * LineCapStyle enumeration description
- * @devices phone, tablet, car
+ * Defining animation function.
  * @since 7
  */
-export declare enum LineCapStyle {
-  /**
-   * The two ends of the dividing line are parallel lines.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Butt,
-
-  /**
-   * The two ends of the dividing line are semicircles.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Round,
-
-  /**
-   * Extends half a circle at the end of the path with a width equal to half the line width and a height equal to the line width.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Square
-}
+export declare function animateTo(value: AnimateToParam, event: () => void): void;
 
 /**
- * Axis enumeration description.
- * @devices phone, tablet, car
+ * Converts a value in vp units to a value in px.
  * @since 7
  */
-export declare enum Axis {
-  /**
-   * Longitudinal arrangement
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Vertical,
+export declare function vp2px(value: number): number;
 
-  /**
-   * Horizontal arrangement.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Horizontal
-}
+/**
+ * Converts a number in units of px to a number in units of vp.
+ * @since 7
+ */
+export declare function px2vp(value: number): number;
 
 /**
- * HorizontalAlign enumeration description.
- * @devices phone, tablet, car
+ * Converts a number in fp units to a number in px.
  * @since 7
  */
-export declare enum HorizontalAlign {
-  /**
-   * Aligns the start end in the language direction.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Start,
+export declare function fp2px(value: number): number;
 
-  /**
-   * Center alignment. The default alignment mode is used.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Center,
+/**
+ * Converts a number in units of px to a number in units of fp.
+ * @since 7
+ */
+export declare function px2fp(value: number): number;
 
-  /**
-   * Aligns the ends in the language direction.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  End
-}
+/**
+ * Converts a number in units of lpx to a number in units of px.
+ * @since 7
+ */
+export declare function lpx2px(value: number): number;
 
 /**
- * FlexAlign enumeration description.
- * @devices phone, tablet, car
+ * Converts a number in units of px to a number in units of lpx.
  * @since 7
  */
-export declare enum FlexAlign {
-  /**
-   * The element is aligned at the head of the principal axis,
-   * the first element is aligned with the head of the row, and subsequent elements are aligned with the previous one.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Start,
+export declare function px2lpx(value: number): number;
 
+/**
+ * The tap action triggers this method invocation.
+ * @since 7
+ */
+export interface ClickEvent {
   /**
-   * The elements are centered in the direction of the principal axis,
-   * and the first element is the same distance from the beginning of the row as the last element is from the end of the row.
-   * @devices phone, tablet, car
+   * X coordinate of the click point relative to the left edge of the device screen.
    * @since 7
    */
-  Center,
+  screenX: number;
 
   /**
-   * The element is aligned at the tail of the principal axis,
-   * the last element is aligned at the end of the row, and the other elements are aligned with the next.
-   * @devices phone, tablet, car
+   * The Y coordinate of the touch point relative to the upper edge of the device screen.
    * @since 7
    */
-  End,
+  screenY: number;
 
   /**
-   * Elastic elements are evenly distributed in the direction of the Flex principal axis,
-   * with the same distance between adjacent elements.
-   * The first element aligns with the beginning of the line, and the last element aligns with the end of the line.
-   * @devices phone, tablet, car
+   * X coordinate of the click point relative to the left edge of the clicked element.
    * @since 7
    */
-  SpaceBetween,
+  x: number;
 
   /**
-   * Elastic elements are evenly distributed in the direction of the Flex principal axis,
-   *  with the same distance between adjacent elements. Half the distance between adjacent elements as the distance between
-   * the first element and the distance between the last element and the end of the row.
-   * @devices phone, tablet, car
+   * Y coordinate of the click point relative to the upper edge of the clicked element.
    * @since 7
    */
-  SpaceAround,
+  y: number;
 
   /**
-   * Elements in the Flex axis direction are evenly spaced.
-   * The spacing between adjacent elements, the spacing between the first element and the beginning of the row,
-   * and the spacing between the last element and the end of the row are the same.
-   * @devices phone, tablet, car
+   * Event timestamp.
    * @since 7
    */
-  SpaceEvenly
+  timestamp: number;
 }
 
 /**
- * ItemAlign enumeration description
- * @devices phone, tablet, car
+ * Type of the touch event.
  * @since 7
  */
-export declare enum ItemAlign {
+export interface TouchObject {
   /**
-   * Use the default configuration in the Flex container.
-   * @devices phone, tablet, car
+   * Type of the touch event.
    * @since 7
    */
-  Auto,
+  type: TouchType;
 
   /**
-   * The element is in the Flex container with the cross-axis direction head aligned.
-   * @devices phone, tablet, car
+   * Finger unique identifier.
    * @since 7
    */
-  Start,
+  id: number;
 
   /**
-   * The element is centered in the Flex container with the cross axis direction aligned.
-   * @devices phone, tablet, car
+   * X coordinate of the touch point relative to the left edge of the device screen.
    * @since 7
    */
-  Center,
+  screenX: number;
 
   /**
-   * The element is bottom aligned in the Flex container with the cross axis direction.
-   * @devices phone, tablet, car
+   * The Y coordinate of the touch point relative to the upper edge of the device screen.
    * @since 7
    */
-  End,
+  screenY: number;
 
   /**
-   * Element In the Flex container, the cross-axis direction text baseline is aligned.
-   * @devices phone, tablet, car
+   * X coordinate of the touch point relative to the left edge of the touched element.
    * @since 7
    */
-  Baseline,
+  x: number;
 
   /**
-   * Element In a Flex container, the fill is stretched across the axis and, when no dimension is set, to the container size.
-   * @devices phone, tablet, car
+   * Y coordinate of the touch point relative to the upper edge of the touched element.
    * @since 7
    */
-  Stretch
+  y: number;
 }
 
 /**
- * FlexDirection enumeration description
- * @devices phone, tablet, car
+ * Touch Action Function Parameters
  * @since 7
  */
-export declare enum FlexDirection {
-  /**
-   * The main axis is consistent with the row direction as the layout mode.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Row,
-
-  /**
-   * The main axis is consistent with the column direction as the layout mode.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Column,
-
+export interface TouchEvent {
   /**
-   * The layout is in the opposite direction to the Row direction.
-   * @devices phone, tablet, car
+   * Type of the touch event.
    * @since 7
    */
-  RowReverse,
+  type: TouchType;
 
   /**
-   * Layout in the opposite direction to the column.
-   * @devices phone, tablet, car
+   * All finger information.
    * @since 7
    */
-  ColumnReverse
-}
+  touches: TouchObject[];
 
-/**
- * FlexWrap enumeration description
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum FlexWrap {
   /**
-   * The Flex container has a single row/column layout of elements, and children are allowed to go beyond the container.
-   * @devices phone, tablet, car
+   * Indicates the current changed finger information.
    * @since 7
    */
-  NoWrap,
+  changedTouches: TouchObject[];
 
   /**
-   * The elements of the Flex container are arranged in multiple rows or columns, and the sub-items are allowed to exceed the container.
-   * @devices phone, tablet, car
+   * Event timestamp.
    * @since 7
    */
-  Wrap,
+  timestamp: number;
 
   /**
-   * The elements of the Flex container are arranged in reverse multiple rows/columns, and children are allowed to exceed the container.
-   * @devices phone, tablet, car
+   * The blocking event pops up.
    * @since 7
    */
-  WrapReverse
+  stopPropagation?: () => void;
 }
 
 /**
- * VerticalAlign enumeration description
- * @devices phone, tablet, car
+ * Description of the PasteData object
  * @since 7
  */
-export declare enum VerticalAlign {
-  /**
-   * Top alignment.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Top,
-
-  /**
-   * Center alignment. The default alignment mode is used.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Center,
-
+export interface PasteData {
   /**
-   * Bottom alignment.
-   * @devices phone, tablet, car
+   * Gets the clipboard text data.
    * @since 7
    */
-  Bottom
-}
+  getPlainText(): string;
 
-/**
- * FlexAlign enumeration VerticalAlignDeclaration
- * @devices phone, tablet, car
- * @since 7
- */
-export declare class VerticalAlignDeclaration {
   /**
-   * constructor.
-   * @devices phone, tablet, car.
+   * Sets the clipboard text data.
    * @since 7
    */
-  constructor(value?: VerticalAlign)
+  setPlainText(value: string);
 }
 
 /**
- * value :In the landscape layout component, the default alignment direction.
- * @devices phone, tablet, car
+ * pixelmap object with release function.
  * @since 7
  */
-export declare class HorizontalAlignDeclaration {
+export declare class PixelMap {
   /**
-   * constructor.
-   * @devices phone, tablet, car.
+   * release function.
    * @since 7
    */
-  constructor(value?: HorizontalAlign)
+  release(): void;
 }
 
 /**
- * ImageRepeat enumeration description
- * @devices phone, tablet, car
+ * DragEvent object description
  * @since 7
  */
-export declare enum ImageRepeat {
-  /**
-   * Do not draw the picture again.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  NoRepeat,
-
+export interface DragEvent {
   /**
-   * Repeat the drawing only on the horizontal axis.
-   * @devices phone, tablet, car
+   * Gets the current clipboard data object.
    * @since 7
    */
-  X,
+  getPasteData(): PasteData;
 
   /**
-   * Repeat the drawing only on the vertical axis.
-   * @devices phone, tablet, car
+   * Obtains the X coordinate of the drag window, in vp.
    * @since 7
    */
-  Y,
+  getX(): number;
 
   /**
-   * Draw the picture repeatedly on both axes.
-   * @devices phone, tablet, car
+   * Obtains the Y coordinate of the drag window, in vp.
    * @since 7
    */
-  XY
-}
+  getY(): number;
 
-/**
- * ImageSize enumeration description
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum ImageSize {
   /**
-   * Keep the scale of the original image unchanged.
-   * @devices phone, tablet, car
+   * Obtains the drag description.
    * @since 7
    */
-  Auto,
+  getDescription(): string;
 
   /**
-   * Default value. Keep the aspect ratio to zoom in or out the image so that both sides of the image are greater than or equal to the display boundary.
-   * @devices phone, tablet, car
+   * Set the drag description.
    * @since 7
    */
-  Cover,
+  setDescription(value: string);
 
   /**
-   * Keep the aspect ratio to zoom out or zoom in so that the image is completely displayed within the display boundary.
-   * @devices phone, tablet, car
+   * Set the floating window object. Value: floating window object.
    * @since 7
    */
-  Contain
+  setPixmap(value: PixelMap);
 }
 
 /**
- * GradientDirection enumeration description
- * @devices phone, tablet, car
+ * KeyEvent object description:
  * @since 7
  */
-export declare enum GradientDirection {
-  /**
-   * Right to left.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Left,
-
-  /**
-   * From the bottom up.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Top,
-
-  /**
-   * From left to right.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  Right,
-
+export interface KeyEvent {
   /**
-   * From the top down.
-   * @devices phone, tablet, car
+   * Type of a key.
    * @since 7
    */
-  Bottom,
+  type: KeyType;
 
   /**
-   * Top Left
-   * @devices phone, tablet, car
+   * Key code of a key
    * @since 7
    */
-  LeftTop,
+  keyCode: number;
 
   /**
-   * Left Bottom
-   * @devices phone, tablet, car
+   * Key value of a key.
    * @since 7
    */
-  LeftBottom,
+  keyText: string;
 
   /**
-   * Right Top
-   * @devices phone, tablet, car
+   * Type of the input device that triggers the current key, such as the keyboard or handle.
    * @since 7
    */
-  RightTop,
+  keySource: KeySource;
 
   /**
-   * Right Bottom
-   * @devices phone, tablet, car
+   * Indicates the ID of the input device that triggers the current key.
    * @since 7
    */
-  RightBottom,
+  deviceId: number;
 
   /**
-   * None
-   * @devices phone, tablet, car
+   * Indicates the status of the key when the key is pressed.
+   * The value 1 indicates the pressed state, and the value 0 indicates the unpressed state.
    * @since 7
    */
-  None
-}
+  metaKey: number;
 
-/**
- * SharedTransitionEffectType enumeration description
- * @devices phone, tablet, car
- * @since 7
- */
-export declare enum SharedTransitionEffectType {
   /**
-   * The location of the destination page element remains unchanged, and you can configure the transparency animation. Currently,
-   * only the static effect configured for redirecting to the target page takes effect.
-   * @devices phone, tablet, car
+   * Timestamp when the key was pressed.
    * @since 7
    */
-  Static,
+  timestamp: number;
 
   /**
-   * Move the source page element to the destination page element location and scale it appropriately.
-   * @devices phone, tablet, car
+   * Block event bubbling.
    * @since 7
    */
-  Exchange
+  stopPropagation?: () => void;
 }
 
 /**
  * CommonMethod
- * @devices phone, tablet, car
  * @since 7
  */
 export declare class CommonMethod<T> {
   /**
    * constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Sets the width of the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  width(value: number | string | Resource): T;
+  width(value: Length): T;
 
   /**
    * Sets the width of the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  height(value: number | string | Resource): T;
+  height(value: Length): T;
 
   /**
-   * The size of the high highlight.
-   * @devices phone, tablet, car.
+   * The size of the current component.
    * @since 7
    */
-  size(value: { width?: number | string | Resource, height?: number | string | Resource}): T;
+  size(value: { width?: Length; height?: Length }): T;
 
   /**
    * constraint Size：
    * minWidth：minimum Width，maxWidth：maximum Width，minHeight：minimum Height ，maxHeight：maximum Height，
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  constraintSize(value: { minWidth?: number | string | Resource, maxWidth?: number | string | Resource, minHeight?: number | string | Resource, maxHeight?: number | string | Resource}): T;
-
-  /**
-   * layout Priority
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  layoutPriority(value: number | string): T;
-
-  /**
-   * layout Weight
-   * @devices phone, tablet, car.
    * @since 7
    */
-  layoutWeight(value: number | string): T;
+  constraintSize(value: {
+    minWidth?: number | string | Resource;
+    maxWidth?: number | string | Resource;
+    minHeight?: number | string | Resource;
+    maxHeight?: number | string | Resource;
+  }): T;
 
   /**
    * Inner margin
-   * @devices phone, tablet, car.
    * @since 7
    */
-  padding(value: { top?: number | string | Resource, right?: number | string | Resource, bottom?: number | string | Resource, left?: number | string  | Resource} | number | string | Resource): T;
+  padding(value: Padding | Length): T;
 
   /**
    * Outer Margin
-   * @devices phone, tablet, car.
    * @since 7
    */
-  margin(value: { top?: number | string | Resource, right?: number | string | Resource, bottom?: number | string | Resource, left?: number | string  | Resource} | number | string | Resource): T;
+  margin(value: Margin | Length): T;
 
   /**
    * Background color
-   * @devices phone, tablet, car.
    * @since 7
    */
   backgroundColor(value: Color | number | string | Resource): T;
@@ -2031,177 +518,161 @@ export declare class CommonMethod<T> {
   /**
    * Background image
    * src: Image address url
-   * @devices phone, tablet, car.
    * @since 7
    */
   backgroundImage(src: string, repeat?: ImageRepeat): T;
 
   /**
    * Background image size
-   * @devices phone, tablet, car.
    * @since 7
    */
-  backgroundImageSize(value: { width?: number | string, height?: number | string } | ImageSize): T;
+  backgroundImageSize(value: { width?: number | string; height?: number | string } | ImageSize): T;
 
   /**
    * Background image position
    * x:Horizontal coordinate;y:Vertical axis coordinate.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  backgroundImagePosition(value: { x?: number | string, y?: number | string } | Alignment): T;
+  backgroundImagePosition(value: { x?: number | string; y?: number | string } | Alignment): T;
 
   /**
    * Opacity
-   * @devices phone, tablet, car.
    * @since 7
    */
-  opacity(value: number | Resource): T
+  opacity(value: number | Resource): T;
 
   /**
    * Opacity
    * width:Border width;color:Border color;radius:Border radius;
-   * @devices phone, tablet, car.
    * @since 7
    */
-  border(value: { width?: number | string | Resource, color?: Color | number | string | Resource, radius?: number | string | Resource, style?: BorderStyle }): T;
+  border(value: {
+    width?: number | string | Resource;
+    color?: Color | number | string | Resource;
+    radius?: number | string | Resource;
+    style?: BorderStyle;
+  }): T;
 
   /**
    * Border style
-   * @devices phone, tablet, car.
    * @since 7
    */
   borderStyle(value: BorderStyle): T;
 
   /**
    * Border width
-   * @devices phone, tablet, car.
    * @since 7
    */
   borderWidth(value: number | string | Resource): T;
 
   /**
    * Border color
-   * @devices phone, tablet, car.
    * @since 7
    */
   borderColor(value: Color | number | string | Resource): T;
 
   /**
    * Border radius
-   * @devices phone, tablet, car.
    * @since 7
    */
   borderRadius(value: number | string | Resource): T;
 
   /**
    * Navigation title
-   * @devices phone, tablet, car.
    * @since 7
    */
   navigationTitle(value: string): T;
 
   /**
    * Navigation subtitle
-   * @devices phone, tablet, car.
    * @since 7
    */
   navigationSubTitle(value: string): T;
 
   /**
    * Hide navigation bar
-   * @devices phone, tablet, car.
    * @since 7
    */
   hideNavigationBar(value: boolean): T;
 
   /**
    * Hide navigation back button
-   * @devices phone, tablet, car.
    * @since 7
    */
   hideNavigationBackButton(value: boolean): T;
 
-  /**
-   * Tool bar
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  toolBar(value: object): T;
-
   /**
    * Hide tool bar
-   * @devices phone, tablet, car.
    * @since 7
    */
   hideToolBar(value: boolean): T;
 
   /**
    * Trigger a click event when a click is clicked.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onClick(event: (event?: ClickEvent) => void): T;
 
   /**
    * Trigger a touch event when touched.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onTouch(event: (event?: TouchEvent) => void): T;
 
   /**
    * Mouse hover event
-   * @devices phone, tablet, car.
    * @since 7
    */
   onHover(event: (isHover?: boolean) => void): T;
 
   /**
    * Keyboard input
-   * @devices phone, tablet, car.
    * @since 7
    */
   onKeyEvent(event: (event?: KeyEvent) => void): T;
 
   /**
    * Pan event
-   * @devices phone, tablet, car.
    * @since 7
    */
   onPan(event: (event?: any) => void): T;
 
   /**
    * animation
-   * @devices phone, tablet, car.
    * @since 7
    */
   animation(value: {
-    duration?: number,
-    tempo?: number,
-    curve?: Curve | string,
-    delay?: number,
-    iterations?: number,
-    playMode?: PlayMode,
-    onFinish?: () => void
+    duration?: number;
+    tempo?: number;
+    curve?: Curve | string;
+    delay?: number;
+    iterations?: number;
+    playMode?: PlayMode;
+    onFinish?: () => void;
   }): T;
 
   /**
    * Transition parameter
-   * @devices phone, tablet, car.
    * @since 7
    */
   transition(value: {
-    type?: TransitionType, opacity?: number,
-    translate?: { x?: number | string, y?: number | string, z?: number | string },
-    scale?: { x?: number, y?: number, z?: number, centerX?: number | string, centerY?: number | string },
-    rotate?: { x?: number, y?: number, z?: number, centerX?: number | string, centerY?: number | string, angle: number | string }
+    type?: TransitionType;
+    opacity?: number;
+    translate?: { x?: number | string; y?: number | string; z?: number | string };
+    scale?: { x?: number; y?: number; z?: number; centerX?: number | string; centerY?: number | string };
+    rotate?: {
+      x?: number;
+      y?: number;
+      z?: number;
+      centerX?: number | string;
+      centerY?: number | string;
+      angle: number | string;
+    };
   }): T;
 
   /**
    * Bind gesture recognition.
    * gesture:Bound Gesture Type,mask:GestureMask;
-   * @devices phone, tablet, car.
    * @since 7
    */
   gesture(gesture: GestureType, mask?: GestureMask): T;
@@ -2209,7 +680,6 @@ export declare class CommonMethod<T> {
   /**
    * Binding Preferential Recognition Gestures
    * gesture:Bound Gesture Type,mask:GestureMask;
-   * @devices phone, tablet, car.
    * @since 7
    */
   priorityGesture(gesture: GestureType, mask?: GestureMask): T;
@@ -2217,7 +687,6 @@ export declare class CommonMethod<T> {
   /**
    * Binding gestures that can be triggered simultaneously with internal component gestures
    * gesture:Bound Gesture Type,mask:GestureMask;
-   * @devices phone, tablet, car.
    * @since 7
    */
   parallelGesture(gesture: GestureType, mask?: GestureMask): T;
@@ -2226,7 +695,6 @@ export declare class CommonMethod<T> {
    * Adds the content blurring effect for the current component. The input parameter is the blurring radius.
    * The larger the blurring radius, the more blurring the content.
    * If the value is 0, the content blurring effect is not blurring.
-   * @devices phone, tablet, car.
    * @since 7
    */
   blur(value: number): T;
@@ -2235,7 +703,6 @@ export declare class CommonMethod<T> {
    * Adds a highlight effect to the current component.
    * The input parameter is the highlight proportion. 0 indicates no highlight effect, and 1 indicates the maximum highlight proportion.
    * The component is displayed as all white (percentage).
-   * @devices phone, tablet, car.
    * @since 7
    */
   brightness(value: number): T;
@@ -2243,7 +710,6 @@ export declare class CommonMethod<T> {
   /**
    * Adds a contrast effect to the current component. The input parameter is the contrast value.
    * A larger contrast value indicates a sharper image. When the contrast value is 0, the image becomes gray. (%)
-   * @devices phone, tablet, car.
    * @since 7
    */
   contrast(value: number): T;
@@ -2252,14 +718,12 @@ export declare class CommonMethod<T> {
    * Adds a grayscale effect to the current component.
    * The value is the gray scale conversion ratio. If the input parameter is 1.0, the gray scale image is completely converted to the gray scale image. If the input parameter is 0.0, the image does not change.
    * If the input parameter is between 0.0 and 1.0, the effect changes. (Percentage)
-   * @devices phone, tablet, car.
    * @since 7
    */
   grayscale(value: number): T;
 
   /**
    * Adds a color overlay effect for the current component. The input parameter is the superimposed color.
-   * @devices phone, tablet, car.
    * @since 7
    */
   colorBlend(value: Color | string | Resource): T;
@@ -2269,7 +733,6 @@ export declare class CommonMethod<T> {
    * The saturation is the ratio of the color-containing component to the achromatic component (gray).
    * The larger the color-containing component, the greater the saturation.
    * The larger the achromatic component, the smaller the saturation. (Percentage)
-   * @devices phone, tablet, car.
    * @since 7
    */
   saturate(value: number): T;
@@ -2277,7 +740,6 @@ export declare class CommonMethod<T> {
   /**
    * Converts the image to sepia. Value defines the scale of the conversion.
    * A value of 1 is completely sepia, and a value of 0 does not change the image. (Percentage)
-   * @devices phone, tablet, car.
    * @since 7
    */
   sepia(value: number): T;
@@ -2285,7 +747,6 @@ export declare class CommonMethod<T> {
   /**
    * Inverts the input image. Value defines the scale of the conversion. 100% of the value is a complete reversal.
    * A value of 0% does not change the image. (Percentage)
-   * @devices phone, tablet, car.
    * @since 7
    */
   invert(value: number): T;
@@ -2294,7 +755,6 @@ export declare class CommonMethod<T> {
    * Adds the hue rotation effect to the current component.
    * The input parameter is the rotation angle. When the input parameter is 0deg, the image does not change (the default value is 0deg), and the input parameter does not have a maximum value.
    * If the value exceeds 360deg, the image is circled again.
-   * @devices phone, tablet, car.
    * @since 7
    */
   hueRotate(value: number | string): T;
@@ -2302,214 +762,183 @@ export declare class CommonMethod<T> {
   /**
    * Adds the background blur effect for the current component. The input parameter is the blur radius.
    * The larger the blur radius, the more blurred the background. If the value is 0, the background blur is not blurred.
-   * @devices phone, tablet, car.
    * @since 7
    */
   backdropBlur(value: number): T;
 
-  /**
-   * This style allows you to set the window blurring degree and blurring style of the current component layout range.
-   * If no value is set, the default value is 0% (no blurring).
-   * Different blurring values and blurring styles cannot be set for multiple blurring areas.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  windowBlur(value: { percent: number, style?: BlurStyle }): T;
-
   /**
    * Sets the translation effect during page transition.
    * The value is the start point of entry and end point of exit.
    * When this parameter is set together with slide, slide takes effect by default.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  translate(value: { x?: number | string, y?: number | string, z?: number | string }): T;
+  translate(value: { x?: number | string; y?: number | string; z?: number | string }): T;
 
   /**
    * Sets the zoom effect during page transition. The value is the start point of entry and end point of exit.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  scale(value: { x?: number, y?: number, z?: number, centerX?: number | string, centerY?: number | string }): T;
+  scale(value: { x?: number; y?: number; z?: number; centerX?: number | string; centerY?: number | string }): T;
 
   /**
    * Default number of occupied columns, indicating the number of occupied grid columns when the number of columns (span) of the corresponding size is not set in the useSizeType attribute.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  gridSpan(value: number): T
+  gridSpan(value: number): T;
 
   /**
    * The default offset column number indicates the number of offset columns of the current component in the start direction of the parent component when the useSizeType attribute does not set the offset of the corresponding dimension. That is,
    * the current component is located in the nth column.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  gridOffset(value: number): T
+  gridOffset(value: number): T;
 
   /**
    * Sets the rotation effect during assembly transition.
    * The values are the start point during insertion and the end point during deletion.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  rotate(value: { x?: number, y?: number, z?: number, centerX?: number | string, centerY?: number | string, angle: number | string }): T;
+  rotate(value: {
+    x?: number;
+    y?: number;
+    z?: number;
+    centerX?: number | string;
+    centerY?: number | string;
+    angle: number | string;
+  }): T;
 
   /**
    * Sets the transformation matrix for the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   transform(value: object): T;
 
   /**
    * This callback is triggered when a component mounts a display.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onAppear(event: () => void): T;
 
   /**
    * This callback is triggered when component uninstallation disappears.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDisAppear(event: () => void): T;
 
   /**
    * Controls the display or hide of the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   visibility(value: Visibility): T;
 
   /**
    * The percentage of the remaining space of the Flex container allocated to the component on which this property resides.
-   * @devices phone, tablet, car.
    * @since 7
    */
   flexGrow(value: number): T;
 
   /**
    * The proportion of the Flex container compression size assigned to the component on which this attribute resides.
-   * @devices phone, tablet, car.
    * @since 7
    */
   flexShrink(value: number): T;
 
   /**
    * The base dimension of the assembly on which this attribute is located in the direction of the principal axis in the Flex container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   flexBasis(value: number | string): T;
 
   /**
    * Overrides the default configuration of alignItems in the Flex Layout container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   alignSelf(value: ItemAlign): T;
 
   /**
    * Sets the current component and displays the priority in the layout container. This parameter is valid only in Row, Column, and Flex single-row layouts.
-   * @devices phone, tablet, car.
    * @since 7
    */
   displayPriority(value: number): T;
 
-  /**
-   * Use a custom alignment.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  useAlign(align: HorizontalAlignDeclaration | VerticalAlignDeclaration, value: { side: Edge, offset?: number | string }): T;
-
   /**
    * The sibling components in the same container are hierarchically displayed. A larger value of z indicates a higher display level.
-   * @devices phone, tablet, car.
    * @since 7
    */
   zIndex(value: number): T;
 
   /**
    * If the components of the two pages are configured with the same ID, the shared element transition is performed during transition. If the parameter is set to an empty string, the shared element transition does not occur. For details about the options parameter, see the options parameter description.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  sharedTransition(id: string, options?: {
-    duration?: number,
-    curve?: Curve | string,
-    delay?: number,
-    motionPath?: {
-      path: string,
-      from?: number,
-      to?: number,
-      rotatable?: boolean
+   * @since 7
+   */
+  sharedTransition(
+    id: string,
+    options?: {
+      duration?: number;
+      curve?: Curve | string;
+      delay?: number;
+      motionPath?: {
+        path: string;
+        from?: number;
+        to?: number;
+        rotatable?: boolean;
+      };
+      zIndex?: number;
+      type?: SharedTransitionEffectType;
     },
-    zIndex?: number,
-    type?: SharedTransitionEffectType,
-  }): T;
+  ): T;
 
   /**
    * Sets the sliding direction. The enumerated value supports logical AND (&) and logical OR (|).
-   * @devices phone, tablet, car.
    * @since 7
    */
   direction(value: Direction): T;
 
   /**
    * align
-   * @devices phone, tablet, car.
    * @since 7
    */
   align(value: Alignment): T;
 
   /**
    * position
-   * @devices phone, tablet, car.
    * @since 7
    */
-  position(value: { x?: number | string | Resource, y?: number | string | Resource }): T;
+  position(value: { x?: number | string | Resource; y?: number | string | Resource }): T;
 
   /**
    * Sets the anchor point of the element when it is positioned. The base point is offset from the top start point of the element.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  markAnchor(value: { x?: number | string | Resource, y?: number | string | Resource }): T;
+  markAnchor(value: { x?: number | string | Resource; y?: number | string | Resource }): T;
 
   /**
    * Coordinate offset relative to the layout completion position.
    * Setting this attribute does not affect the layout of the parent container. The position is adjusted only during drawing.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  offset(value: { x?: number | string | Resource, y?: number | string | Resource }): T;
+  offset(value: { x?: number | string | Resource; y?: number | string | Resource }): T;
 
   /**
    * If the value is true, the component is available and can respond to operations such as clicking.
    *  If it is set to false, click operations are not responded.
-   * @devices phone, tablet, car.
    * @since 7
    */
   enabled(value: boolean): T;
 
   /**
    * Sets the number of occupied columns and offset columns for a specific device width type.
-   * @devices phone, tablet, car.
    * @since 7
    */
   useSizeType(value: {
-    xs?: number | { span: number, offset: number },
-    sm?: number | { span: number, offset: number },
-    md?: number | { span: number, offset: number },
-    lg?: number | { span: number, offset: number }
+    xs?: number | { span: number; offset: number };
+    sm?: number | { span: number; offset: number };
+    md?: number | { span: number; offset: number };
+    lg?: number | { span: number; offset: number };
   }): T;
 
   /**
    * Specifies the aspect ratio of the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   aspectRatio(value: number): T;
@@ -2517,28 +946,24 @@ export declare class CommonMethod<T> {
   /**
    * After a listener is bound, the component can be dragged. After the drag occurs, a callback is triggered.
    * (To be triggered, press and hold for 170 milliseconds (ms))
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDrag(event: (event?: DragEvent) => void): T;
 
   /**
    * After binding, a callback is triggered when the component is dragged to the range of the component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDragEnter(event: (event?: DragEvent) => void): T;
 
   /**
    * After binding, a callback is triggered when the drag moves within the range of a placeable component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDragMove(event: (event?: DragEvent) => void): T;
 
   /**
    * After binding, a callback is triggered when the component is dragged out of the component range.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDragLeave(event: (event?: DragEvent) => void): T;
@@ -2546,25 +971,27 @@ export declare class CommonMethod<T> {
   /**
    * The component bound to this event can be used as the drag release target.
    * This callback is triggered when the drag behavior is stopped within the scope of the component.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDrop(event: (event?: DragEvent) => void): T;
 
   /**
    * Add mask text to the current component. The layout is the same as that of the current component.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  overlay(value: string, options?: { align?: Alignment, offset?: { x?: number, y?: number } }): T;
+  overlay(value: string, options?: { align?: Alignment; offset?: { x?: number; y?: number } }): T;
 
   /**
    * Linear Gradient
    * angle: Angle of Linear Gradient; direction:Direction of Linear Gradient;  colors:Color description for gradients,repeating:repeating.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  linearGradient(value: { angle?: number | string, direction?: GradientDirection, colors: Array<any>, repeating?: boolean }): T;
+  linearGradient(value: {
+    angle?: number | string;
+    direction?: GradientDirection;
+    colors: Array<any>;
+    repeating?: boolean;
+  }): T;
 
   /**
    * Angle Gradient
@@ -2575,10 +1002,16 @@ export declare class CommonMethod<T> {
    * rotating:rotating
    * colors:Color description for gradients
    * repeating:repeating
-   * @devices phone, tablet, car.
    * @since 7
    */
-  sweepGradient(value: { center: Array<any>, start?: number | string, end?: number | string, rotation?: number | string, colors: Array<any>, repeating?: boolean }): T;
+  sweepGradient(value: {
+    center: Array<any>;
+    start?: number | string;
+    end?: number | string;
+    rotation?: number | string;
+    colors: Array<any>;
+    repeating?: boolean;
+  }): T;
 
   /**
    * Radial Gradient
@@ -2586,10 +1019,9 @@ export declare class CommonMethod<T> {
    * radius:Radius of Radial Gradient
    * colors:Color description for gradients
    * repeating: Refill
-   * @devices phone, tablet, car.
    * @since 7
    */
-  radialGradient(value: { center: Array<any>, radius: number | string, colors: Array<any>, repeating?: boolean }): T;
+  radialGradient(value: { center: Array<any>; radius: number | string; colors: Array<any>; repeating?: boolean }): T;
 
   /**
    * Set the motion path of the component
@@ -2597,36 +1029,36 @@ export declare class CommonMethod<T> {
    * from:Start point of the motion path. The default value is 0.0.
    * to:End point of the motion path. The default value is 1.0.
    * rotatble:Whether to follow the path for rotation.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  motionPath(value: { path: string, from?: number, to?: number, rotatable?: boolean }): T;
+  motionPath(value: { path: string; from?: number; to?: number; rotatable?: boolean }): T;
 
   /**
    * Add a shadow effect to the current component
-   * @devices phone, tablet, car.
    * @since 7
    */
-  shadow(value: { radius: number | Resource, color?: Color | string | Resource, offsetX?: number | Resource, offsetY?: number | Resource }): T;
+  shadow(value: {
+    radius: number | Resource;
+    color?: Color | string | Resource;
+    offsetX?: number | Resource;
+    offsetY?: number | Resource;
+  }): T;
 
   /**
    * When the parameter is of the Shape type, the current component is cropped according to the specified shape.
    * When the parameter is of the boolean type, this parameter specifies whether to crop based on the edge contour.
-   * @devices phone, tablet, car.
    * @since 7
    */
   clip(value: boolean | Circle | Ellipse | Path | Rect): T;
 
   /**
    * Applies a mask of the specified shape to the current assembly.
-   * @devices phone, tablet, car.
    * @since 7
    */
   mask(value: Circle | Ellipse | Path | Rect): T;
 
   /**
    * Accessibility group. If this parameter is set to true, the component and all its subcomponents can be selected, and the accessibility service does not focus on the content of its subcomponents.
-   * @devices phone, tablet, car.
    * @since 7
    */
   accessibilityGroup(value: boolean): T;
@@ -2638,7 +1070,6 @@ export declare class CommonMethod<T> {
    * When the component is selected for screen reading, the content of the accessible text is broadcast, helping the user of screen reading clearly know which component is selected.
    * If the component has both text attributes and accessible text attributes,
    * only accessible text content is broadcast when the component is selected.
-   * @devices phone, tablet, car.
    * @since 7
    */
   accessibilityText(value: string): T;
@@ -2650,7 +1081,6 @@ export declare class CommonMethod<T> {
    * Developers can set relatively detailed explanatory text for this property of a component to help users understand what will be done.
    * If the component has both the text attribute and the accessibility attribute, when the component is selected,
    * the text attribute of the component is first broadcast, and then the content of the accessibility attribute is broadcast.
-   * @devices phone, tablet, car.
    * @since 7
    */
   accessibilityDescription(value: string): T;
@@ -2661,219 +1091,198 @@ export declare class CommonMethod<T> {
    * (The last value causes screen reading to ignore the current component and all its subcomponents).
    * If this parameter is set to yes, the current component can be selected for accessibility auxiliary services.
    * If this parameter is set to no, the current component cannot be selected for accessibility auxiliary services.
-   * @devices phone, tablet, car.
    * @since 7
    */
   accessibilityImportance(value: string): T;
 
   /**
    * onAccessibility
-   * @devices phone, tablet, car.
    * @since 7
    */
   onAccessibility(callback: (event?: { eventType: number }) => void): T;
 
   /**
    * geometryTransition
-   * @devices phone, tablet, car.
    * @since 7
    */
   geometryTransition(id: string): T;
 
   /**
    * Popup control
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  bindPopup(show: boolean, popup: {
-
-    /**
-     * Information in the pop-up window.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    message: string,
-
-    /**
-     * placement On Top
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    placementOnTop?: boolean,
-
-    /**
-     * The first button.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    primaryButton?: {
+   * @since 7
+   */
+  bindPopup(
+    show: boolean,
+    popup: {
       /**
-       * Button text value
-       * @devices phone, tablet, car.
+       * Information in the pop-up window.
+      .
        * @since 7
        */
-      value: string;
+      message: string;
 
       /**
-       * action
-       * @devices phone, tablet, car.
+       * placement On Top
+      .
        * @since 7
        */
-      action: () => void;
-    };
-
-    /**
-     * The second button.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    secondaryButton?: {
+      placementOnTop?: boolean;
 
       /**
-       * Button text value
-       * @devices phone, tablet, car.
+       * The first button.
+      .
        * @since 7
        */
-      value: string;
+      primaryButton?: {
+        /**
+         * Button text value
+        .
+         * @since 7
+         */
+        value: string;
+
+        /**
+         * action
+        .
+         * @since 7
+         */
+        action: () => void;
+      };
 
       /**
-       * action
-       * @devices phone, tablet, car.
+       * The second button.
+      .
        * @since 7
        */
-      action: () => void;
-    };
+      secondaryButton?: {
+        /**
+         * Button text value
+        .
+         * @since 7
+         */
+        value: string;
+
+        /**
+         * action
+        .
+         * @since 7
+         */
+        action: () => void;
+      };
 
-    /**
-     * on State Change
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    onStateChange?: (event: { isVisible: boolean }) => void;
-  }): T;
+      /**
+       * on State Change
+      .
+       * @since 7
+       */
+      onStateChange?: (event: { isVisible: boolean }) => void;
+    },
+  ): T;
 
   /**
    * Menu control
-   * @devices phone, tablet, car.
    * @since 7
    */
-  bindMenu(content: {value: string, action: () => void}[]): T;
+  bindMenu(content: { value: string; action: () => void }[]): T;
 }
 
 /**
  * CommonShapeMethod
- * @devices phone, tablet, car
  * @since 7
  */
 export declare class CommonShapeMethod<T> extends CommonMethod<T> {
   /**
    * constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * border Color
-   * @devices phone, tablet, car.
    * @since 7
    */
   stroke(value: Color | number | string | Resource): T;
 
   /**
    * Fill color.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fill(value: Color | number | string | Resource): T;
 
   /**
    * Offset from the start point of the border drawing.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeDashOffset(value: number | string): T;
 
   /**
    * Path endpoint drawing style.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeLineCap(value: LineCapStyle): T;
 
   /**
    * Border corner drawing style.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeLineJoin(value: LineJoinStyle): T;
 
   /**
    * Limits for drawing acute angles as bevels
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeMiterLimit(value: number | string): T;
 
   /**
    * Sets the opacity of the border.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeOpacity(value: number | string | Resource): T;
 
   /**
    * fill Opacity
-   * @devices phone, tablet, car.
    * @since 7
    */
   fillOpacity(value: number | string | Resource): T;
 
   /**
    * Sets the width of the dividing line.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeWidth(value: number | string | Resource): T;
 
   /**
    * Indicates whether to enable anti-aliasing
-   * @devices phone, tablet, car.
    * @since 7
    */
   antiAlias(value: boolean): T;
 
   /**
    * Sets the gap for the border.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  strokeDashArray(value: Array<any>): T
+  strokeDashArray(value: Array<any>): T;
 }
 
 /**
  * Custom Component
- * @devices phone, tablet, car
  * @since 7
  */
 export declare class CustomComponent<T> {
   /**
    * Customize the pop-up content constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   build(): void;
 
   /**
    * Private  aboutToAppear Method
-   * @devices phone, tablet, car.
    * @since 7
    */
   private aboutToAppear?(): void;
 
   /**
    * Private  aboutToDisappear Method
-   * @devices phone, tablet, car.
    * @since 7
    */
   private aboutToDisappear?(): void;
diff --git a/api/@internal/component/ets/counter.d.ts b/api/@internal/component/ets/counter.d.ts
index e8542557eb68b911a21a206d1d4dac73cbe234bf..ba765714d54176bb0ad149f0c2a65240a37849d7 100644
--- a/api/@internal/component/ets/counter.d.ts
+++ b/api/@internal/component/ets/counter.d.ts
@@ -13,58 +13,43 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class CounterExtend<T> extends CounterAttribute<T> {
-}
+import { CommonMethod } from "./common";
 
 /**
  * Counter component, which provides corresponding increment or decrement counting operations.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface Counter extends CounterAttribute<Counter> {
   /**
    * Return Counter.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   (): Counter;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * Defines the Counter attibute functions.
+ * @since 8
  */
 declare class CounterAttribute<T> extends CommonMethod<T> {
   /**
    * Listens to the value change event.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onStateChange(event: () => void): T;
 
   /**
    * Listen to the event that the value increases.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onInc(event: () => void): T;
 
   /**
    * Listens to the number decrease event.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onDec(event: () => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const CounterInterface: Counter;
+export declare class CounterExtend<T> extends CounterAttribute<T> {}
diff --git a/api/@internal/component/ets/custom_dialog_controller.d.ts b/api/@internal/component/ets/custom_dialog_controller.d.ts
index e31974b2b864a97f71d7d5028b3508dd9798a228..31a2acefa26c74d0599373b5b822da0ca29d0d3a 100644
--- a/api/@internal/component/ets/custom_dialog_controller.d.ts
+++ b/api/@internal/component/ets/custom_dialog_controller.d.ts
@@ -1,51 +1,83 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { DialogAlignment } from "./alert_dialog";
-import {CommonMethod, Resource} from "./common";
-
-/**
- * Use the CustomDialogController class to display the custom pop-up window.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class CustomDialogController {
-  /**
-   * The constructor transfers parameter settings.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  constructor(value: {
-    builder: any, cancel?: () => void,
-    autoCancel?: boolean,
-    alignment?: DialogAlignment,
-    offset?: { dx: number | string | Resource, dy: number | string | Resource },
-    customStyle?: boolean
-  });
-
-  /**
-   * Display the content of the customized pop-up window. If the content has been displayed, it does not take effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  open();
-
-  /**
-   * Closes the custom pop-up window. If the window is closed, the window does not take effect.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  close();
-}
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { DialogAlignment } from "./alert_dialog";
+import { Offset } from "./units";
+
+/**
+ * Defines the option of CustomDialogController.
+ * @since 7
+ */
+export declare interface CustomDialogControllerOption {
+  /**
+   * Custom builder function.
+   * @since 7
+   */
+  builder: any;
+
+  /**
+   * Defines the cancel function.
+   * @since 7
+   */
+  cancel?: () => void;
+
+  /**
+   * Defines if use auto cancel when click on the outside of the dialog.
+   * @since 7
+   */
+  autoCancel?: boolean;
+
+  /**
+   * Defines the dialog alignment of the screen.
+   * @since 7
+   */
+  alignment?: DialogAlignment;
+
+  /**
+   * Defines the dialog offset.
+   * @since 7
+   */
+  offset?: Offset;
+
+  /**
+   * Defines if use costom style.
+   * @since 7
+   */
+  customStyle?: boolean;
+}
+
+/**
+ * Use the CustomDialogController class to display the custom pop-up window.
+ * @since 7
+ */
+export declare class CustomDialogController {
+  /**
+   * The constructor transfers parameter settings.
+   * @since 7
+   */
+  constructor(value: CustomDialogControllerOption);
+
+  /**
+   * Display the content of the customized pop-up window. If the content has been displayed, it does not take effect.
+   * @since 7
+   */
+  open();
+
+  /**
+   * Closes the custom pop-up window. If the window is closed, the window does not take effect.
+   * @since 7
+   */
+  close();
+}
diff --git a/api/@internal/component/ets/option.d.ts b/api/@internal/component/ets/data_panel.d.ts
similarity index 46%
rename from api/@internal/component/ets/option.d.ts
rename to api/@internal/component/ets/data_panel.d.ts
index 6ce995fc8636f35935f8d59ccd0b93a7ea294218..467ba76be7c16ec0943ef0093178400588718ce5 100644
--- a/api/@internal/component/ets/option.d.ts
+++ b/api/@internal/component/ets/data_panel.d.ts
@@ -13,40 +13,49 @@
  * limitations under the License.
  */
 
-import { CommonMethod, Resource } from "./common";
+import { CommonMethod } from "./common";
 
 /**
- * Display items.
- * @devices phone, tablet, car.
+ * Defines the option of DataPanel.
  * @since 7
  */
-export declare class OptionExtend<T> extends OptionAttribute<T> {
+export declare interface DataPanelOption {
+  /**
+   * Current data value. the max length is 9.
+   * @since 7
+   */
+  values: number[];
+
+  /**
+   * Maximum value of the current data.
+   * @since 7
+   */
+  max?: number;
 }
 
 /**
- * Provides the interface for displaying the content.
- * @devices phone, tablet, car.
+ * Defines the DataPanel component.
  * @since 7
  */
-interface Option extends OptionAttribute<Option> {
+interface DataPanel extends DataPanelAttribute<DataPanel> {
   /**
-   * Called when the content needs to be displayed.
-   * @devices phone, tablet, car.
+   * Return a DataPanel.
    * @since 7
    */
-  (content?: string | Resource): Option;
+  (options: DataPanelOption): DataPanel;
 }
 
 /**
- * Declare option properties.
- * @devices phone, tablet, car.
+ * Defines the DataPanel attribute functions.
  * @since 7
  */
-declare class OptionAttribute<T> extends CommonMethod<T> {
+declare class DataPanelAttribute<T> extends CommonMethod<T> {
+  /**
+   * Disable the special effect of the data ratio chart.
+   * @since 7
+   */
+  closeEffect(value: boolean): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const OptionInterface: Option;
\ No newline at end of file
+export declare class DataPanelExtend<T> extends DataPanelAttribute<T> {}
+export declare const DataPanelInterface: DataPanel;
diff --git a/api/@internal/component/ets/datapanel.d.ts b/api/@internal/component/ets/datapanel.d.ts
deleted file mode 100644
index 700d2805ce1e0d0155f8483e5fb75456f497625f..0000000000000000000000000000000000000000
--- a/api/@internal/component/ets/datapanel.d.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod} from "./common";
-
-/**
- * The data panel component is used to display multiple data proportions in a circular proportion chart.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class DataPanelExtend<T> extends DataPanelAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-interface DataPanel extends DataPanelAttribute<DataPanel> {
-  /**
-   * Return a DataPanel.
-   * values: Current data value. A maximum of nine data records are supported.
-   * max: Maximum value of the current data.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options: {values: number[], max?: number}): DataPanel;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class DataPanelAttribute<T> extends CommonMethod<T> {
-  /**
-   * Disable the special effect of the data ratio chart.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  closeEffect(value: boolean): T;
-}
-
-/**
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const DataPanelInterface: DataPanel;
diff --git a/api/@internal/component/ets/datePicker.d.ts b/api/@internal/component/ets/date_picker.d.ts
similarity index 56%
rename from api/@internal/component/ets/datePicker.d.ts
rename to api/@internal/component/ets/date_picker.d.ts
index 91586a15ae0d0648cee718c3a32c46d7aeb11964..5ea5d15c5b537fe35aab5026aa297e19f33dac3b 100644
--- a/api/@internal/component/ets/datePicker.d.ts
+++ b/api/@internal/component/ets/date_picker.d.ts
@@ -13,125 +13,124 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
- * Date and time slide selector component.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class DatePickerExtend<T> extends DatePickerAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
+ * Defines the type of DatePicker.
+ * @since 8
  */
 export declare enum DatePickerType {
   /**
    * Application hour and second
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Time,
 
   /**
    * Application data
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  Date
+  Date,
 }
 
-export interface DatePickerResult {
+export declare interface DatePickerResult {
   /**
    * Application year
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   year?: number;
 
   /**
    * Application month
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   month?: number;
 
   /**
    * Application day
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   day?: number;
 
   /**
    * Application hour
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   hour?: number;
 
   /**
    * Application minute
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   minute?: number;
 
   /**
    * Application second
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   second?: number;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * Defines the option of DatePicker.
+ * @since 8
+ */
+export declare interface DatePickerOption {
+  /**
+   * Specifies the start date of the date selector.
+   */
+  start?: Date;
+  /**
+   * Specifies the end date for the date selector.
+   */
+  end?: Date;
+
+  /**
+   * Specifies the date selector check date or time selector check time.
+   */
+  selected?: Date;
+
+  /**
+   * Selector type, including date selector and time selector. By default, the date selector is used.
+   */
+  type?: DatePickerType;
+}
+
+/**
+ * Defines the DatePicker Component.
+ * @since 8
  */
 interface DatePicker extends DatePickerAttribute<DatePicker> {
   /**
-   * start: Specifies the start date of the date selector.
-   * end: Specifies the end date for the date selector.
-   * selected: Specifies the date selector check date or time selector check time.
-   * type: Selector type, including date selector and time selector. By default, the date selector is used.
-   * @devices phone, tablet, car.
-   * @since 7
+   * Defines the DatePicker constructor.
+   * @since 8
    */
-  (options?: {start?: Date, end?: Date, selected?: Date, type?: DatePickerType}): DatePicker;
+  (options?: DatePickerOption): DatePicker;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * Defines the DatePicker attribute functions.
+ * @since 8
  */
 declare class DatePickerAttribute<T> extends CommonMethod<T> {
   /**
    * Date selector: true: displays the lunar calendar. false: The lunar calendar is not displayed.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   lunar(value: boolean): T;
 
   /**
    * Time Selector: indicates whether to display the 24-hour clock.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   useMilitaryTime(value: boolean): T;
 
   /**
    * This event is triggered when a DatePicker date or time is selected.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onChange(callback: (value: DatePickerResult) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class DatePickerExtend<T> extends DatePickerAttribute<T> {}
 export declare const DatePickerInterface: DatePicker;
diff --git a/api/@internal/component/ets/divider.d.ts b/api/@internal/component/ets/divider.d.ts
index d5af01463ec01c9139b859eba23a5afee0a90135..f98c628e6cc88ebc936a2cbed353025fb0f7e732 100644
--- a/api/@internal/component/ets/divider.d.ts
+++ b/api/@internal/component/ets/divider.d.ts
@@ -13,66 +13,52 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, LineCapStyle, Resource} from "./common";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class DividerExtend<T> extends DividerAttribute<T> {
-}
+import { CommonMethod } from "./common";
+import { LineCapStyle } from "./enums";
+import { ResourceColor } from "./units";
 
 /**
  * Provides a divider component to separate different content blocks/content elements.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Divider extends DividerAttribute<Divider> {
   /**
    * Return Divider.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): Divider;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the Divider attribute functions.
  * @since 7
  */
 declare class DividerAttribute<T> extends CommonMethod<T> {
   /**
    * Indicates whether to use a horizontal splitter or a vertical splitter.
    * The options are as follows: false: horizontal splitter; true: vertical splitter.
-   * @devices phone, tablet, car.
    * @since 7
    */
   vertical(value: boolean): T;
 
   /**
    * Sets the color of the divider line.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 
   /**
    * Sets the width of the dividing line.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeWidth(value: number | string): T;
 
   /**
    * Sets the end style of the split line. The default value is Butt.
-   * @devices phone, tablet, car.
    * @since 7
    */
   lineCap(value: LineCapStyle): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class DividerExtend<T> extends DividerAttribute<T> {}
 export declare const DividerInterface: Divider;
diff --git a/api/@internal/component/ets/ellipse.d.ts b/api/@internal/component/ets/ellipse.d.ts
index d44c7f9ab754f60c770d33a6b029e5c224a3e12e..3b5fbc2348b064fd49b25dd06cdde98fd8617f3b 100644
--- a/api/@internal/component/ets/ellipse.d.ts
+++ b/api/@internal/component/ets/ellipse.d.ts
@@ -13,45 +13,24 @@
  * limitations under the License.
  */
 
-import {CommonShapeMethod} from "./common";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class EllipseExtend<T> extends EllipseAttribute<T> {
-}
+import { CommonShapeMethod } from "./common";
 
 /**
  * Ellipse drawing.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Ellipse extends EllipseAttribute<Ellipse> {
-  /**
-   * Set a new value.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  new (value?: { width?: string | number, height?: string | number }): Ellipse;
-
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { width?: string | number, height?: string | number }): Ellipse;
+  (value?: { width?: string | number; height?: string | number }): Ellipse;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-declare class EllipseAttribute<T> extends CommonShapeMethod<T> {
-}
+declare class EllipseAttribute<T> extends CommonShapeMethod<T> {}
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class EllipseExtend<T> extends EllipseAttribute<T> {}
 export declare const EllipseInterface: Ellipse;
diff --git a/api/@internal/component/ets/enums.d.ts b/api/@internal/component/ets/enums.d.ts
new file mode 100644
index 0000000000000000000000000000000000000000..732ce93c3dc59812711977d168ea884f8bca2d37
--- /dev/null
+++ b/api/@internal/component/ets/enums.d.ts
@@ -0,0 +1,1297 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * common enum of color
+ * @since 7
+ */
+export declare enum Color {
+  /**
+   * White.
+   * @since 7
+   */
+  White,
+
+  /**
+   * Black.
+   * @since 7
+   */
+  Black,
+
+  /**
+   * Blue.
+   * @since 7
+   */
+  Blue,
+
+  /**
+   * Brown.
+   * @since 7
+   */
+  Brown,
+
+  /**
+   * Gray.
+   * @since 7
+   */
+  Gray,
+
+  /**
+   * Green.
+   * @since 7
+   */
+  Green,
+
+  /**
+   * Grey.
+   * @since 7
+   */
+  Grey,
+
+  /**
+   * Orange.
+   * @since 7
+   */
+  Orange,
+
+  /**
+   * color.
+   * @since 7
+   */
+  Pink,
+
+  /**
+   * Red.
+   * @since 7
+   */
+  Red,
+
+  /**
+   * Yellow.
+   * @since 7
+   */
+  Yellow,
+}
+
+/**
+ * Image display mode
+ * @since 7
+ */
+export declare enum ImageFit {
+  /**
+   * Keep the aspect ratio to zoom out or zoom in so that the image is completely displayed within the display boundary.
+   * @since 7
+   */
+  Contain,
+
+  /**
+   * Keep the aspect ratio to zoom out or zoom in so that both sides of the image are greater than or equal to the display boundary.
+   * @since 7
+   */
+  Cover,
+
+  /**
+   * Adaptive display
+   * @since 7
+   */
+  Auto,
+
+  /**
+   * Zoom in or out without maintaining the aspect ratio so that the image fills the display boundary.
+   * @since 7
+   */
+  Fill,
+
+  /**
+   * Keep the aspect ratio displayed, and the image zooms out or remains unchanged.
+   * @since 7
+   */
+  ScaleDown,
+
+  /**
+   * Keep the original size and display it in the center.
+   * @since 7
+   */
+  None,
+}
+
+/**
+ * Border Style
+ * @since 7
+ */
+export declare enum BorderStyle {
+  /**
+   * Displays as a series of dots with a radius of half the borderWidth.
+   * @since 7
+   */
+  Dotted,
+
+  /**
+   * Shows as a series of short square dashed lines.
+   * @since 7
+   */
+  Dashed,
+
+  /**
+   * Shows as a solid line.
+   * @since 7
+   */
+  Solid,
+}
+
+/**
+ * Line Join Style
+ * @since 7
+ */
+export declare enum LineJoinStyle {
+  /**
+   * Connect path segments using bevels.
+   * @since 7
+   */
+  Miter,
+
+  /**
+   * Connect path segments using sharp corners.
+   * @since 7
+   */
+  Round,
+
+  /**
+   * Connect path segments using fillets.
+   * @since 7
+   */
+  Bevel,
+}
+
+/**
+ * Function Called by Touch
+ * @since 7
+ */
+export declare enum TouchType {
+  /**
+   * Triggered when the finger is pressed.
+   * @since 7
+   */
+  Down,
+
+  /**
+   * Triggered when the finger is raised.
+   * @since 7
+   */
+  Up,
+
+  /**
+   * Triggered when the finger presses on the screen.
+   * @since 7
+   */
+  Move,
+
+  /**
+   * Triggers when the touch event cancels.
+   * @since 7
+   */
+  Cancel,
+}
+
+/**
+ * Animation status.
+ * @since 7
+ */
+export declare enum AnimationStatus {
+  /**
+   * Initial state of the animation.
+   * @since 7
+   */
+  Initial,
+
+  /**
+   * The animation is playing.
+   * @since 7
+   */
+  Running,
+
+  /**
+   * The animation is paused.
+   * @since 7
+   */
+  Paused,
+
+  /**
+   * The animation is stopped.
+   * @since 7
+   */
+  Stopped,
+}
+
+/**
+ * Sets the animation playback mode. By default, the animation starts to play again after the playback is complete.
+ * @since 7
+ */
+export declare enum Curve {
+  /**
+   * Indicates that the speed of the animation is the same from start to finish.
+   * @since 7
+   */
+  Linear,
+
+  /**
+   * Indicates that the animation starts at a low speed, then accelerates, and then slows down before it ends, CubicBezier(0.25, 0.1, 0.25, 1.0).
+   * @since 7
+   */
+  Ease,
+
+  /**
+   * Indicates that the animation starts at a low speed, CubicBezier(0.42, 0.0, 1.0, 1.0).
+   * @since 7
+   */
+  EaseIn,
+
+  /**
+   * Indicates that the animation ends at a low speed, CubicBezier(0.0, 0.0, 0.78, 1.0).
+   * @since 7
+   */
+  EaseOut,
+
+  /**
+   * Indicates that the animation starts and ends at a slow speed, CubicBezier(0.42, 0.0, 0.78, 1.0).
+   * @since 7
+   */
+  EaseInOut,
+
+  /**
+   * Slow-in, fast-out
+   * @since 7
+   */
+  FastOutSlowIn,
+
+  /**
+   * Linear Out Slow In
+   * @since 7
+   */
+  LinearOutSlowIn,
+
+  /**
+   * Fast OutL inear In.
+   * @since 7
+   */
+  FastOutLinearIn,
+
+  /**
+   * Extreme Deceleration.
+   * @since 7
+   */
+  ExtremeDeceleration,
+
+  /**
+   * Sharp.
+   * @since 7
+   */
+  Sharp,
+
+  /**
+   * Rhythm.
+   * @since 7
+   */
+  Rhythm,
+
+  /**
+   * Smooth.
+   * @since 7
+   */
+  Smooth,
+
+  /**
+   * Damping curve, CubicBezier(0.2, 0.0, 0.2, 1.0).
+   * @since 7
+   */
+  Friction,
+}
+
+/**
+ * Sets the state before and after the animation starts.
+ * @since 7
+ */
+export declare enum FillMode {
+  /**
+   * Restores to the initial state after the playback is complete.
+   * @since 7
+   */
+  None,
+
+  /**
+   * Retains the state at the end of the animation when the playback is complete.
+   * @since 7
+   */
+  Forwards,
+
+  /**
+   * Applies the start attribute value for the period specified by animation-delay before the animation is displayed.
+   * @since 7
+   */
+  Backwards,
+
+  /**
+   * Both forward and backward fill modes are applied.
+   * @since 7
+   */
+  Both,
+}
+
+/**
+ * Play Mode
+ * @since 7
+ */
+export declare enum PlayMode {
+  /**
+   * The animation plays normally.
+   * @since 7
+   */
+  Normal,
+
+  /**
+   * The animation plays backwards.
+   * @since 7
+   */
+  Reverse,
+
+  /**
+   * The animation plays forward on odd numbers (1, 3, 7...) and backward on even numbers (2, 4, 6...).
+   * @since 7
+   */
+  Alternate,
+
+  /**
+   * The animation plays backwards on odd numbers (1, 3, 7...) and forwards on even numbers (2, 4, 6...)..
+   * @since 7
+   */
+  AlternateReverse,
+}
+
+/**
+ * This style allows you to set the window blurring degree and blurring style of the current component layout range,
+ * @since 7
+ */
+export declare enum BlurStyle {
+  /**
+   * Small range glow effect.
+   * @since 7
+   */
+  SmallLight,
+
+  /**
+   * Medium range glow effect.
+   * @since 7
+   */
+  MediumLight,
+
+  /**
+   * Wide range of luminous effects.
+   * @since 7
+   */
+  LargeLight,
+
+  /**
+   * Super-range luminous effect.
+   * @since 7
+   */
+  XlargeLight,
+
+  /**
+   * Small range of dark effects.
+   * @since 7
+   */
+  SmallDark,
+
+  /**
+   * Medium range dark effect.
+   * @since 7
+   */
+  MediumDark,
+
+  /**
+   * Wide range of dark effects.
+   * @since 7
+   */
+  LargeDark,
+
+  /**
+   * Extra large range of dark effects.
+   * @since 7
+   */
+  XlargeDark,
+}
+
+/**
+ * Type of a key.
+ * @since 7
+ */
+export declare enum KeyType {
+  /**
+   * Press the key.
+   * @since 7
+   */
+  Down,
+
+  /**
+   * The key is released.
+   * @since 7
+   */
+  Up,
+}
+
+/**
+ * Type of the input device that triggers the current key.
+ * @since 7
+ */
+export declare enum KeySource {
+  /**
+   * The input device type is unknown.
+   * @since 7
+   */
+  Unknown,
+
+  /**
+   * Set Device Type to Keyboard.
+   * @since 7
+   */
+  Keyboard,
+}
+
+/**
+ * Edge.
+ * @since 7
+ */
+export declare enum Edge {
+  /**
+   * The top is centered horizontally.
+   * @since 7
+   */
+  Top,
+
+  /**
+   * Center horizontal and vertical.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * The bottom is centered horizontally.
+   * @since 7
+   */
+  Bottom,
+
+  /**
+   * Cross axis direction text baseline alignment.
+   * @since 7
+   */
+  Baseline,
+
+  /**
+   * Align the head of the cross axis direction.
+   * @since 7
+   */
+  Start,
+
+  /**
+   * Middle
+   * @since 7
+   */
+  Middle,
+
+  /**
+   * Align the head of the cross axis direction.
+   * @since 7
+   */
+  End,
+}
+
+/**
+ * Set Weekend
+ * @since 7
+ */
+export declare enum Week {
+  /**
+   * Monday.
+   * @since 7
+   */
+  Mon,
+
+  /**
+   * Tuesday.
+   * @since 7
+   */
+  Tue,
+
+  /**
+   * Wednesday.
+   * @since 7
+   */
+  Wed,
+
+  /**
+   * Thursday.
+   * @since 7
+   */
+  Thur,
+
+  /**
+   * Friday.
+   * @since 7
+   */
+  Fri,
+
+  /**
+   * Saturday.
+   * @since 7
+   */
+  Sat,
+
+  /**
+   * Sunday.
+   * @since 7
+   */
+  Sun,
+}
+
+/**
+ * Sets the horizontal layout of elements.
+ * @since 7
+ */
+export declare enum Direction {
+  /**
+   * Elements are laid out from left to right.
+   * @since 7
+   */
+  Ltr,
+
+  /**
+   * Elements are laid out from right to left.
+   * @since 7
+   */
+  Rtl,
+
+  /**
+   * Use the default layout direction.
+   * @since 7
+   */
+  Auto,
+}
+
+/**
+ * Used to set the status of the scroll bar.
+ * @since 7
+ */
+export declare enum BarState {
+  /**
+   * Not displayed.
+   * @since 7
+   */
+  Off,
+
+  /**
+   * On-demand display (displayed when you touch it and disappears after 2 seconds).
+   * @since 7
+   */
+  Auto,
+
+  /**
+   * Resident display.
+   * @since 7
+   */
+  On,
+}
+
+/**
+ * Sliding effect
+ * @since 7
+ */
+export declare enum EdgeEffect {
+  /**
+   * Elastic physical action, sliding to the edge can continue to slide for a distance based on the initial speed or touch event, and spring back when released.
+   * @since 7
+   */
+  Spring,
+
+  /**
+   * Fade.
+   * @since 7
+   */
+  Fade,
+
+  /**
+   * Sliding to the edge has no effect.
+   * @since 7
+   */
+  None,
+}
+
+/**
+ * Alignment enumeration description.
+ * @since 7
+ */
+export declare enum Alignment {
+  /**
+   * Top Start.
+   * @since 7
+   */
+  TopStart,
+
+  /**
+   * The top is centered horizontally.
+   * @since 7
+   */
+  Top,
+
+  /**
+   * Top tail end.
+   * @since 7
+   */
+  TopEnd,
+
+  /**
+   * The starting end is centered longitudinally.
+   * @since 7
+   */
+  Start,
+
+  /**
+   * Center horizontal and vertical.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * The tail end is centered longitudinally.
+   * @since 7
+   */
+  End,
+
+  /**
+   * Bottom starting end.
+   * @since 7
+   */
+  BottomStart,
+
+  /**
+   * The bottom is centered horizontally.
+   * @since 7
+   */
+  Bottom,
+
+  /**
+   * Bottom end.
+   * @since 7
+   */
+  BottomEnd,
+}
+
+/**
+ * TransitionType enumeration descriptio.
+ * @since 7
+ */
+export declare enum TransitionType {
+  /**
+   * Specifies that the current transition action takes effect in all change scenarios of the component.
+   * @since 7
+   */
+  All,
+
+  /**
+   * Specifies the insertion scenario in which the current transition action takes effect.
+   * @since 7
+   */
+  Insert,
+
+  /**
+   * Specifies the deletion scenario in which the current transition action takes effect.
+   * @since 7
+   */
+  Delete,
+}
+
+/**
+ * RelateType enumeration description
+ * @since 7
+ */
+export declare enum RelateType {
+  /**
+   * Scales the current component to fill the parent component.
+   * @since 7
+   */
+  FILL,
+
+  /**
+   * Scales the current component to fit the parent component.
+   * @since 7
+   */
+  FIT,
+}
+
+/**
+ * Controls the display or hide of the current component
+ * @since 7
+ */
+export declare enum Visibility {
+  /**
+   * Show
+   * @since 7
+   */
+  Visible,
+
+  /**
+   * Hide, but participate in layout for placeholder.
+   * @since 7
+   */
+  Hidden,
+
+  /**
+   * Hides but does not participate in layout and does not take place.
+   * @since 7
+   */
+  None,
+}
+
+/**
+ * LineCapStyle enumeration description
+ * @since 7
+ */
+export declare enum LineCapStyle {
+  /**
+   * The two ends of the dividing line are parallel lines.
+   * @since 7
+   */
+  Butt,
+
+  /**
+   * The two ends of the dividing line are semicircles.
+   * @since 7
+   */
+  Round,
+
+  /**
+   * Extends half a circle at the end of the path with a width equal to half the line width and a height equal to the line width.
+   * @since 7
+   */
+  Square,
+}
+
+/**
+ * Axis enumeration description.
+ * @since 7
+ */
+export declare enum Axis {
+  /**
+   * Longitudinal arrangement
+   * @since 7
+   */
+  Vertical,
+
+  /**
+   * Horizontal arrangement.
+   * @since 7
+   */
+  Horizontal,
+}
+
+/**
+ * HorizontalAlign enumeration description.
+ * @since 7
+ */
+export declare enum HorizontalAlign {
+  /**
+   * Aligns the start end in the language direction.
+   * @since 7
+   */
+  Start,
+
+  /**
+   * Center alignment. The default alignment mode is used.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * Aligns the ends in the language direction.
+   * @since 7
+   */
+  End,
+}
+
+/**
+ * FlexAlign enumeration description.
+ * @since 7
+ */
+export declare enum FlexAlign {
+  /**
+   * The element is aligned at the head of the principal axis,
+   * the first element is aligned with the head of the row, and subsequent elements are aligned with the previous one.
+   * @since 7
+   */
+  Start,
+
+  /**
+   * The elements are centered in the direction of the principal axis,
+   * and the first element is the same distance from the beginning of the row as the last element is from the end of the row.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * The element is aligned at the tail of the principal axis,
+   * the last element is aligned at the end of the row, and the other elements are aligned with the next.
+   * @since 7
+   */
+  End,
+
+  /**
+   * Elastic elements are evenly distributed in the direction of the Flex principal axis,
+   * with the same distance between adjacent elements.
+   * The first element aligns with the beginning of the line, and the last element aligns with the end of the line.
+   * @since 7
+   */
+  SpaceBetween,
+
+  /**
+   * Elastic elements are evenly distributed in the direction of the Flex principal axis,
+   *  with the same distance between adjacent elements. Half the distance between adjacent elements as the distance between
+   * the first element and the distance between the last element and the end of the row.
+   * @since 7
+   */
+  SpaceAround,
+
+  /**
+   * Elements in the Flex axis direction are evenly spaced.
+   * The spacing between adjacent elements, the spacing between the first element and the beginning of the row,
+   * and the spacing between the last element and the end of the row are the same.
+   * @since 7
+   */
+  SpaceEvenly,
+}
+
+/**
+ * ItemAlign enumeration description
+ * @since 7
+ */
+export declare enum ItemAlign {
+  /**
+   * Use the default configuration in the Flex container.
+   * @since 7
+   */
+  Auto,
+
+  /**
+   * The element is in the Flex container with the cross-axis direction head aligned.
+   * @since 7
+   */
+  Start,
+
+  /**
+   * The element is centered in the Flex container with the cross axis direction aligned.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * The element is bottom aligned in the Flex container with the cross axis direction.
+   * @since 7
+   */
+  End,
+
+  /**
+   * Element In the Flex container, the cross-axis direction text baseline is aligned.
+   * @since 7
+   */
+  Baseline,
+
+  /**
+   * Element In a Flex container, the fill is stretched across the axis and, when no dimension is set, to the container size.
+   * @since 7
+   */
+  Stretch,
+}
+
+/**
+ * FlexDirection enumeration description
+ * @since 7
+ */
+export declare enum FlexDirection {
+  /**
+   * The main axis is consistent with the row direction as the layout mode.
+   * @since 7
+   */
+  Row,
+
+  /**
+   * The main axis is consistent with the column direction as the layout mode.
+   * @since 7
+   */
+  Column,
+
+  /**
+   * The layout is in the opposite direction to the Row direction.
+   * @since 7
+   */
+  RowReverse,
+
+  /**
+   * Layout in the opposite direction to the column.
+   * @since 7
+   */
+  ColumnReverse,
+}
+
+/**
+ * FlexWrap enumeration description
+ * @since 7
+ */
+export declare enum FlexWrap {
+  /**
+   * The Flex container has a single row/column layout of elements, and children are allowed to go beyond the container.
+   * @since 7
+   */
+  NoWrap,
+
+  /**
+   * The elements of the Flex container are arranged in multiple rows or columns, and the sub-items are allowed to exceed the container.
+   * @since 7
+   */
+  Wrap,
+
+  /**
+   * The elements of the Flex container are arranged in reverse multiple rows/columns, and children are allowed to exceed the container.
+   * @since 7
+   */
+  WrapReverse,
+}
+
+/**
+ * VerticalAlign enumeration description
+ * @since 7
+ */
+export declare enum VerticalAlign {
+  /**
+   * Top alignment.
+   * @since 7
+   */
+  Top,
+
+  /**
+   * Center alignment. The default alignment mode is used.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * Bottom alignment.
+   * @since 7
+   */
+  Bottom,
+}
+
+/**
+ * ImageRepeat enumeration description
+ * @since 7
+ */
+export declare enum ImageRepeat {
+  /**
+   * Do not draw the picture again.
+   * @since 7
+   */
+  NoRepeat,
+
+  /**
+   * Repeat the drawing only on the horizontal axis.
+   * @since 7
+   */
+  X,
+
+  /**
+   * Repeat the drawing only on the vertical axis.
+   * @since 7
+   */
+  Y,
+
+  /**
+   * Draw the picture repeatedly on both axes.
+   * @since 7
+   */
+  XY,
+}
+
+/**
+ * ImageSize enumeration description
+ * @since 7
+ */
+export declare enum ImageSize {
+  /**
+   * Keep the scale of the original image unchanged.
+   * @since 7
+   */
+  Auto,
+
+  /**
+   * Default value. Keep the aspect ratio to zoom in or out the image so that both sides of the image are greater than or equal to the display boundary.
+   * @since 7
+   */
+  Cover,
+
+  /**
+   * Keep the aspect ratio to zoom out or zoom in so that the image is completely displayed within the display boundary.
+   * @since 7
+   */
+  Contain,
+}
+
+/**
+ * GradientDirection enumeration description
+ * @since 7
+ */
+export declare enum GradientDirection {
+  /**
+   * Right to left.
+   * @since 7
+   */
+  Left,
+
+  /**
+   * From the bottom up.
+   * @since 7
+   */
+  Top,
+
+  /**
+   * From left to right.
+   * @since 7
+   */
+  Right,
+
+  /**
+   * From the top down.
+   * @since 7
+   */
+  Bottom,
+
+  /**
+   * Top Left
+   * @since 7
+   */
+  LeftTop,
+
+  /**
+   * Left Bottom
+   * @since 7
+   */
+  LeftBottom,
+
+  /**
+   * Right Top
+   * @since 7
+   */
+  RightTop,
+
+  /**
+   * Right Bottom
+   * @since 7
+   */
+  RightBottom,
+
+  /**
+   * None
+   * @since 7
+   */
+  None,
+}
+
+/**
+ * SharedTransitionEffectType enumeration description
+ * @since 7
+ */
+export declare enum SharedTransitionEffectType {
+  /**
+   * The location of the destination page element remains unchanged, and you can configure the transparency animation. Currently,
+   * only the static effect configured for redirecting to the target page takes effect.
+   * @since 7
+   */
+  Static,
+
+  /**
+   * Move the source page element to the destination page element location and scale it appropriately.
+   * @since 7
+   */
+  Exchange,
+}
+
+/**
+ * Text style
+ * @since 7
+ */
+export declare enum FontStyle {
+  /**
+   * Default style.
+   * @since 7
+   */
+  Normal,
+
+  /**
+   * Italic style.
+   * @since 7
+   */
+  Italic,
+}
+
+/**
+ * The font weight of the text
+ * @since 7
+ */
+export declare enum FontWeight {
+  /**
+   * Defines a lighter value than [Inherited Value]..
+   * @since 7
+   */
+  Lighter,
+
+  /**
+   * Normal font. Equivalent to a digital value of 400.
+   * @since 7
+   */
+  Normal,
+
+  /**
+   * Defines a more general value than [Inherited Value].
+   * @since 7
+   */
+  Regular,
+
+  /**
+   * Defines a value that is more centered than [Inherited Value].
+   * @since 7
+   */
+  Medium,
+
+  /**
+   * Bold. Equivalent to a numeric value of 700.
+   * @since 7
+   */
+  Bold,
+
+  /**
+   * Defines a value that is heavier than [Inherited Value].
+   * @since 7
+   */
+  Bolder,
+}
+
+/**
+ * Alignment of text.
+ * @since 7
+ */
+export declare enum TextAlign {
+  /**
+   * Center the text.
+   * @since 7
+   */
+  Center,
+
+  /**
+   * The text is aligned in the same direction as the writing
+   * @since 7
+   */
+  Start,
+
+  /**
+   * The text is aligned in the opposite direction of writing
+   * @since 7
+   */
+  End,
+}
+
+/**
+ * Declare how text overflows.
+ * @since 7
+ */
+export declare enum TextOverflow {
+  /**
+   * When the text is too long, it will be cropped and displayed.
+   * @since 7
+   */
+
+  Clip,
+  /**
+   * If the text is too long, the text that cannot be displayed shall be replaced by ellipsis.
+   * @since 7
+   */
+
+  Ellipsis,
+
+  /**
+   * Text is not cropped when it is too long.
+   * @since 7
+   */
+  None,
+}
+
+/**
+ * Type of text modifier.
+ * @since 7
+ */
+export declare enum TextDecorationType {
+  /**
+   * Do not use text decorative lines.
+   * @since 7
+   */
+  None,
+
+  /**
+   * Underline the words.
+   * @since 7
+   */
+  Underline,
+
+  /**
+   * Text is in all uppercase.
+   * @since 7
+   */
+  Overline,
+
+  /**
+   * A modifier line that passes through the text.
+   * @since 7
+   */
+  LineThrough,
+}
+
+/**
+ * Letter type in text
+ * @since 7
+ */
+export declare enum TextCase {
+  /**
+   * The default is normal.
+   * @since 7
+   */
+  Normal,
+
+  /**
+   * The text is all lowercase.
+   * @since 7
+   */
+  LowerCase,
+
+  /**
+   * The text is all uppercase.
+   * @since 7
+   */
+  UpperCase,
+}
diff --git a/api/@internal/component/ets/flex.d.ts b/api/@internal/component/ets/flex.d.ts
index 05733ab2b7b3872de8dede21f5a3743de5c4b23b..2ec898013fd9df1f737aa40fbd2d6dd72f83ed23 100644
--- a/api/@internal/component/ets/flex.d.ts
+++ b/api/@internal/component/ets/flex.d.ts
@@ -13,47 +13,62 @@
  * limitations under the License.
  */
 
-import {CommonMethod, FlexDirection, FlexWrap, FlexAlign, ItemAlign} from "./common";
+import { CommonMethod } from "./common";
+import { FlexAlign, FlexDirection, FlexWrap, ItemAlign } from "./enums";
 
 /**
- * @devices phone, tablet, car.
+ * Defines the option of Flex.
  * @since 7
  */
-export declare class FlexExtend<T> extends FlexAttribute<T> {
+export declare interface FlexOption {
+  /**
+   * Sets the horizontal layout of elements.
+   * @since 7
+   */
+  direction?: FlexDirection;
+
+  /**
+   * Whether the Flex container is a single row/column arrangement or a multi-row/column arrangement.
+   * @since 7
+   */
+  wrap?: FlexWrap;
+
+  /**
+   * The alignment format of the subassembly on the Flex container spindle.
+   * @since 7
+   */
+  justifyContent?: FlexAlign;
+
+  /**
+   * Alignment Format for Subassembly on Flex Container Cross Axis.
+   * @since 7
+   */
+  alignItems?: ItemAlign;
+
+  /**
+   * The alignment of multiple lines of content when there is extra space in the cross axis.
+   * @since 7
+   */
+  alignContent?: FlexAlign;
 }
 
 /**
  * Provides a monthly view component to display information such as date, shift break, and schedule.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Flex extends FlexAttribute<Flex> {
   /**
-   * Set the value.
-   * direction: Sets the horizontal layout of elements.
-   * wrap: Whether the Flex container is a single row/column arrangement or a multi-row/column arrangement.
-   * justifyContent: The alignment format of the subassembly on the Flex container spindle.
-   * alignItems: Alignment Format for Subassembly on Flex Container Cross Axis
-   * alignContent:The alignment of multiple lines of content when there is extra space in the cross axis.
-   * @devices phone, tablet, car.
+   * Defines the constructor of Flex.
    * @since 7
    */
-  (value?: {
-    direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: FlexAlign,
-    alignItems?: ItemAlign, alignContent?: FlexAlign
-  }): Flex;
+  (value?: FlexOption): Flex;
 }
 
 /**
- * Common Setting
- * @devices phone, tablet, car.
+ * Defines the Flex attribute functions.
  * @since 7
  */
-declare class FlexAttribute<T> extends CommonMethod<T> {
-}
+declare class FlexAttribute<T> extends CommonMethod<T> {}
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
+export declare class FlexExtend<T> extends FlexAttribute<T> {}
 export declare const FlexInterface: Flex;
diff --git a/api/@internal/component/ets/forEach.d.ts b/api/@internal/component/ets/forEach.d.ts
index a9190cf39d170671cfedaf54be6d01eec66a4c23..8af39463ae410db91e5cdce61a82096b31b20ef7 100644
--- a/api/@internal/component/ets/forEach.d.ts
+++ b/api/@internal/component/ets/forEach.d.ts
@@ -15,17 +15,18 @@
 
 /**
  * looping
- * @devices phone, tablet, car.
  * @since 7
  */
 interface ForEach {
   /**
    * Set the value, array, and key.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (arr: Array<any>, itemGenerator: (item: any, index?: number) => void,
-   keyGenerator?: (item: any, index?: number) => string): ForEach;
+  (
+    arr: Array<any>,
+    itemGenerator: (item: any, index?: number) => void,
+    keyGenerator?: (item: any, index?: number) => string,
+  ): ForEach;
 }
 
 /**
diff --git a/api/@internal/component/ets/form_component.d.ts b/api/@internal/component/ets/form_component.d.ts
index 14652a9abbb3d62e25cb2c277bdc5e98682a55c6..f8dd684198e6fbf6d494d81b5f5ed7c66225236e 100644
--- a/api/@internal/component/ets/form_component.d.ts
+++ b/api/@internal/component/ets/form_component.d.ts
@@ -13,127 +13,126 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Visibility} from "./common";
+import { CommonMethod } from "./common";
+import { Visibility } from "./enums";
 
 /**
- * @devices phone, tablet, car.
+ * Defines the FormDimension enum.
  * @since 7
+ * @systemapi
  */
 export declare enum FormDimension {
   /**
    * 1 x 2 cards
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   Dimension_1_2,
 
   /**
    * 2 x 2 cards
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   Dimension_2_2,
 
   /**
    * 2 x 4 cards
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   Dimension_2_4,
 
   /**
    * 4 x 4 cards
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  Dimension_4_4
+  Dimension_4_4,
 }
 
 /**
- * The card component is provided to display cards.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class FormComponentExtend<T> extends FormComponentAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
+ * Defines the FormComponent.
  * @since 7
+ * @systemapi
  */
 interface FormComponent extends FormComponentAttribute<FormComponent> {
   /**
    * Set a new value.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  (value: {id: number, name: string, bundle: string, ability: string, module: string, dimension?: FormDimension}): FormComponent;
+  (value: {
+    id: number;
+    name: string;
+    bundle: string;
+    ability: string;
+    module: string;
+    dimension?: FormDimension;
+  }): FormComponent;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
+ * @systemapi
  */
 declare class FormComponentAttribute<T> extends CommonMethod<T> {
   /**
    * Sets the display area size of the card.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  size(value: {width: number, height: number}): T;
+  size(value: { width: number; height: number }): T;
 
   /**
    * Card module name.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   moduleName(value: string): T;
 
   /**
    * Set the card size.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   dimension(value: FormDimension): T;
 
   /**
    * Indicates whether to allow card update.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   allowUpdate(value: boolean): T;
 
   /**
    * Whether the card is visible.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   visibility(value: Visibility): T;
 
   /**
    * This function is triggered after card information is obtained. For details about the form information, see the definition of the original capability subsystem.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  onAcquired(callback: (info: {id: number}) => void): T;
+  onAcquired(callback: (info: { id: number }) => void): T;
 
   /**
    * Card loading error.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
-  onError(callback: (info: {errcode: number, msg: string}) => void): T;
+  onError(callback: (info: { errcode: number; msg: string }) => void): T;
 
   /**
    * Card to be redirected.
-   * @devices phone, tablet, car.
    * @since 7
+   * @systemapi
    */
   onRouter(callback: (info: any) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class FormComponentExtend<T> extends FormComponentAttribute<T> {}
 export declare const FormComponentInterface: FormComponent;
diff --git a/api/@internal/component/ets/gauge.d.ts b/api/@internal/component/ets/gauge.d.ts
index a277ad5a78766ce211d198ad9d7683a15fd4bdfe..601030ad7866e6d4ae57ec399c75fd2be9cdbf13 100644
--- a/api/@internal/component/ets/gauge.d.ts
+++ b/api/@internal/component/ets/gauge.d.ts
@@ -1,100 +1,81 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color} from "./common";
-
-/**
- * Data gauge chart component, used to display data as a ring chart.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class GaugeExtend<T> extends GaugeAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Gauge extends GaugeAttribute<Gauge> {
-  /**
-   * value:Current data value.
-   * min: Current Segment Minimum Value
-   * max: Current Segment Maximum Value
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options: {value: number, min?: number, max?: number}): Gauge;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class GaugeAttribute<T> extends CommonMethod<T> {
-  /**
-   * Sets the value for the current profile.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  value(value: number): T;
-
-  /**
-   * Set the start angle. Clock 0 is 0 degrees and clockwise is positive.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  startAngle(angle: number): T;
-
-  /**
-   * Sets the end angle position. Clock 0 is 0 degrees and clockwise is positive.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  endAngle(angle: number): T;
-
-  /**
-   * Set the color of the chart. You can set the solid color and segmented gradient color.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  colors(colors: Array<any>): T;
-
-  /**
-   * Sets the thickness of the ring chart.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  strokeWidth(length: number): T;
-
-  /**
-   * Mark points describe the content of the text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  labelTextConfig(markedLabelText: string): T;
-
-  /**
-   * Color of the marker point description text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  labelColorConfig(markedLabelColor: Color): T;
-}
-
-/**
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const GaugeInterface: Gauge;
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { Color } from "./enums";
+
+/**
+ * Defines the Guage component.
+ * @since 8
+ */
+interface Gauge extends GaugeAttribute<Gauge> {
+  /**
+   * value:Current data value.
+   * min: Current Segment Minimum Value
+   * max: Current Segment Maximum Value
+   * @since 8
+   */
+  (options: { value: number; min?: number; max?: number }): Gauge;
+}
+
+/**
+ * @since 8
+ */
+declare class GaugeAttribute<T> extends CommonMethod<T> {
+  /**
+   * Sets the value for the current profile.
+   * @since 8
+   */
+  value(value: number): T;
+
+  /**
+   * Set the start angle. Clock 0 is 0 degrees and clockwise is positive.
+   * @since 8
+   */
+  startAngle(angle: number): T;
+
+  /**
+   * Sets the end angle position. Clock 0 is 0 degrees and clockwise is positive.
+   * @since 8
+   */
+  endAngle(angle: number): T;
+
+  /**
+   * Set the color of the chart. You can set the solid color and segmented gradient color.
+   * @since 8
+   */
+  colors(colors: Array<any>): T;
+
+  /**
+   * Sets the thickness of the ring chart.
+   * @since 8
+   */
+  strokeWidth(length: number): T;
+
+  /**
+   * Mark points describe the content of the text.
+   * @since 8
+   */
+  labelTextConfig(markedLabelText: string): T;
+
+  /**
+   * Color of the marker point description text.
+   * @since 8
+   */
+  labelColorConfig(markedLabelColor: Color): T;
+}
+
+export declare class GaugeExtend<T> extends GaugeAttribute<T> {}
+export declare const GaugeInterface: Gauge;
diff --git a/api/@internal/component/ets/geometryView.d.ts b/api/@internal/component/ets/geometry_view.d.ts
similarity index 75%
rename from api/@internal/component/ets/geometryView.d.ts
rename to api/@internal/component/ets/geometry_view.d.ts
index a5252584e639cac683b71ece295fcdb36fc21d1d..5579704f336507f5fa1f07196e0a28c947945736 100644
--- a/api/@internal/component/ets/geometryView.d.ts
+++ b/api/@internal/component/ets/geometry_view.d.ts
@@ -13,39 +13,25 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
- * Creating a Geometry View
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class GeometryViewExtend<T> extends GeometryViewAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
+ * Defines the GeometryView Component.
+ * @since 8
  */
 interface GeometryView extends GeometryViewAttribute<GeometryView> {
   /**
    * Callback function.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   (callback: (geometry?: any) => void): GeometryView;
 }
 
 /**
  * Inherit Public
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-declare class GeometryViewAttribute<T> extends CommonMethod<T> {
-}
+declare class GeometryViewAttribute<T> extends CommonMethod<T> {}
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
+export declare class GeometryViewExtend<T> extends GeometryViewAttribute<T> {}
 export declare const GeometryViewInterface: GeometryView;
diff --git a/api/@internal/component/ets/gesture.d.ts b/api/@internal/component/ets/gesture.d.ts
index b0815edca354cc8ff24725395f97b8d98366a805..b5c61a15f7dd97bb08bd2e7416e6a1eaf1015583 100644
--- a/api/@internal/component/ets/gesture.d.ts
+++ b/api/@internal/component/ets/gesture.d.ts
@@ -15,255 +15,214 @@
 
 /**
  * Creating an Object
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum GestureDirection {
   /**
    * Sliding in all directions.
-   * @devices phone, tablet, car.
    * @since 7
    */
   All,
 
   /**
    * Sliding horizontally.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Horizontal,
 
   /**
    * Sliding Vertical
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Vertical
+  Vertical,
 }
 
 /**
  * Creating an Object
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum PanDirection {
-    /**
-     * Default.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    None,
-
-    /**
-     * Sliding horizontally.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Horizontal,
-
-    /**
-     * Sliding left.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Left,
-
-    /**
-     * Sliding right.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Right,
-
-    /**
-     * Sliding Vertical
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Vertical,
-
-    /**
-     * Sliding up.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Up,
-
-    /**
-     * Sliding Down.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Down,
-
-    /**
-     * Sliding in all directions.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    All
-}
+  /**
+   * Default.
+   * @since 7
+   */
+  None,
 
+  /**
+   * Sliding horizontally.
+   * @since 7
+   */
+  Horizontal,
+
+  /**
+   * Sliding left.
+   * @since 7
+   */
+  Left,
+
+  /**
+   * Sliding right.
+   * @since 7
+   */
+  Right,
+
+  /**
+   * Sliding Vertical
+   * @since 7
+   */
+  Vertical,
+
+  /**
+   * Sliding up.
+   * @since 7
+   */
+  Up,
+
+  /**
+   * Sliding Down.
+   * @since 7
+   */
+  Down,
+
+  /**
+   * Sliding in all directions.
+   * @since 7
+   */
+  All,
+}
 
 /**
  * Creating an Object
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum GestureMode {
-
   /**
    * Sequential gesture recognition is performed in sequence according to the gesture registration sequence.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Sequence,
 
   /**
    * Simultaneous recognition. Registration gestures participate in recognition. Everything can be triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Parallel,
 
   /**
    * Mutually exclusive recognition. Only one gesture is successfully recognized.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Exclusive
+  Exclusive,
 }
 
 /**
  * Creating an Object
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum GestureMask {
-
   /**
    * High-priority response to the current gesture.When the current gesture fails to be recognized, other gesture responses are triggered.For gestures with the same priority, responses are performed based on the recognition sequence.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Normal,
 
   /**
    * Ignore internal gestures and recognize the current gesture first.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  IgnoreInternal
+  IgnoreInternal,
 }
 
 /**
  * Creating an Object
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare type GestureType =
   /**
    * Set a type value.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  TapGesture
-  | LongPressGesture
-  | PanGesture
-  | PinchGesture
-  | RotationGesture
-  | GestureGroup
+  TapGesture | LongPressGesture | PanGesture | PinchGesture | RotationGesture | GestureGroup;
 
-export interface GestureEvent {
+/**
+ * long press gesture event used in the longpress scenario.
+ * @since 7
+ */
+export interface LongPressGestureEvent extends GestureEvent {
   /**
-   * Indicates whether an event is triggered repeatedly. This parameter is used in the longpress scenario.
-   * @devices phone, tablet, car.
+   * Indicates whether an event is triggered repeatedly.
    * @since 7
    */
   repeat: boolean;
+}
 
+/**
+ * pan gesture event used in the pan gesture triggering scenario.
+ */
+export interface PanGestureEvent extends GestureEvent {
   /**
-   * Gesture event offset X, which is used in the pan gesture triggering scenario.
-   * @devices phone, tablet, car.
+   * Gesture event offset X.
    * @since 7
    */
   offsetX: number;
 
   /**
-   * Gesture event offset Y, which is used in the pan gesture triggering scenario.
-   * @devices phone, tablet, car.
+   * Gesture event offset Y.
    * @since 7
    */
   offsetY: number;
+}
 
+/**
+ * pinch gesture event used for triggering the pinch gesture.
+ * @since 7
+ */
+export interface PinchGestureEvent extends GestureEvent {
   /**
-   * Scaling ratio, which is used for triggering the pinch gesture.
-   * @devices phone, tablet, car.
+   * Scaling ratio.
    * @since 7
    */
   scale: number;
 
   /**
-   * Rotation angle, which is used to trigger the rotation gesture..
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  angle: number;
-
-  /**
-   * Event timestamp.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  timestamp: number;
-
-  /**
-   * Indicates whether an event is triggered repeatedly. This parameter is used in the longpress scenario.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  globalX: number;
-
-  /**
-   * Indicates whether an event is triggered repeatedly. This parameter is used in the longpress scenario.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  globalY: number;
-
-  /**
-   * Horizontal distance from the upper left corner of the touched component. The upper left corner of the component is the origin.
-   * @devices phone, tablet, car.
+   * X-axis coordinate of the kneading center point, in pixels.
    * @since 7
    */
-  localX: number;
+  pinchCenterX: number;
 
   /**
-   * Longitudinal distance from the upper left corner of the touched component. The upper left corner of the component is the origin.
-   * @devices phone, tablet, car.
+   * Y-axis coordinate of the kneading center point, in pixels.
    * @since 7
    */
-  localY: number;
+  pinchCenterY: number;
+}
 
+/**
+ * rotation gesture event used for triggering the pinch gesture.
+ * @since 7
+ */
+export interface RotationGestureEvent extends GestureEvent {
   /**
-   * X-axis coordinate of the kneading center point, in pixels.
-   * @devices phone, tablet, car.
+   * Rotation angle.
    * @since 7
    */
-  pinchCenterX: number;
+  angle: number;
+}
 
+/**
+ * base event for gesture.
+ * @since 7
+ */
+export interface GestureEvent {
   /**
-   * Y-axis coordinate of the kneading center point, in pixels.
-   * @devices phone, tablet, car.
+   * Event timestamp.
    * @since 7
    */
-  pinchCenterY: number;
+  timestamp: number;
 }
 
-
 /**
  * Creating an interface
- * @devices phone, tablet, car.
  * @since 7
  */
 interface TapGesture {
@@ -271,14 +230,12 @@ interface TapGesture {
    * Set the value.
    * count:Number of consecutive clicks recognized. If the value is less than 1, the default value is used.
    * fingers:The hand index that triggers the click. If the value is less than 1, the default value is used.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { count?: number, fingers?: number }): TapGesture;
+  (value?: { count?: number; fingers?: number }): TapGesture;
 
   /**
    * Tap gesture recognition success callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onAction(event: (event?: GestureEvent) => void): TapGesture;
@@ -286,7 +243,6 @@ interface TapGesture {
 
 /**
  * Creating an interface
- * @devices phone, tablet, car.
  * @since 7
  */
 interface LongPressGesture {
@@ -295,242 +251,183 @@ interface LongPressGesture {
    * fingers: Indicates the hand index that triggers the long press.
    * repeat: Indicates whether to trigger event callback continuously.
    * duration: Minimum press and hold time, in milliseconds.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { fingers?: number, repeat?: boolean, duration?: number }): LongPressGesture;
+  (value?: { fingers?: number; repeat?: boolean; duration?: number }): LongPressGesture;
 
   /**
    * LongPress gesture recognition success callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onAction(event: (event?: GestureEvent) => void): LongPressGesture;
+  onAction(event: (event?: LongPressGestureEvent) => void): LongPressGesture;
 
   /**
    * The LongPress gesture is successfully recognized. When the finger is lifted, the callback is triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionEnd(event: (event?: GestureEvent) => void): LongPressGesture;
+  onActionEnd(event: (event?: LongPressGestureEvent) => void): LongPressGesture;
 
   /**
    * The LongPress gesture is successfully recognized and a callback is triggered when the touch cancel event is received.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onActionCancel(event: () => void): LongPressGesture;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class PanGestureOption {
   /**
    * Constructor parameters.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  constructor(value?: { fingers?: number, direction?: PanDirection, distance?: number });
+  constructor(value?: { fingers?: number; direction?: PanDirection; distance?: number });
 
   /**
    * Sets the direction attribute.
-   * @devices phone, tablet, car.
    * @since 7
    */
   setDirection(value: PanDirection);
 
   /**
    * Sets the setDistance attribute.
-   * @devices phone, tablet, car.
    * @since 7
    */
   setDistance(value: number);
 
   /**
    * Sets the setFingers attribute.
-   * @devices phone, tablet, car.
    * @since 7
    */
   setFingers(value: number);
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface PanGesture {
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { fingers?: number, direction?: PanDirection, distance?: number } | PanGestureOption): PanGesture;
+  (value?: { fingers?: number; direction?: PanDirection; distance?: number } | PanGestureOption): PanGesture;
 
   /**
    * Pan gesture recognition success callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionStart(event: (event?: GestureEvent) => void): PanGesture;
+  onActionStart(event: (event?: PanGestureEvent) => void): PanGesture;
 
   /**
    * Callback when the Pan gesture is moving.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionUpdate(event: (event?: GestureEvent) => void): PanGesture;
+  onActionUpdate(event: (event?: PanGestureEvent) => void): PanGesture;
 
   /**
    * The Pan gesture is successfully recognized. When the finger is lifted, the callback is triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionEnd(event: (event?: GestureEvent) => void): PanGesture;
+  onActionEnd(event: (event?: PanGestureEvent) => void): PanGesture;
 
   /**
    * The Pan gesture is successfully recognized and a callback is triggered when the touch cancel event is received.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onActionCancel(event: () => void): PanGesture;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface PinchGesture {
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { fingers?: number, distance?: number }): PinchGesture;
+  (value?: { fingers?: number; distance?: number }): PinchGesture;
 
   /**
    * Pan gesture recognition success callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionStart(event: (event?: GestureEvent) => void): PinchGesture;
+  onActionStart(event: (event?: PinchGestureEvent) => void): PinchGesture;
 
   /**
    * Callback when the Pan gesture is moving.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionUpdate(event: (event?: GestureEvent) => void): PinchGesture;
+  onActionUpdate(event: (event?: PinchGestureEvent) => void): PinchGesture;
 
   /**
    * The Pan gesture is successfully recognized. When the finger is lifted, the callback is triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionEnd(event: (event?: GestureEvent) => void): PinchGesture;
+  onActionEnd(event: (event?: PinchGestureEvent) => void): PinchGesture;
 
   /**
    * The Pan gesture is successfully recognized and a callback is triggered when the touch cancel event is received.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onActionCancel(event: () => void): PinchGesture;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface RotationGesture {
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { fingers?: number, angle?: number }): RotationGesture;
+  (value?: { fingers?: number; angle?: number }): RotationGesture;
 
   /**
    * Pan gesture recognition success callback.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionStart(event: (event?: GestureEvent) => void): RotationGesture;
+  onActionStart(event: (event?: RotationGestureEvent) => void): RotationGesture;
 
   /**
    * Callback when the Pan gesture is moving.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionUpdate(event: (event?: GestureEvent) => void): RotationGesture;
+  onActionUpdate(event: (event?: RotationGestureEvent) => void): RotationGesture;
 
   /**
    * The Pan gesture is successfully recognized. When the finger is lifted, the callback is triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onActionEnd(event: (event?: GestureEvent) => void): RotationGesture;
+  onActionEnd(event: (event?: RotationGestureEvent) => void): RotationGesture;
 
   /**
    * The Pan gesture is successfully recognized and a callback is triggered when the touch cancel event is received.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onActionCancel(event: () => void): RotationGesture;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface GestureGroup {
   /**
    * Return to Obtain GestureGroup.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (mode: GestureMode, ...gesture: GestureType[]): GestureGroup;
 
   /**
    * The Pan gesture is successfully recognized and a callback is triggered when the touch cancel event is received.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onCancel(event: () => void): GestureGroup;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const TapGestureInterface: TapGesture;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const LongPressGestureInterface: LongPressGesture;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const PanGestureInterface: PanGesture;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const PinchGestureInterface: PinchGesture;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const RotationGestureInterface: RotationGesture;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const GestureGroupInterface: GestureGroup;
diff --git a/api/@internal/component/ets/grid.d.ts b/api/@internal/component/ets/grid.d.ts
index 2b5777e85cc1abdd38f6477170a5ee46c45529cb..227084a5abeb304d5dea7ebd9fd9963a62a44913 100644
--- a/api/@internal/component/ets/grid.d.ts
+++ b/api/@internal/component/ets/grid.d.ts
@@ -13,101 +13,80 @@
  * limitations under the License.
  */
 
-import {CommonMethod, BarState, Color, Resource} from "./common";
-import {Scroller} from "./scroll";
+import { CommonMethod } from "./common";
+import { BarState, Color } from "./enums";
+import { Scroller } from "./scroll";
+import { Length } from "./units";
 
 /**
- * Mesh container for static fixed-size layout scenarios.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class GridExtend<T> extends GridAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Grid extends GridAttribute<Grid> {
   /**
    * Grid is returned when the parameter is transferred.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (scroller?: Scroller): Grid;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class GridAttribute<T> extends CommonMethod<T> {
   /**
    * This parameter specifies the number of columns in the current grid layout.
-   * @devices phone, tablet, car.
    * @since 7
    */
   columnsTemplate(value: string): T;
 
   /**
    * Lets you set the number of rows in the current grid layout,
-   * @devices phone, tablet, car.
    * @since 7
    */
   rowsTemplate(value: string): T;
 
   /**
    * Allows you to set the spacing between columns.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  columnsGap(value: number | string | Resource): T;
+  columnsGap(value: Length): T;
 
   /**
    * Lets you set the spacing between rows.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  rowsGap(value: number | string | Resource): T;
+  rowsGap(value: Length): T;
 
   /**
    * This parameter specifies the width of the scroll bar.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBarWidth(value: number | string): T;
 
   /**
    * Sets the color of the scroll bar.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBarColor(value: Color | number | string): T;
 
   /**
    * Lets you set the spacing between rows.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBar(value: BarState): T;
 
   /**
    * Sets the status of the scroll bar.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScrollIndex(event: (first: number) => void): T;
 
   /**
    * cached Count
-   * @devices phone, tablet, car.
    * @since 7
    */
   cachedCount(value: number): T;
 }
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
+export declare class GridExtend<T> extends GridAttribute<T> {}
 export declare const GridInterface: Grid;
diff --git a/api/@internal/component/ets/gridItem.d.ts b/api/@internal/component/ets/gridItem.d.ts
index d2751a1ce8b01e191e8e7a3164b265156dffca2a..341fe7d9db93fcca73ad90643383646b5fd42e57 100644
--- a/api/@internal/component/ets/gridItem.d.ts
+++ b/api/@internal/component/ets/gridItem.d.ts
@@ -1,85 +1,66 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod} from "./common";
-
-/**
- * Mesh container for static fixed-size layout scenarios.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class GridItemExtend<T> extends GridItemAttribute<T> {
-}
-
-/**
- * Mesh container for static fixed-size layout scenarios.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface GridItem extends GridItemAttribute<GridItem> {
-  /**
-   * Return to get GridItem.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (): GridItem;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class GridItemAttribute<T> extends CommonMethod<T> {
-  /**
-   * This parameter specifies the start line number of the current element.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  rowStart(value: number): T;
-
-  /**
-   * Specifies the end line number of the current element.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  rowEnd(value: number): T;
-
-  /**
-   * This parameter specifies the start column number of the current element.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  columnStart(value: number): T;
-
-  /**
-   * This parameter specifies the end column number of the current element.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  columnEnd(value: number): T;
-
-  /**
-   * This parameter specifies whether to recreate the node when the component build is triggered.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  forceRebuild(value: boolean): T;
-}
-
-/**
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const GridItemInterface: GridItem;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+
+/**
+ * Mesh container for static fixed-size layout scenarios.
+ * @since 7
+ */
+interface GridItem extends GridItemAttribute<GridItem> {
+  /**
+   * Return to get GridItem.
+   * @since 7
+   */
+  (): GridItem;
+}
+
+/**
+ * @since 7
+ */
+declare class GridItemAttribute<T> extends CommonMethod<T> {
+  /**
+   * This parameter specifies the start line number of the current element.
+   * @since 7
+   */
+  rowStart(value: number): T;
+
+  /**
+   * Specifies the end line number of the current element.
+   * @since 7
+   */
+  rowEnd(value: number): T;
+
+  /**
+   * This parameter specifies the start column number of the current element.
+   * @since 7
+   */
+  columnStart(value: number): T;
+
+  /**
+   * This parameter specifies the end column number of the current element.
+   * @since 7
+   */
+  columnEnd(value: number): T;
+
+  /**
+   * This parameter specifies whether to recreate the node when the component build is triggered.
+   * @since 7
+   */
+  forceRebuild(value: boolean): T;
+}
+
+export declare class GridItemExtend<T> extends GridItemAttribute<T> {}
+export declare const GridItemInterface: GridItem;
diff --git a/api/@internal/component/ets/grid_container.d.ts b/api/@internal/component/ets/grid_container.d.ts
index ecdcc39dcd1b26bbe7daecd27d6ed755b9cba37b..fed3cf23a83c0ccdfa0f746aed5988691be2b349 100644
--- a/api/@internal/component/ets/grid_container.d.ts
+++ b/api/@internal/component/ets/grid_container.d.ts
@@ -13,91 +13,91 @@
  * limitations under the License.
  */
 
-import {ColumnAttribute} from "./column";
+import { ColumnAttribute } from "./column";
 
 /**
- * @devices phone, tablet, car.
+ * Defines the size type.
  * @since 7
  */
 export declare enum SizeType {
-
   /**
    * Select a value based on the device type.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Auto,
 
   /**
    * Select a value based on the device type.
-   * @devices phone, tablet, car.
    * @since 7
    */
   XS,
 
   /**
    * Small width type device.
-   * @devices phone, tablet, car.
    * @since 7
    */
   SM,
 
   /**
    * Medium width type device.
-   * @devices phone, tablet, car.
    * @since 7
    */
   MD,
 
   /**
    * Large width type device.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  LG
+  LG,
 }
 
 /**
- * Vertical layout grid layout container, used only in grid layout scenarios.
- * @devices phone, tablet, car.
+ * Defines the option of GridContainer.
  * @since 7
  */
-export declare class GridContainerExtend<T> extends GridContainerAttribute<T> {
+export declare interface GridContainerOption {
+  /**
+   * Sets the total number of columns in the current layout.
+   * @since 7
+   */
+  columns?: number | "auto";
+
+  /**
+   * Select the device width type.
+   * @since 7
+   */
+  sizeType?: SizeType;
+
+  /**
+   * Grid layout column spacing.
+   * @since 7
+   */
+  gutter?: number | string;
+
+  /**
+   * Spacing on both sides of the grid layout.
+   * @since 7
+   */
+  margin?: number | string;
 }
 
 /**
- * @devices phone, tablet, car.
+ * Defines the GridContainer component.
  * @since 7
  */
 interface GridContainer extends GridContainerAttribute<GridContainer> {
   /**
-   * columns: Sets the total number of columns in the current layout.
-   * sizeType: Select the device width type.
-   * gutter: Grid layout column spacing.
-   * margin: Spacing on both sides of the grid layout.
-   * @devices phone, tablet, car.
+   * Defines the constructor of GridContainer.
    * @since 7
    */
-  (
-    value?: {
-      columns?: number | 'auto',
-      sizeType?: SizeType,
-      gutter?: number | string,
-      margin?: number | string
-    }
-  ): GridContainer;
+  (value?: GridContainerOption): GridContainer;
 }
 
 /**
- * inheritance  Column
- * @devices phone, tablet, car.
+ * Defines the grid container attribute from inheritance Column
  * @since 7
  */
-declare class GridContainerAttribute<T> extends ColumnAttribute<T> {
-}
+declare class GridContainerAttribute<T> extends ColumnAttribute<T> {}
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const GridContainerInterface: GridContainer;
\ No newline at end of file
+export declare class GridContainerExtend<T> extends GridContainerAttribute<T> {}
+export declare const GridContainerInterface: GridContainer;
diff --git a/api/@internal/component/ets/hyperlink.d.ts b/api/@internal/component/ets/hyperlink.d.ts
index 225f274f94cf0cb17a343d9f0524d009b8eb0337..bcd13fa15d91a107d91c86c8282915915d6228b0 100644
--- a/api/@internal/component/ets/hyperlink.d.ts
+++ b/api/@internal/component/ets/hyperlink.d.ts
@@ -13,18 +13,10 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { Resource, ResourceColor } from "./units";
 
 /**
- * Hyperlink component, which gives the scope of subcomponents.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class HyperlinkExtend<T> extends HyperlinkAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Hyperlink extends HyperlinkAttribute<Hyperlink> {
@@ -32,7 +24,6 @@ interface Hyperlink extends HyperlinkAttribute<Hyperlink> {
    * Return to get Hyperlink.
    * adress: Web page redirected by the hyperlink component.
    * content: Hyperlinks in the hyperlink component display text.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (address: string | Resource, content?: string | Resource): Hyperlink;
@@ -40,20 +31,15 @@ interface Hyperlink extends HyperlinkAttribute<Hyperlink> {
 
 /**
  * inheritance CommonMethod
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class HyperlinkAttribute<T> extends CommonMethod<T> {
   /**
    * Set Color
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 }
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
+export declare class HyperlinkExtend<T> extends HyperlinkAttribute<T> {}
 export declare const HyperlinkInterface: Hyperlink;
diff --git a/api/@internal/component/ets/image.d.ts b/api/@internal/component/ets/image.d.ts
index 9f276e831317576784e29c3ec39a089d6022ff17..609c093447bcb174b2e48988f5a2ec068c419d17 100644
--- a/api/@internal/component/ets/image.d.ts
+++ b/api/@internal/component/ets/image.d.ts
@@ -13,145 +13,125 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, ImageRepeat, ImageFit, Resource, PixelMap} from "./common";
+import { CommonMethod, PixelMap } from "./common";
+import { ImageFit, ImageRepeat } from "./enums";
+import { Resource, ResourceColor } from "./units";
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ImageRenderMode {
   /**
    * Render according to the original image, including colors.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Original,
 
   /**
    * Render the image as a template image, ignoring the color information of the image.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Template
+  Template,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ImageInterpolation {
   /**
    * Do not use interpolated image data.
-   * @devices phone, tablet, car.
    * @since 7
    */
   None,
 
   /**
    * Low usage of interpolated image data.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Low,
 
   /**
    * Interpolated image data is used moderately.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Medium,
 
   /**
    * High usage of interpolated image data may affect the speed of image rendering.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  High
+  High,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare class ImageExtend<T> extends ImageAttribute<T> {
-}
+export declare class ImageExtend<T> extends ImageAttribute<T> {}
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Image extends ImageAttribute<Image> {
   /**
    * Set src to obtain images.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (src: string | PixelMap | Resource): Image;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ImageAttribute<T> extends CommonMethod<T> {
   /**
    * Placeholder displayed on load
-   * @devices phone, tablet, car.
    * @since 7
    */
   alt(value: string | Resource): T;
 
   /**match Text Direction
-   * @devices phone, tablet, car.
    * @since 7
    */
   matchTextDirection(value: boolean): T;
 
   /**
    * Indicates whether the image follows the text direction.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fitOriginalSize(value: boolean): T;
 
   /**
    * fill Color
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fillColor(value: Color | number | string | Resource): T;
+  fillColor(value: ResourceColor): T;
 
   /**
    * Sets the zoom type of an image.
-   * @devices phone, tablet, car.
    * @since 7
    */
   objectFit(value: ImageFit): T;
 
   /**
    * Set the repeat style of the picture
-   * @devices phone, tablet, car.
    * @since 7
    */
   objectRepeat(value: ImageRepeat): T;
 
   /**
    * Set the auto style of the picture
-   * @devices phone, tablet, car.
    * @since 7
    */
   autoResize(value: boolean): T;
 
   /**
    * Sets the image rendering mode.
-   * @devices phone, tablet, car.
    * @since 7
    */
   renderMode(value: ImageRenderMode): T;
 
   /**
    * Sets the interpolation effect of an image. The interpolation effect is only magnified for the image.
-   * @devices phone, tablet, car.
    * @since 7
    */
   interpolation(value: ImageInterpolation): T;
@@ -159,30 +139,34 @@ declare class ImageAttribute<T> extends CommonMethod<T> {
   /**
    * Specifies the picture decoding size.
    * The original picture is decoded into a picture of a specified size. The unit of the number type is px.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  sourceSize(value: { width: number, height: number }): T;
+  sourceSize(value: { width: number; height: number }): T;
 
   /**
    * This callback is triggered when an image is successfully loaded.
    * The size of the image source that is successfully loaded is returned, in pixels.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onComplete(callback: (event?: { width: number, height: number, componentWidth: number, componentHeight: number, loadingStatus: number }) => void): T;
+  onComplete(
+    callback: (event?: {
+      width: number;
+      height: number;
+      componentWidth: number;
+      componentHeight: number;
+      loadingStatus: number;
+    }) => void,
+  ): T;
 
   /**
    * This callback is triggered when an exception occurs during image loading.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onError(callback: (event?: { componentWidth: number, componentHeight: number }) => void): T;
+  onError(callback: (event?: { componentWidth: number; componentHeight: number }) => void): T;
 
   /**
    * When the loaded source file is a svg image, this callback is triggered when the playback of the svg image is complete.
    * If the svg image is a wireless loop image, this callback is not triggered.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onFinish(event: () => void): T;
diff --git a/api/@internal/component/ets/image_animator.d.ts b/api/@internal/component/ets/image_animator.d.ts
index df0885abfbfe55961068bd4c7aa6f349db02d097..90db5527307aeec6676866ca04c536d630703194 100644
--- a/api/@internal/component/ets/image_animator.d.ts
+++ b/api/@internal/component/ets/image_animator.d.ts
@@ -13,25 +13,15 @@
  * limitations under the License.
  */
 
-import {CommonMethod, AnimationStatus} from "./common";
+import { CommonMethod } from "./common";
+import { AnimationStatus } from "./enums";
 
 /**
- * The frame animation component is provided to play pictures frame by frame.
- * You can configure the list of pictures to be played and configure the duration for each picture.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ImageAnimatorExtend<T> extends ImageAnimatorAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface ImageAnimator extends ImageAnimatorAttribute<ImageAnimator> {
   /**
    * ImageAimator is returned.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): ImageAnimator;
@@ -39,107 +29,96 @@ interface ImageAnimator extends ImageAnimatorAttribute<ImageAnimator> {
 
 /**
  * inheritance CommonMethod
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ImageAnimatorAttribute<T> extends CommonMethod<T> {
   /**
    * list images
-   * @devices phone, tablet, car.
    * @since 7
    */
-  images(value: Array<{
-    src: string, width?: number | string, height?: number | string, top?: number | string, left?:
-      number | string, duration?: number
-  }>): T;
+  images(
+    value: Array<{
+      src: string;
+      width?: number | string;
+      height?: number | string;
+      top?: number | string;
+      left?: number | string;
+      duration?: number;
+    }>,
+  ): T;
 
   /**
    * The default value is the initial state, which is used to control the playback status.
-   * @devices phone, tablet, car.
    * @since 7
    */
   state(value: AnimationStatus): T;
 
   /**
    * The unit is millisecond.
-   * @devices phone, tablet, car.
    * @since 7
    */
   duration(value: number): T;
 
   /**
    * Set the playback sequence.
-   * @devices phone, tablet, car.
    * @since 7
    */
   reverse(value: boolean): T;
 
   /**
    * Sets whether the image size is fixed to the component size.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fixedSize(value: boolean): T;
 
   /**
    * Indicates whether to enable pre-decoding.
-   * @devices phone, tablet, car.
    * @since 7
    */
   preDecode(value: number): T;
 
   /**
    * Sets the state before and after the animation starts
-   * @devices phone, tablet, car.
    * @since 7
    */
   fillMode(value: FillMode): T;
 
   /**
    * Played once by default
-   * @devices phone, tablet, car.
    * @since 7
    */
   iterations(value: number): T;
 
   /**
    * Status callback, which is triggered when the animation starts to play.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onStart(event: () => void): T;
 
   /**
    * Status callback, which is triggered when the animation pauses.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onPause(event: () => void): T;
 
   /**
    * Status callback, triggered when the animation is replayed
-   * @devices phone, tablet, car.
    * @since 7
    */
   onRepeat(event: () => void): T;
 
   /**
    * Status callback, which is triggered when the animation is canceled.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onCancel(event: () => void): T;
 
   /**
    * Status callback, which is triggered when the animation playback is complete.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onFinish(event: () => void): T;
 }
 
-/**
- * @devices phone, tablet, car
- * @since 7
- */
+export declare class ImageAnimatorExtend<T> extends ImageAnimatorAttribute<T> {}
 export declare const ImageAnimatorInterface: ImageAnimator;
diff --git a/api/@internal/component/ets/index.d.ts b/api/@internal/component/ets/index.d.ts
index 344a5e393d0bc87289fdb937e12f4aaef26c51c3..030035bd3e108a2e536add8657736e18a534d2d1 100644
--- a/api/@internal/component/ets/index.d.ts
+++ b/api/@internal/component/ets/index.d.ts
@@ -13,76 +13,74 @@
  * limitations under the License.
  */
 
-export * from './ability_component';
-export * from './action_sheet';
-export * from './alert_dialog';
-export * from './alphabet_indexer';
-export * from './animator';
-export * from './badge';
-export * from './blank';
-export * from './button';
-export * from './calendar';
-export * from './camera';
-export * from './circle';
-export * from './column';
-export * from './column_split';
-export * from './common';
-export * from './counter';
-export * from './custom_dialog_controller';
-export * from './datePicker';
-export * from './divider';
-export * from './ellipse';
-export * from './flex';
-export * from './forEach';
-export * from './form_component';
-export * from './gauge';
-export * from './geometryView';
-export * from './gesture';
-export * from './grid';
-export * from './gridItem';
-export * from './grid_container';
-export * from './image';
-export * from './image_animator';
-export * from './lazyForEach';
-export * from './line';
-export * from './list';
-export * from './listItem';
-export * from './loadingProgress';
-export * from './marquee';
-export * from './navigator';
-export * from './navigatorView';
-export * from './pageTransition';
-export * from './panel';
-export * from './path';
-export * from './piece';
-export * from './qrcode';
-export * from './rating';
-export * from './rect';
-export * from './row';
-export * from './row_split';
-export * from './scroll';
-export * from './search';
-export * from './shape';
-export * from './slider';
-export * from './span';
-export * from './stack';
-export * from './stateManagement';
-export * from './swiper';
-export * from './tab_content';
-export * from './tabs';
-export * from './text';
-export * from './textarea';
-export * from './textinput';
-export * from './textPicker';
-export * from './toggle';
-export * from './video';
-export * from './progress';
-export * from './polygon';
-export * from './polyline';
-export * from './radio';
-export * from './datapanel';
-export * from './hyperlink';
-export * from './menu';
-export * from './option';
-export * from './refresh';
-export * from './web';
+export * from "./ability_component";
+export * from "./alert_dialog";
+export * from "./alphabet_indexer";
+export * from "./animator";
+export * from "./badge";
+export * from "./blank";
+export * from "./button";
+export * from "./calendar";
+export * from "./circle";
+export * from "./column";
+export * from "./column_split";
+export * from "./common";
+export * from "./counter";
+export * from "./custom_dialog_controller";
+export * from "./data_panel";
+export * from "./date_picker";
+export * from "./divider";
+export * from "./ellipse";
+export * from "./enums";
+export * from "./flex";
+export * from "./forEach";
+export * from "./form_component";
+export * from "./gauge";
+export * from "./geometry_view";
+export * from "./gesture";
+export * from "./grid";
+export * from "./gridItem";
+export * from "./grid_container";
+export * from "./hyperlink";
+export * from "./image";
+export * from "./image_animator";
+export * from "./lazyForEach";
+export * from "./line";
+export * from "./list";
+export * from "./listItem";
+export * from "./loading_progress";
+export * from "./marquee";
+export * from "./navigation";
+export * from "./navigator";
+export * from "./pageTransition";
+export * from "./panel";
+export * from "./path";
+export * from "./piece";
+export * from "./polygon";
+export * from "./polyline";
+export * from "./progress";
+export * from "./qrcode";
+export * from "./radio";
+export * from "./rating";
+export * from "./rect";
+export * from "./refresh";
+export * from "./row";
+export * from "./row_split";
+export * from "./scroll";
+export * from "./search";
+export * from "./shape";
+export * from "./slider";
+export * from "./span";
+export * from "./stack";
+export * from "./stateManagement";
+export * from "./swiper";
+export * from "./tabs";
+export * from "./tab_content";
+export * from "./text";
+export * from "./text_area";
+export * from "./text_input";
+export * from "./text_picker";
+export * from "./toggle";
+export * from "./units";
+export * from "./video";
+export * from "./web";
diff --git a/api/@internal/component/ets/inspector.d.ts b/api/@internal/component/ets/inspector.d.ts
index 800b5e7b720522fe1b887adb44ae4fc784c36e29..58001f0a6bf33936d667d50687a8130a1be08526 100644
--- a/api/@internal/component/ets/inspector.d.ts
+++ b/api/@internal/component/ets/inspector.d.ts
@@ -15,14 +15,12 @@
 
 /**
  * Get inspector node infos.
- * @devices phone, tablet, car.
  * @since 7
  */
 declare function getInspectorNodes(): object;
 
 /**
  * Get inspector node info by node id.
- * @devices phone, tablet, car.
  * @since 7
  */
-declare function getInspectorNodeById(id: number): object;
\ No newline at end of file
+declare function getInspectorNodeById(id: number): object;
diff --git a/api/@internal/component/ets/lazyForEach.d.ts b/api/@internal/component/ets/lazyForEach.d.ts
index dd451b06507a2c7fa698c4c15f4c8f32740114d8..6729b859b8314b798db72472338393b0d956528e 100644
--- a/api/@internal/component/ets/lazyForEach.d.ts
+++ b/api/@internal/component/ets/lazyForEach.d.ts
@@ -15,77 +15,65 @@
 
 /**
  * Data Change Listener.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare interface DataChangeListener {
   /**
    * Data ready.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDataReloaded(): void;
 
   /**
    * Data added.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDataAdded(index: number): void;
 
   /**
    * Data moved.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onDataMoved(from: number, to: number): void;
 
   /**
    * Data deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onDataDeleted(index:number): void;
+  onDataDeleted(index: number): void;
 
   /**
    * Data changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onDataChanged(index:number): void;
+  onDataChanged(index: number): void;
 }
 
-
 /**
  * Data  changed.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare interface IDataSource {
   /**
    * Total count.
-   * @devices phone, tablet, car.
    * @since 7
    */
   totalCount(): number;
 
   /**
    * get  data.
-   * @devices phone, tablet, car.
    * @since 7
    */
   getData(index: number): any;
 
   /**
    * register Data Change Listener
-   * @devices phone, tablet, car.
    * @since 7
    */
   registerDataChangeListener(listener: DataChangeListener): void;
 
   /**
    * unregister Data Change Listener
-   * @devices phone, tablet, car.
    * @since 7
    */
   unregisterDataChangeListener(listener: DataChangeListener): void;
@@ -93,21 +81,21 @@ export declare interface IDataSource {
 
 /**
  * Lazy loading.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface LazyForEach {
   /**
    * Enter the value to obtain the LazyForEach.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (dataSource: IDataSource, itemGenerator: (item: any, index?: number) => void,
-    keyGenerator?: (item: any, index?: number) => string): LazyForEach;
+  (
+    dataSource: IDataSource,
+    itemGenerator: (item: any, index?: number) => void,
+    keyGenerator?: (item: any, index?: number) => string,
+  ): LazyForEach;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const LazyForEachInterface: LazyForEach;
diff --git a/api/@internal/component/ets/line.d.ts b/api/@internal/component/ets/line.d.ts
index 5e861d90bbd19ee362ca7a5040c7cfee01827c0f..0133fe7e372fa7af07e01906b86903fa414f733f 100644
--- a/api/@internal/component/ets/line.d.ts
+++ b/api/@internal/component/ets/line.d.ts
@@ -1,74 +1,66 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonShapeMethod} from "./common";
-
-/**
- * Line drawing component.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class LineExtend<T> extends LineAttribute<T> {
-}
-
-/**
- * Line drawing component.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Line extends LineAttribute<Line> {
-  /**
-   * Returns the line.
-   * height: Height of the rectangle where the line resides.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (): Line;
-  /**
-   * The return value of the parameter is Line.
-   * width: Width of the rectangle where the line resides..
-   * height: Height of the rectangle where the line resides.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (value?: { width?: string | number, height?: string | number }) :Line;
-}
-
-/**
- * inheritance CommonShapeMethod.
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class LineAttribute<T> extends CommonShapeMethod<T> {
-  /**
-   * Coordinate of the start point of the line (relative coordinate).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  startPoint(value: Array<any>): T;
-
-  /**
-   * Line end coordinates (relative coordinates).
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  endPoint(value: Array<any>): T;
-}
-
-/**
- * @devices phone, tablet, car
- * @since 7
- */
-export declare const LineInterface: Line;
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonShapeMethod } from "./common";
+
+/**
+ * Line drawing component.
+ * @since 7
+ */
+export declare class LineExtend<T> extends LineAttribute<T> {}
+
+/**
+ * Line drawing component.
+ * @since 7
+ */
+interface Line extends LineAttribute<Line> {
+  /**
+   * Returns the line.
+   * height: Height of the rectangle where the line resides.
+   * @since 7
+   */
+  (): Line;
+  /**
+   * The return value of the parameter is Line.
+   * width: Width of the rectangle where the line resides..
+   * height: Height of the rectangle where the line resides.
+   * @since 7
+   */
+  (value?: { width?: string | number; height?: string | number }): Line;
+}
+
+/**
+ * inheritance CommonShapeMethod.
+ * @since 7
+ */
+declare class LineAttribute<T> extends CommonShapeMethod<T> {
+  /**
+   * Coordinate of the start point of the line (relative coordinate).
+   * @since 7
+   */
+  startPoint(value: Array<any>): T;
+
+  /**
+   * Line end coordinates (relative coordinates).
+   * @since 7
+   */
+  endPoint(value: Array<any>): T;
+}
+
+/**
+ * @devices phone, tablet, car
+ * @since 7
+ */
+export declare const LineInterface: Line;
diff --git a/api/@internal/component/ets/list.d.ts b/api/@internal/component/ets/list.d.ts
index 5e4648c44738c56d00c53e62b8a8ae56be6dad49..127a90ce6254dca136dc57270371981bd4ee80e0 100644
--- a/api/@internal/component/ets/list.d.ts
+++ b/api/@internal/component/ets/list.d.ts
@@ -13,167 +13,149 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Axis, Color, Resource, BarState, EdgeEffect} from "./common";
-import {Scroller} from "./scroll";
+import { CommonMethod } from "./common";
+import { Axis, BarState, EdgeEffect } from "./enums";
+import { Scroller } from "./scroll";
+import { Length, ResourceColor } from "./units";
 
 /**
  * Declare scroll status
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ScrollState {
   /**
    * Not activated.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Idle,
 
   /**
    * Scrolling status.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Scroll,
 
   /**
    * Drag status.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Fling
+  Fling,
 }
 
 /**
  * ListExtend extension declaration.
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare class ListExtend<T> extends ListAttribute<T> {
-}
+export declare class ListExtend<T> extends ListAttribute<T> {}
 
 /**
  * The list interface is extended.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface List extends ListAttribute<List> {
   /**
    * Called when interface data is called.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { initialIndex?: number, space?: number | string, scroller?: Scroller }): List;
+  (value?: { initialIndex?: number; space?: number | string; scroller?: Scroller }): List;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ListAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the arrangement direction of the list component is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   listDirection(value: Axis): T;
 
   /**
    * Called when the display mode of the side slider is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBar(value: BarState): T;
 
   /**
    * Called when the sliding effect is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   edgeEffect(value: EdgeEffect): T;
 
   /**
    * Called when the ListItem split line style is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  divider(value: {
-    strokeWidth: number | string | Resource, color?: Color | number | string | Resource,
-    startMargin?: number | string | Resource, endMargin?: number | string | Resource
-  } | null): T;
+  divider(
+    value: {
+      strokeWidth: Length;
+      color?: ResourceColor;
+      startMargin?: Length;
+      endMargin?: Length;
+    } | null,
+  ): T;
 
   /**
    * Called when judging whether it is in editable mode.
-   * @devices phone, tablet, car.
    * @since 7
    */
   editMode(value: boolean): T;
 
   /**
    * Called when the minimum number of list item caches is set for long list deferred loading.
-   * @devices phone, tablet, car.
    * @since 7
    */
   cachedCount(value: number): T;
 
   /**
    * Called when setting whether to enable chain linkage dynamic effect.
-   * @devices phone, tablet, car.
    */
   chainAnimation(value: boolean): T;
 
   /**
    * Called when the offset and status callback of the slide are set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScroll(event: (scrollOffset: number, scrollState: ScrollState) => void): T;
 
   /**
    * Called when the start and end positions of the display change.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScrollIndex(event: (start: number, end: number) => void): T;
 
   /**
    * Called when the list begins to arrive.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onReachStart(event: () => void): T;
 
   /**
    * Called when the list reaches the end.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onReachEnd(event: () => void): T;
 
   /**
    * Called when the slider stops.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScrollStop(event: () => void): T;
 
   /**
    * Called when a list item is deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onItemDelete(event: (index: number) => boolean): T;
 
   /**
    * Called when a list item is moved.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onItemMove(event: (from: number, to: number) => boolean): T;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const ListInterface: List;
diff --git a/api/@internal/component/ets/listItem.d.ts b/api/@internal/component/ets/listItem.d.ts
index c4327b7f3ad7c1e399f9a980c0254a60f8c2b6d3..fd5ce80977ecc1ccbca9eaf710595ff60ac19038 100644
--- a/api/@internal/component/ets/listItem.d.ts
+++ b/api/@internal/component/ets/listItem.d.ts
@@ -13,31 +13,27 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
  * Declare item ceiling attribute.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum Sticky {
   /**
    * No sticky.
-   * @devices phone, tablet, car.
    * @since 7
    */
   None,
 
   /**
    * Normal mode
-   * @devices phone, tablet, car.
    * @since 7
    */
   Normal,
 
   /**
    * Set opacity.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Opacity,
@@ -51,69 +47,58 @@ export declare enum Sticky {
 export declare enum EditMode {
   /**
    * Unrestricted operations.
-   * @devices phone, tablet, car.
    * @since 7
    */
   None,
 
   /**
    * Deleteable.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Deletable,
 
   /**
    * Movable.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Movable,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare class ListItemExtend<T> extends ListItemAttribute<T> {
-}
+export declare class ListItemExtend<T> extends ListItemAttribute<T> {}
 
 /**
  * Values in the list
- * @devices phone, tablet, car.
  * @since 7
  */
 interface ListItem extends ListItemAttribute<ListItem> {
   /**
    * Called when an interface is used.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (value?: string): ListItem;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ListItemAttribute<T> extends CommonMethod<T> {
   /**
    * Called when setting whether item is ceiling effect.
-   * @devices phone, tablet, car.
    * @since 7
    */
   sticky(value: Sticky): T;
 
   /**
    * Called when judging whether it is editable.
-   * @devices phone, tablet, car.
    * @since 7
    */
   editable(value: boolean | EditMode): T;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const ListItemInterface: ListItem;
diff --git a/api/@internal/component/ets/loadingProgress.d.ts b/api/@internal/component/ets/loading_progress.d.ts
similarity index 69%
rename from api/@internal/component/ets/loadingProgress.d.ts
rename to api/@internal/component/ets/loading_progress.d.ts
index dc6a7dc0faeaa5849d7e36898c981d1ab19a52d4..da055d54851c575b4cdfe2fdd226e4745ab1c8af 100644
--- a/api/@internal/component/ets/loadingProgress.d.ts
+++ b/api/@internal/component/ets/loading_progress.d.ts
@@ -13,74 +13,64 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
 
 /**
  * Load style of progress bar.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-export declare enum LoadingProgressStyle{
+export declare enum LoadingProgressStyle {
   /**
    * Default style.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Default,
 
   /**
    * Announcement style.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Circular,
 
   /**
    * The style of the track.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Orbital,
 }
 
 /**
  * Loading Progress Extensions on Declarative Classes
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-export declare class LoadingProgressExtend<T> extends LoadingProgressAttribute<T> {
-}
+export declare class LoadingProgressExtend<T> extends LoadingProgressAttribute<T> {}
 
 /**
  * Provides an interface for extending the loading progress.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface LoadingProgress extends LoadingProgressAttribute<LoadingProgress> {
   /**
    * Called when the progress bar progress is viewed.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   (): LoadingProgress;
 }
 
 /**
  * Declare the progress bar being loaded
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 declare class LoadingProgressAttribute<T> extends CommonMethod<T> {
   /**
    * Load the color of the progress bar.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  color(value: Color | Resource): T;
+  color(value: ResourceColor): T;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 export declare const LoadingProgressInterface: LoadingProgress;
diff --git a/api/@internal/component/ets/marquee.d.ts b/api/@internal/component/ets/marquee.d.ts
index bcbdf4cda5b80ac7c1bfb5f9005dd4d8f8ebee53..607574643b88f86365f216afb3a28a632d173500 100644
--- a/api/@internal/component/ets/marquee.d.ts
+++ b/api/@internal/component/ets/marquee.d.ts
@@ -1,107 +1,87 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color, Resource} from "./common";
-import {FontWeight} from "./text";
-
-/**
- * @devices phone, tablet
- * @since 5
- */
-export declare class MarqueeExtend<T> extends MarqueeAttribute<T> {
-}
-
-/**
- * Provides the interface for the marquee attributes.
- * @devices phone, tablet
- * @since 5
- */
-interface Marquee extends MarqueeAttribute<Marquee> {
-  /**
-   * Create marquee.
-   * @devices phone, tablet
-   * @since 5
-   */
-  (value: {start: boolean, step?: number, loop?: number, fromStart?: boolean, src: string}): Marquee;
-}
-
-/**
- * Declares marquee properties.
- * @devices phone, tablet
- * @since 5
- */
-declare class MarqueeAttribute<T> extends CommonMethod<T> {
-  /**
-   * Set marquee font Color.
-   * @devices phone, tablet
-   * @since 5
-   */
-  fontColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Set marquee font size.
-   * @devices phone, tablet
-   * @since 5
-   */
-  fontSize(value: number | string | Resource): T;
-
-  /**
-   * Set marquee allow scale.
-   * @devices phone, tablet
-   * @since 5
-   */
-  allowScale(value: boolean): T;
-
-  /**
-   * Set marquee font weight.
-   * @devices phone, tablet
-   * @since 5
-   */
-  fontWeight(value: number | FontWeight | string): T;
-
-  /**
-   * Set marquee font family.
-   * @devices phone, tablet
-   * @since 5
-   */
-  fontFamily(value: string | Resource): T;
-
-  /**
-   * Called when scrolling starts.
-   * @devices phone, tablet
-   * @since 5
-   */
-  onStart(event: () => void): T;
-
-  /**
-   * Called when scrolling to the bottom.
-   * @devices phone, tablet
-   * @since 5
-   */
-  onBounce(event: () => void): T;
-
-  /**
-   * Called when scrolling is complete.
-   * @devices phone, tablet
-   * @since 5
-   */
-  onFinish(event: () => void): T;
-}
-
-/**
- * @devices phone, tablet
- * @since 5
- */
-export declare const MarqueeInterface: Marquee;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { FontWeight } from "./enums";
+import { Length, Resource, ResourceColor } from "./units";
+
+/**
+ * Provides the interface for the marquee attributes.
+ * @since 8
+ */
+interface Marquee extends MarqueeAttribute<Marquee> {
+  /**
+   * Create marquee.
+   * @since 8
+   */
+  (value: { start: boolean; step?: number; loop?: number; fromStart?: boolean; src: string }): Marquee;
+}
+
+/**
+ * Declares marquee properties.
+ * @since 8
+ */
+declare class MarqueeAttribute<T> extends CommonMethod<T> {
+  /**
+   * Set marquee font Color.
+   * @since 8
+   */
+  fontColor(value: ResourceColor): T;
+
+  /**
+   * Set marquee font size.
+   * @since 8
+   */
+  fontSize(value: Length): T;
+
+  /**
+   * Set marquee allow scale.
+   * @since 8
+   */
+  allowScale(value: boolean): T;
+
+  /**
+   * Set marquee font weight.
+   * @since 8
+   */
+  fontWeight(value: number | FontWeight | string): T;
+
+  /**
+   * Set marquee font family.
+   * @since 8
+   */
+  fontFamily(value: string | Resource): T;
+
+  /**
+   * Called when scrolling starts.
+   * @since 8
+   */
+  onStart(event: () => void): T;
+
+  /**
+   * Called when scrolling to the bottom.
+   * @since 8
+   */
+  onBounce(event: () => void): T;
+
+  /**
+   * Called when scrolling is complete.
+   * @since 8
+   */
+  onFinish(event: () => void): T;
+}
+
+export declare class MarqueeExtend<T> extends MarqueeAttribute<T> {}
+export declare const MarqueeInterface: Marquee;
diff --git a/api/@internal/component/ets/navigatorView.d.ts b/api/@internal/component/ets/navigation.d.ts
similarity index 55%
rename from api/@internal/component/ets/navigatorView.d.ts
rename to api/@internal/component/ets/navigation.d.ts
index b35a8d510721c031f9d907dfb4df6a4e7ec902cc..249ac096a87e396217c868bbc8a1b8b1a0b34ee7 100644
--- a/api/@internal/component/ets/navigatorView.d.ts
+++ b/api/@internal/component/ets/navigation.d.ts
@@ -13,40 +13,25 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
-
-/**
- * Show routing content.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class NavigationViewExtend<T> extends NavigationViewAttribute<T> {
-}
+import { CommonMethod } from "./common";
 
 /**
  * Provide navigator view interface
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-interface NavigationView extends NavigationViewAttribute<NavigationView> {
+interface Navigation extends NavigationAttribute<Navigation> {
   /**
    * Called when the navigator view interface is used.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  (): NavigationView;
+  (): Navigation;
 }
 
 /**
  * Declare Navigation view properties.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-declare class NavigationViewAttribute<T> extends CommonMethod<T> {
-}
+declare class NavigationAttribute<T> extends CommonMethod<T> {}
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const NavigationViewInterface: NavigationView;
+export declare class NavigationExtend<T> extends NavigationAttribute<T> {}
+export declare const NavigationInterface: Navigation;
diff --git a/api/@internal/component/ets/navigator.d.ts b/api/@internal/component/ets/navigator.d.ts
index c1e1d43a008daec04453b896b4fbcba7d1d920d2..b0339341ad00c0cb0ad6b6ce02c729b9423c7108 100644
--- a/api/@internal/component/ets/navigator.d.ts
+++ b/api/@internal/component/ets/navigator.d.ts
@@ -13,62 +13,45 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
  * Route jump.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum NavigationType {
   /**
    * Jump to the next page.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Push,
 
   /**
    * Return to the previous page.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Back,
 
   /**
    * Replace page.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Replace
-}
-
-/**
- * Declare navigator extensions.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class NavigatorExtend<T> extends NavigatorAttribute<T> {
+  Replace,
 }
 
 /**
  * Create route
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Navigator extends NavigatorAttribute<Navigator> {
   /**
    * Called when the route jumps.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: {
-    target: string,
-    type?: NavigationType }): Navigator;
+  (value?: { target: string; type?: NavigationType }): Navigator;
 
   /**
    * Called when using the navigator.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): Navigator;
@@ -76,41 +59,33 @@ interface Navigator extends NavigatorAttribute<Navigator> {
 
 /**
  * Declare navigator properties.
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class NavigatorAttribute<T> extends CommonMethod<T> {
   /**
    * Called when determining whether the routing component is active.
-   * @devices phone, tablet, car.
    * @since 7
    */
   active(value: boolean): T;
 
   /**
    * Called when determining whether the routing component is active.
-   * @devices phone, tablet, car.
    * @since 7
    */
   type(value: NavigationType): T;
 
   /**
    * Called when the path to the specified jump target page is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   target(value: string): T;
 
   /**
    * Called when data is passed to the target page at the same time during jump.
-   * @devices phone, tablet, car.
    * @since 7
    */
   params(value: object): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class NavigatorExtend<T> extends NavigatorAttribute<T> {}
 export declare const NavigatorInterface: Navigator;
diff --git a/api/@internal/component/ets/pageTransition.d.ts b/api/@internal/component/ets/pageTransition.d.ts
index 7afab4978e573c4d85f46af9fcd6dade754471df..e1ca8571ffa3bc317d0194feaf5d5de2196f0aec 100644
--- a/api/@internal/component/ets/pageTransition.d.ts
+++ b/api/@internal/component/ets/pageTransition.d.ts
@@ -13,105 +13,90 @@
  * limitations under the License.
  */
 
-import {Curve} from "./common";
+import { Curve } from "./enums";
 
 /**
  * Declare the jump method.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum RouteType {
   /**
    * The page is not redirected.
-   * @devices phone, tablet, car.
    * @since 7
    */
   None,
   /**
    * Go to the next page.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Push,
   /**
    * Redirect to a specified page.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Pop
+  Pop,
 }
 
 /**
  * Declare the sliding effect of transition.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum SlideEffect {
   /**
    * Swipe left.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Left,
 
   /**
    * Swipe right.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Right,
 
   /**
    * Swipe top.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Top,
 
   /**
    * Swipe bottom.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Bottom
+  Bottom,
 }
 
 /**
  * Provides interfaces for common transitions.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class CommonTransition<T> {
   /**
    * Called when a transition method is required.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
   /**
    * Called when the slide in effect of the transition is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   slide(value: SlideEffect): T;
 
   /**
    * Called when the translation effect of page transition is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  translate(value: { x?: number | string, y?: number | string, z?: number | string }): T;
+  translate(value: { x?: number | string; y?: number | string; z?: number | string }): T;
 
   /**
    * Called when setting the zoom effect of page transition.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  scale(value: { x?: number, y?: number, z?: number, centerX?: number | string, centerY?: number | string }): T;
+  scale(value: { x?: number; y?: number; z?: number; centerX?: number | string; centerY?: number | string }): T;
 
   /**
    * Called when the transparency value of the starting point of entry or the ending point of exit is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   opacity(value: number): T;
@@ -119,20 +104,17 @@ export declare class CommonTransition<T> {
 
 /**
  * Provides an interface for page rotation mode.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface PageTransitionEnter extends CommonTransition<PageTransitionEnter> {
   /**
    * Called when page Jump animation is used.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value: { type?: RouteType, duration?: number, curve?: Curve | string, delay?: number }): PageTransitionEnter;
+  (value: { type?: RouteType; duration?: number; curve?: Curve | string; delay?: number }): PageTransitionEnter;
 
   /**
    * Called when the incoming parameter is the normalized progress of the current incoming animation.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onEnter(event: (type?: RouteType, progress?: number) => void): PageTransitionEnter;
@@ -140,39 +122,21 @@ interface PageTransitionEnter extends CommonTransition<PageTransitionEnter> {
 
 /**
  * Provide an interface to exit the transition.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface PageTransitionExit extends CommonTransition<PageTransitionExit> {
   /**
    * Called when the transition is delayed.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value: {
-    type?: RouteType,
-    duration?: number,
-    curve?: Curve | string,
-    delay?: number }): PageTransitionExit;
+  (value: { type?: RouteType; duration?: number; curve?: Curve | string; delay?: number }): PageTransitionExit;
 
   /**
    * Called when the input parameter is the normalized progress of the current exit animation.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onExit(event: (
-    type?: RouteType,
-    progress?: number) => void): PageTransitionExit;
+  onExit(event: (type?: RouteType, progress?: number) => void): PageTransitionExit;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
 export declare const PageTransitionEnterInterface: PageTransitionEnter;
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const PageTransitionExitInterface: PageTransitionExit;
\ No newline at end of file
+export declare const PageTransitionExitInterface: PageTransitionExit;
diff --git a/api/@internal/component/ets/panel.d.ts b/api/@internal/component/ets/panel.d.ts
index c3e66bf09d3bd61f845c02692fc7bf5eaa1185da..7ae3fd2b621f8067d5e3da1b3bc848f121a075dd 100644
--- a/api/@internal/component/ets/panel.d.ts
+++ b/api/@internal/component/ets/panel.d.ts
@@ -13,45 +13,39 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
  * Sets the initial state of the slidable panel.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum PanelMode {
   /**
    * Minimum state.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Mini,
 
   /**
    * SHalf-screen-like status
-   * @devices phone, tablet, car.
    * @since 7
    */
   Half,
 
   /**
    * Class Full Screen Status.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Full
+  Full,
 }
 
 /**
  * Sets the type of sliding panel.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum PanelType {
   /**
    * The switch between the minibar and full-screen display is provided.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Minibar,
@@ -59,7 +53,6 @@ export declare enum PanelType {
   /**
    * Permanent content display class.
    * The switchover effect is provided in three sizes: large (full-screen), medium (half-screen), and small.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Foldable,
@@ -67,118 +60,95 @@ export declare enum PanelType {
   /**
    * Temporary content display area.
    * The switchover effect is provided in three sizes: large (full-screen), medium (half-screen), and small.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Temporary
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class PanelExtend<T> extends PanelAttribute<T> {
+  Temporary,
 }
 
 /**
  * Provides a sliding panel interface.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Panel extends PanelAttribute<Panel> {
   /**
    * Called when the panel slidable panel pops up.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (show: boolean): Panel;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class PanelAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the initial state of the slidable panel is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   mode(value: PanelMode): T;
 
   /**
    * Called when the slidable panel type is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   type(value: PanelType): T;
 
   /**
    * Called when determining whether dragbar exists.
-   * @devices phone, tablet, car.
    * @since 7
    */
   dragBar(value: boolean): T;
 
   /**
    * Called when the height in the full state is specified.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fullHeight(value: number | string): T;
 
   /**
    * Called when the height in the half state is specified.
-   * @devices phone, tablet, car.
    * @since 7
    */
   halfHeight(value: number | string): T;
 
   /**
    * Called when the height in the mini state is specified.
-   * @devices phone, tablet, car.
    * @since 7
    */
   miniHeight(value: number | string): T;
 
   /**
    * Called when the panel slidable panel pops up.
-   * @devices phone, tablet, car.
    * @since 7
    */
   show(value: boolean): T;
 
   /**
    * Called when the state of the slidable panel changes.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onChange(event: (
-
-  /**
-   * Width of content area.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-    width: number,
-
-  /**
-   * Height of content area.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-    height: number,
-
-  /**
-   * Initial state.
-   * @devices phone, tablet, car.
    * @since 7
    */
-    mode: PanelMode) => void): T;
+  onChange(
+    event: (
+      /**
+       * Width of content area.
+       * @since 7
+       */
+      width: number,
+
+      /**
+       * Height of content area.
+       * @since 7
+       */
+      height: number,
+
+      /**
+       * Initial state.
+       * @since 7
+       */
+      mode: PanelMode,
+    ) => void,
+  ): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class PanelExtend<T> extends PanelAttribute<T> {}
 export declare const PanelInterface: Panel;
diff --git a/api/@internal/component/ets/path.d.ts b/api/@internal/component/ets/path.d.ts
index 0fcf2545d1a994744030e8ff2baa6adaa360b263..e450886eef04a00c6d421ee6e6c9649148ba1fb2 100644
--- a/api/@internal/component/ets/path.d.ts
+++ b/api/@internal/component/ets/path.d.ts
@@ -13,52 +13,30 @@
  * limitations under the License.
  */
 
-import {CommonShapeMethod} from "./common";
-
-/**
- * Path drawing.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class PathExtend<T> extends PathAttribute<T> {
-}
+import { CommonShapeMethod } from "./common";
 
 /**
  * Provides the path drawing interface.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Path extends PathAttribute<Path> {
-  /**
-   * Called when drawing with a new path.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  new (value?: { width?: number | string, height?: number | string, commands?: string }): Path;
-
   /**
    * Called when drawing path.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { width?: number | string, height?: number | string, commands?: string }): Path;
+  (value?: { width?: number | string; height?: number | string; commands?: string }): Path;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class PathAttribute<T> extends CommonShapeMethod<T> {
   /**
    * Called when the command string drawn by the path is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   commands(value: string): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class PathExtend<T> extends PathAttribute<T> {}
 export declare const PathInterface: Path;
diff --git a/api/@internal/component/ets/piece.d.ts b/api/@internal/component/ets/piece.d.ts
index c6f83c62cf59bdf2ff54bc658d53886db477baac..63ecaf96fddbc3fa56dee77958fc16b47edf9678 100644
--- a/api/@internal/component/ets/piece.d.ts
+++ b/api/@internal/component/ets/piece.d.ts
@@ -1,75 +1,59 @@
 /*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
- *Sets the relative position of icons and text.
- * @devices phone, tablet, car.
- * @since 7
+ * Sets the relative position of icons and text.
+ * @since 8
  */
 export declare enum IconPosition {
-
   /**
-  * The icon is at the beginning of the text.
-  * @devices phone, tablet, car.
-  * @since 7
-  */
+   * The icon is at the beginning of the text.
+   * @devices phone, tablet, car.
+   * @since 8
+   */
   Start,
 
   /**
-  * The icon is at the end of the text.
-  * @devices phone, tablet, car.
-  * @since 7
-  */
-  End
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class PieceExtend<T> extends PieceAttribute<T> {
+   * The icon is at the end of the text.
+   * @devices phone, tablet, car.
+   * @since 8
+   */
+  End,
 }
 
 /**
  * Provides text and icons for setting block entries.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface Piece extends PieceAttribute<Piece> {
-
   /**
    * Called when setting the position of a block entry.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  (options?: {content: string,icon?: string}): Piece;
+  (options?: { content: string; icon?: string }): Piece;
 }
 
 declare class PieceAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the relative position of the icon and the text is set.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   iconPosition(value: IconPosition): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const PieceInterface: Piece;
\ No newline at end of file
+export declare class PieceExtend<T> extends PieceAttribute<T> {}
+export declare const PieceInterface: Piece;
diff --git a/api/@internal/component/ets/polygon.d.ts b/api/@internal/component/ets/polygon.d.ts
index 4ef162caa2924026f71811511c3335acb2bdf76f..c300eaadbba3b3c57707d4c20093548b34ba5daa 100644
--- a/api/@internal/component/ets/polygon.d.ts
+++ b/api/@internal/component/ets/polygon.d.ts
@@ -1,60 +1,48 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonShapeMethod} from "./common";
-
-/**
- * Polygon drawing.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class PolygonExtend<T> extends PolygonAttribute<T> {
-}
-
-/**
- * Provides the polygon drawing interface.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Polygon extends PolygonAttribute<Polygon> {
-     /**
-     * Called when the draw polygon interface is used.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    (): Polygon;
-
-    /**
-     * Called when drawing a polygon.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    (value?: { width?: string | number, height?: string | number }): Polygon;
-}
-
-declare class PolygonAttribute<T> extends CommonShapeMethod<T> {
-    /**
-     * Called when the vertex coordinate list of a polygon is set.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    points(value: Array<any>): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const PolygonInterface: Polygon;
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonShapeMethod } from "./common";
+
+/**
+ * Provides the polygon drawing interface.
+ * @since 7
+ */
+interface Polygon extends PolygonAttribute<Polygon> {
+  /**
+   * Called when the draw polygon interface is used.
+   * @devices phone, tablet, car.
+   * @since 7
+   */
+  (): Polygon;
+
+  /**
+   * Called when drawing a polygon.
+   * @devices phone, tablet, car.
+   * @since 7
+   */
+  (value?: { width?: string | number; height?: string | number }): Polygon;
+}
+
+declare class PolygonAttribute<T> extends CommonShapeMethod<T> {
+  /**
+   * Called when the vertex coordinate list of a polygon is set.
+   * @devices phone, tablet, car.
+   * @since 7
+   */
+  points(value: Array<any>): T;
+}
+
+export declare class PolygonExtend<T> extends PolygonAttribute<T> {}
+export declare const PolygonInterface: Polygon;
diff --git a/api/@internal/component/ets/polyline.d.ts b/api/@internal/component/ets/polyline.d.ts
index aff378ab08ad36580be19197b606e38e91dc3490..a539a541bf8723247eb3f4c5022023eb5a751f14 100644
--- a/api/@internal/component/ets/polyline.d.ts
+++ b/api/@internal/component/ets/polyline.d.ts
@@ -1,64 +1,48 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonShapeMethod} from "./common";
-
-/**
- * Discounted drawing.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class PolylineExtend<T> extends PolylineAttribute<T> {
-}
-
-/**
- * Provides an interface for drawing polylines.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Polyline extends PolylineAttribute<Polyline> {
-  /**
-   * Called when using the draw polyline interface.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (): Polyline;
-
-  /**
-   * Called when using the draw fold.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (value?: { width?: string | number, height?: string | number }): Polyline;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class PolylineAttribute<T> extends CommonShapeMethod<T> {
-  /**
-   * Called when the polyline is set to pass through the coordinate point list.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  points(value: Array<any>): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const PolylineInterface: Polyline;
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonShapeMethod } from "./common";
+
+/**
+ * Provides an interface for drawing polylines.
+ * @since 7
+ */
+interface Polyline extends PolylineAttribute<Polyline> {
+  /**
+   * Called when using the draw polyline interface.
+   * @since 7
+   */
+  (): Polyline;
+
+  /**
+   * Called when using the draw fold.
+   * @since 7
+   */
+  (value?: { width?: string | number; height?: string | number }): Polyline;
+}
+
+/**
+ * @since 7
+ */
+declare class PolylineAttribute<T> extends CommonShapeMethod<T> {
+  /**
+   * Called when the polyline is set to pass through the coordinate point list.
+   * @since 7
+   */
+  points(value: Array<any>): T;
+}
+
+export declare class PolylineExtend<T> extends PolylineAttribute<T> {}
+export declare const PolylineInterface: Polyline;
diff --git a/api/@internal/component/ets/progress.d.ts b/api/@internal/component/ets/progress.d.ts
index 5504f6430b01b91e57e6d922a85609aba2800e1f..e161e278929e461e9cf7bb95064a9d4a0fbc558f 100644
--- a/api/@internal/component/ets/progress.d.ts
+++ b/api/@internal/component/ets/progress.d.ts
@@ -1,113 +1,82 @@
 /*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
 
-import {CommonMethod, Color, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
 
 /**
  * Type of progress bar
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ProgressStyle {
-    /**
-     * Linear progress bar style.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Linear,
-
-    /**
-     * Capsule progress bar style.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Capsule,
-
-    /**
-     * Circular progress bar.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Eclipse,
-
-    /**
-     * Ring progress bar.
-     * @devices phone, tablet, car.
-     * @since 7
-     */
-    Circular,
-}
+  /**
+   * Linear progress bar style.
+   * @devices phone, tablet, car.
+   * @since 7
+   */
+  Linear,
 
-/**
- * Make a statement on the progress bar.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ProgressExtend<T> extends ProgressAttribute<T> {
+  /**
+   * Circular progress bar.
+   * @devices phone, tablet, car.
+   * @since 7
+   */
+  Eclipse,
 }
 
 /**
  * Provides the progress bar interface.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Progress extends ProgressAttribute<Progress> {
   /**
    * Called when the progress bar is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (object: {value: number,total?: number,style?: ProgressStyle }): Progress;
+  (object: { value: number; total?: number; style?: ProgressStyle }): Progress;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ProgressAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the current progress value is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   value(value: number): T;
 
   /**
    * Called when the progress bar foreground is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 
   /**
    * Called when the style of the circular progress bar is set.
-   * @devices phone, tablet, car.
    * @since 7
+   * @deprecated since 7
    */
-  circularStyle(value: { strokeWidth?: number, scaleCount?: number, scaleWidth?: number }): T;
+  circularStyle(value: { strokeWidth?: number; scaleCount?: number; scaleWidth?: number }): T;
 
-    /**
+  /**
    * Called when the style of the cricular progress bar is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  cricularStyle(value: { strokeWidth?: number, scaleCount?: number, scaleWidth?: number }): T;
+  cricularStyle(value: { strokeWidth?: number; scaleCount?: number; scaleWidth?: number }): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const ProgressInterface: Progress;
\ No newline at end of file
+export declare class ProgressExtend<T> extends ProgressAttribute<T> {}
+export declare const ProgressInterface: Progress;
diff --git a/api/@internal/component/ets/qrcode.d.ts b/api/@internal/component/ets/qrcode.d.ts
index b2993cd8c9d5c0e23f10dfd5c10821985e032b1f..6c8a94fe990bd1ba7a00113ae4fb514b25da473f 100644
--- a/api/@internal/component/ets/qrcode.d.ts
+++ b/api/@internal/component/ets/qrcode.d.ts
@@ -13,53 +13,37 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
-
-/**
- * QR code information
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class QRCodeExtend<T> extends QRCodeAttribute<T> {
-}
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
 
 /**
  * Provides an interface for generating QR codes.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface QRCode extends QRCodeAttribute<QRCode> {
   /**
    * Called when a QR code is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (
-    value: string): QRCode;
+  (value: string): QRCode;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class QRCodeAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the QR code color is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  color(value: Color | number | string | Resource): T;
+  color(value: ResourceColor): T;
 
   /**
    * Called when setting the QR code background color.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  backgroundColor(value: Color | number | string | Resource): T;
+  backgroundColor(value: ResourceColor): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class QRCodeExtend<T> extends QRCodeAttribute<T> {}
 export declare const QRCodeInterface: QRCode;
diff --git a/api/@internal/component/ets/radio.d.ts b/api/@internal/component/ets/radio.d.ts
index 2fb95268f2e453b4451bd7aa423823fdd4db2935..5c56790035a5044cb403f6e12c680cc76e79be3c 100644
--- a/api/@internal/component/ets/radio.d.ts
+++ b/api/@internal/component/ets/radio.d.ts
@@ -1,65 +1,48 @@
 /*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod} from "./common";
-
-/**
- * radio
- * @devices phone, tablet, car.
- * @since 7
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
  */
-export declare class RadioExtend<T> extends RadioAttribute<T> {
-}
+
+import { CommonMethod } from "./common";
 
 /**
  * Provides an interface for creating a radio box.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface Radio extends RadioAttribute<Radio> {
   /**
    * Called when a radio box is created.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  (options: {
-    value: string}): Radio;
+  (options: { value: string }): Radio;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 declare class RadioAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the radio box is selected.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   checked(value: boolean): T;
 
   /**
    * Called when the radio box selection status changes.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onChange(callback: (isChecked: boolean) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class RadioExtend<T> extends RadioAttribute<T> {}
 export declare const RadioInterface: Radio;
diff --git a/api/@internal/component/ets/rating.d.ts b/api/@internal/component/ets/rating.d.ts
index 900fa1ad4e03874d14b27988b7aba6e816bef7cf..7403946f44b943b7020c0a27f99558600c253106 100644
--- a/api/@internal/component/ets/rating.d.ts
+++ b/api/@internal/component/ets/rating.d.ts
@@ -1,81 +1,60 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod} from "./common";
-
-/**
- * Scoring bar
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class RatingExtend<T> extends RatingAttribute<T> {
-}
-
-/**
- * Provides the interface for scoring bars.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Rating extends RatingAttribute<Rating> {
-  /**
-   * Called when a score bar is created.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options?: { rating: number, indicator?: boolean }): Rating;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class RatingAttribute<T> extends CommonMethod<T> {
-  /**
-   * Called when the total number of stars is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  stars(value: number): T;
-
-  /**
-   * Called when the step size of the operation rating.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  stepSize(value: number): T;
-
-  /**
-   * Called when a picture is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  starStyle(value: {
-    backgroundUri: string,
-    foregroundUri: string,
-    secondaryUri?: string}): T;
-
-  /**
-   * Called when the star rating of the operation scoring bar changes.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onChange(callback:(value: number) => void): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const RatingInterface: Rating;
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+
+/**
+ * Provides the interface for scoring bars.
+ * @since 7
+ */
+interface Rating extends RatingAttribute<Rating> {
+  /**
+   * Called when a score bar is created.
+   * @since 7
+   */
+  (options?: { rating: number; indicator?: boolean }): Rating;
+}
+
+/**
+ * @since 7
+ */
+declare class RatingAttribute<T> extends CommonMethod<T> {
+  /**
+   * Called when the total number of stars is set.
+   * @since 7
+   */
+  stars(value: number): T;
+
+  /**
+   * Called when the step size of the operation rating.
+   * @since 7
+   */
+  stepSize(value: number): T;
+
+  /**
+   * Called when a picture is set.
+   * @since 7
+   */
+  starStyle(value: { backgroundUri: string; foregroundUri: string; secondaryUri?: string }): T;
+
+  /**
+   * Called when the star rating of the operation scoring bar changes.
+   * @since 7
+   */
+  onChange(callback: (value: number) => void): T;
+}
+
+export declare class RatingExtend<T> extends RatingAttribute<T> {}
+export declare const RatingInterface: Rating;
diff --git a/api/@internal/component/ets/rect.d.ts b/api/@internal/component/ets/rect.d.ts
index 42ee9caf9be38ed4a0f7142fff46f0b369589020..38836fd7c71d9410e93b672b8c28a8893d8cfe3d 100644
--- a/api/@internal/component/ets/rect.d.ts
+++ b/api/@internal/component/ets/rect.d.ts
@@ -13,73 +13,51 @@
  * limitations under the License.
  */
 
-import {CommonShapeMethod} from "./common";
-
-/**
- * Rectangle drawing.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class RectExtend<T> extends RectAttribute<T> {
-}
+import { CommonShapeMethod } from "./common";
 
 /**
  * Provides an interface for drawing rectangles.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Rect extends RectAttribute<Rect> {
-  /**
-   * Called when a new rectangle is created.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  new (
-    value?: { width?: number | string, height?: number | string, radius?: number | string | Array<any> } |
-    {
-      width?: number | string, height?: number | string, radiusWidth?: number | string,
-      radiusHeight?: number | string
-    }): Rect;
-
   /**
    * Called when a rectangle is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: {width?: number | string,height?: number | string,radius?: number | string | Array<any> } |
-  {
-    width?: number | string,height?: number | string,radiusWidth?: number | string,radiusHeight?: number | string}): Rect;
+  (
+    value?:
+      | { width?: number | string; height?: number | string; radius?: number | string | Array<any> }
+      | {
+          width?: number | string;
+          height?: number | string;
+          radiusWidth?: number | string;
+          radiusHeight?: number | string;
+        },
+  ): Rect;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class RectAttribute<T> extends CommonShapeMethod<T> {
   /**
    * Called when the fillet width is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   radiusWidth(value: number | string): T;
 
   /**
    * Called when the fillet height is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   radiusHeight(value: number | string): T;
 
   /**
    * Called when the fillet size is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   radius(value: number | string | Array<any>): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class RectExtend<T> extends RectAttribute<T> {}
 export declare const RectInterface: Rect;
diff --git a/api/@internal/component/ets/refresh.d.ts b/api/@internal/component/ets/refresh.d.ts
index 773864ed2a35ce9ddafec1c7a568d19a39efe5f7..8750e9f5f677539e1c3855d28b4e77d82a4697a1 100644
--- a/api/@internal/component/ets/refresh.d.ts
+++ b/api/@internal/component/ets/refresh.d.ts
@@ -1,105 +1,84 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod} from "./common";
-
-/**
- * The refresh status of the drop-down refresh.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum RefreshStatus {
-  /**
-   * The refresh status of the drop-down refresh.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Inactive,
-
-  /**
-   * Drop down, but the drop-down distance is less than the refresh distance.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Drag,
-
-  /**
-   * The pull-down exceeds the refresh distance.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  OverDrag,
-
-  /**
-   * After the pull-down, it rebounds to the refresh distance and enters the refresh state.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Refresh,
-
-  /**
-   * After refresh, return to the initial state.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Done,
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class RefreshExtend<T> extends RefreshAttribute<T> {
-}
-
-/**
- * Provides a pull-down refresh interface.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Refresh extends RefreshAttribute<Refresh> {
-  /**
-   * Called when the drop-down refresh is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (value: {refreshing: boolean,offset?: number | string,friction?: number | string }): Refresh;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class RefreshAttribute<T> extends CommonMethod<T> {
-  /**
-   * Called when the refresh state changes.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onStateChange(callback: (state: RefreshStatus) => void): T;
-
-  /**
-   * Called when the refresh state is entered.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onRefreshing(callback: () => void): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const RefreshInterface: Refresh;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+
+/**
+ * The refresh status of the drop-down refresh.
+ * @since 8
+ */
+export declare enum RefreshStatus {
+  /**
+   * The refresh status of the drop-down refresh.
+   * @since 8
+   */
+  Inactive,
+
+  /**
+   * Drop down, but the drop-down distance is less than the refresh distance.
+   * @since 8
+   */
+  Drag,
+
+  /**
+   * The pull-down exceeds the refresh distance.
+   * @since 8
+   */
+  OverDrag,
+
+  /**
+   * After the pull-down, it rebounds to the refresh distance and enters the refresh state.
+   * @since 8
+   */
+  Refresh,
+
+  /**
+   * After refresh, return to the initial state.
+   * @since 8
+   */
+  Done,
+}
+
+/**
+ * Provides a pull-down refresh interface.
+ * @since 8
+ */
+interface Refresh extends RefreshAttribute<Refresh> {
+  /**
+   * Called when the drop-down refresh is set.
+   * @since 8
+   */
+  (value: { refreshing: boolean; offset?: number | string; friction?: number | string }): Refresh;
+}
+
+/**
+ * @since 8
+ */
+declare class RefreshAttribute<T> extends CommonMethod<T> {
+  /**
+   * Called when the refresh state changes.
+   * @since 8
+   */
+  onStateChange(callback: (state: RefreshStatus) => void): T;
+
+  /**
+   * Called when the refresh state is entered.
+   * @since 8
+   */
+  onRefreshing(callback: () => void): T;
+}
+
+export declare class RefreshExtend<T> extends RefreshAttribute<T> {}
+export declare const RefreshInterface: Refresh;
diff --git a/api/@internal/component/ets/row.d.ts b/api/@internal/component/ets/row.d.ts
index 83925d225185b63290e9e554cac508ba078e122e..b225cd0aa869a2d1a49b018a05250fda8d1c7d88 100644
--- a/api/@internal/component/ets/row.d.ts
+++ b/api/@internal/component/ets/row.d.ts
@@ -13,44 +13,31 @@
  * limitations under the License.
  */
 
-import {CommonMethod, VerticalAlign, VerticalAlignDeclaration} from "./common";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class RowExtend<T> extends RowAttribute<T> {
-}
+import { CommonMethod } from "./common";
+import { VerticalAlign } from "./enums";
 
 /**
  * The components are laid out horizontally
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Row extends RowAttribute<Row> {
   /**
    * Called when the layout is set in the horizontal direction.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { space?: string | number, useAlign?: VerticalAlignDeclaration }): Row;
+  (value?: { space?: string | number }): Row;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class RowAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the vertical alignment is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   alignItems(value: VerticalAlign): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class RowExtend<T> extends RowAttribute<T> {}
 export declare const RowInterface: Row;
diff --git a/api/@internal/component/ets/row_split.d.ts b/api/@internal/component/ets/row_split.d.ts
index bcd4382580c4c3751601a9add2d60d92f2d6c004..ea1b2eab15fa93a826b24a06b924b7f23e2aeaf7 100644
--- a/api/@internal/component/ets/row_split.d.ts
+++ b/api/@internal/component/ets/row_split.d.ts
@@ -13,45 +13,30 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
-
-/**
- * Component horizontal layout.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class RowSplitExtend<T> extends RowSplitAttribute<T> {
-}
+import { CommonMethod } from "./common";
 
 /**
  * Provides interfaces for layout in the vertical direction.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface RowSplit extends RowSplitAttribute<RowSplit> {
   /**
    * Called when the layout along the vertical direction is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): RowSplit;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class RowSplitAttribute<T> extends CommonMethod<T> {
   /**
    * Called when judging whether the split line can be dragged.
-   * @devices phone, tablet, car.
    * @since 7
    */
   resizeable(value: boolean): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class RowSplitExtend<T> extends RowSplitAttribute<T> {}
 export declare const RowSplitInterface: RowSplit;
diff --git a/api/@internal/component/ets/scroll.d.ts b/api/@internal/component/ets/scroll.d.ts
index d4b13605de75beb15141ff2e777cad916927cbe6..30672e8dd66e941049f6dd08941e297bc20cb1ee 100644
--- a/api/@internal/component/ets/scroll.d.ts
+++ b/api/@internal/component/ets/scroll.d.ts
@@ -13,177 +13,148 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Edge, Axis, Curve, BarState, EdgeEffect, Color} from "./common";
+import { CommonMethod } from "./common";
+import { Axis, BarState, Color, Curve, Edge, EdgeEffect } from "./enums";
 
 /**
  * Content scroll direction.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ScrollDirection {
   /**
    * Vertical scrolling is supported.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Vertical,
 
   /**
    * Horizontal scrolling is supported.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Horizontal,
 
   /**
    * Free scrolling is supported.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Free,
 
   /**
    * Non-scrollable.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  None
+  None,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class Scroller {
   /**
    * constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Called when the setting slides to the specified position.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollTo(value: {
-    xOffset: number | string,yOffset: number | string,animation?: {duration: number,curve: Curve } });
+    xOffset: number | string;
+    yOffset: number | string;
+    animation?: { duration: number; curve: Curve };
+  });
 
   /**
    * Called when scrolling to the edge of the container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollEdge(value: Edge);
 
   /**
    * Called when page turning mode is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  scrollPage(value: {next: boolean,direction?: Axis });
+  scrollPage(value: { next: boolean; direction?: Axis });
 
   /**
    * Called when viewing the scroll offset.
-   * @devices phone, tablet, car.
    * @since 7
    */
   currentOffset();
 
   /**
    * Called when sliding to the specified index.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollToIndex(value: number);
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ScrollExtend<T> extends ScrollAttribute<T> {
-}
-
 /**
  * Provides interfaces for scrollable containers.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Scroll extends ScrollAttribute<Scroll> {
   /**
    * Called when a scrollable container is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (scroller?: Scroller): Scroll;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ScrollAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the scroll method is slid.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollable(value: ScrollDirection): T;
 
   /**
    * Called when the setting slides to the specified position.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  onScroll(event: (xOffset: number,yOffset: number) => void): T;
+  onScroll(event: (xOffset: number, yOffset: number) => void): T;
 
   /**
    * Called when scrolling to the edge of the container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScrollEdge(event: (side: Edge) => void): T;
 
   /**
    * Called when scrolling has stopped.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onScrollEnd(event: () => void): T;
 
   /**
    * Called when the status of the scroll bar is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBar(barState: BarState): T;
 
   /**
    * Called when the color of the scroll bar is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBarColor(color: Color | number | string): T;
 
   /**
    * Called when the width of the scroll bar is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollBarWidth(value: number | string): T;
 
   /**
    * Called when the sliding effect is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   edgeEffect(edgeEffect: EdgeEffect): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class ScrollExtend<T> extends ScrollAttribute<T> {}
 export declare const ScrollInterface: Scroll;
diff --git a/api/@internal/component/ets/search.d.ts b/api/@internal/component/ets/search.d.ts
index c46db2a63779a5f3659308523a75337340913fa2..f7b61d722d28ac02f5d205732ca335a4ff51f662 100644
--- a/api/@internal/component/ets/search.d.ts
+++ b/api/@internal/component/ets/search.d.ts
@@ -1,34 +1,39 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color, Resource} from "./common";
-import {TextAlign, FontWeight, FontStyle} from "./text";
-
-export declare class SearchExtend<T> extends SearchAttribute<T> {
-}
-
-interface Search extends SearchAttribute<Search> {
-  (options?: {value?: string, placeholder?: string, icon?: string}): Search;
-}
-
-declare class SearchAttribute<T> extends CommonMethod<T> {
-  searchButton(value: string): T;
-  placeholderColor(value: Color | number | string | Resource): T;
-  placeholderFont(value: {size: number, weight: FontWeight, family: string, style: FontStyle}): T;
-  onSubmit(callback:(value: string) => void): T;
-  onChange(callback:(value: string) => void): T;
-}
-
-export declare const SearchInterface: Search
\ No newline at end of file
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { FontStyle, FontWeight } from "./enums";
+import { ResourceColor } from "./units";
+
+/**
+ * @since 8
+ */
+interface Search extends SearchAttribute<Search> {
+  (options?: { value?: string; placeholder?: string; icon?: string }): Search;
+}
+
+/**
+ * @since 8
+ */
+declare class SearchAttribute<T> extends CommonMethod<T> {
+  searchButton(value: string): T;
+  placeholderColor(value: ResourceColor): T;
+  placeholderFont(value: { size: number; weight: FontWeight; family: string; style: FontStyle }): T;
+  onSubmit(callback: (value: string) => void): T;
+  onChange(callback: (value: string) => void): T;
+}
+
+export declare class SearchExtend<T> extends SearchAttribute<T> {}
+export declare const SearchInterface: Search;
diff --git a/api/@internal/component/ets/shape.d.ts b/api/@internal/component/ets/shape.d.ts
index e14d5f2a0d2f5a7cd6a661571702548d33fa9f82..31aa027c61c48340dbad9bb2e982a9c9fc903356 100644
--- a/api/@internal/component/ets/shape.d.ts
+++ b/api/@internal/component/ets/shape.d.ts
@@ -13,121 +13,98 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, LineCapStyle, LineJoinStyle, Resource, PixelMap} from "./common";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ShapeExtend<T> extends ShapeAttribute<T> {
-}
+import { CommonMethod, PixelMap } from "./common";
+import { LineCapStyle, LineJoinStyle } from "./enums";
+import { Resource, ResourceColor } from "./units";
 
 /**
  * Provides interfaces for drawing components.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Shape extends ShapeAttribute<Shape> {
   /**
    * Called when a component is drawn.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (value?: PixelMap): Shape;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class ShapeAttribute<T> extends CommonMethod<T> {
   /**
    * Viewport of shape
-   * @devices phone, tablet, car.
    * @since 7
    */
-  viewPort(value: { x?: number | string, y?: number | string, width?: number | string, height?: number | string }): T;
+  viewPort(value: { x?: number | string; y?: number | string; width?: number | string; height?: number | string }): T;
 
   /**
    * Called when the border color is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  stroke(value: Color | number | string | Resource): T;
+  stroke(value: ResourceColor): T;
 
   /**
    * Called when the fill color is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fill(value: Color | number | string | Resource): T;
+  fill(value: ResourceColor): T;
 
   /**
    * Called when the offset of the starting point of border drawing is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeDashOffset(value: number | string): T;
 
   /**
    * Called when the gap of the border is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeDashArray(value: Array<any>): T;
 
   /**
    * Called when the path endpoint drawing style is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeLineCap(value: LineCapStyle): T;
 
   /**
    * Called when the border corner drawing style is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeLineJoin(value: LineJoinStyle): T;
 
   /**
    * Called when the limit value for drawing acute angles as oblique angles is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeMiterLimit(value: number | string): T;
 
   /**
    * Called when the opacity of the border is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeOpacity(value: number | string | Resource): T;
 
   /**
    * Called when the transparency of the border is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fillOpacity(value: number | string | Resource): T;
 
   /**
    * Called when the width of the border is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   strokeWidth(value: number | string): T;
 
   /**
    * Called when setting whether anti aliasing is on.
-   * @devices phone, tablet, car.
    * @since 7
    */
   antiAlias(value: boolean): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class ShapeExtend<T> extends ShapeAttribute<T> {}
 export declare const ShapeInterface: Shape;
diff --git a/api/@internal/component/ets/slider.d.ts b/api/@internal/component/ets/slider.d.ts
index 93d0e50c6acfa0c395bb3c26574ee29291b0ac4f..90a2f75e9eeda4d12add7a34202bf4d0bad7657b 100644
--- a/api/@internal/component/ets/slider.d.ts
+++ b/api/@internal/component/ets/slider.d.ts
@@ -1,155 +1,130 @@
-/*
- * Copyright (c) 2021 Huawei Device Co., Ltd.
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import {CommonMethod, Color, Resource} from "./common";
-
-/**
- * Declare sliderstyle
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum SliderStyle {
-  /**
-   * The slider is on the slide rail.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  OutSet = 0,
-
-  /**
-   * The slider is in the slide rail.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  InSet,
-}
-
-/**
- * Declare SliderChangeMode
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum SliderChangeMode {
-  /**
-   * Start dragging the slider.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Begin = 0,
-
-  /**
-   * Drag the slider.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Moving,
-
-  /**
-   * End dragging the slider.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  End,
-}
-
-/**
- * Declare SliderChangeMode.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class SliderExtend<T> extends SliderAttribute<T> {
-}
-
-/**
- * Provides an interface for the slide bar component.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Slider extends SliderAttribute<Slider> {
-  /**
-   * Called when the slider bar component is used.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options?: {value?: number,min?: number,max?: number,step?: number,style?: SliderStyle}): Slider;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class SliderAttribute<T> extends CommonMethod<T> {
-  /**
-   * Called when the slider color of the slider bar is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  blockColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when the track color of the slider is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  trackColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when the slider of the slider bar is set to slide over the area color.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  selectedColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when the minimum label is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  minLabel(value: string): T;
-
-  /**
-   * Called when the maximum label is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  maxLabel(value: string): T;
-
-  /**
-   * Called when setting whether to display step size.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  showSteps(value: boolean): T;
-
-  /**
-   * Called when the percentage of bubble prompt is set when sliding.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  showTips(value: boolean): T;
-
-  /**
-   * Called when the selection value changes.
-   * @devices phone, tablet, car
-   * @since 7
-   */
-  onChange(callback:(value: number, mode: SliderChangeMode) => void): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const SliderInterface: Slider;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
+
+/**
+ * Declare sliderstyle
+ * @since 7
+ */
+export declare enum SliderStyle {
+  /**
+   * The slider is on the slide rail.
+   * @since 7
+   */
+  OutSet = 0,
+
+  /**
+   * The slider is in the slide rail.
+   * @since 7
+   */
+  InSet,
+}
+
+/**
+ * Declare SliderChangeMode
+ * @since 7
+ */
+export declare enum SliderChangeMode {
+  /**
+   * Start dragging the slider.
+   * @since 7
+   */
+  Begin = 0,
+
+  /**
+   * Drag the slider.
+   * @since 7
+   */
+  Moving,
+
+  /**
+   * End dragging the slider.
+   * @since 7
+   */
+  End,
+}
+
+/**
+ * Provides an interface for the slide bar component.
+ * @since 7
+ */
+interface Slider extends SliderAttribute<Slider> {
+  /**
+   * Called when the slider bar component is used.
+   * @since 7
+   */
+  (options?: { value?: number; min?: number; max?: number; step?: number; style?: SliderStyle }): Slider;
+}
+
+/**
+ * @since 7
+ */
+declare class SliderAttribute<T> extends CommonMethod<T> {
+  /**
+   * Called when the slider color of the slider bar is set.
+   * @since 7
+   */
+  blockColor(value: ResourceColor): T;
+
+  /**
+   * Called when the track color of the slider is set.
+   * @since 7
+   */
+  trackColor(value: ResourceColor): T;
+
+  /**
+   * Called when the slider of the slider bar is set to slide over the area color.
+   * @since 7
+   */
+  selectedColor(value: ResourceColor): T;
+
+  /**
+   * Called when the minimum label is set.
+   * @since 7
+   */
+  minLabel(value: string): T;
+
+  /**
+   * Called when the maximum label is set.
+   * @since 7
+   */
+  maxLabel(value: string): T;
+
+  /**
+   * Called when setting whether to display step size.
+   * @devices phone, tablet, car
+   * @since 7
+   */
+  showSteps(value: boolean): T;
+
+  /**
+   * Called when the percentage of bubble prompt is set when sliding.
+   * @devices phone, tablet, car
+   * @since 7
+   */
+  showTips(value: boolean): T;
+
+  /**
+   * Called when the selection value changes.
+   * @devices phone, tablet, car
+   * @since 7
+   */
+  onChange(callback: (value: number, mode: SliderChangeMode) => void): T;
+}
+
+export declare class SliderExtend<T> extends SliderAttribute<T> {}
+export declare const SliderInterface: Slider;
diff --git a/api/@internal/component/ets/span.d.ts b/api/@internal/component/ets/span.d.ts
index 811947689ce1a6a3fd6940f79703a1b1b7cc71b4..913d6d9eecec4ea7f935f4e1c7738b65b62ed556 100644
--- a/api/@internal/component/ets/span.d.ts
+++ b/api/@internal/component/ets/span.d.ts
@@ -13,94 +13,73 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
-import {FontStyle, FontWeight, TextDecorationType, TextCase} from "./text";
-
-/**
- * Declaration extension.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class SpanExtend<T> extends SpanAttribute<T> {
-}
+import { CommonMethod } from "./common";
+import { FontStyle, FontWeight, TextDecorationType, TextCase } from "./enums";
+import { Resource, ResourceColor } from "./units";
 
 /**
  * Provide text decoration.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Span extends SpanAttribute<Span> {
   /**
    * Called when text is entered in span.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (value: string | Resource): Span;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class SpanAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the font color is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fontColor(value: Color | number | string | Resource): T;
+  fontColor(value: ResourceColor): T;
 
   /**
    * Called when the font size is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontSize(value: number | string | Resource): T;
 
   /**
    * Called when the font style of a font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontStyle(value: FontStyle): T;
 
   /**
    * Called when the font weight is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontWeight(value: number | FontWeight | string): T;
 
   /**
    * Called when the font list of text is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontFamily(value: string | Resource): T;
 
   /**
    * Called when the text decoration of the text is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  decoration(value: { type: TextDecorationType, color?: Color | number | string | Resource}): T;
+  decoration(value: { type: TextDecorationType; color?: ResourceColor }): T;
 
   /**
    * Called when the distance between text fonts is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   letterSpacing(value: number | string): T;
 
   /**
    * Called when the type of letter in the text font is set.
-   * @devices phone, tablet, car.
    */
   textCase(value: TextCase): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class SpanExtend<T> extends SpanAttribute<T> {}
 export declare const SpanInterface: Span;
diff --git a/api/@internal/component/ets/stack.d.ts b/api/@internal/component/ets/stack.d.ts
index fece13d32087aca68719eebb0dacbf053694f3c8..6fba06254edcb880739f61f696103c458c04076d 100644
--- a/api/@internal/component/ets/stack.d.ts
+++ b/api/@internal/component/ets/stack.d.ts
@@ -13,45 +13,31 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Alignment} from "./common";
-
-/**
- * Declaration extension.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class StackExtend<T> extends StackAttribute<T> {
-}
+import { CommonMethod } from "./common";
+import { Alignment } from "./enums";
 
 /**
  * Provides ports for stacking containers.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Stack extends StackAttribute<Stack> {
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (value?: { alignContent?: Alignment }): Stack;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class StackAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the occupancy of items in the container is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   alignContent(value: Alignment): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class StackExtend<T> extends StackAttribute<T> {}
 export declare const StackInterface: Stack;
diff --git a/api/@internal/component/ets/stateManagement.d.ts b/api/@internal/component/ets/stateManagement.d.ts
index a9f67212db5f187ff4fa8b56dcc76c6403d05599..4adc2f02fc27a8b1d6a6e8bdefcdc2a628f94d1f 100644
--- a/api/@internal/component/ets/stateManagement.d.ts
+++ b/api/@internal/component/ets/stateManagement.d.ts
@@ -15,561 +15,490 @@
 
 /**
  * Provides an interface for attribute subscribers.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface IPropertySubscriber {
   /**
    * Called when the ID of the property subscriber is queried.
-   * @devices phone, tablet, car.
    * @since 7
    */
   id(): number;
 
   /**
    * Provides a single attribute change user interface.
-   * @devices phone, tablet, car.
    * @since 7
    */
   aboutToBeDeleted(owningView?: IPropertySubscriber): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface ISinglePropertyChangeSubscriber<T> extends IPropertySubscriber {
   /**
    * Provides a single attribute change user interface.
-   * @devices phone, tablet, car.
    * @since 7
    */
   hasChanged(newValue: T): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare abstract class SubscribedAbstractProperty<T> {
   /**
    * Setting Subscribers.
-   * @devices phone, tablet, car.
    * @since 7
    */
   protected subscribers_: Set<number>;
 
   /**
    * Private user ID.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private id_;
 
   /**
    * Private user information.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private info_?;
 
   /**
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor(
-
-  /**
-   * Subscriber Information.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-    subscribeMe?: IPropertySubscriber, info?: string);
+    /**
+     * Subscriber Information.
+     * @since 7
+     */
+    subscribeMe?: IPropertySubscriber,
+    info?: string,
+  );
 
   /**
    * Called when the subscriber ID is entered.
-   * @devices phone, tablet, car.
    * @since 7
    */
   id(): number;
 
   /**
    * Called when a subscriber information description is entered.
-   * @devices phone, tablet, car.
    * @since 7
    */
   info(): string;
 
   /**
    * Called when data is obtained.
-   * @devices phone, tablet, car.
    * @since 7
    */
   abstract get(): T;
 
   /**
    * Called when data is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
   abstract set(newValue: T): void;
 
   /**
    * Called when a two-way synchronization is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
   createTwoWaySync(subscribeMe?: IPropertySubscriber, info?: string): SyncedPropertyTwoWay<T>;
 
   /**
    * Called when a one-way synchronization is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
   createOneWaySync(subscribeMe?: IPropertySubscriber, info?: string): SyncedPropertyOneWay<T>;
 
   /**
    * Called when the subscriber is unlinked.
-   * @devices phone, tablet, car.
    * @since 7
    */
   unlinkSuscriber(subscriberId: number): void;
 
   /**
    * Called when the notification has changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   protected notifyHasChanged(newValue: T): void;
 
   /**
    * Called when the notification property is read.
-   * @devices phone, tablet, car.
    * @since 7
    */
   protected notifyPropertyRead(): void;
 
   /**
    * Called when the number of users is queried.
-   * @devices phone, tablet, car.
    * @since 7
    */
   numberOfSubscrbers(): number;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-declare class SyncedPropertyTwoWay<T> extends SubscribedAbstractProperty<T> implements ISinglePropertyChangeSubscriber<T> {
+declare class SyncedPropertyTwoWay<T>
+  extends SubscribedAbstractProperty<T>
+  implements ISinglePropertyChangeSubscriber<T>
+{
   /**
    * Sources of synchronization attributes bidirectionally.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private source_;
 
   /**
    * constructor parameters.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor(source: SubscribedAbstractProperty<T>, subscribeMe?: IPropertySubscriber, info?: string);
 
   /**
    * Called when processing information about to be deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   aboutToBeDeleted(unsubscribeMe?: IPropertySubscriber): void;
 
   /**
    * Information Changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   hasChanged(newValue: T): void;
 
   /**
    * Called when data is obtained.
-   * @devices phone, tablet, car.
    * @since 7
    */
   get(): T;
 
   /**
    * Called when data is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
   set(newValue: T): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-declare class SyncedPropertyOneWay<T> extends SubscribedAbstractProperty<T> implements ISinglePropertyChangeSubscriber<T> {
+declare class SyncedPropertyOneWay<T>
+  extends SubscribedAbstractProperty<T>
+  implements ISinglePropertyChangeSubscriber<T>
+{
   /**
    * Pack value for single-item binding.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private wrappedValue_;
 
   /**
    * Sources of synchronization attributes bidirectionally.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private source_;
 
   /**
    * Constructor parameters.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor(source: SubscribedAbstractProperty<T>, subscribeMe?: IPropertySubscriber, info?: string);
 
   /**
    * Called when processing information about to be deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   aboutToBeDeleted(unsubscribeMe?: IPropertySubscriber): void;
 
   /**
    * Information Changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   hasChanged(newValue: T): void;
 
   /**
    * Called when data is obtained.
-   * @devices phone, tablet, car.
    * @since 7
    */
   get(): T;
 
   /**
    * Called when data is created.
-   * @devices phone, tablet, car.
    * @since 7
    */
   set(newValue: T): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class AppStorage {
   /**
    * Called when a link is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Link<T>(propName: string): any;
 
   /**
    * Called when a hyperlink is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static SetAndLink<T>(propName: string, defaultValue: T): SubscribedAbstractProperty<T>;
 
   /**
    * Called when a property is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Prop<S>(propName: string): any;
 
   /**
    * Called when dynamic properties are set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static SetAndProp<S>(propName: string, defaultValue: S): SubscribedAbstractProperty<S>;
 
   /**
    * Called when owning or not.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Has(propName: string): boolean;
 
   /**
    * Called when data is obtained.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Get<T>(propName: string): T | undefined;
 
   /**
    * Called when setting.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Set<T>(propName: string, newValue: T): boolean;
 
   /**
    * Called when setting or creating.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static SetOrCreate<T>(propName: string, newValue: T): void;
 
   /**
    * Called when a deletion is made.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Delete(propName: string): boolean;
 
   /**
    * Called when a dictionary is sorted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Keys(): IterableIterator<string>;
 
   /**
    * Called when a cleanup occurs.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static staticClear(): boolean;
 
   /**
    * Called when the data can be changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static IsMutable(propName: string): boolean;
 
   /**
    * Called when you check how much data is stored.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Size(): number;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class Environment {
   /**
    * Constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Called when a property value is checked.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static EnvProp<S>(key: string, value: S): boolean;
 
   /**
    * Called when multiple property values are checked.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  static EnvProps(props: {
-    key: string;
-    defaultValue: any;
-  }[]): void;
+  static EnvProps(
+    props: {
+      key: string;
+      defaultValue: any;
+    }[],
+  ): void;
 
   /**
    * Set the key value.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Keys(): Array<string>;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum ColorMode {
   /**
    * Bright color.
-   * @devices phone, tablet, car.
    * @since 7
    */
   LIGHT = 0,
 
   /**
    * Dark.
-   * @devices phone, tablet, car.
    * @since 7
    */
   DARK,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum LayoutDirection {
   /**
    * Elements are laid out from left to right.
-   * @devices phone, tablet, car.
    * @since 7
    */
   LTR = 0,
 
   /**
    * Elements are laid out from right to left.
-   * @devices phone, tablet, car.
    * @since 7
    */
   RTL,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class PersistentStorage {
   /**
    * Constructor parameters.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor(appStorage: AppStorage, storage: Storage);
 
   /**
    * Called when a persistence property is stored.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static PersistProp<T>(key: string, defaultValue: T): void;
 
   /**
    * Called when a property is deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static DeleteProp(key: string): void;
 
   /**
    * Called when multiple persistence properties are stored.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  static PersistProps(properties: {
+  static PersistProps(
+    properties: {
       key: string;
       defaultValue: any;
-  }[]): void;
+    }[],
+  ): void;
 
   /**
    * Set the key value.
-   * @devices phone, tablet, car.
    * @since 7
    */
   static Keys(): Array<string>;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class Storage {
   /**
    * Constructor parameters.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  constructor(
-    needCrossThread?: boolean, file?: string);
+  constructor(needCrossThread?: boolean, file?: string);
 
   /**
    * Called when data is obtained.
-   * @devices phone, tablet, car.
    * @since 7
    */
   get(key: string): string | undefined;
 
   /**
    * Called when setting.
-   * @devices phone, tablet, car.
    * @since 7
    */
   set(key: string, val: any): void;
 
   /**
    * Called when data is cleared.
-   * @devices phone, tablet, car.
    * @since 7
    */
   clear(): void;
 
   /**
    * Called when data is deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   delete(key: string): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare abstract class SubscribaleAbstract {
   /**
    * Returns the ownership attribute set by the.
-   * @devices phone, tablet, car.
    * @since 7
    */
   private owningProperties_: Set<number>;
 
   /**
    * Constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Called when the notification property has changed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   protected notifyPropertyHasChanged(propName: string, newValue: any): void;
 
   /**
    * Called when adding an already owned property.
-   * @devices phone, tablet, car.
    * @since 7
    */
   public addOwningProperty(subscriber: IPropertySubscriber): void;
 
   /**
    * Called when an already owned property is deleted.
-   * @devices phone, tablet, car.
    * @since 7
    */
   public removeOwningProperty(property: IPropertySubscriber): void;
 
   /**
    * Called when an already owned property is deleted by ID
-   * @devices phone, tablet, car.
    * @since 7
    */
   public removeOwningPropertyById(subscriberId: number): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const appStorage: AppStorage;
diff --git a/api/@internal/component/ets/swiper.d.ts b/api/@internal/component/ets/swiper.d.ts
index c65a8ff1fc16ffef58af7a111766b5ef166fce5c..b2b91252fb579ea5e10ed015b84c2c6dea0871bf 100644
--- a/api/@internal/component/ets/swiper.d.ts
+++ b/api/@internal/component/ets/swiper.d.ts
@@ -13,31 +13,27 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
  * Provides methods for switching components.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class SwiperController {
   /**
    * constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Called when the next child component is displayed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   showNext();
 
   /**
    * Called when the previous subcomponent is displayed.
-   * @devices phone, tablet, car.
    * @since 7
    */
   showPrevious();
@@ -45,125 +41,98 @@ export declare class SwiperController {
 
 /**
  * Declare the size of the swiper on the spindle.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum SwiperDisplayMode {
   /**
    * Carousel map extension.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Stretch,
 
   /**
    * The rotation chart is self linear.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  AutoLinear
-}
-
-/**
- * Declaration extension.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class SwiperExtend<T> extends SwiperAttribute<T> {
+  AutoLinear,
 }
 
 /**
  * Provides an interface for sliding containers.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Swiper extends SwiperAttribute<Swiper> {
   /**
    * Called when a sliding container is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (controller?: SwiperController): Swiper;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class SwiperAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the index value of the displayed subcomponent is set in the container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   index(value: number): T;
 
   /**
    * Called when setting whether the subcomponent plays automatically.
-   * @devices phone, tablet, car.
    * @since 7
    */
   autoPlay(value: boolean): T;
 
   /**
    * Called when the time interval for automatic playback is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   interval(value: number): T;
 
   /**
    * Called when you set whether the navigation point indicator is enabled.
-   * @devices phone, tablet, car.
    * @since 7
    */
   indicator(value: boolean): T;
 
   /**
    * Called when setting whether to turn on cyclic sliding.
-   * @devices phone, tablet, car.
    * @since 7
    */
   loop(value: boolean): T;
 
   /**
    * Called when the animation duration of the switch is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   duration(value: number): T;
 
   /**
    * Called when setting whether to slide vertically.
-   * @devices phone, tablet, car.
    * @since 7
    */
   vertical(value: boolean): T;
 
   /**
    * Called when the size of the rotation chart is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   itemSpace(value: number | string): T;
 
   /**
    * Called when setting the size of the swiper container on the spindle.
-   * @devices phone, tablet, car.
    * @since 7
    */
   displayMode(value: SwiperDisplayMode): T;
 
   /**
    * Called when the index value changes.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onChange(event: (index: number) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class SwiperExtend<T> extends SwiperAttribute<T> {}
 export declare const SwiperInterface: Swiper;
diff --git a/api/@internal/component/ets/tab_content.d.ts b/api/@internal/component/ets/tab_content.d.ts
index a19bf4867b7d53d9f923da8a3875188f5e01d3a2..e51a01dbf11bcb6457874d1a3108d8b751a85614 100644
--- a/api/@internal/component/ets/tab_content.d.ts
+++ b/api/@internal/component/ets/tab_content.d.ts
@@ -13,45 +13,40 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { Resource } from "./units";
 
 /**
  * Declaration extension.
  * @devices tv, phone, tablet
  * @since 7
  */
-export declare class TabContentExtend<T> extends TabContentAttribute<T> {
-}
+export declare class TabContentExtend<T> extends TabContentAttribute<T> {}
 
 /**
  * Provides an interface for switching the content view on a tab page.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface TabContent extends TabContentAttribute<TabContent> {
   /**
    * Called when the content view of the switch tab is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (): TabContent;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class TabContentAttribute<T> extends CommonMethod<T> {
   /**
    * Called when tabbar is entered.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  tabBar(value: string | Resource | { icon?: string | Resource, text?: string | Resource }): T;
+  tabBar(value: string | Resource | { icon?: string | Resource; text?: string | Resource }): T;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const TabContentInterface: TabContent;
diff --git a/api/@internal/component/ets/tabs.d.ts b/api/@internal/component/ets/tabs.d.ts
index e8cbc7660f0a83f5c6ef3390345bae8b43d609d6..2e22c4b29be5b47089e37fc59e6d8e8ac6369e06 100644
--- a/api/@internal/component/ets/tabs.d.ts
+++ b/api/@internal/component/ets/tabs.d.ts
@@ -13,148 +13,126 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
 
 /**
  * Declare the graphic format of the bar chart.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum BarMode {
   /**
    * The actual layout width of the TabBar is used. If the width exceeds the total width, you can slide the tabbar.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Scrollable,
 
   /**
    * The width of all TabBars is evenly allocated.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  Fixed
+  Fixed,
 }
 
 /**
  * Declare the location of the bar chart.
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare enum BarPosition {
   /**
    * When the vertical attribute method is set to true, the tab is on the left of the container. When the vertical property method is set to false, the tab is at the top of the container.
-   * @devices phone, tablet, car.
    * @since 7
    */
   Start,
 
   /**
    * When the vertical attribute method is set to true, the tab is located on the right of the container. When the vertical property method is set to false, the tab is at the bottom of the container.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  End
+  End,
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare class TabsController {
   /**
    * constructor.
-   * @devices phone, tablet, car.
    * @since 7
    */
   constructor();
 
   /**
    * Called when the tab is switched.
-   * @devices phone, tablet, car.
    * @since 7
    */
   changeIndex(value: number): void;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare class TabsExtend<T> extends TabsAttribute<T> {
-}
+export declare class TabsExtend<T> extends TabsAttribute<T> {}
 
 /**
  * Provides an interface for switching views.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Tabs extends TabsAttribute<Tabs> {
   /**
    * Called when the view is switched.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  (value?: { barPosition?: BarPosition, index?: number, controller?: TabsController }): Tabs;
+  (value?: { barPosition?: BarPosition; index?: number; controller?: TabsController }): Tabs;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class TabsAttribute<T> extends CommonMethod<T> {
   /**
    * Called when determining whether the tab is vertical.
-   * @devices phone, tablet, car.
    * @since 7
    */
   vertical(value: boolean): T;
 
   /**
    * Called when judging whether page switching can be performed by sliding left and right.
-   * @devices phone, tablet, car.
    * @since 7
    */
   scrollable(value: boolean): T;
 
   /**
    * Called when the graphic format of the bar chart is selected.
-   * @devices phone, tablet, car.
    * @since 7
    */
   barMode(value: BarMode): T;
 
   /**
    * Called when the width of the bar graph is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   barWidth(value: number): T;
 
   /**
    * Called when the height of the bar graph is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   barHeight(value: number): T;
 
   /**
    * Called when the animation duration of the bar graph is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   animationDuration(value: number): T;
 
   /**
    * Called when the tab is switched.
-   * @devices phone, tablet, car.
    * @since 7
    */
   onChange(event: (index: number) => void): T;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const TabsInterface: Tabs;
diff --git a/api/@internal/component/ets/text.d.ts b/api/@internal/component/ets/text.d.ts
index cf01bff54a44e7c9c0a753b459a0bd6f1a7c4c94..3783a00dbd06239d37fd3335958cde71f7a6e5c5 100644
--- a/api/@internal/component/ets/text.d.ts
+++ b/api/@internal/component/ets/text.d.ts
@@ -13,332 +13,123 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { FontStyle, FontWeight, TextAlign, TextCase, TextDecorationType, TextOverflow } from "./enums";
+import { Resource, ResourceColor } from "./units";
 
 /**
- * Text style
- * @devices phone, tablet, car.
  * @since 7
  */
-export declare enum FontStyle {
-  /**
-   * Default style.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Normal,
-
-  /**
-   * Italic style.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Italic
-}
-
-/**
- * The font weight of the text
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum FontWeight {
-  /**
-   * Defines a lighter value than [Inherited Value]..
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Lighter,
-
-  /**
-   * Normal font. Equivalent to a digital value of 400.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Normal,
-
-  /**
-   * Defines a more general value than [Inherited Value].
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Regular,
-
-  /**
-   * Defines a value that is more centered than [Inherited Value].
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Medium,
-
-  /**
-   * Bold. Equivalent to a numeric value of 700.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Bold,
-
-  /**
-   * Defines a value that is heavier than [Inherited Value].
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Bolder
-}
-
-/**
- * Alignment of text.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum TextAlign {
-  /**
-   * Center the text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Center,
-
-  /**
-   * The text is aligned in the same direction as the writing
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Start,
-
-  /**
-   * The text is aligned in the opposite direction of writing
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  End
-}
-
-/**
- * Declare how text overflows.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum TextOverflow {
-  /**
-   * When the text is too long, it will be cropped and displayed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-
-  Clip,
-  /**
-   * If the text is too long, the text that cannot be displayed shall be replaced by ellipsis.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-
-  Ellipsis,
-
-  /**
-   * Text is not cropped when it is too long.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  None
-}
-
-/**
- * Type of text modifier.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum TextDecorationType {
-  /**
-   * Do not use text decorative lines.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  None,
-
-  /**
-   * Underline the words.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Underline,
-
-  /**
-   * Text is in all uppercase.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Overline,
-
-  /**
-   * A modifier line that passes through the text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LineThrough
-}
-
-/**
- * Letter type in text
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum TextCase {
-  /**
-   * The default is normal.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Normal,
-
-  /**
-   * The text is all lowercase.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  LowerCase,
-
-  /**
-   * Text is in all uppercase.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  UpperCase
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class TextExtend<T> extends TextAttribute<T> {
-}
+export declare class TextExtend<T> extends TextAttribute<T> {}
 
 /**
  * Provides an interface for writing texts.
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Text extends TextAttribute<Text> {
   /**
    * Called when writing text.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (content?: string | Resource): Text;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class TextAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the font color is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  fontColor(value: Color | number | string | Resource): T;
+  fontColor(value: ResourceColor): T;
 
   /**
    * Called when the font size is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontSize(value: number | string | Resource): T;
 
   /**
    * Called when the minimum font size of the font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   minFontSize(value: number | string | Resource): T;
 
   /**
    * Called when the maximum font size of the font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   maxFontSize(value: number | string | Resource): T;
 
   /**
    * Called when the font style of a font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontStyle(value: FontStyle): T;
 
   /**
    * Called when the font weight is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontWeight(value: number | FontWeight | string): T;
 
   /**
    * Called when the horizontal center mode of the font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   textAlign(value: TextAlign): T;
 
   /**
    * Called when the vertical center mode of the font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   lineHeight(value: number | string | Resource): T;
 
   /**
    * Called when the overflow mode of the font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   textOverflow(value: { overflow: TextOverflow }): T;
 
   /**
    * Called when the font list of text is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   fontFamily(value: string | Resource): T;
 
   /**
    * Called when the maximum number of lines of text is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   maxLines(value: number): T;
 
   /**
    * Called when the text decoration of the text is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
-  decoration(value: { type: TextDecorationType, color?: Color | number | string | Resource }): T;
+  decoration(value: { type: TextDecorationType; color?: ResourceColor }): T;
 
   /**
    * Called when the distance between text fonts is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   letterSpacing(value: number | string): T;
 
   /**
    * Called when the type of letter in the text font is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   textCase(value: TextCase): T;
 
   /**
    * Called when the baseline offset is set.
-   * @devices phone, tablet, car.
    * @since 7
    */
   baselineOffset(value: number | string): T;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 export declare const TextInterface: Text;
diff --git a/api/@internal/component/ets/camera.d.ts b/api/@internal/component/ets/text_area.d.ts
similarity index 34%
rename from api/@internal/component/ets/camera.d.ts
rename to api/@internal/component/ets/text_area.d.ts
index c79171e21ba7f3afd3ab5e3c7dc05730e099bd61..10a7190d0905a0aace84e732ae1140b42f23440f 100644
--- a/api/@internal/component/ets/camera.d.ts
+++ b/api/@internal/component/ets/text_area.d.ts
@@ -13,67 +13,62 @@
  * limitations under the License.
  */
 
-import {CommonMethod} from "./common";
+import { CommonMethod } from "./common";
+import { TextAlign, FontWeight, FontStyle } from "./enums";
+import { Resource, ResourceColor } from "./units";
 
 /**
- * Camera component, which provides the preview and photographing functions.
- * @devices phone, tablet, car.
- * @since 7
+ * Provides an interface for the multi-line text input component.
+ * @since 8
  */
-export declare enum DevicePosition {
+interface TextArea extends TextAreaAttribute<TextArea> {
   /**
-   * Front camera
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Front,
-
-  /**
-   * Back camera
-   * @devices phone, tablet, car.
-   * @since 7
+   * Called when writing multiple lines of text.
+   * @since 8
    */
-  Back
+  (options?: { placeholder: string | Resource; text: string | Resource }): TextArea;
 }
 
 /**
- * Camera component, which provides the preview and photographing functions.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
-export declare class CameraExtend<T> extends CameraAttribute<T> {
-}
+declare class TextAreaAttribute<T> extends CommonMethod<T> {
+  /**
+   * Called when the color of the placeholder is set.
+   * @since 8
+   */
+  placeholderColor(value: ResourceColor): T;
 
-/**
- * resolution Width, resolution Height
- * @devices phone, tablet, car.
- * @since 7
- */
-interface Camera extends CameraAttribute<Camera> {
   /**
-   * Set the value.
-   * @devices phone, tablet, car.
-   * @since 7
+   * Called when the font property of the placeholder is set.
+   * @since 8
    */
-  (value: { id: string, resolutionWidth: number, resolutionHeight: number }): Camera;
-}
+  placeholderFont(value?: {
+    size?: number | string | Resource;
+    weight?: number | FontWeight | string;
+    family?: string | Resource;
+    style?: FontStyle;
+  }): T;
+
+  /**
+   * Called when the alignment of the contents of a multiline text box is set.
+   * @since 8
+   */
+  textAlign(value: TextAlign): T;
 
-/**
- * set CameraAttribute
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class CameraAttribute<T> extends CommonMethod<T> {
   /**
-   * Set devicePosition value.
+   * Called when the insertion cursor color is set.
+   * @since 6
+   */
+  caretColor(value: ResourceColor): T;
+
+  /**
+   * Called when the input changes.
    * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  devicePosition(value: DevicePosition): T;
+  onChange(callback: (value: string) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const CameraInterface: Camera;
+export declare class TextAreaExtend<T> extends TextAreaAttribute<T> {}
+export declare const TextAreaInterface: TextArea;
diff --git a/api/@internal/component/ets/textinput.d.ts b/api/@internal/component/ets/text_input.d.ts
similarity index 43%
rename from api/@internal/component/ets/textinput.d.ts
rename to api/@internal/component/ets/text_input.d.ts
index a7e396e809cb90466abbc128bc8363a9bc777c36..34ebed9f27aa96b307eb732ddc38588c0d6d04ea 100644
--- a/api/@internal/component/ets/textinput.d.ts
+++ b/api/@internal/component/ets/text_input.d.ts
@@ -1,193 +1,164 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color, Resource} from "./common";
-import {FontWeight, FontStyle} from "./text";
-
-/**
- * Declare the type of input box
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum InputType {
-  /**
-   * Basic input mode.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Normal,
-
-  /**
-   * Password entry mode.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Number,
-
-  /**
-   * E-mail address input mode.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Email,
-
-  /**
-   * Pure digital input mode.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Password,
-}
-
-/**
- * Declare the type of soft keyboard.
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare enum EnterKeyType {
-  /**
-   * Go.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Go,
-
-  /**
-   * Search.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Search,
-
-  /**
-   * Send.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Send,
-
-  /**
-   * Next.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Next,
-
-  /**
-   * Done.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  Done,
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class TextInputExtend<T> extends TextInputAttribute<T> {
-}
-
-/**
- * Provides a single-line text input component interface.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface TextInput extends TextInputAttribute<TextInput> {
-  /**
-   * Called when writing a single line of text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options?: {
-      placeholder: string | Resource,
-      text: string | Resource,
-  }): TextInput;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class TextInputAttribute<T> extends CommonMethod<T> {
-  /**
-   * Called when the input type is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  type(value: InputType): T;
-
-  /**
-   * Called when the color of the placeholder is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  placeholderColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when the font property of the placeholder is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  placeholderFont(value?: { size?: number | string | Resource, weight?: number | FontWeight | string, family?: string | Resource, style?: FontStyle }): T;
-
-  /**
-   * Called when the type of soft keyboard input button is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  enterKeyType(value: EnterKeyType): T;
-
-  /**
-   * Called when the color of the insertion cursor is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  caretColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when judging whether the text editing has changed.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onEditChanged(callback: (isEditing: boolean) => void): T;
-
-  /**
-   * Called when submitted.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onSubmit(callback: (enterKey: EnterKeyType) => void): T;
-
-  /**
-   * Called when the input of the input box changes.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  onChange(callback: (value: string) => void): T;
-
-  /**
-   * Called when the input of maximum text length is set.
-   * @devices tv, phone, tablet, wearable, liteWearable, smartVision.
-   * @since 5
-   */
-  maxLength(value: number): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const TextInputInterface: TextInput;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+import { FontWeight, FontStyle } from "./enums";
+import { Resource, ResourceColor } from "./units";
+
+/**
+ * Declare the type of input box
+ * @since 8
+ */
+export declare enum InputType {
+  /**
+   * Basic input mode.
+   * @since 8
+   */
+  Normal,
+
+  /**
+   * Password entry mode.
+   * @since 8
+   */
+  Number,
+
+  /**
+   * E-mail address input mode.
+   * @since 8
+   */
+  Email,
+
+  /**
+   * Pure digital input mode.
+   * @since 8
+   */
+  Password,
+}
+
+/**
+ * Declare the type of soft keyboard.
+ * @since 8
+ */
+export declare enum EnterKeyType {
+  /**
+   * Go.
+   * @since 8
+   */
+  Go,
+
+  /**
+   * Search.
+   * @since 8
+   */
+  Search,
+
+  /**
+   * Send.
+   * @since 8
+   */
+  Send,
+
+  /**
+   * Next.
+   * @since 8
+   */
+  Next,
+
+  /**
+   * Done.
+   * @since 8
+   */
+  Done,
+}
+
+/**
+ * Provides a single-line text input component interface.
+ * @since 8
+ */
+interface TextInput extends TextInputAttribute<TextInput> {
+  /**
+   * Called when writing a single line of text.
+   * @since 8
+   */
+  (options?: { placeholder: string | Resource; text: string | Resource }): TextInput;
+}
+
+/**
+ * @since 8
+ */
+declare class TextInputAttribute<T> extends CommonMethod<T> {
+  /**
+   * Called when the input type is set.
+   * @since 8
+   */
+  type(value: InputType): T;
+
+  /**
+   * Called when the color of the placeholder is set.
+   * @since 8
+   */
+  placeholderColor(value: ResourceColor): T;
+
+  /**
+   * Called when the font property of the placeholder is set.
+   * @since 8
+   */
+  placeholderFont(value?: {
+    size?: number | string | Resource;
+    weight?: number | FontWeight | string;
+    family?: string | Resource;
+    style?: FontStyle;
+  }): T;
+
+  /**
+   * Called when the type of soft keyboard input button is set.
+   * @since 8
+   */
+  enterKeyType(value: EnterKeyType): T;
+
+  /**
+   * Called when the color of the insertion cursor is set.
+   * @since 8
+   */
+  caretColor(value: ResourceColor): T;
+
+  /**
+   * Called when judging whether the text editing has changed.
+   * @since 8
+   */
+  onEditChanged(callback: (isEditing: boolean) => void): T;
+
+  /**
+   * Called when submitted.
+   * @since 8
+   */
+  onSubmit(callback: (enterKey: EnterKeyType) => void): T;
+
+  /**
+   * Called when the input of the input box changes.
+   * @since 8
+   */
+  onChange(callback: (value: string) => void): T;
+
+  /**
+   * Called when the input of maximum text length is set.
+   * @devices tv, phone, tablet, wearable, liteWearable, smartVision.
+   * @since 5
+   */
+  maxLength(value: number): T;
+}
+
+export declare class TextInputExtend<T> extends TextInputAttribute<T> {}
+export declare const TextInputInterface: TextInput;
diff --git a/api/@internal/component/ets/textPicker.d.ts b/api/@internal/component/ets/text_picker.d.ts
similarity index 67%
rename from api/@internal/component/ets/textPicker.d.ts
rename to api/@internal/component/ets/text_picker.d.ts
index 3d26001661c2ce6818bab15c09d752eb8ce58bbe..542719fdd2ba9adcaed6418ed164c296eb8b22e2 100644
--- a/api/@internal/component/ets/textPicker.d.ts
+++ b/api/@internal/component/ets/text_picker.d.ts
@@ -13,93 +13,79 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { Resource } from "./units";
 
 /**
  * Declare the type of selector
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 export declare enum PickerStyle {
   /**
    * Inside the line.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   INLINE = 0,
 
   /**
    * Block-level elements.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   BLOCK,
 
   /**
    * fade.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   FADE,
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class TextPickerExtend<T> extends TextPickerAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface TextPicker extends TextPickerAttribute<TextPicker> {
   /**
    * Add the property of the selector value range.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  (options?: {range: string[] | Resource, value?: string, selected?: number, loop?: boolean , style?: PickerStyle}): TextPicker;
+  (options?: {
+    range: string[] | Resource;
+    value?: string;
+    selected?: number;
+    loop?: boolean;
+    style?: PickerStyle;
+  }): TextPicker;
 }
 
 /**
  * Style the text selector.
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 declare class TextPickerAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the default height of the selected element is set.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   defaultPickerItemHeight(value: number): T;
 
   /**
    * Called when the pop-up value is returned.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onAccept(callback: (value: string, index: number) => void): T;
 
   /**
    * Called when the Cancel button in the pop-up window is clicked.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onCancel(callback: () => void): T;
 
   /**
    * Called when the OK button in the pop-up window is clicked.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   onChange(callback: (value: string, index: number) => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class TextPickerExtend<T> extends TextPickerAttribute<T> {}
 export declare const TextPickerInterface: TextPicker;
diff --git a/api/@internal/component/ets/textarea.d.ts b/api/@internal/component/ets/textarea.d.ts
deleted file mode 100644
index c9882b4dd7fc7a407c7d8b964caf178d30a98fe9..0000000000000000000000000000000000000000
--- a/api/@internal/component/ets/textarea.d.ts
+++ /dev/null
@@ -1,85 +0,0 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod, Color, Resource} from "./common";
-import {TextAlign, FontWeight, FontStyle} from "./text";
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class TextAreaExtend<T> extends TextAreaAttribute<T> {
-}
-
-/**
- * Provides an interface for the multi-line text input component.
- * @devices phone, tablet, car.
- * @since 7
- */
-interface TextArea extends TextAreaAttribute<TextArea> {
-  /**
-   * Called when writing multiple lines of text.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  (options?: {placeholder: string | Resource, text: string | Resource}): TextArea;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-declare class TextAreaAttribute<T> extends CommonMethod<T> {
-  /**
-   * Called when the color of the placeholder is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  placeholderColor(value: Color | number | string | Resource): T;
-
-  /**
-   * Called when the font property of the placeholder is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  placeholderFont(value?:{ size?: number | string | Resource, weight?: number | FontWeight | string, family?: string | Resource, style?: FontStyle }): T;
-
-  /**
-   * Called when the alignment of the contents of a multiline text box is set.
-   * @devices phone, tablet, car.
-   * @since 7
-   */
-  textAlign(value: TextAlign): T;
-
-  /**
-   * Called when the insertion cursor color is set.
-   * @devices phone, tablet, car.
-   * @since 6
-   */
-  caretColor(value: Color | number | string | Resource): T;
-
-  /**
-    * Called when the input changes.
-    * @devices phone, tablet, car.
-    * @since 7
-    */
-  onChange(callback: (value: string) => void): T;
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare const TextAreaInterface: TextArea;
\ No newline at end of file
diff --git a/api/@internal/component/ets/toggle.d.ts b/api/@internal/component/ets/toggle.d.ts
index 8f9751928ef17d703fe04da94f9191e86f60b9cd..0cd55b927cc321455c6b3615bbbf202376f25507 100644
--- a/api/@internal/component/ets/toggle.d.ts
+++ b/api/@internal/component/ets/toggle.d.ts
@@ -13,85 +13,66 @@
  * limitations under the License.
  */
 
-import {CommonMethod, Color} from "./common";
+import { CommonMethod } from "./common";
+import { ResourceColor } from "./units";
 
 /**
  * Declare the type of status button
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 export declare enum ToggleType {
   /**
    * Checkbox
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Checkbox,
 
   /**
    * Switch
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
   Switch,
 
   /**
    * Button
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  Button
+  Button,
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class ToggleExtend<T> extends ToggleAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 interface Toggle extends ToggleAttribute<Toggle> {
   /**
    * Set parameters to obtain the toggle.
-   * @devices phone, tablet, car.
-   * @since 7
+   * @since 8
    */
-  (options?: {type: ToggleType, isOn?: boolean}): Toggle;
+  (options?: { type: ToggleType; isOn?: boolean }): Toggle;
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
+ * @since 8
  */
 declare class ToggleAttribute<T> extends CommonMethod<T> {
   /**
    * Called when the selected state of the component changes.
-   * @since 7
-   * @devices phone, tablet, car.
+   * @since 8
    */
   onChange(callback: (isOn: boolean) => void): T;
 
   /**
    * Called when the color of the selected button is set.
-   * @since 7
-   * @devices phone, tablet, car.
+   * @since 8
    */
-  selectedColor(value: Color): T;
+  selectedColor(value: ResourceColor): T;
 
   /**
    * Called when the color of the selected button is set.
-   * @since 7
-   * @devices phone, tablet, car.
+   * @since 8
    */
-  swithPointStyle(color: Color): T;
+  swithPointColor(color: ResourceColor): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class ToggleExtend<T> extends ToggleAttribute<T> {}
 export declare const ToggleInterface: Toggle;
diff --git a/api/@internal/component/ets/menu.d.ts b/api/@internal/component/ets/units.d.ts
similarity index 36%
rename from api/@internal/component/ets/menu.d.ts
rename to api/@internal/component/ets/units.d.ts
index 648606548a68e8122c31a3c82ae66ea55a312cc4..d93e6c46e2be43ed4d1e3f66d0138f6d2a8cf81b 100644
--- a/api/@internal/component/ets/menu.d.ts
+++ b/api/@internal/component/ets/units.d.ts
@@ -13,75 +13,120 @@
  * limitations under the License.
  */
 
-import { CommonMethod, Resource } from "./common";
+import { Color, FontStyle, FontWeight } from "./enums";
 
 /**
- * Method of displaying menu.
- * @devices phone, tablet, car.
+ * Defines the data type of the interface restriction.
  * @since 7
  */
-export declare enum MenuType {
+export declare interface Resource {
+  /**
+   * Set id.
+   * @since 7
+   */
+  readonly id: number;
 
   /**
-   * Shows when clicked.
-   * @devices phone, tablet, car.
+   * Set type.
    * @since 7
    */
-  Click,
+  readonly type: number;
 
   /**
-   * Long-time display.
-   * @devices phone, tablet, car.
+   * Set params.
    * @since 7
    */
-  LongPress
+  readonly params?: any[];
 }
 
 /**
- * Make a statement about the menu display.
- * @devices phone, tablet, car.
+ * Defines the length property with string, number and resource unit.
  * @since 7
  */
-export declare class MenuExtend<T> extends MenuAttribute<T> {
-}
+export declare type Length = string | number | Resource;
 
 /**
- * Provides an interface for displaying menus.
- * @devices phone, tablet, car.
+ * Defines the string which can use resource.
  * @since 7
  */
-interface Menu extends MenuAttribute<Menu> {
+export declare type ResourceStr = string | Resource;
+
+/**
+ * Defines the padding property.
+ * @since 7
+ */
+export declare type Padding = {
   /**
-   * Called when an option is displayed for a menu.
-   * @devices phone, tablet, car.
-   * @since 7
+   * top property.
    */
-  (options?: { type?: MenuType, title?: string | Resource }): Menu;
-}
+  top?: Length;
+
+  /**
+   * right property.
+   */
+  right?: Length;
+
+  /**
+   * bottom property.
+   */
+  bottom?: Length;
+
+  /**
+   * left property.
+   */
+  left?: Length;
+};
+
+/**
+ * Defines the margin property.
+ * @sicne 7
+ */
+export declare type Margin = Padding;
 
 /**
- * Method for declaring menu options.
- * @devices phone, tablet, car.
+ * Defines the offset property.
  * @since 7
  */
-declare class MenuAttribute<T> extends CommonMethod<T> {
+export declare type Offset = {
   /**
-   * Called when the menu is displayed..
-   * @devices phone, tablet, car.
-   * @since 7
+   * dx property.
    */
-  show(value: boolean): T;
+  dx: Length;
 
-   /**
-   * Called when the display position is set.
-   * @devices phone, tablet, car.
-   * @since 7
+  /**
+   * dy property.
    */
-  showPosition(options: {x: number, y: number}): T;
-}
+  dy: Length;
+};
 
 /**
- * @devices phone, tablet, car.
+ * Defines the color which can use resource.
  * @since 7
  */
-export declare const MenuInterface: Menu;
\ No newline at end of file
+export declare type ResourceColor = Color | number | string | Resource;
+
+/**
+ * Defines the font used for text.
+ * @since 7
+ */
+export declare interface Font {
+  /**
+   * font size.
+   */
+  size?: number;
+
+  /**
+   * font weight.
+   */
+  weight?: FontWeight;
+
+  /**
+   * font family.
+   */
+  family?: string;
+
+  /**
+   * font style.
+   */
+  style?: FontStyle;
+}
diff --git a/api/@internal/component/ets/video.d.ts b/api/@internal/component/ets/video.d.ts
index c8207b5eb2e882dbe0dcffba28049f32f419db2a..f6cfeeecbfec3f77e0b6e4e7f14b5469f9518887 100644
--- a/api/@internal/component/ets/video.d.ts
+++ b/api/@internal/component/ets/video.d.ts
@@ -13,194 +13,161 @@
  * limitations under the License.
  */
 
-import {CommonMethod, ImageFit, Resource} from "./common";
+import { CommonMethod } from "./common";
+import { ImageFit } from "./enums";
+import { Resource } from "./units";
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class VideoController {
   /**
    * constructor.
    * @since 7
-   * @devices phone, tablet, car.
    */
   constructor();
 
   /**
    * Provides events to play.
    * @since 7
-   * @devices phone, tablet, car.
    */
   start();
 
   /**
    * Provides a pause event for playback.
    * @since 7
-   * @devices phone, tablet, car.
    */
   pause();
 
   /**
    * Provides an event to stop playback.
    * @since 6
-   * @devices phone, tablet, car.
    */
   stop();
 
   /**
    * Provide the progress method of video playback.
    * @since 7
-   * @devices phone, tablet, car.
    */
   setCurrentTime(value: number);
 
   /**
    * Provides a full screen playback method.
    * @since 7
-   * @devices phone, tablet, car.
    */
   requestFullscreen(value: boolean);
 
   /**
    * Provides a method to exit full screen playback.
    * @since 7
-   * @devices phone, tablet, car.
    */
   exitFullscreen();
 }
 
 /**
- * @devices phone, tablet, car.
- * @since 7
- */
-export declare class VideoExtend<T> extends VideoAttribute<T> {
-}
-
-/**
- * @devices phone, tablet, car.
  * @since 7
  */
 interface Video extends VideoAttribute<Video> {
   /**
    * Set the value.
-   * @devices phone, tablet, car.
    * @since 7
    */
   (value: {
-    src?: string | Resource,
-    currentProgressRate?: number | string,
-    previewUri?: string,
-    controller?: VideoController
+    src?: string | Resource;
+    currentProgressRate?: number | string;
+    previewUri?: string;
+    controller?: VideoController;
   }): Video;
 }
 
 /**
- * @devices phone, tablet, car.
  * @since 7
  */
 declare class VideoAttribute<T> extends CommonMethod<T> {
   /**
    * Called when judging whether the video is muted.
    * @since 7
-   * @devices phone, tablet, car.
    */
   muted(value: boolean): T;
 
   /**
    * Called when judging whether the video is played automatically.
    * @since 7
-   * @devices phone, tablet, car.
    */
   autoPlay(value: boolean): T;
 
   /**
    * Called when judging whether the control bar is displayed.
    * @since 7
-   * @devices phone, tablet, car.
    */
   controls(value: boolean): T;
 
   /**
    * Called when judging whether the video is played circularly.
    * @since 6
-   * @devices phone, tablet, car.
    */
   loop(value: boolean): T;
 
   /**
    * Called when determining the zoom type of the video source.
    * @since 7
-   * @devices phone, tablet, car.
    */
   objectFit(value: ImageFit): T;
 
   /**
    * Called when the video is played.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onStart(event: () => void): T;
 
   /**
    * Called when the video is paused.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onPause(event: () => void): T;
 
   /**
    * Called when the video playback ends.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onFinish(event: () => void): T;
 
   /**
    * Called when the video enters and exits the full screen.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onFullscreenChange(callback: (event?: { fullscreen: boolean }) => void): T;
 
   /**
    * Called when the video preparation is complete.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onPrepared(callback: (event?: { duration: number }) => void): T;
 
   /**
    * Called when the time information is reported when the progress bar process is operated.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onSeeking(callback: (event?: { time: number }) => void): T;
 
   /**
    * Called when the playback time information is reported after the operation progress bar is completed.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onSeeked(callback: (event?: { time: number }) => void): T;
 
   /**
    * Called when the playback progress changes.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onUpdate(callback: (event?: { time: number }) => void): T;
 
   /**
    * Called when playback fails.
    * @since 7
-   * @devices phone, tablet, car.
    */
   onError(event: () => void): T;
 }
 
-/**
- * @devices phone, tablet, car.
- * @since 7
- */
+export declare class VideoExtend<T> extends VideoAttribute<T> {}
 export declare const VideoInterface: Video;
diff --git a/api/@internal/component/ets/web.d.ts b/api/@internal/component/ets/web.d.ts
index f5154c3f8e33c69b076ed88c81c867a6071c2f14..3f6128766fd3422024aaa1be98e740e624fe83e2 100644
--- a/api/@internal/component/ets/web.d.ts
+++ b/api/@internal/component/ets/web.d.ts
@@ -1,34 +1,97 @@
-/*
-  * Copyright (c) 2021 Huawei Device Co., Ltd.
-  * Licensed under the Apache License, Version 2.0 (the "License");
-  * you may not use this file except in compliance with the License.
-  * You may obtain a copy of the License at
-  *
-  *     http://www.apache.org/licenses/LICENSE-2.0
-  *
-  * Unless required by applicable law or agreed to in writing, software
-  * distributed under the License is distributed on an "AS IS" BASIS,
-  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  * See the License for the specific language governing permissions and
-  * limitations under the License.
-  */
-
-import {CommonMethod} from "./common";
-
-export declare class WebController {
-  constructor();
-  reload();
-}
-
-interface Web extends CommonMethod<Web> {
-  (value:{
-      src: string,
-      controller: WebController,
-  }): Web;
-  onPageStart(callback: (url: string) => void): Web;
-  onPageFinish(callback: (url: string) => void): Web;
-  onError(callback: (errorMsg: string) => void): Web;
-  onMessage(callback: (msg: string) => void): Web;
-}
-
-export declare const WebInterface: Web;
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { CommonMethod } from "./common";
+
+/**
+ * Defines the WebController.
+ * @since 8
+ */
+export declare class WebController {
+  /**
+   * Defines the constructor of WebController.
+   * @since 8
+   */
+  constructor();
+
+  /**
+   * Reload current web page.
+   * @since 8
+   */
+  reload();
+}
+
+/**
+ * Defines the option of Web component.
+ * @since 8
+ */
+export declare interface WebOption {
+  /**
+   * The web url.
+   * @since 8
+   */
+  src: string;
+
+  /**
+   * The web Controller.
+   * @since 8
+   */
+  controller: WebController;
+}
+
+/**
+ * Defines the Web component.
+ * @since 8
+ */
+interface Web extends WebAttribute<Web> {
+  /**
+   * Defines the constructor of Web.
+   * @since 8
+   */
+  (value: WebOption): Web;
+}
+
+/**
+ * Defines the Web component attribute functions.
+ * @since 8
+ */
+declare class WebAttribute<T> extends CommonMethod<T> {
+  /**
+   * The Callback of onPageStart.
+   * @since 8
+   */
+  onPageStart(callback: (url: string) => void): T;
+
+  /**
+   * The Callback of onPageFinish.
+   * @since 8
+   */
+  onPageFinish(callback: (url: string) => void): T;
+
+  /**
+   * The Callback of onError.
+   * @since 8
+   */
+  onError(callback: (errorMsg: string) => void): T;
+
+  /**
+   * The Callback of onMessage.
+   * @since 8
+   */
+  onMessage(callback: (msg: string) => void): T;
+}
+
+export declare class WebExtend<T> extends WebAttribute<T> {}
+export declare const WebInterface: Web;
diff --git a/example/ets/component/text_clock_exmaple.ets b/example/ets/component/text_clock_exmaple.ets
new file mode 100644
index 0000000000000000000000000000000000000000..4f2ecd82b378df7bb7c28d99dac51425e4b5eaff
--- /dev/null
+++ b/example/ets/component/text_clock_exmaple.ets
@@ -0,0 +1,27 @@
+/*
+ * Copyright (c) 2021 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@Entry
+@Component
+struct TextClockExmaple {
+  private format: string = 'ddd mm dd yyyy HH:MM:SS'
+
+  build() {
+    Column() {
+      TextClock({is24hour: true, hourswest: -8})
+        .format(this.format)
+    }
+  }
+}
\ No newline at end of file