call-live-sdk1 0.0.1 → 0.0.3

package/dist/call-live-sdk.es.js

@@ -25589,6 +25589,15 @@ const createImpl = (createState) => {
   return useBoundStore;
 };
 const create$c = (createState) => createState ? createImpl(createState) : createImpl;
+var define_import_meta_env_default = {};
+const envConfig$1 = {
+  // 环境名称
+  env: define_import_meta_env_default.VITE_ENV || "development",
+  // SDK 授权配置
+  queenSdkKey: "hP7in57avgV12eJB7dff0052b8ac0481da28769b23b37bc77",
+  // API 相关配置
+  liveProxyUrl: "https://api.lfeiyao.com"
+};
 var ErrorSeverity = /* @__PURE__ */ ((ErrorSeverity2) => {
   ErrorSeverity2["SEVERE"] = "severe";
   ErrorSeverity2["WARNING"] = "warning";
@@ -25601,27 +25610,34 @@ var GlobalErrorType = /* @__PURE__ */ ((GlobalErrorType2) => {
   GlobalErrorType2["OTHER_ERROR"] = "other_error";
   return GlobalErrorType2;
 })(GlobalErrorType || {});
-const useSdkStore = create$c((set3, get4) => ({
+const envConfig = {
   callConfig: {
-    el: "root",
-    sign: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlZGl0aW9uX2lkIjo0NywiZXhwIjoxNzY2OTg2NDY2LCJpYXQiOjE3NjYzODE2NjYsIm5iZiI6MTc2NjM4MTY2Niwic3ViX3VzZXJpZCI6MCwidXNlcmlkIjoiMzg3MzU5ODkifQ.PoX2zUuJycp_Qt8obbKNO1m6GcAWBYklaeIi2IgxnEI",
-    liveId: 53065,
-    title: "test",
+    el: envConfig$1.env === "production" ? "" : "root",
+    sign: envConfig$1.env === "production" ? "" : "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlZGl0aW9uX2lkIjo0NywiZXhwIjoxNzY2OTg2NDY2LCJpYXQiOjE3NjYzODE2NjYsIm5iZiI6MTc2NjM4MTY2Niwic3ViX3VzZXJpZCI6MCwidXNlcmlkIjoiMzg3MzU5ODkifQ.PoX2zUuJycp_Qt8obbKNO1m6GcAWBYklaeIi2IgxnEI",
+    liveId: envConfig$1.env === "production" ? null : 53065,
+    title: envConfig$1.env === "production" ? "" : "test",
     components: {
       chat: { enabled: true },
       team: { enabled: true },
       call: { enabled: true, inviteLink: "" }
     },
-    agentId: 38735989,
-    apiDomain: "https://api.lfeiyao.com"
+    agentId: envConfig$1.env === "production" ? null : 38735989,
+    apiDomain: envConfig$1.liveProxyUrl
   },
   guestConfig: {
     el: "",
-    sign: "",
-    liveId: 53065,
-    agentId: 38735989,
-    apiDomain: "https://api.lfeiyao.com"
+    sign: envConfig$1.env === "production" ? "" : "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlZGl0aW9uX2lkIjo0NywiZXhwIjoxNzY2OTg2NDY2LCJpYXQiOjE3NjYzODE2NjYsIm5iZiI6MTc2NjM4MTY2Niwic3ViX3VzZXJpZCI6MCwidXNlcmlkIjoiMzg3MzU5ODkifQ.PoX2zUuJycp_Qt8obbKNO1m6GcAWBYklaeIi2IgxnEI",
+    liveId: envConfig$1.env === "production" ? null : 53065,
+    agentId: envConfig$1.env === "production" ? null : 38735989,
+    apiDomain: envConfig$1.liveProxyUrl
   },
+  styleConfig: {
+    minHeight: 770,
+    minWidth: 1500
+  }
+};
+const useSdkStore = create$c((set3, get4) => ({
+  ...envConfig,
   // 初始错误状态
   globalError: null,
   setGuestConfig: (config2) => set3({ guestConfig: config2 }),
@@ -25676,6 +25692,178 @@ const useSdkStore = create$c((set3, get4) => ({
   clearGlobalError: () => set3({ globalError: null })
 }));
 const useLiveId = () => useSdkStore((state) => state.getLiveId());
+function withPureRenderTheme(Component) {
+  return (props) => /* @__PURE__ */ reactExports.createElement(ConfigProvider$1, {
+    theme: {
+      token: {
+        motion: false,
+        zIndexPopupBase: 0
+      }
+    }
+  }, /* @__PURE__ */ reactExports.createElement(Component, Object.assign({}, props)));
+}
+const genPurePanel = (Component, alignPropName, postProps, defaultPrefixCls2, getDropdownCls) => {
+  const PurePanel2 = (props) => {
+    const {
+      prefixCls: customizePrefixCls,
+      style: style2
+    } = props;
+    const holderRef = reactExports.useRef(null);
+    const [popupHeight, setPopupHeight] = reactExports.useState(0);
+    const [popupWidth, setPopupWidth] = reactExports.useState(0);
+    const [open2, setOpen] = useMergedState(false, {
+      value: props.open
+    });
+    const {
+      getPrefixCls
+    } = reactExports.useContext(ConfigContext);
+    const prefixCls = getPrefixCls(defaultPrefixCls2 || "select", customizePrefixCls);
+    reactExports.useEffect(() => {
+      setOpen(true);
+      if (typeof ResizeObserver !== "undefined") {
+        const resizeObserver2 = new ResizeObserver((entries) => {
+          const element = entries[0].target;
+          setPopupHeight(element.offsetHeight + 8);
+          setPopupWidth(element.offsetWidth);
+        });
+        const interval = setInterval(() => {
+          var _a2;
+          const dropdownCls = getDropdownCls ? `.${getDropdownCls(prefixCls)}` : `.${prefixCls}-dropdown`;
+          const popup = (_a2 = holderRef.current) === null || _a2 === void 0 ? void 0 : _a2.querySelector(dropdownCls);
+          if (popup) {
+            clearInterval(interval);
+            resizeObserver2.observe(popup);
+          }
+        }, 10);
+        return () => {
+          clearInterval(interval);
+          resizeObserver2.disconnect();
+        };
+      }
+    }, [prefixCls]);
+    let mergedProps = Object.assign(Object.assign({}, props), {
+      style: Object.assign(Object.assign({}, style2), {
+        margin: 0
+      }),
+      open: open2,
+      visible: open2,
+      getPopupContainer: () => holderRef.current
+    });
+    if (postProps) {
+      mergedProps = postProps(mergedProps);
+    }
+    if (alignPropName) {
+      Object.assign(mergedProps, {
+        [alignPropName]: {
+          overflow: {
+            adjustX: false,
+            adjustY: false
+          }
+        }
+      });
+    }
+    const mergedStyle = {
+      paddingBottom: popupHeight,
+      position: "relative",
+      minWidth: popupWidth
+    };
+    return /* @__PURE__ */ reactExports.createElement("div", {
+      ref: holderRef,
+      style: mergedStyle
+    }, /* @__PURE__ */ reactExports.createElement(Component, Object.assign({}, mergedProps)));
+  };
+  return withPureRenderTheme(PurePanel2);
+};
+var __rest$1d = function(s3, e3) {
+  var t2 = {};
+  for (var p2 in s3)
+    if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
+      t2[p2] = s3[p2];
+  if (s3 != null && typeof Object.getOwnPropertySymbols === "function")
+    for (var i = 0, p2 = Object.getOwnPropertySymbols(s3); i < p2.length; i++) {
+      if (e3.indexOf(p2[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s3, p2[i]))
+        t2[p2[i]] = s3[p2[i]];
+    }
+  return t2;
+};
+const PurePanel$b = (props) => {
+  const {
+    prefixCls: customizePrefixCls,
+    className,
+    closeIcon,
+    closable,
+    type: type4,
+    title,
+    children,
+    footer
+  } = props, restProps = __rest$1d(props, ["prefixCls", "className", "closeIcon", "closable", "type", "title", "children", "footer"]);
+  const {
+    getPrefixCls
+  } = reactExports.useContext(ConfigContext);
+  const rootPrefixCls = getPrefixCls();
+  const prefixCls = customizePrefixCls || getPrefixCls("modal");
+  const rootCls = useCSSVarCls(rootPrefixCls);
+  const [wrapCSSVar, hashId, cssVarCls] = useStyle$$(prefixCls, rootCls);
+  const confirmPrefixCls = `${prefixCls}-confirm`;
+  let additionalProps = {};
+  if (type4) {
+    additionalProps = {
+      closable: closable !== null && closable !== void 0 ? closable : false,
+      title: "",
+      footer: "",
+      children: /* @__PURE__ */ reactExports.createElement(ConfirmContent, Object.assign({}, props, {
+        prefixCls,
+        confirmPrefixCls,
+        rootPrefixCls,
+        content: children
+      }))
+    };
+  } else {
+    additionalProps = {
+      closable: closable !== null && closable !== void 0 ? closable : true,
+      title,
+      footer: footer !== null && /* @__PURE__ */ reactExports.createElement(Footer$3, Object.assign({}, props)),
+      children
+    };
+  }
+  return wrapCSSVar(/* @__PURE__ */ reactExports.createElement(Panel$2, Object.assign({
+    prefixCls,
+    className: classNames$1(hashId, `${prefixCls}-pure-panel`, type4 && confirmPrefixCls, type4 && `${confirmPrefixCls}-${type4}`, className, cssVarCls, rootCls)
+  }, restProps, {
+    closeIcon: renderCloseIcon(prefixCls, closeIcon),
+    closable
+  }, additionalProps)));
+};
+const PurePanel$c = withPureRenderTheme(PurePanel$b);
+function modalWarn(props) {
+  return confirm$1(withWarn(props));
+}
+const Modal = Modal$1;
+Modal.useModal = useModal;
+Modal.info = function infoFn(props) {
+  return confirm$1(withInfo(props));
+};
+Modal.success = function successFn(props) {
+  return confirm$1(withSuccess(props));
+};
+Modal.error = function errorFn(props) {
+  return confirm$1(withError(props));
+};
+Modal.warning = modalWarn;
+Modal.warn = modalWarn;
+Modal.confirm = function confirmFn(props) {
+  return confirm$1(withConfirm(props));
+};
+Modal.destroyAll = function destroyAllFn() {
+  while (destroyFns.length) {
+    const close = destroyFns.pop();
+    if (close) {
+      close();
+    }
+  }
+};
+Modal.config = modalGlobalConfig;
+Modal._InternalPanelDoNotUseOrYouWillBeFired = PurePanel$c;
 const genCardHeadStyle = (token2) => {
   const {
     antCls,
@@ -31067,7 +31255,7 @@ function useAnimateConfig(prefixCls, animated2 = {
   }
   return mergedAnimated;
 }
-var __rest$1d = function(s3, e3) {
+var __rest$1c = function(s3, e3) {
   var t2 = {};
   for (var p2 in s3)
     if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
@@ -31101,7 +31289,7 @@ function useLegacyItems$2(items, children) {
       } = node2;
       const _a2 = props || {}, {
         tab: tab2
-      } = _a2, restProps = __rest$1d(_a2, ["tab"]);
+      } = _a2, restProps = __rest$1c(_a2, ["tab"]);
       const item = Object.assign(Object.assign({
         key: String(key)
       }, restProps), {
@@ -32010,7 +32198,7 @@ const useStyle$X = genStyleHooks("Tabs", (token2) => {
   return [genSizeStyle$4(tabsToken), genRtlStyle$2(tabsToken), genPositionStyle(tabsToken), genDropdownStyle(tabsToken), genCardStyle(tabsToken), genTabsStyle(tabsToken), genMotionStyle$2(tabsToken)];
 }, prepareComponentToken$u);
 const TabPane$2 = () => null;
-var __rest$1c = function(s3, e3) {
+var __rest$1b = function(s3, e3) {
   var t2 = {};
   for (var p2 in s3)
     if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
@@ -32045,7 +32233,7 @@ const InternalTabs = /* @__PURE__ */ reactExports.forwardRef((props, ref) => {
     indicator,
     destroyInactiveTabPane,
     destroyOnHidden
-  } = props, otherProps = __rest$1c(props, ["type", "className", "rootClassName", "size", "onEdit", "hideAdd", "centered", "addIcon", "removeIcon", "moreIcon", "more", "popupClassName", "children", "items", "animated", "style", "indicatorSize", "indicator", "destroyInactiveTabPane", "destroyOnHidden"]);
+  } = props, otherProps = __rest$1b(props, ["type", "className", "rootClassName", "size", "onEdit", "hideAdd", "centered", "addIcon", "removeIcon", "moreIcon", "more", "popupClassName", "children", "items", "animated", "style", "indicatorSize", "indicator", "destroyInactiveTabPane", "destroyOnHidden"]);
   const {
     prefixCls: customizePrefixCls
   } = otherProps;
@@ -32113,7 +32301,7 @@ const InternalTabs = /* @__PURE__ */ reactExports.forwardRef((props, ref) => {
 });
 const Tabs$2 = InternalTabs;
 Tabs$2.TabPane = TabPane$2;
-var __rest$1b = function(s3, e3) {
+var __rest$1a = function(s3, e3) {
   var t2 = {};
   for (var p2 in s3)
     if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
@@ -32130,7 +32318,7 @@ const Grid$1 = (_a2) => {
     prefixCls,
     className,
     hoverable = true
-  } = _a2, props = __rest$1b(_a2, ["prefixCls", "className", "hoverable"]);
+  } = _a2, props = __rest$1a(_a2, ["prefixCls", "className", "hoverable"]);
   const {
     getPrefixCls
   } = reactExports.useContext(ConfigContext);
@@ -32161,7 +32349,7 @@ const useVariant = (component, variant, legacyBordered) => {
   const enableVariantCls = Variants.includes(mergedVariant);
   return [mergedVariant, enableVariantCls];
 };
-var __rest$1a = function(s3, e3) {
+var __rest$19 = function(s3, e3) {
   var t2 = {};
   for (var p2 in s3)
     if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
@@ -32218,7 +32406,7 @@ const Card$2 = /* @__PURE__ */ reactExports.forwardRef((props, ref) => {
     tabProps = {},
     classNames: customClassNames,
     styles: customStyles
-  } = props, others = __rest$1a(props, ["prefixCls", "className", "rootClassName", "style", "extra", "headStyle", "bodyStyle", "title", "loading", "bordered", "variant", "size", "type", "cover", "actions", "tabList", "children", "activeTabKey", "defaultActiveTabKey", "tabBarExtraContent", "hoverable", "tabProps", "classNames", "styles"]);
+  } = props, others = __rest$19(props, ["prefixCls", "className", "rootClassName", "style", "extra", "headStyle", "bodyStyle", "title", "loading", "bordered", "variant", "size", "type", "cover", "actions", "tabList", "children", "activeTabKey", "defaultActiveTabKey", "tabBarExtraContent", "hoverable", "tabProps", "classNames", "styles"]);
   const {
     getPrefixCls,
     direction,
@@ -32272,7 +32460,7 @@ const Card$2 = /* @__PURE__ */ reactExports.forwardRef((props, ref) => {
     items: tabList.map((_a2) => {
       var {
         tab: tab2
-      } = _a2, item = __rest$1a(_a2, ["tab"]);
+      } = _a2, item = __rest$19(_a2, ["tab"]);
       return Object.assign({
         label: tab2
       }, item);
@@ -32332,7 +32520,7 @@ const Card$2 = /* @__PURE__ */ reactExports.forwardRef((props, ref) => {
     style: mergedStyle
   }), head, coverDom, body, actionDom));
 });
-var __rest$19 = function(s3, e3) {
+var __rest$18 = function(s3, e3) {
   var t2 = {};
   for (var p2 in s3)
     if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
@@ -32351,7 +32539,7 @@ const Meta = (props) => {
     avatar,
     title,
     description: description2
-  } = props, others = __rest$19(props, ["prefixCls", "className", "avatar", "title", "description"]);
+  } = props, others = __rest$18(props, ["prefixCls", "className", "avatar", "title", "description"]);
   const {
     getPrefixCls
   } = reactExports.useContext(ConfigContext);
@@ -33193,184 +33381,16 @@ const ErrorPage = ({
     })
   });
 };
-function withPureRenderTheme(Component) {
-  return (props) => /* @__PURE__ */ reactExports.createElement(ConfigProvider$1, {
-    theme: {
-      token: {
-        motion: false,
-        zIndexPopupBase: 0
-      }
-    }
-  }, /* @__PURE__ */ reactExports.createElement(Component, Object.assign({}, props)));
-}
-const genPurePanel = (Component, alignPropName, postProps, defaultPrefixCls2, getDropdownCls) => {
-  const PurePanel2 = (props) => {
-    const {
-      prefixCls: customizePrefixCls,
-      style: style2
-    } = props;
-    const holderRef = reactExports.useRef(null);
-    const [popupHeight, setPopupHeight] = reactExports.useState(0);
-    const [popupWidth, setPopupWidth] = reactExports.useState(0);
-    const [open2, setOpen] = useMergedState(false, {
-      value: props.open
-    });
-    const {
-      getPrefixCls
-    } = reactExports.useContext(ConfigContext);
-    const prefixCls = getPrefixCls(defaultPrefixCls2 || "select", customizePrefixCls);
-    reactExports.useEffect(() => {
-      setOpen(true);
-      if (typeof ResizeObserver !== "undefined") {
-        const resizeObserver2 = new ResizeObserver((entries) => {
-          const element = entries[0].target;
-          setPopupHeight(element.offsetHeight + 8);
-          setPopupWidth(element.offsetWidth);
-        });
-        const interval = setInterval(() => {
-          var _a2;
-          const dropdownCls = getDropdownCls ? `.${getDropdownCls(prefixCls)}` : `.${prefixCls}-dropdown`;
-          const popup = (_a2 = holderRef.current) === null || _a2 === void 0 ? void 0 : _a2.querySelector(dropdownCls);
-          if (popup) {
-            clearInterval(interval);
-            resizeObserver2.observe(popup);
-          }
-        }, 10);
-        return () => {
-          clearInterval(interval);
-          resizeObserver2.disconnect();
-        };
-      }
-    }, [prefixCls]);
-    let mergedProps = Object.assign(Object.assign({}, props), {
-      style: Object.assign(Object.assign({}, style2), {
-        margin: 0
-      }),
-      open: open2,
-      visible: open2,
-      getPopupContainer: () => holderRef.current
-    });
-    if (postProps) {
-      mergedProps = postProps(mergedProps);
-    }
-    if (alignPropName) {
-      Object.assign(mergedProps, {
-        [alignPropName]: {
-          overflow: {
-            adjustX: false,
-            adjustY: false
-          }
-        }
-      });
-    }
-    const mergedStyle = {
-      paddingBottom: popupHeight,
-      position: "relative",
-      minWidth: popupWidth
-    };
-    return /* @__PURE__ */ reactExports.createElement("div", {
-      ref: holderRef,
-      style: mergedStyle
-    }, /* @__PURE__ */ reactExports.createElement(Component, Object.assign({}, mergedProps)));
-  };
-  return withPureRenderTheme(PurePanel2);
-};
-var __rest$18 = function(s3, e3) {
-  var t2 = {};
-  for (var p2 in s3)
-    if (Object.prototype.hasOwnProperty.call(s3, p2) && e3.indexOf(p2) < 0)
-      t2[p2] = s3[p2];
-  if (s3 != null && typeof Object.getOwnPropertySymbols === "function")
-    for (var i = 0, p2 = Object.getOwnPropertySymbols(s3); i < p2.length; i++) {
-      if (e3.indexOf(p2[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s3, p2[i]))
-        t2[p2[i]] = s3[p2[i]];
-    }
-  return t2;
-};
-const PurePanel$b = (props) => {
-  const {
-    prefixCls: customizePrefixCls,
-    className,
-    closeIcon,
-    closable,
-    type: type4,
-    title,
-    children,
-    footer
-  } = props, restProps = __rest$18(props, ["prefixCls", "className", "closeIcon", "closable", "type", "title", "children", "footer"]);
-  const {
-    getPrefixCls
-  } = reactExports.useContext(ConfigContext);
-  const rootPrefixCls = getPrefixCls();
-  const prefixCls = customizePrefixCls || getPrefixCls("modal");
-  const rootCls = useCSSVarCls(rootPrefixCls);
-  const [wrapCSSVar, hashId, cssVarCls] = useStyle$$(prefixCls, rootCls);
-  const confirmPrefixCls = `${prefixCls}-confirm`;
-  let additionalProps = {};
-  if (type4) {
-    additionalProps = {
-      closable: closable !== null && closable !== void 0 ? closable : false,
-      title: "",
-      footer: "",
-      children: /* @__PURE__ */ reactExports.createElement(ConfirmContent, Object.assign({}, props, {
-        prefixCls,
-        confirmPrefixCls,
-        rootPrefixCls,
-        content: children
-      }))
-    };
-  } else {
-    additionalProps = {
-      closable: closable !== null && closable !== void 0 ? closable : true,
-      title,
-      footer: footer !== null && /* @__PURE__ */ reactExports.createElement(Footer$3, Object.assign({}, props)),
-      children
-    };
-  }
-  return wrapCSSVar(/* @__PURE__ */ reactExports.createElement(Panel$2, Object.assign({
-    prefixCls,
-    className: classNames$1(hashId, `${prefixCls}-pure-panel`, type4 && confirmPrefixCls, type4 && `${confirmPrefixCls}-${type4}`, className, cssVarCls, rootCls)
-  }, restProps, {
-    closeIcon: renderCloseIcon(prefixCls, closeIcon),
-    closable
-  }, additionalProps)));
-};
-const PurePanel$c = withPureRenderTheme(PurePanel$b);
-function modalWarn(props) {
-  return confirm$1(withWarn(props));
-}
-const Modal = Modal$1;
-Modal.useModal = useModal;
-Modal.info = function infoFn(props) {
-  return confirm$1(withInfo(props));
-};
-Modal.success = function successFn(props) {
-  return confirm$1(withSuccess(props));
-};
-Modal.error = function errorFn(props) {
-  return confirm$1(withError(props));
-};
-Modal.warning = modalWarn;
-Modal.warn = modalWarn;
-Modal.confirm = function confirmFn(props) {
-  return confirm$1(withConfirm(props));
-};
-Modal.destroyAll = function destroyAllFn() {
-  while (destroyFns.length) {
-    const close = destroyFns.pop();
-    if (close) {
-      close();
-    }
-  }
-};
-Modal.config = modalGlobalConfig;
-Modal._InternalPanelDoNotUseOrYouWillBeFired = PurePanel$c;
 class GlobalErrorBoundary extends reactExports.Component {
   constructor(props) {
     super(props);
     this.unsubscribe = null;
     this.handleApiError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const severity = code && code >= 500 ? ErrorSeverity.SEVERE : ErrorSeverity.WARNING;
       const globalError = {
         type: GlobalErrorType.API_ERROR,
@@ -33379,10 +33399,15 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleParamValidationError = (event) => {
-      const { message: message2, details } = event.detail;
+      const {
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.PARAM_VALIDATION_ERROR,
         code: 400,
@@ -33390,7 +33415,9 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.WARNING
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleTokenExpired = (event) => {
       const globalError = {
@@ -33400,10 +33427,16 @@ class GlobalErrorBoundary extends reactExports.Component {
         details: event.detail,
         severity: ErrorSeverity.SEVERE
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleNotFoundError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.API_ERROR,
         code: code || 404,
@@ -33411,10 +33444,16 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.SEVERE
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleTimeoutError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.API_ERROR,
         code: code || 408,
@@ -33422,10 +33461,16 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.WARNING
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleServerError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.API_ERROR,
         code: code || 500,
@@ -33433,10 +33478,16 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.SEVERE
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleClientError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.API_ERROR,
         code: code || 400,
@@ -33444,10 +33495,16 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.WARNING
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleUnknownError = (event) => {
-      const { code, message: message2, details } = event.detail;
+      const {
+        code,
+        message: message2,
+        details
+      } = event.detail;
       const globalError = {
         type: GlobalErrorType.OTHER_ERROR,
         code: code || 500,
@@ -33455,11 +33512,17 @@ class GlobalErrorBoundary extends reactExports.Component {
         details,
         severity: ErrorSeverity.SEVERE
       };
-      useSdkStore.setState({ globalError });
+      useSdkStore.setState({
+        globalError
+      });
     };
     this.handleClearError = () => {
-      useSdkStore.setState({ globalError: null });
-      this.setState({ hasError: false });
+      useSdkStore.setState({
+        globalError: null
+      });
+      this.setState({
+        hasError: false
+      });
     };
     this.handleRetry = () => {
       this.handleClearError();
@@ -33496,7 +33559,9 @@ class GlobalErrorBoundary extends reactExports.Component {
     window.addEventListener("unknownError", this.handleUnknownError);
     this.unsubscribe = useSdkStore.subscribe((state, prevState) => {
       if (state.globalError !== prevState.globalError) {
-        this.setState({ globalError: state.globalError });
+        this.setState({
+          globalError: state.globalError
+        });
       }
     });
   }
@@ -33535,49 +33600,56 @@ class GlobalErrorBoundary extends reactExports.Component {
       },
       severity: ErrorSeverity.SEVERE
     };
-    useSdkStore.setState({ globalError });
-    this.setState({ globalError });
+    useSdkStore.setState({
+      globalError
+    });
+    this.setState({
+      globalError
+    });
   }
   /**
    * 渲染组件
    * @returns React节点
    */
   render() {
-    const { globalError } = this.state;
-    const { errorNotification = false } = this.props;
+    const {
+      globalError
+    } = this.state;
+    const {
+      errorNotification = false
+    } = this.props;
     if (!errorNotification) {
       return this.props.children;
     }
     if (globalError) {
       if (globalError.severity === ErrorSeverity.SEVERE) {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(
-          ErrorPage,
-          {
-            error: globalError,
-            onClose: this.handleClearError,
-            onRetry: this.handleRetry
-          }
-        );
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorPage, {
+          error: globalError,
+          onClose: this.handleClearError,
+          onRetry: this.handleRetry
+        });
       } else {
-        return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-          this.props.children,
-          /* @__PURE__ */ jsxRuntimeExports.jsxs(
-            Modal,
-            {
-              title: "错误提示",
-              open: !!globalError && globalError.severity === ErrorSeverity.WARNING,
-              onOk: this.handleClearError,
-              onCancel: this.handleClearError,
-              okText: "关闭",
-              cancelText: "取消",
-              centered: true,
-              children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-red-500", children: globalError.message }),
-                globalError.details && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "mt-2 text-sm text-gray-600", children: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", { className: "whitespace-pre-wrap", children: JSON.stringify(globalError.details, null, 2) }) })
-              ]
-            }
-          )
-        ] });
+        return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, {
+          children: [this.props.children, /* @__PURE__ */ jsxRuntimeExports.jsxs(Modal, {
+            title: "错误提示",
+            open: !!globalError && globalError.severity === ErrorSeverity.WARNING,
+            onOk: this.handleClearError,
+            onCancel: this.handleClearError,
+            okText: "关闭",
+            cancelText: "取消",
+            centered: true,
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+              className: "text-red-500",
+              children: globalError.message
+            }), globalError.details && /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+              className: "mt-2 text-sm text-gray-600",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx("pre", {
+                className: "whitespace-pre-wrap",
+                children: JSON.stringify(globalError.details, null, 2)
+              })
+            })]
+          })]
+        });
       }
     }
     return this.props.children;
@@ -46027,18 +46099,6 @@ axios.formToJSON = (thing) => formDataToJSON(utils$9.isHTMLForm(thing) ? new For
 axios.getAdapter = adapters.getAdapter;
 axios.HttpStatusCode = HttpStatusCode;
 axios.default = axios;
-var define_import_meta_env_default = {};
-const envConfig = {
-  // 环境名称
-  env: define_import_meta_env_default.VITE_ENV || "development",
-  // 地图相关配置
-  amapKey: "d3e9b4bd66a3ed8533f2e5d01c24e273",
-  amapCode: "ff1c6caa84b5fe4e179dc6a84580995c",
-  // SDK 授权配置
-  queenSdkKey: "hP7in57avgV12eJB7dff0052b8ac0481da28769b23b37bc77",
-  // API 相关配置
-  liveProxyUrl: "https://api.lfeiyao.com"
-};
 function withResolvers() {
   let output = {};
   output.promise = new Promise((res, rej) => {
@@ -46520,10 +46580,14 @@ const errorConfig = {
     console.warn("Login expired, please re-login");
   }
 };
-console.log("<<envConfig.env>>", envConfig);
-console.log("=====>", envConfig.env === "production" ? useSdkStore.getState().getApiDomain() : envConfig);
+const map$d = {
+  production: useSdkStore.getState().getApiDomain(),
+  test: envConfig$1.liveProxyUrl,
+  dev: ""
+};
+console.log("envConfig.env", envConfig$1.env);
 const axiosInstance = axios.create({
-  baseURL: envConfig.env === "production" ? useSdkStore.getState().getApiDomain() : envConfig.liveProxyUrl,
+  baseURL: map$d[envConfig$1.env],
   // 只在生产环境设置基础 URL，开发环境使用代理
   timeout: 3e4,
   // 30秒超时
@@ -85324,6 +85388,10 @@ function useLiveInfo() {
         return res;
       }
       return res;
+    }).catch((error22) => {
+      console.error("直播信息请求失败,取消轮训：", error22);
+      requestResult.cancel();
+      return error22;
     });
   }, {
     pollingInterval: 2e3,
@@ -85517,10 +85585,16 @@ const Head = ({
     livePushCode
   } = useLivePushCodeStore();
   const {
-    data: liveInfoData
+    data: liveInfoData,
+    run: runLiveInfo
   } = useRequest(() => request(`/bis/live-info?id=${liveId}`).then((res) => res.data), {
-    manual: callConfig.role !== "main"
+    manual: true
   });
+  reactExports.useEffect(() => {
+    if (callConfig.rule === "main") {
+      runLiveInfo();
+    }
+  }, [callConfig.rule]);
   const [isLive, setIsLive] = reactExports.useState(false);
   const [isCurrentPagePushing, setIsCurrentPagePushing] = reactExports.useState(false);
   const [isModalVisible, setIsModalVisible] = reactExports.useState(false);
@@ -195526,46 +195600,37 @@ const useDrawingToolsStore = create$c((set3, get4) => ({
   setPenSize: (size) => set3((state) => {
     const newSize = typeof size === "function" ? size(state.penSize) : size;
     return {
-      penSize: newSize,
-      penSizeRef: { current: newSize }
+      penSize: newSize
     };
   }),
   penColor: "#ff5a5a",
   setPenColor: (color) => set3((state) => {
     const newColor = typeof color === "function" ? color(state.penColor) : color;
     return {
-      penColor: newColor,
-      penColorRef: { current: newColor }
+      penColor: newColor
     };
   }),
-  penSizeRef: { current: 2 },
-  penColorRef: { current: "#ff5a5a" },
   // 激光笔设置
   laserPenSize: 2,
   setLaserPenSize: (size) => set3((state) => {
     const newSize = typeof size === "function" ? size(state.laserPenSize) : size;
     return {
-      laserPenSize: newSize,
-      laserPenSizeRef: { current: newSize }
+      laserPenSize: newSize
     };
   }),
   laserPenColor: "#ff5a5a",
   setLaserPenColor: (color) => set3((state) => {
     const newColor = typeof color === "function" ? color(state.laserPenColor) : color;
     return {
-      laserPenColor: newColor,
-      laserPenColorRef: { current: newColor }
+      laserPenColor: newColor
     };
   }),
-  laserPenSizeRef: { current: 2 },
-  laserPenColorRef: { current: "#ff5a5a" },
   // 形状设置
   shapeSize: 2,
   setShapeSize: (size) => set3((state) => {
     const newSize = typeof size === "function" ? size(state.shapeSize) : size;
     return {
-      shapeSize: newSize,
-      shapeSizeRef: { current: newSize }
+      shapeSize: newSize
     };
   }),
   shapeType: "rect",
@@ -195580,39 +195645,32 @@ const useDrawingToolsStore = create$c((set3, get4) => ({
   setShapeColor: (color) => set3((state) => {
     const newColor = typeof color === "function" ? color(state.shapeColor) : color;
     return {
-      shapeColor: newColor,
-      shapeColorRef: { current: newColor }
+      shapeColor: newColor
     };
   }),
-  shapeSizeRef: { current: 2 },
-  shapeTypeRef: { current: "rect" },
-  shapeColorRef: { current: "#ff5a5a" },
   // 文字设置
   textSize: 16,
   setTextSize: (size) => set3((state) => {
     const newSize = typeof size === "function" ? size(state.textSize) : size;
     return {
-      textSize: newSize,
-      textSizeRef: { current: newSize }
+      textSize: newSize
     };
   }),
   textColor: "#ff5a5a",
   setTextColor: (color) => set3((state) => {
     const newColor = typeof color === "function" ? color(state.textColor) : color;
     return {
-      textColor: newColor,
-      textColorRef: { current: newColor }
+      textColor: newColor
     };
   }),
-  textSizeRef: { current: 16 },
-  textColorRef: { current: "#ff5a5a" },
   // 预览弹窗状态
   isPreviewModalVisible: false,
   setIsPreviewModalVisible: (visible) => set3({ isPreviewModalVisible: visible }),
   // 绘图相关引用
   downPoint: { current: null },
   upPoint: { current: null },
-  currentShape: { current: null }
+  currentShape: { current: null },
+  getter: () => get4()
 }));
 const useCallUserPagination = (config2) => {
   const { gridCols } = config2;
@@ -265662,7 +265720,7 @@ const Document$1 = ({
       return /* @__PURE__ */ jsxRuntimeExports.jsx("a", {
         href: r3.buy_url,
         target: "_blank",
-        className: "flex text-stone-500",
+        className: "text-[--call-live-sdk-color-primary]",
         rel: "noreferrer",
         children: r3.name
       });
@@ -266022,13 +266080,13 @@ const Document$1 = ({
         title: "预览文档",
         width: 715,
         children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: "w-670px pt-4 h-430px bg-#e8e8e8 flex items-center flex-col",
+          className: "w-670px pt-4 h-430px bg-#1a1a1a flex items-center flex-col",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx("img", {
             src: urlList[listIndex],
-            className: " h-92  object-contain"
+            className: " h-92  object-contain bg-#0e121c p-4 rounded"
           }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "flex items-center h-40px",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+            className: "flex items-center h-40px text-white",
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
               onClick: () => {
                 if (listIndex > 0) {
                   setListIndex(listIndex - 1);
@@ -266036,12 +266094,13 @@ const Document$1 = ({
                   setListIndex(urlList.length - 1);
                 }
               },
-              className: " cursor-pointer bg-white px-2",
+              type: "primary",
+              ghost: true,
               children: "上一页"
             }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "mx-2",
+              className: "mx-2 text-white",
               children: [listIndex + 1, "/", urlList.length]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
               onClick: () => {
                 if (listIndex < urlList.length - 1) {
                   setListIndex(listIndex + 1);
@@ -266049,7 +266108,8 @@ const Document$1 = ({
                   setListIndex(0);
                 }
               },
-              className: " cursor-pointer bg-white px-2",
+              type: "primary",
+              ghost: true,
               children: "下一页"
             })]
           })]
@@ -266146,7 +266206,6 @@ const DocumentControler = ({
     setDocumentIndex(selectedScene.documentIndex);
     handleImageClick(selectedScene.documentIndex);
   }, [currentScene]);
-  console.log("documentInfo", documentInfo);
   reactExports.useEffect(() => {
     if (!documentInfo.name) {
       setDocumentScrollLeft(0);
@@ -266463,30 +266522,20 @@ const ToolOption = reactExports.memo(({
   });
 });
 ToolOption.displayName = "ToolOption";
+const COLORS = ["#ff5a5a", "#ffbf48", "#3a9bff", "#58efb8", "#000000", "#808080", "#ffffff"];
+const LINE_SIZES = [2, 4, 6];
+const TEXT_SIZES = [16, 20, 24, 28, 32];
+const TOOL_IDS = {
+  SELECT: 1,
+  PEN: 2,
+  LASER_PEN: 3,
+  SHAPE: 4,
+  TEXT: 5
+};
 const DrawingToolbar = ({
   onToolClick,
   onClearCanvas,
-  onPreviewClick,
-  // 初始值 - 仅用于初始化，实际状态由 model 管理
-  initialPenSize = 2,
-  initialPenColor = "#ff5a5a",
-  initialLaserPenSize = 2,
-  initialLaserPenColor = "#ff5a5a",
-  initialShapeSize = 2,
-  initialShapeType = "rect",
-  initialShapeColor = "#ff5a5a",
-  initialTextSize = 16,
-  initialTextColor = "#ff5a5a",
-  // 状态更新回调 - 用于向父组件通知变化
-  onPenSizeChange,
-  onPenColorChange,
-  onLaserPenSizeChange,
-  onLaserPenColorChange,
-  onShapeSizeChange,
-  onShapeTypeChange,
-  onShapeColorChange,
-  onTextSizeChange,
-  onTextColorChange
+  onPreviewClick
 }) => {
   const {
     // 工具选择
@@ -266517,114 +266566,23 @@ const DrawingToolbar = ({
     // 预览弹窗状态
     setIsPreviewModalVisible
   } = useDrawingToolsStore();
-  const prevPropsRef = reactExports.useRef({
-    initialPenSize,
-    initialPenColor,
-    initialLaserPenSize,
-    initialLaserPenColor,
-    initialShapeSize,
-    initialShapeType,
-    initialShapeColor,
-    initialTextSize,
-    initialTextColor
-  });
-  reactExports.useEffect(() => {
-    const prevProps = prevPropsRef.current;
-    if (prevProps.initialPenSize !== initialPenSize) {
-      setPenSize(initialPenSize);
-      prevPropsRef.current.initialPenSize = initialPenSize;
-    }
-    if (prevProps.initialPenColor !== initialPenColor) {
-      setPenColor(initialPenColor);
-      prevPropsRef.current.initialPenColor = initialPenColor;
-    }
-    if (prevProps.initialLaserPenSize !== initialLaserPenSize) {
-      setLaserPenSize(initialLaserPenSize);
-      prevPropsRef.current.initialLaserPenSize = initialLaserPenSize;
-    }
-    if (prevProps.initialLaserPenColor !== initialLaserPenColor) {
-      setLaserPenColor(initialLaserPenColor);
-      prevPropsRef.current.initialLaserPenColor = initialLaserPenColor;
-    }
-    if (prevProps.initialShapeSize !== initialShapeSize) {
-      setShapeSize(initialShapeSize);
-      prevPropsRef.current.initialShapeSize = initialShapeSize;
-    }
-    if (prevProps.initialShapeType !== initialShapeType) {
-      setShapeType(initialShapeType);
-      prevPropsRef.current.initialShapeType = initialShapeType;
-    }
-    if (prevProps.initialShapeColor !== initialShapeColor) {
-      setShapeColor(initialShapeColor);
-      prevPropsRef.current.initialShapeColor = initialShapeColor;
-    }
-    if (prevProps.initialTextSize !== initialTextSize) {
-      setTextSize(initialTextSize);
-      prevPropsRef.current.initialTextSize = initialTextSize;
-    }
-    if (prevProps.initialTextColor !== initialTextColor) {
-      setTextColor(initialTextColor);
-      prevPropsRef.current.initialTextColor = initialTextColor;
-    }
-  }, [initialPenSize, initialPenColor, initialLaserPenSize, initialLaserPenColor, initialShapeSize, initialShapeType, initialShapeColor, initialTextSize, initialTextColor]);
   const handleToolClick = (tool) => {
     setSelectedTool(tool);
     onToolClick(tool);
   };
-  const handlePenSizeChange = (size) => {
-    setPenSize(size);
-    if (onPenSizeChange)
-      onPenSizeChange(size);
-    setTimeout(() => onToolClick(2));
-  };
-  const handlePenColorChange = (color) => {
-    setPenColor(color);
-    if (onPenColorChange)
-      onPenColorChange(color);
-    setTimeout(() => onToolClick(2));
-  };
-  const handleLaserPenSizeChange = (size) => {
-    setLaserPenSize(size);
-    if (onLaserPenSizeChange)
-      onLaserPenSizeChange(size);
-    setTimeout(() => onToolClick(3));
-  };
-  const handleLaserPenColorChange = (color) => {
-    setLaserPenColor(color);
-    if (onLaserPenColorChange)
-      onLaserPenColorChange(color);
-    setTimeout(() => onToolClick(3));
-  };
-  const handleShapeSizeChange = (size) => {
-    setShapeSize(size);
-    if (onShapeSizeChange)
-      onShapeSizeChange(size);
-    setTimeout(() => onToolClick(4));
-  };
-  const handleShapeTypeChange = (type4) => {
-    setShapeType(type4);
-    if (onShapeTypeChange)
-      onShapeTypeChange(type4);
-    setTimeout(() => onToolClick(4));
-  };
-  const handleShapeColorChange = (color) => {
-    setShapeColor(color);
-    if (onShapeColorChange)
-      onShapeColorChange(color);
-    setTimeout(() => onToolClick(4));
-  };
-  const handleTextSizeChange = (size) => {
-    setTextSize(size);
-    if (onTextSizeChange)
-      onTextSizeChange(size);
-    setTimeout(() => onToolClick(5));
-  };
-  const handleTextColorChange = (color) => {
-    setTextColor(color);
-    if (onTextColorChange)
-      onTextColorChange(color);
-    setTimeout(() => onToolClick(5));
-  };
+  const handleToolSettingChange = (setter, toolId) => (value) => {
+    setter(value);
+    setTimeout(() => onToolClick(toolId));
+  };
+  const handlePenSizeChange = handleToolSettingChange(setPenSize, TOOL_IDS.PEN);
+  const handlePenColorChange = handleToolSettingChange(setPenColor, TOOL_IDS.PEN);
+  const handleLaserPenSizeChange = handleToolSettingChange(setLaserPenSize, TOOL_IDS.LASER_PEN);
+  const handleLaserPenColorChange = handleToolSettingChange(setLaserPenColor, TOOL_IDS.LASER_PEN);
+  const handleShapeSizeChange = handleToolSettingChange(setShapeSize, TOOL_IDS.SHAPE);
+  const handleShapeTypeChange = handleToolSettingChange(setShapeType, TOOL_IDS.SHAPE);
+  const handleShapeColorChange = handleToolSettingChange(setShapeColor, TOOL_IDS.SHAPE);
+  const handleTextSizeChange = handleToolSettingChange(setTextSize, TOOL_IDS.TEXT);
+  const handleTextColorChange = handleToolSettingChange(setTextColor, TOOL_IDS.TEXT);
   return /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
     className: "flex items-center",
     children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Space, {
@@ -266635,10 +266593,10 @@ const DrawingToolbar = ({
         children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
           className: "w-32px h-32px flex justify-center items-center cursor-pointer hover:bg-#12151a",
           style: {
-            background: selectedTool === 1 ? "#12151a" : "",
-            color: selectedTool === 1 ? "#6672fc" : "#fff"
+            background: selectedTool === TOOL_IDS.SELECT ? "#12151a" : "",
+            color: selectedTool === TOOL_IDS.SELECT ? "#6672fc" : "#fff"
           },
-          onClick: () => handleToolClick(1),
+          onClick: () => handleToolClick(TOOL_IDS.SELECT),
           children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgGuideO, {
             className: "text-24px"
           })
@@ -266648,11 +266606,11 @@ const DrawingToolbar = ({
         optionContent: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
           className: "w-260px py-4 px-3 flex flex-col justify-between",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx(SizePicker, {
-            sizes: [2, 4, 6],
+            sizes: LINE_SIZES,
             selectedSize: penSize,
             onSizeChange: handlePenSizeChange
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(ColorPicker, {
-            colors: ["#ff5a5a", "#ffbf48", "#3a9bff", "#58efb8", "#000000", "#808080", "#ffffff"],
+            colors: COLORS,
             selectedColor: penColor,
             onColorChange: handlePenColorChange
           })]
@@ -266664,10 +266622,10 @@ const DrawingToolbar = ({
           children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
             className: "w-32px h-32px flex justify-center items-center cursor-pointer hover:bg-#12151a",
             style: {
-              background: selectedTool === 2 ? "#12151a" : "",
-              color: selectedTool === 2 ? "#6672fc" : "#fff"
+              background: selectedTool === TOOL_IDS.PEN ? "#12151a" : "",
+              color: selectedTool === TOOL_IDS.PEN ? "#6672fc" : "#fff"
             },
-            onClick: () => handleToolClick(2),
+            onClick: () => handleToolClick(TOOL_IDS.PEN),
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(SvgEdit, {
               className: "text-18px"
             })
@@ -266678,11 +266636,11 @@ const DrawingToolbar = ({
         optionContent: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
           className: "w-260px py-4 px-3 flex flex-col justify-between",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx(SizePicker, {
-            sizes: [2, 4, 6],
+            sizes: LINE_SIZES,
             selectedSize: laserPenSize,
             onSizeChange: handleLaserPenSizeChange
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(ColorPicker, {
-            colors: ["#ff5a5a", "#ffbf48", "#3a9bff", "#58efb8", "#000000", "#808080", "#ffffff"],
+            colors: COLORS,
             selectedColor: laserPenColor,
             onColorChange: handleLaserPenColorChange
           })]
@@ -266694,10 +266652,10 @@ const DrawingToolbar = ({
           children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
             className: "w-32px h-32px flex justify-center items-center cursor-pointer hover:bg-#12151a",
             style: {
-              background: selectedTool === 3 ? "#12151a" : "",
-              color: selectedTool === 3 ? "#6672fc" : "#fff"
+              background: selectedTool === TOOL_IDS.LASER_PEN ? "#12151a" : "",
+              color: selectedTool === TOOL_IDS.LASER_PEN ? "#6672fc" : "#fff"
             },
-            onClick: () => handleToolClick(3),
+            onClick: () => handleToolClick(TOOL_IDS.LASER_PEN),
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$r, {
               className: "text-18px"
             })
@@ -266712,7 +266670,7 @@ const DrawingToolbar = ({
               marginBottom: 10
             },
             children: [/* @__PURE__ */ jsxRuntimeExports.jsx(SizePicker, {
-              sizes: [2, 4, 6],
+              sizes: LINE_SIZES,
               selectedSize: shapeSize,
               onSizeChange: handleShapeSizeChange
             }), /* @__PURE__ */ jsxRuntimeExports.jsx(ShapeTypePicker, {
@@ -266721,7 +266679,7 @@ const DrawingToolbar = ({
               onTypeChange: handleShapeTypeChange
             })]
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(ColorPicker, {
-            colors: ["#ff5a5a", "#ffbf48", "#3a9bff", "#58efb8", "#000000", "#808080", "#ffffff"],
+            colors: COLORS,
             selectedColor: shapeColor,
             onColorChange: handleShapeColorChange
           })]
@@ -266733,10 +266691,10 @@ const DrawingToolbar = ({
           children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
             className: "w-32px h-32px flex justify-center items-center cursor-pointer hover:bg-#12151a",
             style: {
-              background: selectedTool === 4 ? "#12151a" : "",
-              color: selectedTool === 4 ? "#6672fc" : "#fff"
+              background: selectedTool === TOOL_IDS.SHAPE ? "#12151a" : "",
+              color: selectedTool === TOOL_IDS.SHAPE ? "#6672fc" : "#fff"
             },
-            onClick: () => handleToolClick(4),
+            onClick: () => handleToolClick(TOOL_IDS.SHAPE),
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$p, {
               className: "text-18px"
             })
@@ -266747,11 +266705,11 @@ const DrawingToolbar = ({
         optionContent: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
           className: "w-260px py-4 px-3 flex flex-col justify-between",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx(TextSizePicker, {
-            sizes: [16, 20, 24, 28, 32],
+            sizes: TEXT_SIZES,
             selectedSize: textSize,
             onSizeChange: handleTextSizeChange
           }), /* @__PURE__ */ jsxRuntimeExports.jsx(ColorPicker, {
-            colors: ["#ff5a5a", "#ffbf48", "#3a9bff", "#58efb8", "#000000", "#808080", "#ffffff"],
+            colors: COLORS,
             selectedColor: textColor,
             onColorChange: handleTextColorChange
           })]
@@ -266763,10 +266721,10 @@ const DrawingToolbar = ({
           children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
             className: "w-32px h-32px flex justify-center items-center cursor-pointer hover:bg-#12151a",
             style: {
-              background: selectedTool === 5 ? "#12151a" : "",
-              color: selectedTool === 5 ? "#6672fc" : "#fff"
+              background: selectedTool === TOOL_IDS.TEXT ? "#12151a" : "",
+              color: selectedTool === TOOL_IDS.TEXT ? "#6672fc" : "#fff"
             },
-            onClick: () => handleToolClick(5),
+            onClick: () => handleToolClick(TOOL_IDS.TEXT),
             children: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon$e, {
               className: "text-18px"
             })
@@ -266984,14 +266942,11 @@ const LivePlayer = ({
     callUsers: state.callUsers,
     toggleRightSidebar: state.toggleRightSidebar
   }));
-  useSdkStore((state) => state.callConfig.el);
   const canvasRef = reactExports.useRef(null);
   const canvasContainerRef = reactExports.useRef(null);
   const streamRef = reactExports.useRef(null);
   const streamContainerRef = reactExports.useRef(null);
   const {
-    // 工具选择
-    selectedTool,
     setSelectedTool,
     // 绘图相关引用
     downPoint,
@@ -266999,37 +266954,37 @@ const LivePlayer = ({
     currentShape,
     // 形状设置
     shapeType,
-    setShapeType,
-    shapeTypeRef,
     shapeColor,
-    setShapeColor,
-    shapeColorRef,
     shapeSize,
-    setShapeSize,
-    shapeSizeRef,
     // 画笔设置
     penColor,
-    setPenColor,
-    penColorRef,
     penSize,
-    setPenSize,
-    penSizeRef,
     // 激光笔设置
     laserPenColor,
-    setLaserPenColor,
-    laserPenColorRef,
     laserPenSize,
-    setLaserPenSize,
-    laserPenSizeRef,
     // 文字设置
     textColor,
-    setTextColor,
-    textColorRef,
     textSize,
-    setTextSize,
-    textSizeRef,
-    setIsPreviewModalVisible
-  } = useDrawingToolsStore();
+    // 预览弹窗状态
+    setIsPreviewModalVisible,
+    getter: getDrawing
+  } = useDrawingToolsStore((state) => ({
+    setSelectedTool: state.setSelectedTool,
+    downPoint: state.downPoint,
+    upPoint: state.upPoint,
+    currentShape: state.currentShape,
+    shapeType: state.shapeType,
+    shapeColor: state.shapeColor,
+    shapeSize: state.shapeSize,
+    penColor: state.penColor,
+    penSize: state.penSize,
+    laserPenColor: state.laserPenColor,
+    laserPenSize: state.laserPenSize,
+    textColor: state.textColor,
+    textSize: state.textSize,
+    getter: state.getter,
+    setIsPreviewModalVisible: state.setIsPreviewModalVisible
+  }));
   const canvasSettingRef = reactExports.useRef("horizontal");
   const worker = reactExports.useRef(null);
   const isWorkerRunning = reactExports.useRef(false);
@@ -267566,9 +267521,9 @@ const LivePlayer = ({
   };
   const drawShapeMouseDown = (e3) => {
     downPoint.current = e3.absolutePointer;
-    const shapeType2 = shapeTypeRef.current;
-    const shapeColor2 = shapeColorRef.current;
-    const shapeSize2 = shapeSizeRef.current;
+    const shapeType2 = getDrawing().shapeType;
+    const shapeColor2 = getDrawing().shapeColor;
+    const shapeSize2 = getDrawing().shapeSize;
     if (shapeType2 === "circle" || shapeType2 === "rect") {
       currentShape.current = shapeType2 === "circle" ? new xo({
         left: downPoint.current.x,
@@ -267596,7 +267551,7 @@ const LivePlayer = ({
   const drawShapeMouseMove = (e3) => {
     if (!currentShape.current)
       return;
-    const shapeType2 = shapeTypeRef.current;
+    const shapeType2 = getDrawing().shapeType;
     const currentPoint = e3.absolutePointer;
     const dx = currentPoint.x - downPoint.current.x;
     const dy = currentPoint.y - downPoint.current.y;
@@ -267630,7 +267585,7 @@ const LivePlayer = ({
     canvasRequestRenderAll();
   };
   const drawShareMouseUp = () => {
-    const shapeColor2 = shapeColorRef.current;
+    const shapeColor2 = getDrawing().shapeColor;
     if (currentShape.current) {
       if (JSON.stringify(downPoint.current) === JSON.stringify(upPoint.current)) {
         return;
@@ -267645,8 +267600,8 @@ const LivePlayer = ({
   const drawTextMouseDown = (e3) => {
     var _a3;
     const pointer = (_a3 = getter().fabricInstance) == null ? void 0 : _a3.getPointer(e3.e);
-    const textColor2 = textColorRef.current;
-    const textSize2 = textSizeRef.current;
+    const textColor2 = getDrawing().textColor;
+    const textSize2 = getDrawing().textSize;
     if (pointer) {
       const {
         x,
@@ -267667,8 +267622,8 @@ const LivePlayer = ({
   };
   const enablePenDrawing = () => {
     const canvas = getter().fabricInstance;
-    const penColor2 = penColorRef.current;
-    const penSize2 = penSizeRef.current;
+    const penColor2 = getDrawing().penColor;
+    const penSize2 = getDrawing().penSize;
     const pencilBrush = new oo(canvas);
     pencilBrush.color = penColor2;
     pencilBrush.width = penSize2;
@@ -267679,8 +267634,8 @@ const LivePlayer = ({
   };
   const enableLaserPenDrawing = () => {
     const canvas = getter().fabricInstance;
-    const laserPenColor2 = laserPenColorRef.current;
-    const laserPenSize2 = laserPenSizeRef.current;
+    const laserPenColor2 = getDrawing().laserPenColor;
+    const laserPenSize2 = getDrawing().laserPenSize;
     const pencilBrush = new oo(canvas);
     pencilBrush.color = laserPenColor2;
     pencilBrush.width = laserPenSize2;
@@ -268756,7 +268711,7 @@ const LivePlayer = ({
       let queenEngine;
       if (cameraType === 1) {
         queenEngine = new d$3();
-        queenEngine.init(envConfig.queenSdkKey, function() {
+        queenEngine.init(envConfig$1.queenSdkKey, function() {
           console.log("初始化完成");
           const {
             isSkinBuffing,
@@ -269182,28 +269137,9 @@ const LivePlayer = ({
       children: [isMainRole && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
         className: " flex items-center justify-center h-48px gap-5 bg-#222933",
         children: [/* @__PURE__ */ jsxRuntimeExports.jsx(DrawingToolbar, {
-          selectedTool,
           onToolClick: clickTool,
           onClearCanvas: clearCanvas,
-          onPreviewClick: () => setIsPreviewModalVisible(true),
-          initialPenSize: penSize,
-          initialPenColor: penColor,
-          initialLaserPenSize: laserPenSize,
-          initialLaserPenColor: laserPenColor,
-          initialShapeSize: shapeSize,
-          initialShapeType: shapeType,
-          initialShapeColor: shapeColor,
-          initialTextSize: textSize,
-          initialTextColor: textColor,
-          onPenSizeChange: setPenSize,
-          onPenColorChange: setPenColor,
-          onLaserPenSizeChange: setLaserPenSize,
-          onLaserPenColorChange: setLaserPenColor,
-          onShapeSizeChange: setShapeSize,
-          onShapeTypeChange: setShapeType,
-          onShapeColorChange: setShapeColor,
-          onTextSizeChange: setTextSize,
-          onTextColorChange: setTextColor
+          onPreviewClick: () => setIsPreviewModalVisible(true)
         }), callConfig.isCall && /* @__PURE__ */ jsxRuntimeExports.jsx(LayoutSwitcher, {
           className: "absolute right-10",
           currentLayout: layoutMode,
@@ -269363,9 +269299,8 @@ const InviteGuestModal = ({
   const [open2, setOpen] = reactExports.useState(false);
   const isModalOpen = externalIsOpen !== void 0 ? externalIsOpen : open2;
   const handleClose = externalOnClose || (() => setOpen(false));
-  const inviteLink = (call2 == null ? void 0 : call2.enabled) ? (call2 == null ? void 0 : call2.inviteLink) || "" : "";
   const copyText = `直播名称： ${data2 == null ? void 0 : data2.title}
-加入链接： ${inviteLink}
+加入链接： ${call2 == null ? void 0 : call2.inviteLink}
 加入密码： ${callConfig.password}`;
   const copyInviteLink = () => {
     navigator.clipboard.writeText(copyText).then(() => {
@@ -269417,7 +269352,7 @@ const InviteGuestModal = ({
       centered: true,
       children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
         className: styles.inviteContainer,
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+        children: [(call2 == null ? void 0 : call2.inviteLink) && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
           className: styles.inviteSection,
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
             className: styles.sectionLabel,
@@ -269425,7 +269360,7 @@ const InviteGuestModal = ({
           }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
             className: styles.inputGroup,
             children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Input, {
-              value: inviteLink,
+              value: call2 == null ? void 0 : call2.inviteLink,
               readOnly: true,
               className: styles.inviteInput
             }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
@@ -280136,6 +280071,618 @@ let ErrorBoundary$1 = class ErrorBoundary extends reactExports.Component {
     return this.props.children;
   }
 };
+const AudioVisualizer = reactExports.memo(
+  ({ selectedMicrophone, isVisible: isVisible3, onVolumeLevelsChange }) => {
+    const [audioContext, setAudioContext] = reactExports.useState(null);
+    const [analyser, setAnalyser] = reactExports.useState(null);
+    const [microphoneStream, setMicrophoneStream] = reactExports.useState(null);
+    const [volumeLevels, setVolumeLevels] = reactExports.useState(Array(12).fill(0));
+    const animationFrameRef = reactExports.useRef(null);
+    const canvasRef = reactExports.useRef(null);
+    const microphoneStreamRef = reactExports.useRef(microphoneStream);
+    const audioContextRef = reactExports.useRef(audioContext);
+    const analyserRef = reactExports.useRef(analyser);
+    reactExports.useEffect(() => {
+      microphoneStreamRef.current = microphoneStream;
+      audioContextRef.current = audioContext;
+      analyserRef.current = analyser;
+    }, [microphoneStream, audioContext, analyser]);
+    const cleanupMediaResources = reactExports.useCallback(() => {
+      if (animationFrameRef.current) {
+        cancelAnimationFrame(animationFrameRef.current);
+        animationFrameRef.current = null;
+      }
+      if (microphoneStreamRef.current) {
+        microphoneStreamRef.current.getTracks().forEach((track) => track.stop());
+        setMicrophoneStream(null);
+      }
+      if (audioContextRef.current) {
+        audioContextRef.current.close().catch((err2) => console.error("关闭音频上下文失败:", err2));
+        setAudioContext(null);
+        setAnalyser(null);
+      }
+    }, []);
+    reactExports.useEffect(() => {
+      if (onVolumeLevelsChange) {
+        onVolumeLevelsChange(volumeLevels);
+      }
+    }, [volumeLevels, onVolumeLevelsChange]);
+    reactExports.useEffect(() => {
+      if (isVisible3 && selectedMicrophone) {
+        const context = new (window.AudioContext || window.webkitAudioContext)();
+        setAudioContext(context);
+        const audioAnalyser = context.createAnalyser();
+        audioAnalyser.fftSize = 2048;
+        setAnalyser(audioAnalyser);
+        navigator.mediaDevices.getUserMedia({
+          audio: {
+            deviceId: selectedMicrophone ? { exact: selectedMicrophone } : void 0
+          }
+        }).then((stream) => {
+          setMicrophoneStream(stream);
+          const source = context.createMediaStreamSource(stream);
+          source.connect(audioAnalyser);
+          const canvas = canvasRef.current;
+          const canvasCtx = canvas == null ? void 0 : canvas.getContext("2d");
+          const frequencyDataArray = new Uint8Array(audioAnalyser.frequencyBinCount);
+          const timeDataArray = new Uint8Array(audioAnalyser.frequencyBinCount);
+          const analyzeVolume = () => {
+            audioAnalyser.getByteFrequencyData(frequencyDataArray);
+            audioAnalyser.getByteTimeDomainData(timeDataArray);
+            if (canvasCtx && canvas) {
+              canvasCtx.clearRect(0, 0, canvas.width, canvas.height);
+              canvasCtx.lineWidth = 2;
+              canvasCtx.strokeStyle = "#2196F3";
+              canvasCtx.beginPath();
+              const sliceWidth = canvas.width / timeDataArray.length;
+              let x = 0;
+              for (let i = 0; i < timeDataArray.length; i++) {
+                const v3 = timeDataArray[i] / 128;
+                const y3 = v3 * canvas.height / 2;
+                if (i === 0) {
+                  canvasCtx.moveTo(x, y3);
+                } else {
+                  canvasCtx.lineTo(x, y3);
+                }
+                x += sliceWidth;
+              }
+              canvasCtx.lineTo(canvas.width, canvas.height / 2);
+              canvasCtx.stroke();
+            }
+            const segmentSize = Math.floor(frequencyDataArray.length / 12);
+            const normalizedLevels = Array(12).fill(0).map((_2, index2) => {
+              const start2 = index2 * segmentSize;
+              const end2 = start2 + segmentSize;
+              const segmentAvg = frequencyDataArray.slice(start2, end2).reduce((sum2, value) => sum2 + value, 0) / segmentSize;
+              return Math.min(1, Math.pow(segmentAvg / 255, 0.8));
+            });
+            setVolumeLevels(normalizedLevels);
+            animationFrameRef.current = requestAnimationFrame(analyzeVolume);
+          };
+          analyzeVolume();
+        }).catch((err2) => {
+          console.error("获取麦克风失败:", err2);
+          const interval = setInterval(() => {
+            const newLevels = Array(12).fill(0).map(() => Math.random());
+            setVolumeLevels(newLevels);
+          }, 200);
+          return () => clearInterval(interval);
+        });
+        return cleanupMediaResources;
+      }
+    }, [isVisible3, selectedMicrophone, cleanupMediaResources]);
+    reactExports.useEffect(() => {
+      return () => {
+        cleanupMediaResources();
+      };
+    }, [cleanupMediaResources]);
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col space-y-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: " h-24 bg-gray-50 rounded border border-gray-200", children: /* @__PURE__ */ jsxRuntimeExports.jsx("canvas", { ref: canvasRef, className: " h-full", width: "400", height: "100" }) }) });
+  }
+);
+AudioVisualizer.displayName = "AudioVisualizer";
+class MediaErrorBoundary extends reactExports.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      hasError: false,
+      errorMessage: ""
+    };
+  }
+  static getDerivedStateFromError(error2) {
+    return {
+      hasError: true,
+      errorMessage: error2.message
+    };
+  }
+  componentDidCatch(error2, errorInfo) {
+    console.error("媒体设备错误:", error2, errorInfo);
+  }
+  render() {
+    if (this.state.hasError) {
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+        className: "p-4 border border-red-300 rounded bg-red-50",
+        children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Alert, {
+          message: "媒体设备错误",
+          description: `无法访问媒体设备: ${this.state.errorMessage}。请检查设备权限或连接。`,
+          type: "error",
+          showIcon: true,
+          icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon, {})
+        }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
+          type: "primary",
+          className: "mt-4",
+          onClick: () => this.setState({
+            hasError: false,
+            errorMessage: ""
+          }),
+          children: "重试"
+        })]
+      });
+    }
+    return this.props.children;
+  }
+}
+const MediaSettings = () => {
+  const {
+    callCurrentUser,
+    toggleVideo,
+    rtc,
+    getter
+  } = useCallStore();
+  const [isModalVisible, setIsModalVisible] = reactExports.useState(false);
+  const [mirrorEnabled, setMirrorEnabled] = reactExports.useState(true);
+  const [cameraDevices, setCameraDevices] = reactExports.useState([]);
+  const [microphoneDevices, setMicrophoneDevices] = reactExports.useState([]);
+  const [selectedCamera, setSelectedCamera] = reactExports.useState("");
+  const [selectedMicrophone, setSelectedMicrophone] = reactExports.useState("");
+  const [beautySettings, setBeautySettings] = reactExports.useState({
+    enabled: false,
+    whiteIntensity: 0.5,
+    smoothIntensity: 0.5,
+    sharpenIntensity: 0.5
+  });
+  const [beautyExtension, setBeautyExtension] = reactExports.useState(null);
+  const [beautyCompatible, setBeautyCompatible] = reactExports.useState(false);
+  console.log("beautyCompatible", beautyCompatible);
+  const [beautyInitialized, setBeautyInitialized] = reactExports.useState(false);
+  const getDevices = reactExports.useCallback(async () => {
+    try {
+      if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {
+        console.error("浏览器不支持获取媒体设备列表");
+        staticMethods.error("您的浏览器不支持媒体设备选择功能");
+        return;
+      }
+      await navigator.mediaDevices.getUserMedia({
+        audio: true,
+        video: true
+      }).catch((err2) => console.error("获取媒体权限失败:", err2));
+      const devices = await navigator.mediaDevices.enumerateDevices();
+      const cameras = devices.filter((device) => device.kind === "videoinput").map((device) => ({
+        id: device.deviceId,
+        label: device.label || `摄像头 ${device.deviceId.slice(0, 5)}...`
+      }));
+      const microphones = devices.filter((device) => device.kind === "audioinput").map((device) => ({
+        id: device.deviceId,
+        label: device.label || `麦克风 ${device.deviceId.slice(0, 5)}...`
+      }));
+      if (cameras.length > 0) {
+        setCameraDevices(cameras);
+        setSelectedCamera((prevCamera) => {
+          return cameras.find((cam) => cam.id === prevCamera) ? prevCamera : cameras[0].id;
+        });
+      }
+      if (microphones.length > 0) {
+        setMicrophoneDevices(microphones);
+        setSelectedMicrophone((prevMic) => {
+          return microphones.find((mic) => mic.id === prevMic) ? prevMic : microphones[0].id;
+        });
+      }
+    } catch (error2) {
+      console.error("获取设备列表失败:", error2);
+      staticMethods.error("获取媒体设备失败，请检查设备权限");
+      setCameraDevices([{
+        id: "default",
+        label: "默认摄像头"
+      }]);
+      setMicrophoneDevices([{
+        id: "default",
+        label: "默认麦克风"
+      }]);
+    }
+  }, []);
+  reactExports.useEffect(() => {
+    if (isModalVisible) {
+      getDevices();
+    }
+    if (navigator.mediaDevices) {
+      navigator.mediaDevices.addEventListener("devicechange", getDevices);
+      return () => {
+        navigator.mediaDevices.removeEventListener("devicechange", getDevices);
+      };
+    }
+  }, [getDevices, isModalVisible]);
+  reactExports.useEffect(() => {
+    if (isModalVisible && !beautyInitialized) {
+      initializeBeautyExtension();
+    }
+  }, [isModalVisible, beautyInitialized]);
+  const initializeBeautyExtension = reactExports.useCallback(async () => {
+    try {
+      const rtcInstance = getter().rtc;
+      if (rtcInstance && rtcInstance.beautyExtension) {
+        const extension = rtcInstance.beautyExtension;
+        const compatibilityResult = await extension.checkCompatibility();
+        console.log("浏览器兼容性检查结果:", compatibilityResult);
+        if (compatibilityResult.isCompatible) {
+          setBeautyExtension(extension);
+          setBeautyCompatible(true);
+          setBeautyInitialized(true);
+          console.log("美颜扩展初始化成功");
+        } else {
+          console.warn("浏览器不支持美颜功能:", compatibilityResult.message || "兼容性检查失败");
+          setBeautyCompatible(false);
+          staticMethods.warning("您的浏览器不支持美颜功能，请使用 Chrome 78+ 或其他兼容浏览器");
+        }
+      } else {
+        console.warn("RTC客户端或美颜扩展未初始化");
+        setBeautyCompatible(false);
+        staticMethods.warning("RTC客户端未初始化，无法使用美颜功能");
+      }
+    } catch (error2) {
+      console.error("美颜扩展初始化失败:", error2);
+      setBeautyCompatible(false);
+      staticMethods.error("美颜功能初始化失败");
+    }
+  }, [rtc]);
+  const handleBeautyToggle = reactExports.useCallback((enabled) => {
+    if (!beautyExtension || !beautyCompatible) {
+      staticMethods.warning("美颜功能不可用");
+      return;
+    }
+    try {
+      if (enabled) {
+        beautyExtension.enableBeauty();
+        console.log("美颜已开启");
+      } else {
+        beautyExtension.disableBeauty();
+        console.log("美颜已关闭");
+      }
+      setBeautySettings((prev2) => ({
+        ...prev2,
+        enabled
+      }));
+    } catch (error2) {
+      console.error("美颜开关操作失败:", error2);
+      staticMethods.error("美颜开关操作失败");
+    }
+  }, [beautyExtension, beautyCompatible]);
+  const handleBeautyIntensityChange = reactExports.useCallback(
+    debounce$6((type4, value) => {
+      if (!beautyExtension || !beautyCompatible) {
+        return;
+      }
+      try {
+        let mode;
+        let settingKey;
+        switch (type4) {
+          case "white":
+            mode = EffectBeautyMode.EFFECT_WHITE_MODE;
+            settingKey = "whiteIntensity";
+            break;
+          case "smooth":
+            mode = EffectBeautyMode.EFFECT_SMOOTH_MODE;
+            settingKey = "smoothIntensity";
+            break;
+          case "sharpen":
+            mode = EffectBeautyMode.EFFECT_SHARPEN_MODE;
+            settingKey = "sharpenIntensity";
+            break;
+          default:
+            return;
+        }
+        beautyExtension.setBeautyIntensity(mode, value);
+        setBeautySettings((prev2) => ({
+          ...prev2,
+          [settingKey]: value
+        }));
+        console.log(`${type4} 强度已设置为:`, value);
+      } catch (error2) {
+        console.error("美颜强度设置失败:", error2);
+        staticMethods.error("美颜强度设置失败");
+      }
+    }, 300),
+    // 300ms 防抖延迟
+    [beautyExtension, beautyCompatible]
+  );
+  reactExports.useEffect(() => {
+    const savedBeautySettings = localStorage.getItem("beautySettings");
+    if (savedBeautySettings) {
+      try {
+        const parsed = JSON.parse(savedBeautySettings);
+        setBeautySettings(parsed);
+      } catch (error2) {
+        console.error("加载美颜设置失败:", error2);
+      }
+    }
+  }, []);
+  reactExports.useEffect(() => {
+    localStorage.setItem("beautySettings", JSON.stringify(beautySettings));
+  }, [beautySettings]);
+  const handleCameraChange = reactExports.useCallback(async (newCameraId) => {
+    setSelectedCamera(newCameraId);
+    try {
+      const rtcInstance = getter().rtc;
+      if (rtcInstance && rtcInstance.setMediaDevices) {
+        const result = await rtcInstance.setMediaDevices({
+          cameraId: newCameraId,
+          mirrorEnabled
+        });
+        if (result.success) {
+          console.log("摄像头设备已切换:", newCameraId);
+        } else {
+          console.error("摄像头切换失败:", result.message);
+          staticMethods.error("摄像头切换失败");
+        }
+      }
+    } catch (error2) {
+      console.error("摄像头配置失败:", error2);
+      staticMethods.error("摄像头配置失败");
+    }
+  }, [rtc, mirrorEnabled]);
+  const handleMicrophoneChange = reactExports.useCallback(async (newMicrophoneId) => {
+    setSelectedMicrophone(newMicrophoneId);
+    try {
+      const rtcInstance = getter().rtc;
+      if (rtcInstance && rtcInstance.setMediaDevices) {
+        const result = await rtcInstance.setMediaDevices({
+          microphoneId: newMicrophoneId
+        });
+        if (result.success) {
+          console.log("麦克风设备已切换:", newMicrophoneId);
+        } else {
+          console.error("麦克风切换失败:", result.message);
+          staticMethods.error("麦克风切换失败");
+        }
+      }
+    } catch (error2) {
+      console.error("麦克风配置失败:", error2);
+      staticMethods.error("麦克风配置失败");
+    }
+  }, [rtc]);
+  const handleMirrorChange = reactExports.useCallback(async (checked) => {
+    setMirrorEnabled(checked);
+    try {
+      const rtcInstance = getter().rtc;
+      if (rtcInstance && rtcInstance.setMediaDevices) {
+        const result = await rtcInstance.setMediaDevices({
+          cameraId: selectedCamera,
+          mirrorEnabled: checked
+        });
+        if (result.success) {
+          console.log("镜像翻转已设置:", checked);
+        } else {
+          console.error("镜像翻转设置失败:", result.message);
+          staticMethods.error("镜像翻转设置失败");
+        }
+      }
+    } catch (error2) {
+      console.error("镜像翻转配置失败:", error2);
+      staticMethods.error("镜像翻转配置失败");
+    }
+  }, [rtc, selectedCamera]);
+  const closeMediaSettings = reactExports.useCallback(() => {
+    setIsModalVisible(false);
+  }, []);
+  const openMediaSettings = () => {
+    console.log("openMediaSettings");
+    setIsModalVisible(true);
+  };
+  const handleClose = reactExports.useCallback(() => {
+    closeMediaSettings();
+  }, [closeMediaSettings]);
+  reactExports.useEffect(() => {
+    console.log("useEffect openMediaSettings");
+    eventBus.on("openMediaSettings", openMediaSettings);
+    eventBus.on("closeMediaSettings", closeMediaSettings);
+    return () => {
+      eventBus.off("openMediaSettings", openMediaSettings);
+      eventBus.off("closeMediaSettings", closeMediaSettings);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(Modal, {
+    open: isModalVisible,
+    title: "媒体设置",
+    onCancel: handleClose,
+    width: 910,
+    footer: null,
+    children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+      className: "flex justify-between",
+      children: [/* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+          children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+            className: "mb-6",
+            children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+              className: "flex items-center mb-2",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                className: "mr-2",
+                children: "摄像头："
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "flex-1",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
+                  className: "w-full",
+                  value: selectedCamera,
+                  onChange: handleCameraChange,
+                  options: reactExports.useMemo(() => cameraDevices.map((device) => ({
+                    value: device.id,
+                    label: device.label
+                  })), [cameraDevices])
+                })
+              })]
+            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+              className: "flex items-center mb-2",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                className: "mr-2",
+                children: "麦克风："
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "flex-1",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
+                  className: "w-full",
+                  value: selectedMicrophone,
+                  onChange: handleMicrophoneChange,
+                  options: reactExports.useMemo(() => microphoneDevices.map((device) => ({
+                    value: device.id,
+                    label: device.label
+                  })), [microphoneDevices])
+                })
+              })]
+            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+              className: "mt-8",
+              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+                className: "flex items-center justify-between mb-2",
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  children: "音频监控"
+                })
+              }), /* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
+                children: /* @__PURE__ */ jsxRuntimeExports.jsx(AudioVisualizer, {
+                  selectedMicrophone,
+                  isVisible: isModalVisible
+                })
+              })]
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+              className: "mt-8",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                className: "flex items-center justify-between mb-2",
+                children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                  children: "镜像翻转"
+                }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
+                  checked: mirrorEnabled,
+                  onChange: handleMirrorChange,
+                  size: "small"
+                })]
+              })
+            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+              className: "mt-8 border-t pt-6",
+              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                className: "mb-4",
+                children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("h3", {
+                  className: "text-lg font-medium mb-4 flex items-center",
+                  children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                    className: "mr-2",
+                    children: "🎨"
+                  }), "美颜设置", !beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                    className: "ml-2 text-xs text-red-500 bg-red-50 px-2 py-1 rounded",
+                    children: "不支持"
+                  })]
+                }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                  className: "flex items-center justify-between mb-4",
+                  children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                    className: "text-sm",
+                    children: "启用美颜"
+                  }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
+                    checked: beautySettings.enabled,
+                    onChange: handleBeautyToggle,
+                    disabled: !beautyCompatible,
+                    size: "small"
+                  })]
+                }), beautySettings.enabled && beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                  className: "space-y-4",
+                  children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                      className: "flex items-center justify-between mb-2",
+                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                        className: "text-sm",
+                        children: "美白强度"
+                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+                        className: "text-xs text-gray-500",
+                        children: [Math.round(beautySettings.whiteIntensity * 100), "%"]
+                      })]
+                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
+                      min: 0,
+                      max: 1,
+                      step: 0.1,
+                      value: beautySettings.whiteIntensity,
+                      onChange: (value) => handleBeautyIntensityChange("white", value),
+                      tooltip: {
+                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
+                      }
+                    })]
+                  }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                      className: "flex items-center justify-between mb-2",
+                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                        className: "text-sm",
+                        children: "磨皮强度"
+                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+                        className: "text-xs text-gray-500",
+                        children: [Math.round(beautySettings.smoothIntensity * 100), "%"]
+                      })]
+                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
+                      min: 0,
+                      max: 1,
+                      step: 0.1,
+                      value: beautySettings.smoothIntensity,
+                      onChange: (value) => handleBeautyIntensityChange("smooth", value),
+                      tooltip: {
+                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
+                      }
+                    })]
+                  }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+                      className: "flex items-center justify-between mb-2",
+                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
+                        className: "text-sm",
+                        children: "锐化强度"
+                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+                        className: "text-xs text-gray-500",
+                        children: [Math.round(beautySettings.sharpenIntensity * 100), "%"]
+                      })]
+                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
+                      min: 0,
+                      max: 1,
+                      step: 0.1,
+                      value: beautySettings.sharpenIntensity,
+                      onChange: (value) => handleBeautyIntensityChange("sharpen", value),
+                      tooltip: {
+                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
+                      }
+                    })]
+                  })]
+                }), !beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsx(Alert, {
+                  message: "美颜功能不可用",
+                  description: "您的浏览器不支持美颜功能，请使用 Chrome 78+ 或其他兼容浏览器",
+                  type: "warning",
+                  showIcon: true,
+                  icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon, {}),
+                  className: "mt-4"
+                })]
+              })
+            })]
+          })
+        })
+      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
+            children: isModalVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(CallUserVideo, {
+              video_id: (callCurrentUser == null ? void 0 : callCurrentUser.rtc_userid) + "preview",
+              user: callCurrentUser,
+              className: " h-60",
+              selectable: false
+            })
+          })
+        }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
+          className: "mt-4 flex items-center justify-center",
+          children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
+            className: "text-sm",
+            children: [(callCurrentUser == null ? void 0 : callCurrentUser.isVideoEnabled) ? "开启" : "关闭", "摄像头"]
+          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
+            checked: callCurrentUser == null ? void 0 : callCurrentUser.isVideoEnabled,
+            onChange: toggleVideo,
+            size: "small"
+          })]
+        })]
+      })]
+    })
+  });
+};
 const CallComponent = () => {
   const liveId = useLiveId();
   const {
@@ -280246,7 +280793,7 @@ const CallComponent = () => {
             })
           }), callConfig.rule === "main" && callConfig.isCall && /* @__PURE__ */ jsxRuntimeExports.jsx(CallBottomActions, {
             onConfigUpdate: handleUpdateRTCConfig
-          })]
+          }), (callConfig == null ? void 0 : callConfig.isCall) && /* @__PURE__ */ jsxRuntimeExports.jsx(MediaSettings, {})]
         })
       })
     })
@@ -280903,10 +281450,141 @@ const useCommentSocketStore = create$c((set3, get4) => ({
   disconnect: void 0,
   // 业务方法（空实现，后续由 Hook 覆盖）
   fetChatUrl: async (id3) => {
-  },
-  setCallback: () => {
   }
 }));
+function useCommentSocket() {
+  const liveId = useLiveId();
+  const callbackRef = reactExports.useRef();
+  const fetchLivePush = useLivePushCodeStore((state) => state.fetchLivePush);
+  const chat_url = useCommentSocketStore((state) => state.chat_url);
+  const handleMessageChange = reactExports.useCallback((mess) => {
+    var _a2;
+    if (!(mess == null ? void 0 : mess.data))
+      return;
+    let message2;
+    try {
+      message2 = JSON.parse(mess.data);
+    } catch (e3) {
+      console.error("解析 WebSocket 消息失败：", e3);
+      return;
+    }
+    useCommentSocketStore.setState({ latestMessage: mess });
+    switch (message2.type) {
+      case "comment_delete":
+        useCommentSocketStore.setState({ commentDeleteItem: message2.data });
+        setTimeout(() => {
+          useCommentSocketStore.setState({ commentDeleteItem: {} });
+        }, 0);
+        break;
+      case "chat_forward":
+        (_a2 = callbackRef.current) == null ? void 0 : _a2.call(callbackRef, message2.data);
+        break;
+      case "activity_config_change":
+        useCommentSocketStore.setState({ activityConfigChange: message2.data });
+        break;
+    }
+  }, []);
+  const socketRef = reactExports.useRef(null);
+  reactExports.useEffect(() => {
+    if (!chat_url) {
+      return;
+    }
+    if (socketRef.current) {
+      socketRef.current.close();
+      socketRef.current = null;
+    }
+    try {
+      socketRef.current = new WebSocket(chat_url);
+      socketRef.current.onopen = (event) => {
+        if (liveId && socketRef.current) {
+          try {
+            const joinRoomMessage = JSON.stringify({
+              type: "join_room",
+              data: { room_id: liveId }
+            });
+            socketRef.current.send(joinRoomMessage);
+          } catch (error2) {
+            console.error("❌ WebSocket: 发送 join_room 失败:", error2);
+          }
+        }
+        useCommentSocketStore.setState({ readyState: 1 });
+      };
+      socketRef.current.onclose = (event) => {
+        useCommentSocketStore.setState({ readyState: 3 });
+      };
+      socketRef.current.onerror = (error2) => {
+        console.error("❌ WebSocket: 连接错误:", error2);
+        useCommentSocketStore.setState({ readyState: 3 });
+      };
+      socketRef.current.onmessage = (event) => {
+        handleMessageChange(event);
+      };
+    } catch (error2) {
+      console.error("❌ WebSocket: 创建连接失败:", error2);
+      useCommentSocketStore.setState({ readyState: 3 });
+    }
+    return () => {
+      if (socketRef.current) {
+        socketRef.current.close();
+        socketRef.current = null;
+      }
+    };
+  }, [chat_url, liveId, handleMessageChange]);
+  const fetChatUrl = reactExports.useCallback(
+    async (id3) => {
+      if (!id3) {
+        return;
+      }
+      try {
+        const res = await fetchLivePush(id3);
+        if (!res) {
+          console.error("❌ 获取直播推流配置失败");
+          return;
+        }
+        let newChatUrl = res.chat_url || "";
+        if (newChatUrl) {
+          const userAgentParam = `equipment=${encodeURIComponent(navigator.userAgent)}`;
+          newChatUrl += newChatUrl.includes("?") ? `&${userAgentParam}` : `?${userAgentParam}`;
+        } else {
+          console.error("❌ 未获取到有效的 chat_url");
+        }
+        useCommentSocketStore.setState({
+          chat_url: newChatUrl,
+          rtmUrl: res.rtm_push_url || "",
+          webTransportUrl: res.web_transport_url || ""
+        });
+      } catch (error2) {
+        console.error("❌ 获取直播推流配置失败:", error2);
+      }
+    },
+    [fetchLivePush]
+  );
+  const setCallback = reactExports.useCallback((callback) => {
+    callbackRef.current = callback;
+  }, []);
+  const sendMessage = reactExports.useCallback((message2) => {
+    if (socketRef.current && socketRef.current.readyState === 1) {
+      socketRef.current.send(message2);
+    } else {
+      console.error("useCommentSocket - 发送消息失败，WebSocket 未连接");
+    }
+  }, []);
+  const disconnect = reactExports.useCallback(() => {
+    if (socketRef.current) {
+      socketRef.current.close();
+      socketRef.current = null;
+      useCommentSocketStore.setState({ readyState: 3 });
+    }
+  }, []);
+  reactExports.useEffect(() => {
+    useCommentSocketStore.setState({
+      sendMessage,
+      disconnect,
+      fetChatUrl
+    });
+  }, [sendMessage, disconnect, fetChatUrl]);
+  return { ...useCommentSocketStore.getState(), setCallback };
+}
 function getTargetElement(target, defaultElement) {
   if (!target) {
     return defaultElement;
@@ -288838,7 +289516,7 @@ const ChatComponent = () => {
     fetChatUrl,
     disconnect,
     setCallback
-  } = useCommentSocketStore();
+  } = useCommentSocket();
   const [selectFilter, setSelectFilter] = reactExports.useState(1);
   const fetchInteractionList = async () => {
     const res = await request("/bis/interaction-list", {
@@ -288878,11 +289556,20 @@ const ChatComponent = () => {
     }
   };
   reactExports.useEffect(() => {
-    fetChatUrl(liveId);
+    setCallback(handleMessage);
     return () => {
-      disconnect == null ? void 0 : disconnect();
+      setCallback(() => {
+      });
     };
   }, []);
+  reactExports.useEffect(() => {
+    if (liveId) {
+      fetChatUrl(liveId);
+    }
+    return () => {
+      disconnect == null ? void 0 : disconnect();
+    };
+  }, [liveId, fetChatUrl, disconnect]);
   const handleMessage = (message2) => {
     console.log("New message received:", message2);
     if (Object.keys(message2).length === 0)
@@ -288907,13 +289594,6 @@ const ChatComponent = () => {
       }
     }
   };
-  reactExports.useEffect(() => {
-    setCallback(handleMessage);
-    return () => {
-      setCallback(() => {
-      });
-    };
-  }, []);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
     className: " h-full",
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
@@ -292136,616 +292816,6 @@ const RtcJoomRoom = reactExports.memo(({
     })
   });
 });
-const AudioVisualizer = reactExports.memo(
-  ({ selectedMicrophone, isVisible: isVisible3, onVolumeLevelsChange }) => {
-    const [audioContext, setAudioContext] = reactExports.useState(null);
-    const [analyser, setAnalyser] = reactExports.useState(null);
-    const [microphoneStream, setMicrophoneStream] = reactExports.useState(null);
-    const [volumeLevels, setVolumeLevels] = reactExports.useState(Array(12).fill(0));
-    const animationFrameRef = reactExports.useRef(null);
-    const canvasRef = reactExports.useRef(null);
-    const microphoneStreamRef = reactExports.useRef(microphoneStream);
-    const audioContextRef = reactExports.useRef(audioContext);
-    const analyserRef = reactExports.useRef(analyser);
-    reactExports.useEffect(() => {
-      microphoneStreamRef.current = microphoneStream;
-      audioContextRef.current = audioContext;
-      analyserRef.current = analyser;
-    }, [microphoneStream, audioContext, analyser]);
-    const cleanupMediaResources = reactExports.useCallback(() => {
-      if (animationFrameRef.current) {
-        cancelAnimationFrame(animationFrameRef.current);
-        animationFrameRef.current = null;
-      }
-      if (microphoneStreamRef.current) {
-        microphoneStreamRef.current.getTracks().forEach((track) => track.stop());
-        setMicrophoneStream(null);
-      }
-      if (audioContextRef.current) {
-        audioContextRef.current.close().catch((err2) => console.error("关闭音频上下文失败:", err2));
-        setAudioContext(null);
-        setAnalyser(null);
-      }
-    }, []);
-    reactExports.useEffect(() => {
-      if (onVolumeLevelsChange) {
-        onVolumeLevelsChange(volumeLevels);
-      }
-    }, [volumeLevels, onVolumeLevelsChange]);
-    reactExports.useEffect(() => {
-      if (isVisible3 && selectedMicrophone) {
-        const context = new (window.AudioContext || window.webkitAudioContext)();
-        setAudioContext(context);
-        const audioAnalyser = context.createAnalyser();
-        audioAnalyser.fftSize = 2048;
-        setAnalyser(audioAnalyser);
-        navigator.mediaDevices.getUserMedia({
-          audio: {
-            deviceId: selectedMicrophone ? { exact: selectedMicrophone } : void 0
-          }
-        }).then((stream) => {
-          setMicrophoneStream(stream);
-          const source = context.createMediaStreamSource(stream);
-          source.connect(audioAnalyser);
-          const canvas = canvasRef.current;
-          const canvasCtx = canvas == null ? void 0 : canvas.getContext("2d");
-          const frequencyDataArray = new Uint8Array(audioAnalyser.frequencyBinCount);
-          const timeDataArray = new Uint8Array(audioAnalyser.frequencyBinCount);
-          const analyzeVolume = () => {
-            audioAnalyser.getByteFrequencyData(frequencyDataArray);
-            audioAnalyser.getByteTimeDomainData(timeDataArray);
-            if (canvasCtx && canvas) {
-              canvasCtx.clearRect(0, 0, canvas.width, canvas.height);
-              canvasCtx.lineWidth = 2;
-              canvasCtx.strokeStyle = "#2196F3";
-              canvasCtx.beginPath();
-              const sliceWidth = canvas.width / timeDataArray.length;
-              let x = 0;
-              for (let i = 0; i < timeDataArray.length; i++) {
-                const v3 = timeDataArray[i] / 128;
-                const y3 = v3 * canvas.height / 2;
-                if (i === 0) {
-                  canvasCtx.moveTo(x, y3);
-                } else {
-                  canvasCtx.lineTo(x, y3);
-                }
-                x += sliceWidth;
-              }
-              canvasCtx.lineTo(canvas.width, canvas.height / 2);
-              canvasCtx.stroke();
-            }
-            const segmentSize = Math.floor(frequencyDataArray.length / 12);
-            const normalizedLevels = Array(12).fill(0).map((_2, index2) => {
-              const start2 = index2 * segmentSize;
-              const end2 = start2 + segmentSize;
-              const segmentAvg = frequencyDataArray.slice(start2, end2).reduce((sum2, value) => sum2 + value, 0) / segmentSize;
-              return Math.min(1, Math.pow(segmentAvg / 255, 0.8));
-            });
-            setVolumeLevels(normalizedLevels);
-            animationFrameRef.current = requestAnimationFrame(analyzeVolume);
-          };
-          analyzeVolume();
-        }).catch((err2) => {
-          console.error("获取麦克风失败:", err2);
-          const interval = setInterval(() => {
-            const newLevels = Array(12).fill(0).map(() => Math.random());
-            setVolumeLevels(newLevels);
-          }, 200);
-          return () => clearInterval(interval);
-        });
-        return cleanupMediaResources;
-      }
-    }, [isVisible3, selectedMicrophone, cleanupMediaResources]);
-    reactExports.useEffect(() => {
-      return () => {
-        cleanupMediaResources();
-      };
-    }, [cleanupMediaResources]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "flex flex-col space-y-4", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: " h-24 bg-gray-50 rounded border border-gray-200", children: /* @__PURE__ */ jsxRuntimeExports.jsx("canvas", { ref: canvasRef, className: " h-full", width: "400", height: "100" }) }) });
-  }
-);
-AudioVisualizer.displayName = "AudioVisualizer";
-class MediaErrorBoundary extends reactExports.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      hasError: false,
-      errorMessage: ""
-    };
-  }
-  static getDerivedStateFromError(error2) {
-    return {
-      hasError: true,
-      errorMessage: error2.message
-    };
-  }
-  componentDidCatch(error2, errorInfo) {
-    console.error("媒体设备错误:", error2, errorInfo);
-  }
-  render() {
-    if (this.state.hasError) {
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        className: "p-4 border border-red-300 rounded bg-red-50",
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Alert, {
-          message: "媒体设备错误",
-          description: `无法访问媒体设备: ${this.state.errorMessage}。请检查设备权限或连接。`,
-          type: "error",
-          showIcon: true,
-          icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon, {})
-        }), /* @__PURE__ */ jsxRuntimeExports.jsx(Button$1, {
-          type: "primary",
-          className: "mt-4",
-          onClick: () => this.setState({
-            hasError: false,
-            errorMessage: ""
-          }),
-          children: "重试"
-        })]
-      });
-    }
-    return this.props.children;
-  }
-}
-const MediaSettings = () => {
-  const {
-    callCurrentUser,
-    toggleVideo,
-    rtc,
-    getter
-  } = useCallStore();
-  const [isModalVisible, setIsModalVisible] = reactExports.useState(false);
-  const [mirrorEnabled, setMirrorEnabled] = reactExports.useState(true);
-  const [cameraDevices, setCameraDevices] = reactExports.useState([]);
-  const [microphoneDevices, setMicrophoneDevices] = reactExports.useState([]);
-  const [selectedCamera, setSelectedCamera] = reactExports.useState("");
-  const [selectedMicrophone, setSelectedMicrophone] = reactExports.useState("");
-  const [beautySettings, setBeautySettings] = reactExports.useState({
-    enabled: false,
-    whiteIntensity: 0.5,
-    smoothIntensity: 0.5,
-    sharpenIntensity: 0.5
-  });
-  const [beautyExtension, setBeautyExtension] = reactExports.useState(null);
-  const [beautyCompatible, setBeautyCompatible] = reactExports.useState(false);
-  console.log("beautyCompatible", beautyCompatible);
-  const [beautyInitialized, setBeautyInitialized] = reactExports.useState(false);
-  const getDevices = reactExports.useCallback(async () => {
-    try {
-      if (!navigator.mediaDevices || !navigator.mediaDevices.enumerateDevices) {
-        console.error("浏览器不支持获取媒体设备列表");
-        staticMethods.error("您的浏览器不支持媒体设备选择功能");
-        return;
-      }
-      await navigator.mediaDevices.getUserMedia({
-        audio: true,
-        video: true
-      }).catch((err2) => console.error("获取媒体权限失败:", err2));
-      const devices = await navigator.mediaDevices.enumerateDevices();
-      const cameras = devices.filter((device) => device.kind === "videoinput").map((device) => ({
-        id: device.deviceId,
-        label: device.label || `摄像头 ${device.deviceId.slice(0, 5)}...`
-      }));
-      const microphones = devices.filter((device) => device.kind === "audioinput").map((device) => ({
-        id: device.deviceId,
-        label: device.label || `麦克风 ${device.deviceId.slice(0, 5)}...`
-      }));
-      if (cameras.length > 0) {
-        setCameraDevices(cameras);
-        setSelectedCamera((prevCamera) => {
-          return cameras.find((cam) => cam.id === prevCamera) ? prevCamera : cameras[0].id;
-        });
-      }
-      if (microphones.length > 0) {
-        setMicrophoneDevices(microphones);
-        setSelectedMicrophone((prevMic) => {
-          return microphones.find((mic) => mic.id === prevMic) ? prevMic : microphones[0].id;
-        });
-      }
-    } catch (error2) {
-      console.error("获取设备列表失败:", error2);
-      staticMethods.error("获取媒体设备失败，请检查设备权限");
-      setCameraDevices([{
-        id: "default",
-        label: "默认摄像头"
-      }]);
-      setMicrophoneDevices([{
-        id: "default",
-        label: "默认麦克风"
-      }]);
-    }
-  }, []);
-  reactExports.useEffect(() => {
-    if (isModalVisible) {
-      getDevices();
-    }
-    if (navigator.mediaDevices) {
-      navigator.mediaDevices.addEventListener("devicechange", getDevices);
-      return () => {
-        navigator.mediaDevices.removeEventListener("devicechange", getDevices);
-      };
-    }
-  }, [getDevices, isModalVisible]);
-  reactExports.useEffect(() => {
-    if (isModalVisible && !beautyInitialized) {
-      initializeBeautyExtension();
-    }
-  }, [isModalVisible, beautyInitialized]);
-  const initializeBeautyExtension = reactExports.useCallback(async () => {
-    try {
-      const rtcInstance = getter().rtc;
-      if (rtcInstance && rtcInstance.beautyExtension) {
-        const extension = rtcInstance.beautyExtension;
-        const compatibilityResult = await extension.checkCompatibility();
-        console.log("浏览器兼容性检查结果:", compatibilityResult);
-        if (compatibilityResult.isCompatible) {
-          setBeautyExtension(extension);
-          setBeautyCompatible(true);
-          setBeautyInitialized(true);
-          console.log("美颜扩展初始化成功");
-        } else {
-          console.warn("浏览器不支持美颜功能:", compatibilityResult.message || "兼容性检查失败");
-          setBeautyCompatible(false);
-          staticMethods.warning("您的浏览器不支持美颜功能，请使用 Chrome 78+ 或其他兼容浏览器");
-        }
-      } else {
-        console.warn("RTC客户端或美颜扩展未初始化");
-        setBeautyCompatible(false);
-        staticMethods.warning("RTC客户端未初始化，无法使用美颜功能");
-      }
-    } catch (error2) {
-      console.error("美颜扩展初始化失败:", error2);
-      setBeautyCompatible(false);
-      staticMethods.error("美颜功能初始化失败");
-    }
-  }, [rtc]);
-  const handleBeautyToggle = reactExports.useCallback((enabled) => {
-    if (!beautyExtension || !beautyCompatible) {
-      staticMethods.warning("美颜功能不可用");
-      return;
-    }
-    try {
-      if (enabled) {
-        beautyExtension.enableBeauty();
-        console.log("美颜已开启");
-      } else {
-        beautyExtension.disableBeauty();
-        console.log("美颜已关闭");
-      }
-      setBeautySettings((prev2) => ({
-        ...prev2,
-        enabled
-      }));
-    } catch (error2) {
-      console.error("美颜开关操作失败:", error2);
-      staticMethods.error("美颜开关操作失败");
-    }
-  }, [beautyExtension, beautyCompatible]);
-  const handleBeautyIntensityChange = reactExports.useCallback(
-    debounce$6((type4, value) => {
-      if (!beautyExtension || !beautyCompatible) {
-        return;
-      }
-      try {
-        let mode;
-        let settingKey;
-        switch (type4) {
-          case "white":
-            mode = EffectBeautyMode.EFFECT_WHITE_MODE;
-            settingKey = "whiteIntensity";
-            break;
-          case "smooth":
-            mode = EffectBeautyMode.EFFECT_SMOOTH_MODE;
-            settingKey = "smoothIntensity";
-            break;
-          case "sharpen":
-            mode = EffectBeautyMode.EFFECT_SHARPEN_MODE;
-            settingKey = "sharpenIntensity";
-            break;
-          default:
-            return;
-        }
-        beautyExtension.setBeautyIntensity(mode, value);
-        setBeautySettings((prev2) => ({
-          ...prev2,
-          [settingKey]: value
-        }));
-        console.log(`${type4} 强度已设置为:`, value);
-      } catch (error2) {
-        console.error("美颜强度设置失败:", error2);
-        staticMethods.error("美颜强度设置失败");
-      }
-    }, 300),
-    // 300ms 防抖延迟
-    [beautyExtension, beautyCompatible]
-  );
-  reactExports.useEffect(() => {
-    const savedBeautySettings = localStorage.getItem("beautySettings");
-    if (savedBeautySettings) {
-      try {
-        const parsed = JSON.parse(savedBeautySettings);
-        setBeautySettings(parsed);
-      } catch (error2) {
-        console.error("加载美颜设置失败:", error2);
-      }
-    }
-  }, []);
-  reactExports.useEffect(() => {
-    localStorage.setItem("beautySettings", JSON.stringify(beautySettings));
-  }, [beautySettings]);
-  const handleCameraChange = reactExports.useCallback(async (newCameraId) => {
-    setSelectedCamera(newCameraId);
-    try {
-      const rtcInstance = getter().rtc;
-      if (rtcInstance && rtcInstance.setMediaDevices) {
-        const result = await rtcInstance.setMediaDevices({
-          cameraId: newCameraId,
-          mirrorEnabled
-        });
-        if (result.success) {
-          console.log("摄像头设备已切换:", newCameraId);
-        } else {
-          console.error("摄像头切换失败:", result.message);
-          staticMethods.error("摄像头切换失败");
-        }
-      }
-    } catch (error2) {
-      console.error("摄像头配置失败:", error2);
-      staticMethods.error("摄像头配置失败");
-    }
-  }, [rtc, mirrorEnabled]);
-  const handleMicrophoneChange = reactExports.useCallback(async (newMicrophoneId) => {
-    setSelectedMicrophone(newMicrophoneId);
-    try {
-      const rtcInstance = getter().rtc;
-      if (rtcInstance && rtcInstance.setMediaDevices) {
-        const result = await rtcInstance.setMediaDevices({
-          microphoneId: newMicrophoneId
-        });
-        if (result.success) {
-          console.log("麦克风设备已切换:", newMicrophoneId);
-        } else {
-          console.error("麦克风切换失败:", result.message);
-          staticMethods.error("麦克风切换失败");
-        }
-      }
-    } catch (error2) {
-      console.error("麦克风配置失败:", error2);
-      staticMethods.error("麦克风配置失败");
-    }
-  }, [rtc]);
-  const handleMirrorChange = reactExports.useCallback(async (checked) => {
-    setMirrorEnabled(checked);
-    try {
-      const rtcInstance = getter().rtc;
-      if (rtcInstance && rtcInstance.setMediaDevices) {
-        const result = await rtcInstance.setMediaDevices({
-          cameraId: selectedCamera,
-          mirrorEnabled: checked
-        });
-        if (result.success) {
-          console.log("镜像翻转已设置:", checked);
-        } else {
-          console.error("镜像翻转设置失败:", result.message);
-          staticMethods.error("镜像翻转设置失败");
-        }
-      }
-    } catch (error2) {
-      console.error("镜像翻转配置失败:", error2);
-      staticMethods.error("镜像翻转配置失败");
-    }
-  }, [rtc, selectedCamera]);
-  const closeMediaSettings = reactExports.useCallback(() => {
-    setIsModalVisible(false);
-  }, []);
-  const openMediaSettings = () => {
-    setIsModalVisible(true);
-  };
-  const handleClose = reactExports.useCallback(() => {
-    closeMediaSettings();
-  }, [closeMediaSettings]);
-  reactExports.useEffect(() => {
-    eventBus.on("openMediaSettings", openMediaSettings);
-    eventBus.on("closeMediaSettings", closeMediaSettings);
-    return () => {
-      eventBus.off("openMediaSettings", openMediaSettings);
-      eventBus.off("closeMediaSettings", closeMediaSettings);
-    };
-  }, []);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(Modal, {
-    open: isModalVisible,
-    title: "媒体设置",
-    onCancel: handleClose,
-    width: 910,
-    footer: null,
-    children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-      className: "flex justify-between",
-      children: [/* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
-        children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-          children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: "mb-6",
-            children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "flex items-center mb-2",
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                className: "mr-2",
-                children: "摄像头："
-              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-                className: "flex-1",
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
-                  className: "w-full",
-                  value: selectedCamera,
-                  onChange: handleCameraChange,
-                  options: reactExports.useMemo(() => cameraDevices.map((device) => ({
-                    value: device.id,
-                    label: device.label
-                  })), [cameraDevices])
-                })
-              })]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "flex items-center mb-2",
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                className: "mr-2",
-                children: "麦克风："
-              }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-                className: "flex-1",
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(Select$1, {
-                  className: "w-full",
-                  value: selectedMicrophone,
-                  onChange: handleMicrophoneChange,
-                  options: reactExports.useMemo(() => microphoneDevices.map((device) => ({
-                    value: device.id,
-                    label: device.label
-                  })), [microphoneDevices])
-                })
-              })]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-              className: "mt-8",
-              children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-                className: "flex items-center justify-between mb-2",
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                  children: "音频监控"
-                })
-              }), /* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
-                children: /* @__PURE__ */ jsxRuntimeExports.jsx(AudioVisualizer, {
-                  selectedMicrophone,
-                  isVisible: isModalVisible
-                })
-              })]
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "mt-8",
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                className: "flex items-center justify-between mb-2",
-                children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                  children: "镜像翻转"
-                }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
-                  checked: mirrorEnabled,
-                  onChange: handleMirrorChange,
-                  size: "small"
-                })]
-              })
-            }), /* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-              className: "mt-8 border-t pt-6",
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                className: "mb-4",
-                children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("h3", {
-                  className: "text-lg font-medium mb-4 flex items-center",
-                  children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                    className: "mr-2",
-                    children: "🎨"
-                  }), "美颜设置", !beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                    className: "ml-2 text-xs text-red-500 bg-red-50 px-2 py-1 rounded",
-                    children: "不支持"
-                  })]
-                }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                  className: "flex items-center justify-between mb-4",
-                  children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                    className: "text-sm",
-                    children: "启用美颜"
-                  }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
-                    checked: beautySettings.enabled,
-                    onChange: handleBeautyToggle,
-                    disabled: !beautyCompatible,
-                    size: "small"
-                  })]
-                }), beautySettings.enabled && beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                  className: "space-y-4",
-                  children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                      className: "flex items-center justify-between mb-2",
-                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                        className: "text-sm",
-                        children: "美白强度"
-                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-                        className: "text-xs text-gray-500",
-                        children: [Math.round(beautySettings.whiteIntensity * 100), "%"]
-                      })]
-                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
-                      min: 0,
-                      max: 1,
-                      step: 0.1,
-                      value: beautySettings.whiteIntensity,
-                      onChange: (value) => handleBeautyIntensityChange("white", value),
-                      tooltip: {
-                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
-                      }
-                    })]
-                  }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                      className: "flex items-center justify-between mb-2",
-                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                        className: "text-sm",
-                        children: "磨皮强度"
-                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-                        className: "text-xs text-gray-500",
-                        children: [Math.round(beautySettings.smoothIntensity * 100), "%"]
-                      })]
-                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
-                      min: 0,
-                      max: 1,
-                      step: 0.1,
-                      value: beautySettings.smoothIntensity,
-                      onChange: (value) => handleBeautyIntensityChange("smooth", value),
-                      tooltip: {
-                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
-                      }
-                    })]
-                  }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                    children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-                      className: "flex items-center justify-between mb-2",
-                      children: [/* @__PURE__ */ jsxRuntimeExports.jsx("span", {
-                        className: "text-sm",
-                        children: "锐化强度"
-                      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-                        className: "text-xs text-gray-500",
-                        children: [Math.round(beautySettings.sharpenIntensity * 100), "%"]
-                      })]
-                    }), /* @__PURE__ */ jsxRuntimeExports.jsx(Slider2, {
-                      min: 0,
-                      max: 1,
-                      step: 0.1,
-                      value: beautySettings.sharpenIntensity,
-                      onChange: (value) => handleBeautyIntensityChange("sharpen", value),
-                      tooltip: {
-                        formatter: (value) => `${Math.round((value || 0) * 100)}%`
-                      }
-                    })]
-                  })]
-                }), !beautyCompatible && /* @__PURE__ */ jsxRuntimeExports.jsx(Alert, {
-                  message: "美颜功能不可用",
-                  description: "您的浏览器不支持美颜功能，请使用 Chrome 78+ 或其他兼容浏览器",
-                  type: "warning",
-                  showIcon: true,
-                  icon: /* @__PURE__ */ jsxRuntimeExports.jsx(RefIcon, {}),
-                  className: "mt-4"
-                })]
-              })
-            })]
-          })
-        })
-      }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-        children: [/* @__PURE__ */ jsxRuntimeExports.jsx("div", {
-          children: /* @__PURE__ */ jsxRuntimeExports.jsx(MediaErrorBoundary, {
-            children: isModalVisible && /* @__PURE__ */ jsxRuntimeExports.jsx(CallUserVideo, {
-              video_id: (callCurrentUser == null ? void 0 : callCurrentUser.rtc_userid) + "preview",
-              user: callCurrentUser,
-              className: " h-60",
-              selectable: false
-            })
-          })
-        }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: "mt-4 flex items-center justify-center",
-          children: [/* @__PURE__ */ jsxRuntimeExports.jsxs("span", {
-            className: "text-sm",
-            children: [(callCurrentUser == null ? void 0 : callCurrentUser.isVideoEnabled) ? "开启" : "关闭", "摄像头"]
-          }), /* @__PURE__ */ jsxRuntimeExports.jsx(Switch, {
-            checked: callCurrentUser == null ? void 0 : callCurrentUser.isVideoEnabled,
-            onChange: toggleVideo,
-            size: "small"
-          })]
-        })]
-      })]
-    })
-  });
-};
 const CallHome$1 = () => {
   const audioContextRef = reactExports.useRef(null);
   const audioDestinationRef = reactExports.useRef(null);
@@ -292811,7 +292881,7 @@ const CallHome$1 = () => {
           rule: "sub"
         }), /* @__PURE__ */ jsxRuntimeExports.jsx(RightSidebar, {
           canvasSetting
-        }), /* @__PURE__ */ jsxRuntimeExports.jsx(MediaSettings, {})]
+        })]
       })]
     }), (callCurrentUser == null ? void 0 : callCurrentUser.waiting_mode_state) === WaitingModeState.WAITING && /* @__PURE__ */ jsxRuntimeExports.jsx(LiveWaitingRoom, {
       hostName: callConfig.title
@@ -295619,7 +295689,7 @@ const CanvasCameraForm = reactExports.forwardRef(({
     const queenEngineCanvas = document.getElementById("queenEngineCanvas");
     const queenEngine = new d$3();
     queenEngineRef.current = queenEngine;
-    queenEngine.init(envConfig.queenSdkKey, function() {
+    queenEngine.init(envConfig$1.queenSdkKey, function() {
       console.log("初始化完成");
       timer.current = setInterval(() => {
         queenRender();
@@ -296119,13 +296189,13 @@ const CanvasUploadVideo = ({
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Dragger$1, {
         ...props,
         children: videoUrl ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-          className: "relative  aspect-video flex items-center justify-center videoUploadWrap",
+          className: "relative w-full aspect-video flex items-center justify-center videoUploadWrap",
           children: [/* @__PURE__ */ jsxRuntimeExports.jsx("video", {
             src: videoUrl,
             autoPlay: !isVideoAutoPlay,
-            className: " aspect-video"
+            className: "w-full"
           }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: " h-full absolute top-0 left-0 text-#fff bg-#0009 items-center justify-center uploadContent flex-col",
+            className: "w-full h-full absolute top-0 left-0 text-#fff bg-#0009 items-center justify-center uploadContent flex-col",
             style: {
               display: "none"
             },
@@ -296269,7 +296339,7 @@ const CanvasUploadAudio = ({
             className: "mt-2",
             children: fileData.current.name
           }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-            className: " h-full absolute top-0 left-0 text-#fff bg-#0009 items-center justify-center uploadContent flex-col",
+            className: "w-full h-full absolute top-0 left-0 text-#fff bg-#0009 items-center justify-center uploadContent flex-col",
             style: {
               display: "none"
             },
@@ -305542,7 +305612,6 @@ const CallHome = () => {
     fabricInstance,
     updateCallConfig
   } = useCallStore();
-  console.log("重新渲染推流端");
   const pcRef = reactExports.useRef(null);
   const audioContextRef = reactExports.useRef(null);
   const audioDestinationRef = reactExports.useRef(null);
@@ -305707,16 +305776,6 @@ const CallHome = () => {
       newBackgroundAudioStreams.set(streamId, audioStream);
       audioStreamRef.current = newBackgroundAudioStreams;
     });
-    return () => {
-      var _a3;
-      const rtmp = rtmpRef.current;
-      console.log("rtmp", rtmp);
-      if (rtmpRef.current) {
-        rtmpRef.current.stopPush();
-        (_a3 = rtmpRef.current) == null ? void 0 : _a3.destroy();
-        rtmpRef.current = null;
-      }
-    };
   }, []);
   reactExports.useEffect(() => {
     const handleBeforeUnload = (e3) => {
@@ -305769,26 +305828,54 @@ const CallHome = () => {
       return;
     (_a3 = livePlayerRef.current) == null ? void 0 : _a3.canvasRequestRenderAll();
   }, [isSelectedId, isHoveredId]);
-  const sizeEl = useSdkStore((state) => state.callConfig.el);
+  const {
+    sizeEl,
+    styleConfig
+  } = useSdkStore((state) => ({
+    sizeEl: state.callConfig.el,
+    styleConfig: state.styleConfig
+  }));
   const wapRef = reactExports.useRef(null);
   reactExports.useEffect(() => {
-    console.log("[livePlayer.设置视频容器高度]", sizeEl);
     if (!wapRef.current)
       return;
-    let el2;
+    let el2 = null;
     if (typeof sizeEl === "string") {
       el2 = document.getElementById(sizeEl);
-    } else {
+      if (!el2) {
+        console.warn(`[ResizeObserver] 找不到 ID 为 "${sizeEl}" 的元素，`);
+      }
+    } else if (sizeEl instanceof HTMLElement) {
       el2 = sizeEl;
+    } else {
+      console.warn("[ResizeObserver] sizeEl 无效，");
     }
-    if (!el2)
+    if (!el2) {
+      console.error("[ResizeObserver] 无法获取要观察的元素");
       return;
+    }
+    console.log("[ResizeObserver] 开始观察元素:", el2);
+    const updateHeight = () => {
+      if (wapRef.current) {
+        const newHeight = el2.clientHeight - 60;
+        wapRef.current.style.height = newHeight + "px";
+        wapRef.current.style.minHeight = "770px";
+        console.log("[ResizeObserver] 更新高度:", newHeight);
+      }
+    };
     const resizeObserver2 = new ResizeObserver(() => {
-      wapRef.current.style.height = (el2 == null ? void 0 : el2.clientHeight) - 60 + "px";
+      updateHeight();
     });
     resizeObserver2.observe(el2);
+    const handleWindowResize = () => {
+      updateHeight();
+    };
+    window.addEventListener("resize", handleWindowResize);
+    updateHeight();
     return () => {
+      console.log("[ResizeObserver] 停止观察元素:", el2);
       resizeObserver2.disconnect();
+      window.removeEventListener("resize", handleWindowResize);
     };
   }, [sizeEl]);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(ConfigProvider$1, {
@@ -305803,7 +305890,7 @@ const CallHome = () => {
       }
     },
     children: [/* @__PURE__ */ jsxRuntimeExports.jsx(RtcJoomRoom, {}), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
-      className: "h-full bg-#0e131c min-w-[1500px] min-h-[770px] overflow-auto flex flex-col",
+      className: `h-full bg-#0e131c min-w-[${styleConfig.minWidth}] min-h-[${styleConfig.minHeight}] overflow-auto`,
       children: [/* @__PURE__ */ jsxRuntimeExports.jsx(Head$1, {
         canvasSetting,
         setCanvasSetting,
@@ -305814,7 +305901,7 @@ const CallHome = () => {
         audioDestinationRef
       }), /* @__PURE__ */ jsxRuntimeExports.jsxs("div", {
         ref: wapRef,
-        className: " flex-1 relative flex mt-1 gap-1 ",
+        className: "h-[calc(100%-60px)] relative flex mt-1 gap-1 ",
         children: [/* @__PURE__ */ jsxRuntimeExports.jsx(LeftSidebar, {
           onSceneClick: handleSceneClick,
           currentScene,