yjz-web-sdk 1.0.10 → 1.0.11-beta.10

package/lib/uni-sdk.js

@@ -0,0 +1,1263 @@
+!function(){"use strict";try{if("undefined"!=typeof document){var e=document.createElement("style");e.appendChild(document.createTextNode(".vContainer[data-v-a76aee48]{transition:transform .2s linear;transform-origin:center center;margin:0;overflow:hidden;background:transparent;transform:translateZ(0);will-change:transform}.flex[data-v-a76aee48]{display:flex}.flex-1[data-v-a76aee48]{flex:1 1 0}.items-center[data-v-a76aee48]{align-items:center}.justify-center[data-v-a76aee48]{justify-content:center}.video-control[data-v-a76aee48]{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;object-fit:cover;background:transparent;clip-path:inset(0 1px);-webkit-user-drag:none;touch-action:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0)}.circle-cursor[data-v-a76aee48]{cursor:url(\"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20fill='none'%3e%3ccircle%20cx='12'%20cy='12'%20r='12'%20fill='%23fff'%20opacity='.6'/%3e%3ccircle%20cx='12'%20cy='12'%20r='10'%20fill='%23000'%20opacity='.6'/%3e%3c/svg%3e\") 12 12,auto}.triangle-cursor[data-v-a76aee48]{cursor:url(\"data:image/svg+xml,%3csvg%20class='icon'%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20width='22'%20height='22'%3e%3cpath%20d='M143.832313%205.834982H143.686438A108.676545%20108.676545%200%200%200%205.834982%20143.686438l34.499333-11.815839-34.499333%2011.815839%200.072938%200.218812%200.145874%200.437624%200.583498%201.750494%202.333993%206.71023%208.752474%2025.528047L49.232663%20269.867929a2254749.467572%202254749.467572%200%200%201%20223.917444%20652.351017l9.335972%2027.205605%202.552804%207.585476%200.729373%202.188119a72.572592%2072.572592%200%200%200%20126.181491%2040.844876%2072.134968%2072.134968%200%200%200%2014.076895-18.963693c3.282178-6.41848%205.689108-13.639271%208.023101-20.3495l0.072937-0.291749%2072.572592-209.329989%2047.409231-136.830334%2015.53564-44.710551%200.145874-0.364687%200.510561-0.145874%2045.002301-15.900327%20137.486769-48.649165c99.340573-35.228705%20202.984445-71.989094%20209.913487-74.906584l3.355115-1.312871c8.023101-3.136303%2022.391744-8.606599%2033.915834-20.130689a72.499655%2072.499655%200%200%200%200-102.549813L999.240712%20304.877823c-1.823432-1.969307-7.293728-7.731351-13.274585-11.961714a89.056417%2089.056417%200%200%200-27.205605-12.3264h-0.145874l-2.552805-0.875247L948.184617%20277.161657l-27.86204-9.263034-94.672588-31.800653A405018.007245%20405018.007245%200%200%201%20268.919745%2048.138604L178.039896%2017.504947%20152.657723%208.752473%20145.874556%206.637292%20144.196999%205.90792%20143.832313%205.834982z'%20fill='%23000000'%20opacity='.7'%3e%3c/path%3e%3c/svg%3e\") 1 1,auto}.default-cursor[data-v-a76aee48]{cursor:default}.no-events[data-v-a76aee48]{pointer-events:none!important}.ime-input[data-v-a76aee48]{position:fixed;right:0;bottom:0;width:1px;height:1px;opacity:0;pointer-events:none}.hb-player-container{position:relative;display:flex;flex:1 1 0;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden}.hb-keyboard-container{position:relative;width:100%;height:100%;transition:transform .2s linear;transform-origin:center center;transform:translateZ(0);will-change:transform;margin:0;overflow:hidden}.hb-remote-video{width:100%;height:100%;display:block;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;touch-action:none;object-fit:cover;backface-visibility:hidden;transform:translateZ(0);clip-path:inset(0 1px)}.hb-ime-input{position:absolute;opacity:0;right:0;bottom:0;width:1px;height:1px;border:none;outline:none;resize:none;z-index:-1}.circle-cursor{cursor:url(@/assets/icon/circle.svg) 12 12,auto}.triangle-cursor{cursor:url(@/assets/icon/triangle.svg) 1 1,auto}.default-cursor{cursor:default}.no-events{pointer-events:none!important}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}}();
+var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var _screenStatus, _isComposing, _direction, _screenWidth, _screenHeight, _clarityLevel, _gestureMode;
+import { W as WheelData, t as transformCoordinate, A as ActionType, v as valueToPercentage, T as TouchData, g as getKeyEventData, I as InputData, i as isFunctionKey, E as EventEmitter, C as ChannelDataType, a as WebRTCSdk, b as EmitType, F as FailCode, c as ContainerDirection, K as KeyEventData, j as ActionCommandEventValue, h as ActionCommandEventType, d as ClarityData, G as GestureData } from "./ScreenControlUtil-D4-BTCo9.js";
+var DocumentEvent = /* @__PURE__ */ ((DocumentEvent2) => {
+  DocumentEvent2["KEY_DOWN"] = "keydown";
+  DocumentEvent2["POINTER_ENTER"] = "pointerenter";
+  DocumentEvent2["POINTER_LEAVE"] = "pointerleave";
+  DocumentEvent2["POINTER_DOWN"] = "pointerdown";
+  DocumentEvent2["POINTER_UP"] = "pointerup";
+  DocumentEvent2["POINTER_MOVE"] = "pointermove";
+  DocumentEvent2["WHEEL"] = "wheel";
+  DocumentEvent2["COMPOSITION_START"] = "compositionstart";
+  DocumentEvent2["COMPOSITION_END"] = "compositionend";
+  DocumentEvent2["INPUT"] = "input";
+  return DocumentEvent2;
+})(DocumentEvent || {});
+var MenuKey = /* @__PURE__ */ ((MenuKey2) => {
+  MenuKey2[MenuKey2["HOME"] = 3] = "HOME";
+  MenuKey2[MenuKey2["BACK"] = 4] = "BACK";
+  MenuKey2[MenuKey2["TASK"] = 187] = "TASK";
+  return MenuKey2;
+})(MenuKey || {});
+var ClarityLevel = /* @__PURE__ */ ((ClarityLevel2) => {
+  ClarityLevel2[ClarityLevel2["FLUENT"] = 1] = "FLUENT";
+  ClarityLevel2[ClarityLevel2["STANDARD"] = 2] = "STANDARD";
+  ClarityLevel2[ClarityLevel2["HIGH_DEFINITION"] = 3] = "HIGH_DEFINITION";
+  return ClarityLevel2;
+})(ClarityLevel || {});
+const CLARITY_LEVEL_LIST = [
+  {
+    label: "流畅",
+    value: 1
+    /* FLUENT */
+  },
+  {
+    label: "标清",
+    value: 2
+    /* STANDARD */
+  },
+  {
+    label: "高清",
+    value: 3
+    /* HIGH_DEFINITION */
+  }
+];
+var GestureMode = /* @__PURE__ */ ((GestureMode2) => {
+  GestureMode2[GestureMode2["THREE_BUTTON_NAVIGATION"] = 0] = "THREE_BUTTON_NAVIGATION";
+  GestureMode2[GestureMode2["GESTURE_NAVIGATION"] = 2] = "GESTURE_NAVIGATION";
+  return GestureMode2;
+})(GestureMode || {});
+const CLASS_NAME = {
+  CONTAINER_CLASS_NAME: "hb-player-container",
+  KEYBOARD_CONTAINER_CLASS_NAME: "hb-keyboard-container",
+  REMOTE_VIDEO_CLASS_NAME: "hb-remote-video",
+  INPUT_METHOD_EDITOR_CLASS_NAME: "hb-ime-input"
+};
+var CursorType = /* @__PURE__ */ ((CursorType2) => {
+  CursorType2[CursorType2["DEFAULT_CURSOR"] = 0] = "DEFAULT_CURSOR";
+  CursorType2[CursorType2["CIRCLE_CURSOR"] = 1] = "CIRCLE_CURSOR";
+  CursorType2[CursorType2["TRIANGLE_CURSOR"] = 2] = "TRIANGLE_CURSOR";
+  return CursorType2;
+})(CursorType || {});
+const cursorClassMap = {
+  [
+    0
+    /* DEFAULT_CURSOR */
+  ]: "default-cursor",
+  [
+    1
+    /* CIRCLE_CURSOR */
+  ]: "circle-cursor",
+  [
+    2
+    /* TRIANGLE_CURSOR */
+  ]: "triangle-cursor"
+};
+class Logger {
+  constructor({
+    prefix,
+    enabledDebug = false
+  }) {
+    __publicField(this, "prefix");
+    __publicField(this, "enabledDebug");
+    this.prefix = prefix;
+    this.enabledDebug = enabledDebug;
+  }
+  output(type, ...args) {
+    const logFn = console[type];
+    if (typeof logFn !== "function") return;
+    if (this.enabledDebug) {
+      logFn([this.prefix], ...args);
+    }
+  }
+  log(...args) {
+    this.output("log", ...args);
+  }
+  warn(...args) {
+    this.output("warn", ...args);
+  }
+  error(...args) {
+    this.output("error", ...args);
+  }
+}
+class RemoteVideoController {
+  constructor({
+    rootContainer,
+    loadedSuccess,
+    loadedFailure,
+    enabledDebug = false,
+    cursorType = CursorType.DEFAULT_CURSOR,
+    remoteViewBackgroundColor = "transparent"
+  }) {
+    __publicField(this, "rootContainer");
+    __publicField(this, "remoteElement", null);
+    __publicField(this, "cursorType");
+    __publicField(this, "remoteViewBackgroundColor", "transparent");
+    __publicField(this, "logger");
+    // 解码成功
+    __publicField(this, "loadedSuccess");
+    // 解码失败
+    __publicField(this, "loadedFailure");
+    // 屏幕状态
+    __privateAdd(this, _screenStatus, false);
+    __publicField(this, "documentClickListener", () => {
+      if (this.remoteElement) {
+        this.remoteElement.muted = false;
+        this.remoteElement.play().catch(this.logger.error);
+      }
+    });
+    __publicField(this, "handleMetaDataListener", () => {
+      var _a;
+      __privateSet(this, _screenStatus, true);
+      (_a = this.loadedSuccess) == null ? void 0 : _a.call(this);
+    });
+    this.logger = new Logger({
+      prefix: "RemoteController",
+      enabledDebug
+    });
+    this.rootContainer = rootContainer;
+    this.cursorType = cursorType;
+    this.remoteViewBackgroundColor = remoteViewBackgroundColor;
+    this.loadedSuccess = loadedSuccess;
+    this.loadedFailure = loadedFailure;
+    this.init();
+  }
+  validateParams() {
+    const rootContainer = this.rootContainer;
+    if (!(rootContainer instanceof HTMLElement)) {
+      throw new Error("提供挂载节点元素");
+    }
+  }
+  createVideoElement() {
+    const videoElement = document.createElement("video");
+    videoElement.classList.add(CLASS_NAME.REMOTE_VIDEO_CLASS_NAME);
+    videoElement.classList.add(cursorClassMap[this.cursorType]);
+    videoElement.style = `background-color: ${this.remoteViewBackgroundColor}`;
+    return videoElement;
+  }
+  mountNode() {
+    const video = this.createVideoElement();
+    video.muted = true;
+    this.remoteElement = video;
+    this.rootContainer.appendChild(video);
+  }
+  async init() {
+    this.logger.log("实例初始化");
+    this.validateParams();
+    this.mountNode();
+    this.addEvent();
+  }
+  addDocumentClick() {
+    document.addEventListener("click", this.documentClickListener);
+  }
+  offDocumentClick() {
+    document.removeEventListener("click", this.documentClickListener);
+  }
+  addEvent() {
+    var _a;
+    this.addDocumentClick();
+    (_a = this.remoteElement) == null ? void 0 : _a.addEventListener("loadedmetadata", this.handleMetaDataListener);
+  }
+  offEvent() {
+    var _a;
+    this.offDocumentClick();
+    (_a = this.remoteElement) == null ? void 0 : _a.removeEventListener("loadedmetadata", this.handleMetaDataListener);
+  }
+  startPlay(track) {
+    const video = this.remoteElement;
+    if (!video) return;
+    video.play();
+    this.replaceVideoTrack(video, track);
+  }
+  replaceVideoTrack(video, newTrack) {
+    const videoEl = video;
+    if (!videoEl.srcObject) {
+      videoEl.srcObject = new MediaStream();
+    }
+    const mediaStream = videoEl.srcObject;
+    this.updateTrack(mediaStream, newTrack);
+    videoEl.playbackRate = 1;
+    videoEl.playsInline = true;
+    videoEl.disablePictureInPicture = true;
+    videoEl.setAttribute("playsinline", "true");
+    videoEl.setAttribute("webkit-playsinline", "true");
+    videoEl.setAttribute("x5-video-player-type", "h5");
+    videoEl.setAttribute("x5-video-player-fullscreen", "false");
+    videoEl.setAttribute("x5-video-orientation", "portraint");
+    videoEl.preload = "auto";
+  }
+  updateTrack(stream, newTrack) {
+    if (newTrack.kind === "video") {
+      stream.getVideoTracks().forEach((oldTrack) => {
+        stream.removeTrack(oldTrack);
+        oldTrack.stop();
+      });
+      stream.addTrack(newTrack);
+    } else if (newTrack.kind === "audio") {
+      if (!stream.getAudioTracks().some((t) => t.id === newTrack.id)) {
+        stream.addTrack(newTrack);
+      }
+    }
+  }
+  stopPlay() {
+    __privateSet(this, _screenStatus, false);
+    const video = this.remoteElement;
+    if (video && video.srcObject) {
+      const stream = video.srcObject;
+      stream.getTracks().forEach((t) => t.stop());
+      video.pause();
+      video.srcObject = null;
+    }
+  }
+  destroy() {
+    this.logger.log("destroy");
+    this.stopPlay();
+    this.offEvent();
+  }
+}
+_screenStatus = new WeakMap();
+class RemoteCanvasController {
+  constructor() {
+    __publicField(this, "remoteElement", null);
+    __publicField(this, "audioElement");
+  }
+  startDecode(arrayBuffer) {
+  }
+  startPlay(track) {
+  }
+  stopPlay() {
+  }
+  destroy() {
+  }
+}
+class RemoteController {
+  constructor({
+    rootContainer,
+    loadedSuccess,
+    loadedFailure,
+    enabledDebug = false,
+    enabledDecode = false,
+    cursorType = CursorType.DEFAULT_CURSOR,
+    remoteViewBackgroundColor = "transparent"
+  }) {
+    __publicField(this, "remoteController");
+    const options = {
+      rootContainer,
+      enabledDebug,
+      loadedFailure,
+      loadedSuccess,
+      cursorType,
+      remoteViewBackgroundColor
+    };
+    const RemoteControllerFn = enabledDecode ? RemoteCanvasController : RemoteVideoController;
+    this.remoteController = new RemoteControllerFn({
+      ...options
+    });
+  }
+  get audioElement() {
+    return this.remoteController.audioElement;
+  }
+  get remoteElement() {
+    return this.remoteController.remoteElement;
+  }
+  startPlay(track) {
+    this.remoteController.startPlay(track);
+  }
+  startDecode(arrayBuffer) {
+    var _a, _b;
+    (_b = (_a = this.remoteController).startDecode) == null ? void 0 : _b.call(_a, arrayBuffer);
+  }
+  stopPlay() {
+    this.remoteController.stopPlay();
+  }
+  destroy() {
+    this.remoteController.destroy();
+  }
+}
+function getEventXY(event, rect) {
+  if ("clientX" in event && "clientY" in event) {
+    return [event.clientX - rect.left, event.clientY - rect.top];
+  } else {
+    return [0, 0];
+  }
+}
+class MouseTouchControl {
+  constructor({ remoteElement, isGroup, widthRatio, videoAngle, streamAngle, cloudDeviceSize, touchDataUpdateCallback, wheelDataUpdateCallback, enabledDebug = false, isMove = false }) {
+    __publicField(this, "logger");
+    __publicField(this, "remoteElement", null);
+    __publicField(this, "cloudDeviceSize", { width: 0, height: 0 });
+    __publicField(this, "streamAngle", 0);
+    __publicField(this, "videoAngle", 0);
+    __publicField(this, "widthRatio", 0);
+    __publicField(this, "isGroup", false);
+    __publicField(this, "pointers");
+    __publicField(this, "groupIndexCounter", 0);
+    __publicField(this, "isMove", false);
+    __publicField(this, "touchDataUpdateCallback");
+    __publicField(this, "wheelDataUpdateCallback");
+    __publicField(this, "handleWheel", (e) => {
+      var _a;
+      const delta = Math.sign(e.deltaY) * -1;
+      const wheelData = new WheelData(delta);
+      (_a = this.wheelDataUpdateCallback) == null ? void 0 : _a.call(this, wheelData);
+    });
+    __publicField(this, "handlePointerEvent", (event, action, pointerId) => {
+      var _a;
+      if (!this.remoteElement) return;
+      const rect = this.remoteElement.getBoundingClientRect();
+      let [x, y] = getEventXY(event, rect);
+      const cloudWidth = this.cloudDeviceSize.width;
+      const cloudHeight = this.cloudDeviceSize.height;
+      const result = transformCoordinate(
+        rect.width,
+        rect.height,
+        cloudWidth,
+        cloudHeight,
+        this.videoAngle,
+        this.streamAngle,
+        x,
+        y
+      );
+      if (!result) return;
+      x = result[0];
+      y = result[1];
+      let pointerState = this.pointers.get(pointerId);
+      if (action === ActionType.ACTION_DOWN) {
+        pointerState = {
+          x,
+          y,
+          downTime: event.timeStamp,
+          isDown: true,
+          bound: Math.trunc(6 / this.widthRatio),
+          index: 0,
+          groupIndex: this.groupIndexCounter++
+        };
+        this.pointers.set(pointerId, pointerState);
+      } else {
+        if (!pointerState) return;
+        if (action === ActionType.ACTION_MOVE) {
+          let dx = x - pointerState.x;
+          let dy = y - pointerState.y;
+          if (this.isMove) {
+            dy = 0;
+            y = pointerState.y;
+          }
+          if (Math.abs(dx) < pointerState.bound && Math.abs(dy) < pointerState.bound) {
+            return;
+          }
+          pointerState.x = x;
+          pointerState.y = y;
+          pointerState.index++;
+        }
+      }
+      const [px, py] = valueToPercentage(
+        rect.width,
+        rect.height,
+        cloudWidth,
+        cloudHeight,
+        this.videoAngle,
+        this.streamAngle,
+        x,
+        y
+      );
+      const offsetTime = Math.trunc(event.timeStamp - pointerState.downTime);
+      const touchData = this.isGroup ? new TouchData(
+        action,
+        pointerId,
+        px,
+        py,
+        offsetTime,
+        "web",
+        pointerState.index,
+        pointerState.groupIndex
+      ) : new TouchData(
+        action,
+        pointerId,
+        px,
+        py,
+        offsetTime,
+        "web"
+      );
+      this.logger.log(touchData);
+      (_a = this.touchDataUpdateCallback) == null ? void 0 : _a.call(this, touchData);
+      if (action === ActionType.ACTION_UP) {
+        this.pointers.delete(pointerId);
+      }
+    });
+    __publicField(this, "handleMouseDown", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      if (this.remoteElement) this.remoteElement.setPointerCapture(event.pointerId);
+      this.handlePointerEvent(event, ActionType.ACTION_DOWN, event.pointerId);
+    });
+    __publicField(this, "handleMouseMove", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      this.handlePointerEvent(event, ActionType.ACTION_MOVE, event.pointerId);
+      if (!this.remoteElement) return;
+      const rect = this.remoteElement.getBoundingClientRect();
+      const { clientX: x, clientY: y } = event;
+      if (x < rect.left || x > rect.right || y < rect.top || y > rect.bottom) {
+        this.handleMouseUp(event);
+      }
+    });
+    __publicField(this, "handleMouseUp", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      this.handlePointerEvent(event, ActionType.ACTION_UP, event.pointerId);
+      if (this.remoteElement) {
+        this.remoteElement.releasePointerCapture(event.pointerId);
+      }
+    });
+    __publicField(this, "handleMouseEnter", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      if (event.pointerType !== "mouse") return;
+      if (event.buttons === 1 && !this.pointers.has(event.pointerId)) {
+        if (this.remoteElement) {
+          this.remoteElement.setPointerCapture(event.pointerId);
+        }
+        this.handlePointerEvent(event, ActionType.ACTION_DOWN, event.pointerId);
+      }
+    });
+    __publicField(this, "handleMouseLeave", (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      if (event.pointerType !== "mouse") return;
+      if (this.pointers.has(event.pointerId)) {
+        this.handlePointerEvent(event, ActionType.ACTION_UP, event.pointerId);
+        if (this.remoteElement) {
+          this.remoteElement.releasePointerCapture(event.pointerId);
+        }
+      }
+    });
+    this.logger = new Logger({
+      prefix: "MouseTouchControl",
+      enabledDebug
+    });
+    this.remoteElement = remoteElement;
+    this.cloudDeviceSize = cloudDeviceSize;
+    this.widthRatio = widthRatio;
+    this.videoAngle = videoAngle;
+    this.streamAngle = streamAngle;
+    this.isGroup = isGroup;
+    this.isMove = isMove;
+    this.pointers = /* @__PURE__ */ new Map();
+    this.touchDataUpdateCallback = touchDataUpdateCallback;
+    this.wheelDataUpdateCallback = wheelDataUpdateCallback;
+    this.init();
+  }
+  setVideoAngle(angle) {
+    this.videoAngle = angle;
+  }
+  setStreamAngle(angle) {
+    this.streamAngle = angle;
+  }
+  setWidthRatio(value) {
+    this.widthRatio = value;
+  }
+  setCloudDeviceSize(value) {
+    this.cloudDeviceSize = value;
+  }
+  validateParams() {
+    const video = this.remoteElement;
+    if (!(video instanceof HTMLVideoElement || video instanceof HTMLCanvasElement)) {
+      throw new Error("提供渲染挂载元素需为 canvas 或 video 元素");
+    }
+  }
+  addEvent() {
+    const remoteVideoElement = this.remoteElement;
+    if (remoteVideoElement) {
+      remoteVideoElement.addEventListener(DocumentEvent.POINTER_ENTER, this.handleMouseEnter);
+      remoteVideoElement.addEventListener(DocumentEvent.POINTER_MOVE, this.handleMouseMove);
+      remoteVideoElement.addEventListener(DocumentEvent.POINTER_LEAVE, this.handleMouseLeave);
+      remoteVideoElement.addEventListener(DocumentEvent.POINTER_DOWN, this.handleMouseDown);
+      remoteVideoElement.addEventListener(DocumentEvent.POINTER_UP, this.handleMouseUp);
+      remoteVideoElement.addEventListener(DocumentEvent.WHEEL, this.handleWheel);
+    }
+  }
+  offEvent() {
+    const remoteVideoElement = this.remoteElement;
+    if (remoteVideoElement) {
+      remoteVideoElement.removeEventListener(DocumentEvent.POINTER_ENTER, this.handleMouseEnter);
+      remoteVideoElement.removeEventListener(DocumentEvent.POINTER_MOVE, this.handleMouseMove);
+      remoteVideoElement.removeEventListener(DocumentEvent.POINTER_LEAVE, this.handleMouseLeave);
+      remoteVideoElement.removeEventListener(DocumentEvent.POINTER_DOWN, this.handleMouseDown);
+      remoteVideoElement.removeEventListener(DocumentEvent.POINTER_UP, this.handleMouseUp);
+      remoteVideoElement.removeEventListener(DocumentEvent.WHEEL, this.handleWheel);
+    }
+  }
+  init() {
+    this.validateParams();
+    this.addEvent();
+  }
+  destroy() {
+    this.logger.log("destroy");
+    this.offEvent();
+  }
+}
+class KeyboardControl {
+  constructor({
+    rootContainer,
+    inputDataUpdateCallback,
+    chineseDataUpdateCallback,
+    enabledDebug = false,
+    disabled = false,
+    enabledIMEKeyboard = false,
+    videoAngle
+  }) {
+    __publicField(this, "logger");
+    __publicField(this, "rootContainer");
+    __publicField(this, "keyboardContainerElement", null);
+    __publicField(this, "inputMethodEditorElement", null);
+    __publicField(this, "inputDataUpdateCallback");
+    __publicField(this, "chineseDataUpdateCallback");
+    __publicField(this, "videoAngle");
+    __publicField(this, "disabled", false);
+    __publicField(this, "enabledIMEKeyboard", false);
+    __privateAdd(this, _isComposing, false);
+    __publicField(this, "clearInput", () => {
+      if (this.inputMethodEditorElement) {
+        this.inputMethodEditorElement.value = "";
+      }
+    });
+    __publicField(this, "focusIME", () => {
+      requestAnimationFrame(() => {
+        var _a;
+        (_a = this.inputMethodEditorElement) == null ? void 0 : _a.focus();
+      });
+    });
+    __publicField(this, "blurIME", () => {
+      var _a;
+      (_a = this.inputMethodEditorElement) == null ? void 0 : _a.blur();
+    });
+    __publicField(this, "handleKeyDown", (e) => {
+      e.preventDefault();
+      const data = getKeyEventData(e);
+      this.inputDataUpdateCallback(data);
+    });
+    __publicField(this, "handleKeyboardContainerPointerenter", () => {
+      if (this.disabled) {
+        return;
+      }
+      if (this.inputMethodEditorElement) {
+        this.focusIME();
+      } else {
+        document.addEventListener(DocumentEvent.KEY_DOWN, this.handleKeyDown);
+      }
+    });
+    __publicField(this, "handleKeyboardContainerPointerleave", () => {
+      if (this.disabled) {
+        return;
+      }
+      if (this.inputMethodEditorElement) {
+        this.blurIME();
+      } else {
+        document.removeEventListener(DocumentEvent.KEY_DOWN, this.handleKeyDown);
+      }
+    });
+    __publicField(this, "handleIMECompositionStart", (_e) => {
+      __privateSet(this, _isComposing, true);
+    });
+    __publicField(this, "handleIMECompositionEnd", (e) => {
+      __privateSet(this, _isComposing, false);
+      const text = e.data;
+      if (text && text.length > 0) {
+        this.chineseDataUpdateCallback(new InputData(text));
+      }
+      this.clearInput();
+    });
+    __publicField(this, "handleIMEInput", (e) => {
+      const inputEvent = e;
+      if (__privateGet(this, _isComposing)) return;
+      const text = inputEvent.data;
+      if (text && text.length > 0) {
+        this.chineseDataUpdateCallback(new InputData(text));
+      }
+      this.clearInput();
+    });
+    __publicField(this, "handleIMEKeyDown", (event) => {
+      if (__privateGet(this, _isComposing)) return;
+      if (isFunctionKey(event)) {
+        const data = getKeyEventData(event);
+        if (data.keyCode === 50 && data.meta === 4096) return;
+        this.inputDataUpdateCallback(data);
+      }
+    });
+    this.logger = new Logger({
+      prefix: "KeyboardControl",
+      enabledDebug
+    });
+    this.disabled = disabled;
+    this.rootContainer = rootContainer;
+    this.inputDataUpdateCallback = inputDataUpdateCallback;
+    this.chineseDataUpdateCallback = chineseDataUpdateCallback;
+    this.videoAngle = videoAngle;
+    this.enabledIMEKeyboard = enabledIMEKeyboard;
+    this.init();
+  }
+  createKeyboardContainerElement() {
+    const keyboardContainerElement = document.createElement("div");
+    keyboardContainerElement.className = CLASS_NAME.KEYBOARD_CONTAINER_CLASS_NAME;
+    keyboardContainerElement.style.rotate = `${this.videoAngle}deg`;
+    return keyboardContainerElement;
+  }
+  createInputMethodEditor() {
+    const textareaElement = document.createElement("textarea");
+    textareaElement.classList.add(CLASS_NAME.INPUT_METHOD_EDITOR_CLASS_NAME);
+    textareaElement.autocomplete = "off";
+    textareaElement.autocapitalize = "off";
+    textareaElement.spellcheck = false;
+    return textareaElement;
+  }
+  mountNode() {
+    const keyboardContainerElement = this.createKeyboardContainerElement();
+    if (this.enabledIMEKeyboard) {
+      const inputMethodEditorElement = this.createInputMethodEditor();
+      keyboardContainerElement.appendChild(inputMethodEditorElement);
+      this.inputMethodEditorElement = inputMethodEditorElement;
+    }
+    this.rootContainer.appendChild(keyboardContainerElement);
+    this.keyboardContainerElement = keyboardContainerElement;
+  }
+  init() {
+    this.mountNode();
+    this.addEvent();
+  }
+  setKeyboardContainerSize(width, height) {
+    if (this.keyboardContainerElement) {
+      this.keyboardContainerElement.style.width = `${width}px`;
+      this.keyboardContainerElement.style.height = `${height}px`;
+    }
+  }
+  setKeyboardContainerElementStyle(style) {
+    if (this.keyboardContainerElement) {
+      this.keyboardContainerElement.style.rotate = `${style.rotate}deg`;
+    }
+  }
+  setVideoAngle(value) {
+    this.videoAngle = value;
+    this.setKeyboardContainerElementStyle({
+      rotate: value
+    });
+  }
+  openIMEKeyboard() {
+    var _a;
+    if (this.inputMethodEditorElement) {
+      return;
+    }
+    const inputMethodEditorElement = this.createInputMethodEditor();
+    if (inputMethodEditorElement) {
+      this.inputMethodEditorElement = inputMethodEditorElement;
+      (_a = this.keyboardContainerElement) == null ? void 0 : _a.appendChild(inputMethodEditorElement);
+      this.addInputMethodEditorEvent();
+    }
+  }
+  closeIMEKeyboard() {
+    var _a;
+    if (!this.inputMethodEditorElement) {
+      return;
+    }
+    this.offInputMethodEditorEvent();
+    (_a = this.keyboardContainerElement) == null ? void 0 : _a.removeChild(this.inputMethodEditorElement);
+  }
+  addKeyboardContainerEvent() {
+    var _a, _b;
+    (_a = this.keyboardContainerElement) == null ? void 0 : _a.addEventListener(DocumentEvent.POINTER_ENTER, this.handleKeyboardContainerPointerenter);
+    (_b = this.keyboardContainerElement) == null ? void 0 : _b.addEventListener(DocumentEvent.POINTER_LEAVE, this.handleKeyboardContainerPointerleave);
+  }
+  offKeyboardContainerEvent() {
+    var _a, _b;
+    (_a = this.keyboardContainerElement) == null ? void 0 : _a.removeEventListener(DocumentEvent.POINTER_ENTER, this.handleKeyboardContainerPointerenter);
+    (_b = this.keyboardContainerElement) == null ? void 0 : _b.removeEventListener(DocumentEvent.POINTER_LEAVE, this.handleKeyboardContainerPointerleave);
+    document.removeEventListener(DocumentEvent.KEY_DOWN, this.handleKeyDown);
+  }
+  addInputMethodEditorEvent() {
+    var _a, _b, _c, _d;
+    (_a = this.inputMethodEditorElement) == null ? void 0 : _a.addEventListener(DocumentEvent.COMPOSITION_START, this.handleIMECompositionStart);
+    (_b = this.inputMethodEditorElement) == null ? void 0 : _b.addEventListener(DocumentEvent.COMPOSITION_END, this.handleIMECompositionEnd);
+    (_c = this.inputMethodEditorElement) == null ? void 0 : _c.addEventListener(DocumentEvent.INPUT, this.handleIMEInput);
+    (_d = this.inputMethodEditorElement) == null ? void 0 : _d.addEventListener(DocumentEvent.KEY_DOWN, this.handleIMEKeyDown);
+  }
+  offInputMethodEditorEvent() {
+    var _a, _b, _c, _d;
+    (_a = this.inputMethodEditorElement) == null ? void 0 : _a.removeEventListener(DocumentEvent.COMPOSITION_START, this.handleIMECompositionStart);
+    (_b = this.inputMethodEditorElement) == null ? void 0 : _b.removeEventListener(DocumentEvent.COMPOSITION_END, this.handleIMECompositionEnd);
+    (_c = this.inputMethodEditorElement) == null ? void 0 : _c.removeEventListener(DocumentEvent.INPUT, this.handleIMEInput);
+    (_d = this.inputMethodEditorElement) == null ? void 0 : _d.removeEventListener(DocumentEvent.KEY_DOWN, this.handleIMEKeyDown);
+  }
+  addEvent() {
+    this.addKeyboardContainerEvent();
+    this.addInputMethodEditorEvent();
+  }
+  offEvent() {
+    this.offKeyboardContainerEvent();
+    this.offInputMethodEditorEvent();
+  }
+  destroy() {
+    var _a;
+    this.offEvent();
+    (_a = this.keyboardContainerElement) == null ? void 0 : _a.remove();
+    this.keyboardContainerElement = null;
+    this.inputMethodEditorElement = null;
+  }
+}
+_isComposing = new WeakMap();
+const _WebRTCWrapper = class _WebRTCWrapper extends EventEmitter {
+  constructor({
+    connectConfig,
+    enabledDebug = false
+  }) {
+    super();
+    __publicField(this, "logger");
+    __publicField(this, "webRtcSDKInstance", null);
+    __privateAdd(this, _direction);
+    __privateAdd(this, _screenWidth);
+    __privateAdd(this, _screenHeight);
+    __privateAdd(this, _clarityLevel);
+    __privateAdd(this, _gestureMode);
+    this.logger = new Logger({
+      prefix: "Wrapper",
+      enabledDebug
+    });
+    const webRtcSDKInstance = new WebRTCSdk(connectConfig);
+    this.webRtcSDKInstance = webRtcSDKInstance;
+    this.addEvent();
+  }
+  addEvent() {
+    if (this.webRtcSDKInstance) {
+      const webRtcSDKInstance = this.webRtcSDKInstance;
+      webRtcSDKInstance.addListener(EmitType.streamTrack, (track) => {
+        this.emit(_WebRTCWrapper.EVENTS.RECEIVE_MEDIA_STREAM_TRACK, track);
+      });
+      webRtcSDKInstance.addListener(EmitType.iceConnectionState, (state) => {
+        this.logger.log("iceConnectionState", state);
+        if (state === _WebRTCWrapper.EVENTS.CONNECTED) {
+          this.emit(_WebRTCWrapper.EVENTS.CONNECTED);
+        }
+      });
+      webRtcSDKInstance.addListener(EmitType.webrtcError, (error) => {
+        this.logger.log("webrtcError", error);
+        if (error.code !== FailCode.CAMERA && error.code !== FailCode.DATACHANNEL_ERR && error.code !== FailCode.STREAM_STATE && error.code !== FailCode.AUTH_FAILED) {
+          this.emit(_WebRTCWrapper.EVENTS.STOP_CONNECT, error);
+          this.destroy();
+        }
+        this.emit(_WebRTCWrapper.EVENTS.ERROR, error);
+      });
+      if ("arrayBuffer" in EmitType) {
+        webRtcSDKInstance.addListener(EmitType.arrayBuffer, (buffer) => {
+          this.emit(_WebRTCWrapper.EVENTS.RECEIVE_ARRAY_BUFFER, buffer);
+        });
+      }
+      webRtcSDKInstance.addListener(EmitType.statisticInfo, (info) => {
+        this.emit(_WebRTCWrapper.EVENTS.STATISTIC_INFO, info);
+      });
+      webRtcSDKInstance.addListener(EmitType.cloudStatusChanged, (cloudStatus) => {
+        if (cloudStatus) {
+          this.logger.log("cloudStatusChanged", cloudStatus);
+          const { direction, screenWidth, screenHeight, clarityLevel, gestureMode } = cloudStatus;
+          if (__privateGet(this, _direction) === void 0 || __privateGet(this, _direction) !== direction) {
+            this.emit(_WebRTCWrapper.EVENTS.DIRECTION_CHANGE, direction === ContainerDirection.Vertical ? 0 : -90);
+            __privateSet(this, _direction, direction);
+          }
+          if (__privateGet(this, _screenWidth) === void 0 || __privateGet(this, _screenHeight) === void 0 || (__privateGet(this, _screenWidth) !== screenWidth || __privateGet(this, _screenHeight) !== screenHeight)) {
+            this.emit(_WebRTCWrapper.EVENTS.RESIZE, {
+              screenWidth,
+              screenHeight
+            });
+            __privateSet(this, _screenWidth, screenWidth);
+            __privateSet(this, _screenHeight, screenHeight);
+          }
+          if (__privateGet(this, _clarityLevel) === void 0 || __privateGet(this, _clarityLevel) !== clarityLevel) {
+            this.emit(_WebRTCWrapper.EVENTS.CLARITY_LEVEL_CHANGE, clarityLevel);
+            __privateSet(this, _clarityLevel, clarityLevel);
+          }
+          if (__privateGet(this, _gestureMode) === void 0 || __privateGet(this, _gestureMode) !== gestureMode) {
+            this.emit(_WebRTCWrapper.EVENTS.GESTURE_MODE_CHANGE, gestureMode);
+            __privateSet(this, _gestureMode, gestureMode);
+          }
+        }
+      });
+    }
+  }
+  offEvents() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.removeAllListeners();
+  }
+  startConnection() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.startConnection();
+  }
+  sendChannelData(type, data) {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendChannelData(type, data);
+  }
+  sendClickData(data) {
+    this.sendChannelData(ChannelDataType.ClickData, data);
+  }
+  sendActionWheel(data) {
+    this.sendChannelData(ChannelDataType.ActionWheel, data);
+  }
+  sendActionInput(data) {
+    this.sendChannelData(ChannelDataType.ActionInput, data);
+  }
+  sendActionChinese(data) {
+    this.sendChannelData(ChannelDataType.ActionChinese, data);
+  }
+  goBack() {
+    const keyEvent = new KeyEventData(MenuKey.BACK, 0);
+    this.sendActionInput(keyEvent);
+  }
+  goHome() {
+    const keyEvent = new KeyEventData(MenuKey.HOME, 0);
+    this.sendActionInput(keyEvent);
+  }
+  goTask() {
+    const keyEvent = new KeyEventData(MenuKey.TASK, 0);
+    this.sendActionInput(keyEvent);
+  }
+  enableAudio() {
+    this.sendChannelData(ChannelDataType.ActionCommandEvent, {
+      action: ActionCommandEventType.ACTION_CONTROL_AUDIO,
+      value: ActionCommandEventValue.ENABLE
+    });
+  }
+  disableAudio() {
+    this.sendChannelData(ChannelDataType.ActionCommandEvent, {
+      action: ActionCommandEventType.ACTION_CONTROL_AUDIO,
+      value: ActionCommandEventValue.DISABLE
+    });
+  }
+  /**
+   * @param level 
+   * 高清: 3
+   * 标清: 2
+   * 流畅: 1
+   */
+  changeLevel(level) {
+    if (level < ClarityLevel.FLUENT || level > ClarityLevel.HIGH_DEFINITION) {
+      this.logger.error("清晰度等级错误，只能是1-3之间，分别是：流畅、标清 和 高清");
+      return;
+    }
+    this.sendChannelData(ChannelDataType.ActionClarity, new ClarityData(level));
+  }
+  /**
+   * @param value 
+   * 发送剪贴板的内容
+   */
+  sendClipboardData(value) {
+    this.sendChannelData(ChannelDataType.ClipboardData, value);
+  }
+  setNavigationMode(mode) {
+    const data = new GestureData(mode);
+    this.sendChannelData(ChannelDataType.ActionGesture, data);
+  }
+  switchToGestureNavigation() {
+    this.setNavigationMode(GestureMode.GESTURE_NAVIGATION);
+  }
+  switchToThreeButtonNavigation() {
+    this.setNavigationMode(GestureMode.THREE_BUTTON_NAVIGATION);
+  }
+  destroy() {
+    var _a;
+    this.logger.log("destroy");
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.stop();
+    this.offEvents();
+    this.webRtcSDKInstance = null;
+  }
+};
+_direction = new WeakMap();
+_screenWidth = new WeakMap();
+_screenHeight = new WeakMap();
+_clarityLevel = new WeakMap();
+_gestureMode = new WeakMap();
+__publicField(_WebRTCWrapper, "EVENTS", {
+  CONNECTED: "connected",
+  DIRECTION_CHANGE: "directionChange",
+  RESIZE: "resize",
+  CLARITY_LEVEL_CHANGE: "clarityLevel",
+  GESTURE_MODE_CHANGE: "gestureMode",
+  RECEIVE_MEDIA_STREAM_TRACK: "receiveMediaStreamTrack",
+  RECEIVE_ARRAY_BUFFER: "receiveArrayBuffer",
+  ERROR: "error",
+  STOP_CONNECT: "stopConnect",
+  STATISTIC_INFO: "statisticInfo",
+  CLICK_DATA: ChannelDataType.ClickData
+});
+let WebRTCWrapper = _WebRTCWrapper;
+var SDKEvents = /* @__PURE__ */ ((SDKEvents2) => {
+  SDKEvents2["CHANNEL_EVENT"] = "channelEvent";
+  SDKEvents2["GROUP_CONTROL_EVENT"] = "groupControlEvent";
+  SDKEvents2["LOADED_SUCCESS"] = "loadedSuccess";
+  SDKEvents2["LOADED_FAILURE"] = "loadedFailure";
+  return SDKEvents2;
+})(SDKEvents || {});
+const _UniSDK = class _UniSDK extends EventEmitter {
+  constructor({
+    mountedElement,
+    connectConfig,
+    cloudDeviceSize = {
+      width: 720,
+      height: 1280
+    },
+    disabled = false,
+    enabledDebug = false,
+    isGroup = false,
+    disabledVerticalSwipe = false,
+    enabledIMEKeyboard = false,
+    remoteViewBackgroundColor = "transparent",
+    videoAngle = 0,
+    cursorType = 0,
+    enabledDecode = false
+  }) {
+    super();
+    __publicField(this, "logger");
+    __publicField(this, "mountedElement");
+    __publicField(this, "connectConfig");
+    __publicField(this, "cloudDeviceSize");
+    __publicField(this, "videoContainerElement", null);
+    __publicField(this, "containerResizeObserver", null);
+    __publicField(this, "remoteViewBackgroundColor", "transparent");
+    __publicField(this, "remoteController", null);
+    __publicField(this, "webRtcSDKInstance", null);
+    __publicField(this, "mouseTouchControl", null);
+    __publicField(this, "keyboardControl", null);
+    __publicField(this, "isGroup", false);
+    __publicField(this, "videoAngle", 0);
+    __publicField(this, "streamAngle", 0);
+    __publicField(this, "widthRatio", 0);
+    __publicField(this, "heightRatio", 0);
+    __publicField(this, "cursorType", 0);
+    __publicField(this, "disabled", false);
+    __publicField(this, "enabledDebug", false);
+    __publicField(this, "disabledVerticalSwipe", false);
+    __publicField(this, "enabledIMEKeyboard", false);
+    __publicField(this, "enabledDecode", false);
+    this.logger = new Logger({
+      prefix: "SDK",
+      enabledDebug
+    });
+    this.mountedElement = mountedElement;
+    this.connectConfig = connectConfig;
+    this.disabled = disabled;
+    this.remoteViewBackgroundColor = remoteViewBackgroundColor;
+    this.videoAngle = videoAngle;
+    this.cursorType = cursorType;
+    this.cloudDeviceSize = cloudDeviceSize;
+    this.isGroup = isGroup;
+    this.disabledVerticalSwipe = disabledVerticalSwipe;
+    this.enabledIMEKeyboard = enabledIMEKeyboard;
+    this.enabledDebug = enabledDebug;
+    this.enabledDecode = enabledDecode;
+  }
+  setVideoAngle(angle) {
+    var _a;
+    this.videoAngle = angle;
+    (_a = this.keyboardControl) == null ? void 0 : _a.setVideoAngle(angle);
+  }
+  getVideoAngle() {
+    return this.videoAngle;
+  }
+  setStreamAngle(angle) {
+    var _a;
+    this.streamAngle = angle;
+    (_a = this.mouseTouchControl) == null ? void 0 : _a.setStreamAngle(angle);
+  }
+  setCloudDeviceSize(value) {
+    var _a;
+    this.cloudDeviceSize = value;
+    (_a = this.mouseTouchControl) == null ? void 0 : _a.setCloudDeviceSize(value);
+  }
+  validateParams() {
+    this.logger.log("validateParams");
+    if (this.mountedElement instanceof HTMLElement) {
+      return true;
+    }
+    if (this.mountedElement && typeof this.mountedElement === "string") {
+      const element = document.querySelector(this.mountedElement);
+      if (!element) {
+        throw new Error(`挂载的 "${this.mountedElement}" 节点不存在`);
+      }
+      this.mountedElement = element;
+    } else {
+      throw new Error("挂载节点找不到");
+    }
+  }
+  init() {
+    this.validateParams();
+    this.createNode();
+    this.mounted();
+    this.addEvent();
+  }
+  createVideoContainerElement() {
+    const videoContainerElement = document.createElement("div");
+    videoContainerElement.className = CLASS_NAME.CONTAINER_CLASS_NAME;
+    return videoContainerElement;
+  }
+  setKeyboardContainerSize(width, height) {
+    var _a, _b;
+    (_b = (_a = this.keyboardControl) == null ? void 0 : _a.setKeyboardContainerSize) == null ? void 0 : _b.call(_a, width, height);
+  }
+  createNode() {
+    this.logger.log("createNode");
+    const videoContainerElement = this.createVideoContainerElement();
+    this.videoContainerElement = videoContainerElement;
+  }
+  calculateSize(w, h) {
+    var _a;
+    const isRotated = this.videoAngle % 180 !== 0;
+    const containerWidth = isRotated ? h : w;
+    const containerHeight = isRotated ? w : h;
+    const cloudDeviceSize = this.cloudDeviceSize;
+    const vWidth = cloudDeviceSize.width;
+    const vHeight = cloudDeviceSize.height;
+    const aspect = vWidth / vHeight;
+    const videoHeight = containerWidth / aspect;
+    let width;
+    let height;
+    if (videoHeight > containerHeight) {
+      height = containerHeight;
+      width = height * aspect;
+    } else {
+      width = containerWidth;
+      height = videoHeight;
+    }
+    this.widthRatio = vWidth / width;
+    this.heightRatio = vHeight / height;
+    (_a = this.mouseTouchControl) == null ? void 0 : _a.setWidthRatio(this.widthRatio);
+    this.setKeyboardContainerSize(width, height);
+  }
+  addContainerResizeListener() {
+    if (!this.videoContainerElement) {
+      return;
+    }
+    const resizeObserver = new ResizeObserver(([entry]) => {
+      const { width, height } = entry.contentRect;
+      this.calculateSize(width, height);
+    });
+    resizeObserver.observe(this.videoContainerElement);
+    this.containerResizeObserver = resizeObserver;
+  }
+  offContainerResizeListener() {
+    if (this.containerResizeObserver && this.videoContainerElement) {
+      this.containerResizeObserver.unobserve(this.videoContainerElement);
+    }
+  }
+  addEvent() {
+    this.addContainerResizeListener();
+  }
+  offEvents() {
+    this.logger.log("offEvents");
+    this.offContainerResizeListener();
+    this.removeAllListeners();
+  }
+  createRemoteController() {
+    const remoteController = new RemoteController({
+      rootContainer: this.videoContainerElement,
+      enabledDecode: this.enabledDecode,
+      loadedSuccess: () => {
+        this.logger.log("loadedSuccess");
+        this.emit(_UniSDK.EVENTS.LOADED_SUCCESS);
+      },
+      loadedFailure: (reason) => {
+        this.logger.log("loadedFailure");
+        this.emit(_UniSDK.EVENTS.LOADED_FAILURE, reason);
+      },
+      enabledDebug: this.enabledDebug
+    });
+    this.remoteController = remoteController;
+    return remoteController;
+  }
+  createMouseTouchControl(remoteElement) {
+    const mouseTouchControl = new MouseTouchControl({
+      remoteElement,
+      isGroup: this.isGroup,
+      isMove: this.disabledVerticalSwipe,
+      videoAngle: this.videoAngle,
+      widthRatio: this.widthRatio,
+      streamAngle: this.streamAngle,
+      cloudDeviceSize: this.cloudDeviceSize,
+      touchDataUpdateCallback: (data) => {
+        var _a;
+        (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendClickData(data);
+      },
+      wheelDataUpdateCallback: (data) => {
+        var _a;
+        (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendActionWheel(data);
+      },
+      enabledDebug: this.enabledDebug
+    });
+    this.mouseTouchControl = mouseTouchControl;
+    return mouseTouchControl;
+  }
+  createKeyboardControl() {
+    const keyboardControl = new KeyboardControl({
+      rootContainer: this.videoContainerElement,
+      videoAngle: this.videoAngle,
+      disabled: this.disabled,
+      enabledIMEKeyboard: this.enabledIMEKeyboard,
+      inputDataUpdateCallback: (data) => {
+        var _a;
+        (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendActionInput(data);
+      },
+      chineseDataUpdateCallback: (data) => {
+        var _a;
+        (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendActionChinese(data);
+      },
+      enabledDebug: this.enabledDebug
+    });
+    this.keyboardControl = keyboardControl;
+    return keyboardControl;
+  }
+  async mounted() {
+    this.logger.log("mounted");
+    if (this.mountedElement instanceof HTMLElement) {
+      this.mountedElement.appendChild(this.videoContainerElement);
+      requestAnimationFrame(() => {
+        var _a;
+        const { width, height } = this.videoContainerElement.getBoundingClientRect();
+        this.calculateSize(width, height);
+        const remoteController = this.createRemoteController();
+        const webRtcSDKInstance = new WebRTCWrapper({
+          connectConfig: {
+            ...this.connectConfig,
+            isGroup: this.isGroup
+          },
+          enabledDebug: this.enabledDebug
+        });
+        webRtcSDKInstance.startConnection();
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.RECEIVE_MEDIA_STREAM_TRACK, (track) => {
+          remoteController.startPlay(track);
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.RECEIVE_ARRAY_BUFFER, (buffer) => {
+          remoteController.startDecode(buffer);
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.DIRECTION_CHANGE, (value) => {
+          this.setStreamAngle(value);
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.RESIZE, (screen) => {
+          this.setCloudDeviceSize({
+            width: screen.screenWidth,
+            height: screen.screenHeight
+          });
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.CONNECTED, () => {
+          this.emit(_UniSDK.EVENTS.CONNECTED);
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.STOP_CONNECT, () => {
+          var _a2;
+          (_a2 = this.remoteController) == null ? void 0 : _a2.stopPlay();
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.STATISTIC_INFO, (info) => {
+          this.emit(_UniSDK.EVENTS.STATISTIC_INFO, info);
+        });
+        webRtcSDKInstance.addListener(WebRTCWrapper.EVENTS.CLARITY_LEVEL_CHANGE, (level) => {
+          this.emit(_UniSDK.EVENTS.CLARITY_LEVEL_CHANGE, level);
+        });
+        this.webRtcSDKInstance = webRtcSDKInstance;
+        const keyboardControl = this.createKeyboardControl();
+        (_a = keyboardControl.keyboardContainerElement) == null ? void 0 : _a.append(remoteController.remoteElement);
+        this.createMouseTouchControl(remoteController.remoteElement);
+      });
+    }
+  }
+  startConnection() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.startConnection();
+  }
+  goBack() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.goBack();
+  }
+  goHome() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.goHome();
+  }
+  goTask() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.goTask();
+  }
+  enableAudio() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.enableAudio();
+  }
+  disableAudio() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.disableAudio();
+  }
+  changeLevel(value) {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.changeLevel(value);
+  }
+  sendClipboardData(value) {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.sendClipboardData(value);
+  }
+  openIMEKeyboard() {
+    var _a;
+    (_a = this.keyboardControl) == null ? void 0 : _a.openIMEKeyboard();
+  }
+  closeIMEKeyboard() {
+    var _a;
+    (_a = this.keyboardControl) == null ? void 0 : _a.closeIMEKeyboard();
+  }
+  switchToGestureNavigation() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.switchToGestureNavigation();
+  }
+  switchToThreeButtonNavigation() {
+    var _a;
+    (_a = this.webRtcSDKInstance) == null ? void 0 : _a.switchToThreeButtonNavigation();
+  }
+  destroy() {
+    var _a, _b, _c, _d;
+    this.logger.log("destroy");
+    (_a = this.remoteController) == null ? void 0 : _a.destroy();
+    (_b = this.mouseTouchControl) == null ? void 0 : _b.destroy();
+    (_c = this.webRtcSDKInstance) == null ? void 0 : _c.destroy();
+    this.offEvents();
+    (_d = this.videoContainerElement) == null ? void 0 : _d.remove();
+  }
+};
+__publicField(_UniSDK, "EVENTS", {
+  ...SDKEvents,
+  ...WebRTCWrapper.EVENTS
+});
+__publicField(_UniSDK, "CURSOR_TYPE", CursorType);
+__publicField(_UniSDK, "CLARITY_LEVEL", ClarityLevel);
+__publicField(_UniSDK, "CLARITY_LEVEL_LIST", CLARITY_LEVEL_LIST);
+let UniSDK = _UniSDK;
+export {
+  UniSDK
+};