tuikit-atomicx-vue3 4.4.0 → 4.5.0

package/dist/components/UserPicker/components/SelectedPanel/SelectedPanel.js

@@ -1,4 +1,4 @@
-import { defineComponent as h, computed as I, createElementBlock as c, createCommentVNode as i, openBlock as a, normalizeClass as t, createElementVNode as l, toDisplayString as d, unref as o, createTextVNode as m, Fragment as u, renderList as f, createVNode as p } from "vue";
+import { defineComponent as h, computed as I, createElementBlock as c, createCommentVNode as i, openBlock as a, normalizeClass as t, createElementVNode as l, toDisplayString as n, unref as o, createTextVNode as m, Fragment as p, renderList as f, createVNode as y } from "vue";
 import { useUIKit as k, IconClose as b } from "@tencentcloud/uikit-base-component-vue3";
 import $ from "../../../Avatar/Avatar.js";
 import { _ as N } from "../../../../_plugin-vue_export-helper-CHgC5LLL.js";
@@ -12,8 +12,8 @@ const j = ["onClick"], C = /* @__PURE__ */ h({
     maxCount: { default: Number.POSITIVE_INFINITY }
   },
   setup(_) {
-    const { t: y } = k(), n = _, r = I(() => n.displayMode === "list" ? n.selectedItems : n.displayMode === "tree" ? n.selectedItems.filter((e) => e.isLeafNode) : []), v = Number.POSITIVE_INFINITY;
-    return (e, F) => r.value.length > 0 ? (a(), c("div", {
+    const { t: u } = k(), d = _, r = I(() => d.displayMode === "list" ? d.selectedItems : d.displayMode === "tree" ? d.selectedItems.filter((e) => e.isLeafNode) : []), v = Number.POSITIVE_INFINITY;
+    return (e, z) => r.value.length > 0 ? (a(), c("div", {
       key: 0,
       class: t(e.$style.selected__panel)
     }, [
@@ -22,27 +22,28 @@ const j = ["onClick"], C = /* @__PURE__ */ h({
       }, [
         l("span", {
           class: t(e.$style.selected__title)
-        }, d(o(y)("UserPicker.selected")), 3),
+        }, n(o(u)("UserPicker.selected")), 3),
         l("span", {
           class: t(e.$style.selected__count)
         }, [
-          m(d(r.value.length) + " ", 1),
-          _.maxCount < o(v) ? (a(), c(u, { key: 0 }, [
-            m(" / " + d(_.maxCount), 1)
-          ], 64)) : i("", !0)
+          m(n(r.value.length) + " ", 1),
+          _.maxCount < o(v) ? (a(), c(p, { key: 0 }, [
+            m(" / " + n(_.maxCount), 1)
+          ], 64)) : i("", !0),
+          m(" " + n(o(u)("UserPicker.people_unit")), 1)
         ], 2)
       ], 2),
       l("div", {
         class: t(e.$style.selected__list)
       }, [
-        (a(!0), c(u, null, f(r.value, (s) => (a(), c("div", {
+        (a(!0), c(p, null, f(r.value, (s) => (a(), c("div", {
           key: s.key,
           class: t(e.$style.selected__item)
         }, [
           l("div", {
             class: t(e.$style["selected__item-content"])
           }, [
-            p(o($), {
+            y(o($), {
               src: s.avatarUrl,
               class: t(e.$style["selected__item-avatar"]),
               size: "sm",
@@ -50,16 +51,16 @@ const j = ["onClick"], C = /* @__PURE__ */ h({
             }, null, 8, ["src", "class", "alt"]),
             l("div", {
               class: t(e.$style["selected__item-label"])
-            }, d(s.label), 3)
+            }, n(s.label), 3)
           ], 2),
           _.lockedKeys.has(s.key) ? i("", !0) : (a(), c("button", {
             key: 0,
             type: "button",
             class: t(e.$style["selected__remove-button"]),
             "aria-label": "remove",
-            onClick: (K) => _.onRemove(s.key)
+            onClick: (F) => _.onRemove(s.key)
           }, [
-            p(o(b), {
+            y(o(b), {
               name: "close",
               size: "12px"
             })
@@ -68,10 +69,10 @@ const j = ["onClick"], C = /* @__PURE__ */ h({
       ], 2)
     ], 2)) : i("", !0);
   }
-}), V = "_selected__panel_1phj6_12", M = "_selected__header_1phj6_17", P = "_selected__title_1phj6_23", S = "_selected__count_1phj6_28", T = "_selected__list_1phj6_32", g = "_selected__item_1phj6_55", E = {
+}), V = "_selected__panel_1phj6_12", P = "_selected__header_1phj6_17", M = "_selected__title_1phj6_23", S = "_selected__count_1phj6_28", T = "_selected__list_1phj6_32", g = "_selected__item_1phj6_55", E = {
   selected__panel: V,
-  selected__header: M,
-  selected__title: P,
+  selected__header: P,
+  selected__title: M,
   selected__count: S,
   selected__list: T,
   selected__item: g,
@@ -79,9 +80,9 @@ const j = ["onClick"], C = /* @__PURE__ */ h({
   "selected__item-avatar": "_selected__item-avatar_1phj6_70",
   "selected__item-label": "_selected__item-label_1phj6_83",
   "selected__remove-button": "_selected__remove-button_1phj6_91"
-}, z = {
+}, U = {
   $style: E
-}, R = /* @__PURE__ */ N(C, [["__cssModules", z]]);
+}, R = /* @__PURE__ */ N(C, [["__cssModules", U]]);
 export {
   R as default
 };

package/dist/components/UserPicker/hooks/useSearchFilter.d.ts

@@ -1,10 +1,10 @@
 import { Ref } from 'vue';
-import { UserPickerDataSource } from '../type';
+import { UserPickerDataSource, UserPickerRow } from '../type';
 
 interface UseSearchFilterOptions<T = unknown> {
     dataSource: Ref<UserPickerDataSource<T>>;
     isTreeMode?: boolean;
-    onSearch?: (value: string) => void;
+    onSearch?: (dataSource: Array<UserPickerRow<T>>, keyword: string) => Array<UserPickerRow<T>>;
     debounceTime?: number;
 }
 interface UseSearchFilterReturn<T = unknown> {

package/dist/components/UserPicker/hooks/useSearchFilter.js

@@ -1,50 +1,58 @@
-import { ref as f, computed as h } from "vue";
+import { ref as h, computed as f } from "vue";
 function d(e) {
   return e.length === 0 ? !1 : "isLeafNode" in e[0];
 }
-function m(e, i) {
-  if (!i.trim())
+function m(e, a) {
+  if (!a.trim())
     return e;
-  const l = (r) => r.label.toLowerCase().includes(i.toLowerCase()), u = (r) => {
-    const n = [];
-    return r.forEach((t) => {
-      const c = l(t);
-      let s = [];
-      t.children && t.children.length && (s = u(t.children)), (c || s.length > 0) && n.push({
-        ...t,
-        children: s.length > 0 ? s : t.children
+  const t = a.toLowerCase(), u = (l) => l.key.toLowerCase().includes(t) || l.label.toLowerCase().includes(t), r = (l) => {
+    const c = [];
+    return l.forEach((n) => {
+      const o = u(n);
+      let i = [];
+      n.children && n.children.length && (i = r(n.children)), (o || i.length > 0) && c.push({
+        ...n,
+        children: i.length > 0 ? i : n.children
       });
-    }), n;
+    }), c;
   };
-  return u(e);
+  return r(e);
 }
-function g(e, i) {
-  return i.trim() ? e.filter((l) => l.label.toLowerCase().includes(i.toLowerCase())) : e;
+function w(e, a) {
+  if (!a.trim())
+    return e;
+  const t = a.toLowerCase();
+  return e.filter(
+    (u) => u.key.toLowerCase().includes(t) || u.label.toLowerCase().includes(t)
+  );
 }
-function p({
+function C({
   dataSource: e,
-  isTreeMode: i = !1,
-  onSearch: l,
+  isTreeMode: a = !1,
+  onSearch: t,
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   debounceTime: u = 300
 }) {
-  const r = f(""), n = f(!1), t = h(() => r.value.trim() ? i && d(e.value) ? m(e.value, r.value) : g(e.value, r.value) : e.value), c = (a) => {
-    n.value = !0, r.value = a, l && l(a), n.value = !1;
-  }, s = () => {
-    r.value = "", l && l("");
-  }, o = (a) => {
-    r.value = a;
-  }, v = h(() => r.value.trim() ? Array.isArray(t.value) && t.value.length === 0 : !1);
+  const r = h(""), l = h(!1), c = f(() => {
+    const s = r.value.trim();
+    return s ? a && d(e.value) ? m(e.value, s) : t ? t(e.value, s) : w(e.value, s) : e.value;
+  }), n = (s) => {
+    l.value = !0, r.value = s, l.value = !1;
+  }, o = () => {
+    r.value = "";
+  }, i = (s) => {
+    r.value = s;
+  }, v = f(() => r.value.trim() ? Array.isArray(c.value) && c.value.length === 0 : !1);
   return {
     searchValue: r,
-    setSearchValue: o,
-    filteredData: t,
-    isSearching: n,
-    handleSearch: c,
-    clearSearch: s,
+    setSearchValue: i,
+    filteredData: c,
+    isSearching: l,
+    handleSearch: n,
+    clearSearch: o,
     isSearchEmpty: v
   };
 }
 export {
-  p as useSearchFilter
+  C as useSearchFilter
 };

package/dist/components/UserPicker/i18n/en-US.d.ts

@@ -3,5 +3,6 @@ declare const UserPicker: {
     no_result: string;
     no_data_available: string;
     selected: string;
+    people_unit: string;
 };
 export default UserPicker;

package/dist/components/UserPicker/i18n/en-US.js

@@ -2,7 +2,8 @@ const e = {
   search: "Search",
   no_result: "No result",
   no_data_available: "No data available",
-  selected: "Selected"
+  selected: "Selected",
+  people_unit: "people"
 };
 export {
   e as default

package/dist/components/UserPicker/i18n/index.d.ts

@@ -4,12 +4,14 @@ declare const resources: {
         no_result: string;
         no_data_available: string;
         selected: string;
+        people_unit: string;
     };
     'zh-CN': {
         search: string;
         no_result: string;
         no_data_available: string;
         selected: string;
+        people_unit: string;
     };
 };
 export { resources };

package/dist/components/UserPicker/i18n/zh-CN.d.ts

@@ -3,5 +3,6 @@ declare const UserPicker: {
     no_result: string;
     no_data_available: string;
     selected: string;
+    people_unit: string;
 };
 export default UserPicker;

package/dist/components/UserPicker/i18n/zh-CN.js

@@ -2,7 +2,8 @@ const e = {
   search: "搜索",
   no_result: "没有结果",
   no_data_available: "无数据",
-  selected: "已选择"
+  selected: "已选择",
+  people_unit: "人"
 };
 export {
   e as default

package/dist/components/UserPicker/index.d.ts

@@ -17,7 +17,7 @@ declare const UserPicker: import('vue').DefineComponent<import('vue').ExtractPro
         type: import('vue').PropType<(data: UserPickerRow<unknown> | UserPickerNode<unknown>) => any>;
     };
     onSearch: {
-        type: import('vue').PropType<(value: string) => void>;
+        type: import('vue').PropType<(dataSource: UserPickerRow<unknown>[], keyword: string) => UserPickerRow<unknown>[]>;
     };
     maxCount: {
         type: import('vue').PropType<number>;
@@ -78,7 +78,7 @@ declare const UserPicker: import('vue').DefineComponent<import('vue').ExtractPro
         type: import('vue').PropType<(data: UserPickerRow<unknown> | UserPickerNode<unknown>) => any>;
     };
     onSearch: {
-        type: import('vue').PropType<(value: string) => void>;
+        type: import('vue').PropType<(dataSource: UserPickerRow<unknown>[], keyword: string) => UserPickerRow<unknown>[]>;
     };
     maxCount: {
         type: import('vue').PropType<number>;

package/dist/components/UserPicker/type.d.ts

@@ -39,7 +39,7 @@ export interface UserPickerProps<T = unknown> {
     onMaxCountExceed?: (selectedItems: UserPickerResult<T>) => void;
     enableSearch?: boolean;
     searchPlaceholder?: string;
-    onSearch?: (value: string) => void;
+    onSearch?: (dataSource: Array<UserPickerRow<T>>, keyword: string) => Array<UserPickerRow<T>>;
     renderItem?: (data: UserPickerRow<T> | UserPickerNode<T>) => any;
     onSelectedChange?: (selectedItems: UserPickerResult<T>) => void;
     onReachEnd?: () => void;

package/dist/components/VideoSetting/CameraSelect.js

@@ -1,9 +1,8 @@
-import { defineComponent as h, ref as I, watch as _, onBeforeMount as b, createBlock as m, openBlock as o, unref as n, withCtx as g, createElementBlock as y, Fragment as B, renderList as k } from "vue";
-import w from "../../baseComp/Select/SelectPC.js";
-import x from "../../baseComp/Option/OptionPC.js";
+import { defineComponent as I, ref as h, watch as _, onBeforeMount as b, createBlock as m, openBlock as o, unref as n, withCtx as g, createElementBlock as y, Fragment as B, renderList as k } from "vue";
+import { TUISelect as w, TUIOption as x } from "@tencentcloud/uikit-base-component-vue3";
 import { useDeviceState as S } from "../../states/DeviceState/DeviceState.js";
 import { _ as L } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const V = /* @__PURE__ */ h({
+const U = /* @__PURE__ */ I({
   __name: "CameraSelect",
   props: {
     onChange: {},
@@ -11,7 +10,7 @@ const V = /* @__PURE__ */ h({
   },
   setup(d) {
     var i;
-    const { cameraList: c, currentCamera: t, setCurrentCamera: p, getCameraList: v } = S(), u = d, l = I((i = t.value) == null ? void 0 : i.deviceId);
+    const { cameraList: c, currentCamera: t, setCurrentCamera: p, getCameraList: v } = S(), u = d, l = h((i = t.value) == null ? void 0 : i.deviceId);
     _(
       () => {
         var e;
@@ -55,7 +54,7 @@ const V = /* @__PURE__ */ h({
       _: 1
     }, 8, ["modelValue", "disabled"]));
   }
-}), O = /* @__PURE__ */ L(V, [["__scopeId", "data-v-991fca18"]]);
+}), M = /* @__PURE__ */ L(U, [["__scopeId", "data-v-ec49906e"]]);
 export {
-  O as default
+  M as default
 };

package/dist/components/VideoSetting/VideoMediaControl.js

@@ -1,58 +1,58 @@
-import { defineComponent as T, inject as V, ref as x, withDirectives as d, createElementBlock as r, openBlock as o, createVNode as f, unref as e, withCtx as z, Fragment as u, createBlock as i, vShow as B } from "vue";
-import { IconCameraOn as p, IconCameraOff as v } from "@tencentcloud/uikit-base-component-vue3";
-import E from "../../baseComp/IconButton.js";
-import P from "./VideoSettingTab.js";
-import { useI18n as L } from "../../locales/index.js";
-import N from "../../directives/vClickOutside.js";
-import { useUserState as R } from "../../states/UserState/index.js";
-import { useRoomState as U } from "../../states/RoomState.js";
-import { useDeviceState as j } from "../../states/DeviceState/DeviceState.js";
-import { DeviceError as F, DeviceStatus as s, MediaSettingDisplayMode as H } from "../../types/device.js";
-import { _ as W } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const q = { class: "video-control-container" }, A = /* @__PURE__ */ T({
+import { defineComponent as b, inject as O, ref as P, withDirectives as T, createElementBlock as r, openBlock as t, createVNode as D, createBlock as a, createCommentVNode as x, unref as e, withCtx as z, Fragment as d } from "vue";
+import { IconCameraOn as f, IconCameraOff as p } from "@tencentcloud/uikit-base-component-vue3";
+import B from "../../baseComp/IconButton.js";
+import E from "../../directives/vClickOutside.js";
+import { useI18n as N } from "../../locales/index.js";
+import { useRoomParticipantState as L } from "../../states/RoomParticipantState/index.js";
+import { useRoomState as R } from "../../states/RoomState/index.js";
+import j from "./VideoSettingTab.js";
+import { useDeviceState as F } from "../../states/DeviceState/DeviceState.js";
+import { DeviceError as H, DeviceStatus as n, MediaSettingDisplayMode as W } from "../../types/device.js";
+import { _ as q } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const A = { class: "video-control-container" }, G = /* @__PURE__ */ b({
   __name: "VideoMediaControl",
   emits: ["click-icon"],
-  setup(G, { emit: C }) {
-    const _ = V("videoSettingProps"), k = C, { cameraStatus: n, cameraLastError: S, isCameraTesting: c, startCameraDeviceTest: h, stopCameraDeviceTest: w, openLocalCamera: y, closeLocalCamera: g } = j(), { localUser: I } = R(), { currentRoom: l } = U(), { t: D } = L(), t = x(!1);
-    async function M() {
-      var a;
-      if (t.value = !1, k("click-icon"), !l.value) {
-        c.value ? await w() : await h({ view: "video-preview" });
+  setup(J, { emit: u }) {
+    const v = O("videoSettingProps"), C = u, { cameraStatus: s, cameraLastError: k, isCameraTesting: c, startCameraTest: _, stopCameraTest: S, openLocalCamera: h, closeLocalCamera: y } = F(), { currentRoom: m } = R(), { localParticipant: w } = L(), { t: g } = N(), o = P(!1);
+    async function I() {
+      var i;
+      if (o.value = !1, C("click-icon"), !m.value) {
+        c.value ? await S() : await _({ view: "video-preview" });
         return;
       }
-      ((a = I.value) == null ? void 0 : a.cameraStatus) === s.On ? await g() : await y();
+      ((i = w.value) == null ? void 0 : i.cameraStatus) === n.On ? await y() : await h();
     }
-    function b() {
-      t.value = !t.value;
+    function M() {
+      o.value = !o.value;
     }
-    function O() {
-      t.value && (t.value = !1);
+    function V() {
+      o.value && (o.value = !1);
     }
-    return (a, J) => {
-      var m;
-      return d((o(), r("div", q, [
-        f(E, {
-          title: e(D)("Camera"),
-          "has-more": ((m = e(_)) == null ? void 0 : m.displayMode) === e(H).IconWithPanel,
-          disabled: e(n) === e(s).OffNeedPermission,
-          "is-not-support": e(S) !== e(F).NoError,
-          onClickIcon: M,
-          onClickMore: b
+    return (i, K) => {
+      var l;
+      return T((t(), r("div", A, [
+        D(B, {
+          title: e(g)("Camera"),
+          "has-more": ((l = e(v)) == null ? void 0 : l.displayMode) === e(W).IconWithPanel,
+          disabled: e(s) === e(n).OffNeedPermission,
+          "is-not-support": e(k) !== e(H).NoError,
+          onClickIcon: I,
+          onClickMore: M
         }, {
           default: z(() => [
-            e(l) ? (o(), r(u, { key: 1 }, [
-              e(n) === e(s).On ? (o(), i(e(p), {
+            e(m) ? (t(), r(d, { key: 1 }, [
+              e(s) === e(n).On ? (t(), a(e(f), {
                 key: 0,
                 size: "24"
-              })) : (o(), i(e(v), {
+              })) : (t(), a(e(p), {
                 key: 1,
                 size: "24"
               }))
-            ], 64)) : (o(), r(u, { key: 0 }, [
-              e(c) ? (o(), i(e(p), {
+            ], 64)) : (t(), r(d, { key: 0 }, [
+              e(c) ? (t(), a(e(f), {
                 key: 0,
                 size: "24"
-              })) : (o(), i(e(v), {
+              })) : (t(), a(e(p), {
                 key: 1,
                 size: "24"
               }))
@@ -60,15 +60,16 @@ const q = { class: "video-control-container" }, A = /* @__PURE__ */ T({
           ]),
           _: 1
         }, 8, ["title", "has-more", "disabled", "is-not-support"]),
-        d(f(P, { class: "video-tab" }, null, 512), [
-          [B, t.value]
-        ])
+        o.value ? (t(), a(j, {
+          key: 0,
+          class: "video-tab"
+        })) : x("", !0)
       ])), [
-        [e(N), O]
+        [e(E), V]
       ]);
     };
   }
-}), re = /* @__PURE__ */ W(A, [["__scopeId", "data-v-95f3c5e7"]]);
+}), re = /* @__PURE__ */ q(G, [["__scopeId", "data-v-9f083804"]]);
 export {
   re as default
 };

package/dist/components/VideoSetting/VideoPreview.js

@@ -1,38 +1,37 @@
-import { defineComponent as p, onMounted as v, onUnmounted as f, createElementBlock as n, openBlock as o, createElementVNode as a, createCommentVNode as r, createBlock as _, unref as e, toDisplayString as l } from "vue";
-import { IconLoading as u } from "@tencentcloud/uikit-base-component-vue3";
-import { useI18n as w } from "../../locales/index.js";
-import C from "@tencentcloud/tuiroom-engine-js";
-import { useDeviceState as g } from "../../states/DeviceState/DeviceState.js";
-import { _ as y } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const k = { class: "video-preview-container" }, T = { class: "attention-info" }, D = {
+import { defineComponent as _, ref as p, onBeforeMount as v, onMounted as f, onUnmounted as l, createElementBlock as i, openBlock as t, createElementVNode as n, createCommentVNode as s, createBlock as u, unref as e, toDisplayString as w } from "vue";
+import { IconLoading as g } from "@tencentcloud/uikit-base-component-vue3";
+import { useI18n as C } from "../../locales/index.js";
+import { useDeviceState as h } from "../../states/DeviceState/DeviceState.js";
+import { _ as k } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const y = { class: "video-preview-container" }, x = ["id"], B = { class: "attention-info" }, D = {
   key: 0,
   class: "off-camera-info"
-}, I = /* @__PURE__ */ p({
+}, I = /* @__PURE__ */ _({
   __name: "VideoPreview",
-  setup(V) {
-    const { t: s } = w(), { isCameraTesting: c, isCameraTestLoading: t, startCameraDeviceTest: m, stopCameraDeviceTest: d } = g();
-    return v(async () => {
-      C.once("ready", () => {
-        m({ view: "video-preview" });
-      });
+  setup(T) {
+    const { t: r } = C(), { isCameraTesting: c, isCameraTestLoading: a, startCameraDeviceTest: d, stopCameraDeviceTest: m } = h(), o = p("");
+    return v(() => {
+      o.value = `atomicx-video-preview-${Math.random().toString(36).substring(2, 15)}`;
     }), f(async () => {
-      await d();
-    }), (x, i) => (o(), n("div", k, [
-      i[0] || (i[0] = a("div", {
-        id: "video-preview",
+      await d({ view: o.value });
+    }), l(async () => {
+      await m();
+    }), (V, M) => (t(), i("div", y, [
+      n("div", {
+        id: o.value,
         class: "video-preview"
-      }, null, -1)),
-      a("div", T, [
-        !e(c) && !e(t) ? (o(), n("span", D, l(e(s)("Off Camera")), 1)) : r("", !0),
-        e(t) ? (o(), _(e(u), {
+      }, null, 8, x),
+      n("div", B, [
+        !e(c) && !e(a) ? (t(), i("span", D, w(e(r)("Off Camera")), 1)) : s("", !0),
+        e(a) ? (t(), u(e(g), {
           key: 1,
           size: "36",
           class: "loading"
-        })) : r("", !0)
+        })) : s("", !0)
       ])
     ]));
   }
-}), P = /* @__PURE__ */ y(I, [["__scopeId", "data-v-02a8db1b"]]);
+}), b = /* @__PURE__ */ k(I, [["__scopeId", "data-v-ed8972e6"]]);
 export {
-  P as default
+  b as default
 };

package/dist/components/VideoSetting/VideoProfile.js

@@ -1,46 +1,45 @@
-import { defineComponent as m, computed as s, watch as c, createBlock as n, openBlock as a, unref as i, isRef as _, withCtx as v, createElementBlock as V, Fragment as y, renderList as b } from "vue";
-import k from "../../baseComp/Select/SelectPC.js";
-import Q from "../../baseComp/Option/OptionPC.js";
+import { defineComponent as s, computed as c, watch as m, createBlock as n, openBlock as a, unref as i, isRef as v, withCtx as _, createElementBlock as y, Fragment as b, renderList as Q } from "vue";
+import { TUISelect as V, TUIOption as P } from "@tencentcloud/uikit-base-component-vue3";
 import { useI18n as D } from "../../locales/index.js";
-import { TUIVideoQuality as t } from "@tencentcloud/tuiroom-engine-js";
 import { useDeviceState as h } from "../../states/DeviceState/DeviceState.js";
-import { _ as x } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-const C = /* @__PURE__ */ m({
+import { VideoQuality as o } from "../../types/device.js";
+import { _ as k } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+const x = /* @__PURE__ */ s({
   __name: "VideoProfile",
-  setup(P) {
-    const { t: e } = D(), d = s(() => [
-      { label: e("Low Definition"), value: t.kVideoQuality_360p },
+  setup(I) {
+    const { t: e } = D(), p = c(() => [
+      { label: e("Low Definition"), value: o.Quality360P },
       {
         label: e("Standard Definition"),
-        value: t.kVideoQuality_540p
+        value: o.Quality540P
       },
-      { label: e("High Definition"), value: t.kVideoQuality_720p },
+      { label: e("High Definition"), value: o.Quality720P },
       {
         label: e("Super Definition"),
-        value: t.kVideoQuality_1080p
+        value: o.Quality1080P
       }
-    ]), { localVideoQuality: l, updateVideoQuality: p } = h();
-    return c(l, (r) => {
-      p({ quality: r });
-    }), (r, u) => (a(), n(i(k), {
+    ]), { localVideoQuality: l, updateVideoQuality: d } = h();
+    return m(l, (u) => {
+      d({ quality: u });
+    }), (u, r) => (a(), n(i(V), {
       modelValue: i(l),
-      "onUpdate:modelValue": u[0] || (u[0] = (o) => _(l) ? l.value = o : null),
+      "onUpdate:modelValue": r[0] || (r[0] = (t) => v(l) ? l.value = t : null),
       placeholder: "placeholder",
       class: "select",
       teleported: !1,
       "popper-append-to-body": !1
     }, {
-      default: v(() => [
-        (a(!0), V(y, null, b(d.value, (o, f) => (a(), n(i(Q), {
+      default: _(() => [
+        (a(!0), y(b, null, Q(p.value, (t, f) => (a(), n(i(P), {
           key: f,
-          label: o.label,
-          value: o.value
+          label: t.label,
+          value: t.value
         }, null, 8, ["label", "value"]))), 128))
       ]),
       _: 1
     }, 8, ["modelValue"]));
   }
-}), q = /* @__PURE__ */ x(C, [["__scopeId", "data-v-9fdbdd69"]]);
+}), C = /* @__PURE__ */ k(x, [["__scopeId", "data-v-f895787a"]]);
 export {
-  q as default
+  C as default
 };