@quicktvui/ai 1.0.6 → 1.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quicktvui/ai",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "description": "QuickTVUI AI 开发规范与脚手架注入工具",
   "main": "index.js",
   "scripts": {

package/rules/.clinerules

@@ -6,9 +6,19 @@
 
 **AI MUST refer to the official documentation and source code below BEFORE generating any code. NEVER hallucinate component names, attribute names, or APIs. These are the ONLY authorities.**
 
-1.  **Local Docs & Examples (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` directory.
-    *   **Component Docs**: Detailed definitions of components, APIs, and CSS.
-    *   **Example Code**: Vue files under `node_modules/@quicktvui/ai/rules/.docs/examples/` are verified best practices. **AI MUST refer to these examples before generating any logic.**
+1.  **Local Docs, Examples & Source (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` and `node_modules/@quicktvui/ai/rules/.source/` directories.
+    *   **Component Docs**: `.docs/` for component, API, and CSS definitions.
+    *   **Example Code**: `.docs/examples/` for verified best practices (pagination, focus, etc.).
+    *   **Framework Source Map**: `.source/` contains the full-stack implementation. AI MUST locate source based on module:
+        *   `quicktvui/`: Core Vue 3 UI component library implementation.
+        *   `hippy/`: Android Native implementation (ViewController, UIManager).
+        *   `ESPlayer*/ESVideoPlayer`: Media playback engines (Video, Audio, ADs).
+        *   `ESPlayerManager`: High-level player window and playlist management.
+        *   `ESRouter`: TV-optimized routing and navigation system.
+        *   `ESCore`: Native module bridge, Storage, Toast, and System APIs.
+        *   `ESVue*/ESVueStyleParser`: Custom Vue renderer and Style parser logic.
+        *   `ESAxios`: Platform-optimized network library.
+        *   `web/`: Polyfills for standard web tags.
 
 2.  **Official Docs**: https://quicktvui.com
 3.  **Core Library Samples**: https://github.com/quicktvui/quicktvui.git
@@ -402,4 +412,18 @@ export default defineComponent({
 5.  **Pagination & Load More Rules (CRITICAL)**:
     *   **`qt-tabs` (Tabs Waterfall)**: **MUST** use **`@onTabPageLoadData="onTabPageLoadData"`**. Append data via `addPageData`.
     *   **`qt-waterfall` (Single Waterfall)**: **NO native `loadMore` event**. Usually triggered via **`@onItemBind`** on the last section (e.g., a Loading Section) or by listening to **`@onScrollToBottom`** (if supported by parent).
-    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+
+### 7. Native Component Mapping & Deprecations
+AI MUST understand the mapping between Vue components and Java Native controllers to avoid using deprecated logic:
+
+| Vue Component | Native Name (Hippy) | Java Class (PRIMARY) | Status |
+| :--- | :--- | :--- | :--- |
+| `qt-text` | `TextView` | `com.tencent.extend.views.TextViewController` | **Recommended** |
+| `qt-list-view` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-waterfall` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-image` | `Image` | `com.tencent.mtt.hippy.views.image.HippyImageViewController` | **Active** |
+| **(Deprecated)** | `Text` | `com.tencent.mtt.hippy.views.text.HippyTextViewController` | **DEPRECATED** |
+| **(Deprecated)** | `ListView` | `com.tencent.mtt.hippy.views.list.HippyListViewController` | **DEPRECATED** |
+
+**Rule**: Always prefer source code in `.source/hippy/extend_views/`. Use `.source/hippy/hippy_views/` only as a secondary fallback.

package/rules/.cursorrules

@@ -6,9 +6,19 @@
 
 **AI MUST refer to the official documentation and source code below BEFORE generating any code. NEVER hallucinate component names, attribute names, or APIs. These are the ONLY authorities.**
 
-1.  **Local Docs & Examples (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` directory.
-    *   **Component Docs**: Detailed definitions of components, APIs, and CSS.
-    *   **Example Code**: Vue files under `node_modules/@quicktvui/ai/rules/.docs/examples/` are verified best practices. **AI MUST refer to these examples before generating any logic.**
+1.  **Local Docs, Examples & Source (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` and `node_modules/@quicktvui/ai/rules/.source/` directories.
+    *   **Component Docs**: `.docs/` for component, API, and CSS definitions.
+    *   **Example Code**: `.docs/examples/` for verified best practices (pagination, focus, etc.).
+    *   **Framework Source Map**: `.source/` contains the full-stack implementation. AI MUST locate source based on module:
+        *   `quicktvui/`: Core Vue 3 UI component library implementation.
+        *   `hippy/`: Android Native implementation (ViewController, UIManager).
+        *   `ESPlayer*/ESVideoPlayer`: Media playback engines (Video, Audio, ADs).
+        *   `ESPlayerManager`: High-level player window and playlist management.
+        *   `ESRouter`: TV-optimized routing and navigation system.
+        *   `ESCore`: Native module bridge, Storage, Toast, and System APIs.
+        *   `ESVue*/ESVueStyleParser`: Custom Vue renderer and Style parser logic.
+        *   `ESAxios`: Platform-optimized network library.
+        *   `web/`: Polyfills for standard web tags.
 
 2.  **Official Docs**: https://quicktvui.com
 3.  **Core Library Samples**: https://github.com/quicktvui/quicktvui.git
@@ -403,4 +413,18 @@ export default defineComponent({
 5.  **Pagination & Load More Rules (CRITICAL)**:
     *   **`qt-tabs` (Tabs Waterfall)**: **MUST** use **`@onTabPageLoadData="onTabPageLoadData"`**. Append data via `addPageData`.
     *   **`qt-waterfall` (Single Waterfall)**: **NO native `loadMore` event**. Usually triggered via **`@onItemBind`** on the last section (e.g., a Loading Section) or by listening to **`@onScrollToBottom`** (if supported by parent).
-    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+
+### 7. Native Component Mapping & Deprecations
+AI MUST understand the mapping between Vue components and Java Native controllers to avoid using deprecated logic:
+
+| Vue Component | Native Name (Hippy) | Java Class (PRIMARY) | Status |
+| :--- | :--- | :--- | :--- |
+| `qt-text` | `TextView` | `com.tencent.extend.views.TextViewController` | **Recommended** |
+| `qt-list-view` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-waterfall` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-image` | `Image` | `com.tencent.mtt.hippy.views.image.HippyImageViewController` | **Active** |
+| **(Deprecated)** | `Text` | `com.tencent.mtt.hippy.views.text.HippyTextViewController` | **DEPRECATED** |
+| **(Deprecated)** | `ListView` | `com.tencent.mtt.hippy.views.list.HippyListViewController` | **DEPRECATED** |
+
+**Rule**: Always prefer source code in `.source/hippy/extend_views/`. Use `.source/hippy/hippy_views/` only as a secondary fallback.

package/rules/.github/copilot-instructions.md

@@ -6,9 +6,19 @@
 
 **AI MUST refer to the official documentation and source code below BEFORE generating any code. NEVER hallucinate component names, attribute names, or APIs. These are the ONLY authorities.**
 
-1.  **Local Docs & Examples (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` directory.
-    *   **Component Docs**: Detailed definitions of components, APIs, and CSS.
-    *   **Example Code**: Vue files under `node_modules/@quicktvui/ai/rules/.docs/examples/` are verified best practices. **AI MUST refer to these examples before generating any logic.**
+1.  **Local Docs, Examples & Source (PRIMARY)**: `node_modules/@quicktvui/ai/rules/.docs/` and `node_modules/@quicktvui/ai/rules/.source/` directories.
+    *   **Component Docs**: `.docs/` for component, API, and CSS definitions.
+    *   **Example Code**: `.docs/examples/` for verified best practices (pagination, focus, etc.).
+    *   **Framework Source Map**: `.source/` contains the full-stack implementation. AI MUST locate source based on module:
+        *   `quicktvui/`: Core Vue 3 UI component library implementation.
+        *   `hippy/`: Android Native implementation (ViewController, UIManager).
+        *   `ESPlayer*/ESVideoPlayer`: Media playback engines (Video, Audio, ADs).
+        *   `ESPlayerManager`: High-level player window and playlist management.
+        *   `ESRouter`: TV-optimized routing and navigation system.
+        *   `ESCore`: Native module bridge, Storage, Toast, and System APIs.
+        *   `ESVue*/ESVueStyleParser`: Custom Vue renderer and Style parser logic.
+        *   `ESAxios`: Platform-optimized network library.
+        *   `web/`: Polyfills for standard web tags.
 
 2.  **Official Docs**: https://quicktvui.com
 3.  **Core Library Samples**: https://github.com/quicktvui/quicktvui.git
@@ -471,4 +481,18 @@ export default defineComponent({
 5.  **Pagination & Load More Rules (CRITICAL)**:
     *   **`qt-tabs` (Tabs Waterfall)**: **MUST** use **`@onTabPageLoadData="onTabPageLoadData"`**. Append data via `addPageData`.
     *   **`qt-waterfall` (Single Waterfall)**: **NO native `loadMore` event**. Usually triggered via **`@onItemBind`** on the last section (e.g., a Loading Section) or by listening to **`@onScrollToBottom`** (if supported by parent).
-    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+    *   **`qt-list-view` / `qt-grid-view`**: Support native `@loadMore="loadMoreFn"` with `pageNo` parameter.
+
+### 7. Native Component Mapping & Deprecations
+AI MUST understand the mapping between Vue components and Java Native controllers to avoid using deprecated logic:
+
+| Vue Component | Native Name (Hippy) | Java Class (PRIMARY) | Status |
+| :--- | :--- | :--- | :--- |
+| `qt-text` | `TextView` | `com.tencent.extend.views.TextViewController` | **Recommended** |
+| `qt-list-view` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-waterfall` | `FastListView` | `com.tencent.extend.views.fastlist.FastListViewController` | **Recommended** |
+| `qt-image` | `Image` | `com.tencent.mtt.hippy.views.image.HippyImageViewController` | **Active** |
+| **(Deprecated)** | `Text` | `com.tencent.mtt.hippy.views.text.HippyTextViewController` | **DEPRECATED** |
+| **(Deprecated)** | `ListView` | `com.tencent.mtt.hippy.views.list.HippyListViewController` | **DEPRECATED** |
+
+**Rule**: Always prefer source code in `.source/hippy/extend_views/`. Use `.source/hippy/hippy_views/` only as a secondary fallback.

package/rules/.source/ESADPlayer/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@extscreen/es3-ad-player",
+  "version": "1.0.13",
+  "description": "Vue-Next binding for ES native framework",
+  "author": "ExtScreen Team",
+  "homepage": "http://extscreen.com",
+  "license": "Apache-2.0",
+  "entry": "dist/index.js",
+  "main": "dist/index.js",
+  "module": "dist/index.js",
+  "types": "dist/src/index.d.ts",
+  "keywords": [
+    "es3-player",
+    "native",
+    "web",
+    "framework",
+    "compiler"
+  ],
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+  }
+}

package/rules/.source/ESADPlayer/rollup.config.js

@@ -0,0 +1,33 @@
+import vue from "rollup-plugin-vue";
+import typescript from "rollup-plugin-typescript2";
+import postcss from "rollup-plugin-postcss";
+import { terser } from "rollup-plugin-terser";
+import commonjs from "rollup-plugin-commonjs";
+import resolve from "rollup-plugin-node-resolve";
+
+export default {
+  input: "./src/index.ts",
+  output: {
+    file: "./dist/index.js",
+    format: "es",
+  },
+  plugins: [
+    typescript(),
+    vue({
+      css: true,
+      compileTemplate: true,
+    }),
+    postcss({
+      extract: "index.css",
+    }),
+    terser(),
+    commonjs(),
+    resolve(),
+  ],
+  external: [
+    "@extscreen/es3-vue",
+    "vue",
+    "@extscreen/es3-player",
+    "@extscreen/es3-core",
+  ],
+};

package/rules/.source/ESADPlayer/src/component/ESADPlayerViewComponent.ts

@@ -0,0 +1,466 @@
+import { defineComponent, h, ref } from "vue";
+import { ESApp, Native, registerElement } from "@extscreen/es3-vue";
+import {
+  ESPlayerDurationCallback,
+  ESPlayerProgressCallback,
+} from "@extscreen/es3-player";
+
+function registerESADPlayerViewComponent(app: ESApp) {
+  const ADPlayerComponent = {
+    component: {
+      name: "ADPlayerComponent",
+      processEventData(
+        evtData,
+        nativeEventParams: {
+          playerStatus: number;
+          playerWidth: number;
+          playerHeight: number;
+          errorCode: number;
+          errorMessage: string;
+          playerClickable: boolean;
+          leftVolume: number;
+          rightVolume: number;
+        },
+      ) {
+        const { handler: event, __evt: nativeEventName } = evtData;
+        switch (nativeEventName) {
+          case "onPlayerStatusChanged":
+            event.playerState = nativeEventParams.playerStatus;
+            event.errorCode = nativeEventParams.errorCode;
+            event.errorMessage = nativeEventParams.errorMessage;
+            event.playerClickable = nativeEventParams.playerClickable;
+            break;
+          case "onPlayerError":
+            event.errorCode = nativeEventParams.errorCode;
+            event.errorMessage = nativeEventParams.errorMessage;
+            break;
+          case "onPlayerVolumeChanged":
+            event.leftVolume = nativeEventParams.leftVolume;
+            event.rightVolume = nativeEventParams.rightVolume;
+            break;
+          default:
+        }
+        return event;
+      },
+    },
+  };
+  registerElement("ADPlayerComponent", ADPlayerComponent);
+
+  const ADPlayerViewImpl = defineComponent({
+    emits: [
+      "player-status-changed",
+      "player-error",
+      "player-info",
+      "player-volume-changed",
+      "player-component-info",
+      "canExitTime",
+      "player-left-volume-changed",
+      "player-right-volume-changed",
+    ],
+    setup(props, context) {
+      const adPlayerViewRef = ref();
+
+      let progressCallback: ESPlayerProgressCallback;
+      let durationCallback: ESPlayerDurationCallback;
+
+      const setProgressCallback = (
+        callback: ESPlayerProgressCallback,
+      ): void => {
+        progressCallback = callback;
+      };
+
+      const setDurationCallback = (
+        callback: ESPlayerDurationCallback,
+      ): void => {
+        durationCallback = callback;
+      };
+
+      const getComponentInfo = () => {
+        Native.callUIFunction(adPlayerViewRef.value, "getEsInfo", [], (res) => {
+          context.emit("player-component-info", res);
+        });
+      };
+      const initComponent = (
+        channelCode: string,
+        testServer: boolean,
+        debug: boolean,
+      ) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "init",
+          ["2ezER7", "快应用", channelCode, testServer, debug],
+          (res) => {},
+        );
+      };
+      const setPointADProgress = (progress: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setPointADProgress",
+          [progress],
+          (res) => {},
+        );
+      };
+      const clickPlayerView = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "clickPlayerView",
+          [],
+          (res) => {},
+        );
+      };
+      const play = (...params: Array<any>) => {
+        let url: string = params[0];
+        let type: number = params[1];
+        let mediaId: string = params[2];
+        let adCount: number = params[3];
+        let leftVolume: string = params[4];
+        let rightVolume: string = params[5];
+        let playerType: number = params[6];
+        let playerMediaCodec: boolean = params[7];
+        let playerOptionArray: Array<any> = params[8];
+        let muteAD: boolean = params[9];
+        let display: boolean = params[10];
+
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "play",
+          [
+            url,
+            type,
+            mediaId,
+            adCount,
+            leftVolume,
+            rightVolume,
+            playerType,
+            playerMediaCodec,
+            playerOptionArray,
+            muteAD,
+            display,
+          ],
+          (res) => {},
+        );
+      };
+      const start = () => {
+        Native.callUIFunction(adPlayerViewRef.value, "start", [], (res) => {});
+      };
+      const seekTo = (progress: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "seekTo",
+          [progress],
+          (res) => {},
+        );
+      };
+      const resume = () => {
+        Native.callUIFunction(adPlayerViewRef.value, "resume", [], (res) => {});
+      };
+      const stop = () => {
+        Native.callUIFunction(adPlayerViewRef.value, "stop", [], (res) => {});
+      };
+      const changeToFullScreen = (fullScreen: boolean) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "changeToFullScreen",
+          [fullScreen],
+          (res) => {},
+        );
+      };
+      const requestPlayerViewLayout = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "requestPlayerViewLayout",
+          [],
+          (res) => {},
+        );
+      };
+      const requestViewLayout = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "requestLayout",
+          [],
+          (res) => {},
+        );
+      };
+      const invalidate = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "requestLayout",
+          [],
+          (res) => {},
+        );
+      };
+      const updateLayout = (
+        width: number,
+        height: number,
+        x: number,
+        y: number,
+      ) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "updateLayout",
+          [width, height, x, y],
+          (res) => {},
+        );
+      };
+      const requestCustomSizeLayout = (
+        width: number,
+        height: number,
+        x: number,
+        y: number,
+      ) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "requestCustomSizeLayout",
+          [width, height, x, y],
+          (res) => {},
+        );
+      };
+      const requestCustomLayout = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "requestCustomLayout",
+          [],
+          (res) => {},
+        );
+      };
+      const setSize = (width: number, height: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setPlayerSize",
+          [width, height],
+          (res) => {},
+        );
+      };
+      const setPlayerDimension = (
+        defaultWidth: number,
+        defaultHeight: number,
+        fullPlayerWidth: number,
+        fullPlayerHeight: number,
+        fullScreen: boolean,
+      ) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setPlayerDimension",
+          [
+            defaultWidth,
+            defaultHeight,
+            fullPlayerWidth,
+            fullPlayerHeight,
+            fullScreen,
+          ],
+          (res) => {},
+        );
+      };
+      const setDefaultPlayerWidth = (defaultPlayerWidth: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setDefaultPlayerWidth",
+          [defaultPlayerWidth],
+          (res) => {},
+        );
+      };
+      const setDefaultPlayerHeight = (defaultPlayerHeight: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setDefaultPlayerHeight",
+          [defaultPlayerHeight],
+          (res) => {},
+        );
+      };
+      const setFullPlayerWidth = (fullPlayerWidth: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setFullPlayerWidth",
+          [fullPlayerWidth],
+          (res) => {},
+        );
+      };
+      const setFullPlayerHeight = (fullPlayerHeight: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setFullPlayerHeight",
+          [fullPlayerHeight],
+          (res) => {},
+        );
+      };
+      const setPlayRate = (playRate: string) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setPlayRate",
+          [playRate],
+          (res) => {},
+        );
+      };
+      const setDefinition = (definition: number) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setDefinition",
+          [definition],
+          (res) => {},
+        );
+      };
+      const release = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "release",
+          [],
+          (res) => {},
+        );
+      };
+      const isStopped = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "isStopped",
+          [],
+          (res) => {},
+        );
+      };
+      const getCurrentPosition = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "getCurrentPosition",
+          [],
+          (res) => {
+            if (progressCallback) {
+              progressCallback(res);
+            }
+          },
+        );
+      };
+      const getDuration = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "getDuration",
+          [],
+          (res) => {
+            if (durationCallback) {
+              durationCallback(res);
+            }
+          },
+        );
+      };
+      const getADCanExitTime = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "getADCanExitTime",
+          [],
+          (res) => {
+            context.emit("canExitTime", res);
+          },
+        );
+      };
+      const getLeftVolume = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "getLeftVolume",
+          [],
+          (res) => {
+            context.emit("player-left-volume-changed", res);
+          },
+        );
+      };
+      const getRightVolume = () => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "getRightVolume",
+          [],
+          (res) => {
+            context.emit("player-right-volume-changed", res);
+          },
+        );
+      };
+      const setLeftVolume = (leftVolume: string) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setLeftVolume",
+          [leftVolume],
+          (res) => {},
+        );
+      };
+      const setRightVolume = (rightVolume: string) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setRightVolume",
+          [rightVolume],
+          (res) => {},
+        );
+      };
+      const setVolume = (volume: string) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setVolume",
+          [volume],
+          (res) => {},
+        );
+      };
+      const setLeftRightVolume = (leftVolume: string, rightVolume: string) => {
+        Native.callUIFunction(
+          adPlayerViewRef.value,
+          "setLeftRightVolume",
+          [leftVolume, rightVolume],
+          (res) => {},
+        );
+      };
+      context.expose({
+        getComponentInfo,
+        initComponent,
+        setPointADProgress,
+        clickPlayerView,
+        play,
+        start,
+        seekTo,
+        resume,
+        stop,
+        changeToFullScreen,
+        requestPlayerViewLayout,
+        requestViewLayout,
+        updateLayout,
+        requestCustomSizeLayout,
+        requestCustomLayout,
+        setSize,
+        setPlayerDimension,
+        setDefaultPlayerWidth,
+        setDefaultPlayerHeight,
+        setFullPlayerWidth,
+        setFullPlayerHeight,
+        setPlayRate,
+        setDefinition,
+        release,
+        isStopped,
+        getCurrentPosition,
+        getDuration,
+        getADCanExitTime,
+        getLeftVolume,
+        getRightVolume,
+        setLeftVolume,
+        setRightVolume,
+        setVolume,
+        setLeftRightVolume,
+        setProgressCallback,
+        setDurationCallback,
+        invalidate,
+      });
+      return () => {
+        return h("ADPlayerComponent", {
+          ref: adPlayerViewRef,
+          onPlayerStatusChanged: (evt) => {
+            context.emit("player-status-changed", evt);
+          },
+          onPlayerError: (evt) => {
+            context.emit("player-error", evt);
+          },
+          onPlayerVolumeChanged: (evt) => {
+            context.emit(
+              "player-volume-changed",
+              evt.leftVolume,
+              evt.rightVolume,
+            );
+          },
+        });
+      };
+    },
+  });
+  app.component("es-ad-player-view-component", ADPlayerViewImpl);
+}
+
+export default registerESADPlayerViewComponent;

package/rules/.source/ESADPlayer/src/core/ESADType.ts

@@ -0,0 +1,6 @@
+export enum ESADType {
+  ES_AD_TYPE_LAUNCH = 0, //开屏
+  ES_AD_TYPE_PREVIOUS_ROLL = 1, //前贴
+  ES_AD_TYPE_MIDDLE_ROLL = 2, //暂停
+  ES_AD_TYPE_POST_ROLL = 4, //后贴
+}

package/rules/.source/ESADPlayer/src/index.ts

@@ -0,0 +1,18 @@
+import ESADPlayer from "./index.vue";
+import { ESADType } from "./core/ESADType";
+import { ESApp } from "@extscreen/es3-vue";
+import registerESADPlayerViewComponent from "./component/ESADPlayerViewComponent";
+
+ESADPlayer.install = (Vue) => {
+  Vue.component(ESADPlayer.name, ESADPlayer);
+};
+
+export { ESADPlayer, ESADType };
+
+export const createESADPlayer = () => {
+  return {
+    install: function (app: ESApp): void {
+      registerESADPlayerViewComponent(app);
+    },
+  };
+};