@opendesign-plus-test/components 0.0.1-rc.220 → 0.0.1-rc.221

package/dist/treeshaking/components/footer/components/FooterList.vue2.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createElementBlock, Fragment, renderSlot, createElementVNode, toDisplayString, createCommentVNode, unref, renderList, createBlock } from "vue";
+import { defineComponent, openBlock, createElementBlock, Fragment, renderSlot, createElementVNode, toDisplayString, createCommentVNode, normalizeClass, unref, renderList, createBlock } from "vue";
 import { ODivider } from "@opensig/opendesign";
 import { useScreen } from "@opendesign-plus/composables";
 const _hoisted_1 = {
@@ -9,51 +9,47 @@ const _hoisted_2 = { class: "info-text" };
 const _hoisted_3 = ["href", "target"];
 const _hoisted_4 = ["src"];
 const _hoisted_5 = {
-  key: 1,
-  class: "content"
-};
-const _hoisted_6 = {
   key: 0,
   class: "quick-nav"
 };
-const _hoisted_7 = { class: "quick-title" };
-const _hoisted_8 = ["href", "target"];
-const _hoisted_9 = {
+const _hoisted_6 = { class: "quick-title" };
+const _hoisted_7 = ["href", "target"];
+const _hoisted_8 = {
   key: 0,
   class: "friendship-link"
 };
-const _hoisted_10 = { class: "friendship-link-title" };
-const _hoisted_11 = { class: "friendship-link-box" };
-const _hoisted_12 = ["href", "target"];
-const _hoisted_13 = { class: "footer-bottom" };
-const _hoisted_14 = {
+const _hoisted_9 = { class: "friendship-link-title" };
+const _hoisted_10 = { class: "friendship-link-box" };
+const _hoisted_11 = ["href", "target"];
+const _hoisted_12 = { class: "footer-bottom" };
+const _hoisted_13 = {
   key: 0,
   class: "footer-logo"
 };
-const _hoisted_15 = ["src"];
-const _hoisted_16 = ["href"];
-const _hoisted_17 = {
+const _hoisted_14 = ["src"];
+const _hoisted_15 = ["href"];
+const _hoisted_16 = {
   key: 1,
   class: "footer-option"
 };
-const _hoisted_18 = { class: "footer-option-item" };
-const _hoisted_19 = ["href", "target"];
-const _hoisted_20 = { class: "license" };
-const _hoisted_21 = { class: "license-text" };
-const _hoisted_22 = { class: "license-info" };
-const _hoisted_23 = { class: "copyright" };
-const _hoisted_24 = { class: "copyright-left" };
-const _hoisted_25 = { class: "copyright-text" };
-const _hoisted_26 = ["href"];
-const _hoisted_27 = { class: "filing" };
-const _hoisted_28 = ["src"];
-const _hoisted_29 = { class: "beian-info" };
-const _hoisted_30 = {
+const _hoisted_17 = { class: "footer-option-item" };
+const _hoisted_18 = ["href", "target"];
+const _hoisted_19 = { class: "license" };
+const _hoisted_20 = { class: "license-text" };
+const _hoisted_21 = { class: "license-info" };
+const _hoisted_22 = { class: "copyright" };
+const _hoisted_23 = { class: "copyright-left" };
+const _hoisted_24 = { class: "copyright-text" };
+const _hoisted_25 = ["href"];
+const _hoisted_26 = { class: "filing" };
+const _hoisted_27 = ["src"];
+const _hoisted_28 = { class: "beian-info" };
+const _hoisted_29 = {
   key: 2,
   class: "footer-right"
 };
-const _hoisted_31 = ["src"];
-const _hoisted_32 = { class: "txt" };
+const _hoisted_30 = ["src"];
+const _hoisted_31 = { class: "txt" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "FooterList",
   props: {
@@ -96,15 +92,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ])) : createCommentVNode("", true)
           ];
         }, true) : createCommentVNode("", true),
-        _ctx.$slots.quickNav || props.quickNav || _ctx.$slots.friendshipLink || props.friendshipLink ? (openBlock(), createElementBlock("div", _hoisted_5, [
+        _ctx.$slots.quickNav || props.quickNav || _ctx.$slots.friendshipLink || props.friendshipLink ? (openBlock(), createElementBlock("div", {
+          key: 1,
+          class: normalizeClass(["content", { "no-info": !(_ctx.$slots.info || props.info) }])
+        }, [
           _ctx.$slots.quickNav || props.quickNav ? renderSlot(_ctx.$slots, "quickNav", { key: 0 }, () => [
-            __props.quickNav && !unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_6, [
+            __props.quickNav && !unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_5, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(__props.quickNav, (nav) => {
                 return openBlock(), createElementBlock("div", {
                   key: nav.title,
                   class: "nav"
                 }, [
-                  createElementVNode("div", _hoisted_7, toDisplayString(nav.title), 1),
+                  createElementVNode("div", _hoisted_6, toDisplayString(nav.title), 1),
                   (openBlock(true), createElementBlock(Fragment, null, renderList(nav.children, (navItem) => {
                     return openBlock(), createElementBlock("p", {
                       key: navItem.title,
@@ -114,7 +113,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         href: navItem.href,
                         target: linkTarget(navItem.href, navItem == null ? void 0 : navItem.target),
                         rel: "noopener noreferrer"
-                      }, toDisplayString(navItem.title), 9, _hoisted_8)
+                      }, toDisplayString(navItem.title), 9, _hoisted_7)
                     ]);
                   }), 128))
                 ]);
@@ -122,37 +121,37 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ])) : createCommentVNode("", true)
           ], true) : createCommentVNode("", true),
           _ctx.$slots.friendshipLink || props.friendshipLink ? renderSlot(_ctx.$slots, "friendshipLink", { key: 1 }, () => [
-            __props.friendshipLink ? (openBlock(), createElementBlock("div", _hoisted_9, [
-              createElementVNode("div", _hoisted_10, toDisplayString(__props.friendshipLink.title), 1),
-              createElementVNode("div", _hoisted_11, [
+            __props.friendshipLink ? (openBlock(), createElementBlock("div", _hoisted_8, [
+              createElementVNode("div", _hoisted_9, toDisplayString(__props.friendshipLink.title), 1),
+              createElementVNode("div", _hoisted_10, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(__props.friendshipLink.children, (link) => {
                   return openBlock(), createElementBlock("a", {
                     href: link.href,
                     key: link.href,
                     target: linkTarget(link.href, link == null ? void 0 : link.target)
-                  }, toDisplayString(link.title), 9, _hoisted_12);
+                  }, toDisplayString(link.title), 9, _hoisted_11);
                 }), 128))
               ])
             ])) : createCommentVNode("", true)
           ], true) : createCommentVNode("", true)
-        ])) : createCommentVNode("", true),
+        ], 2)) : createCommentVNode("", true),
         renderSlot(_ctx.$slots, "footer", {}, () => [
-          createElementVNode("div", _hoisted_13, [
-            __props.footerLogo && !unref(lePadV) ? (openBlock(), createElementBlock("div", _hoisted_14, [
+          createElementVNode("div", _hoisted_12, [
+            __props.footerLogo ? (openBlock(), createElementBlock("div", _hoisted_13, [
               createElementVNode("img", {
                 src: __props.footerLogo.logo,
                 alt: ""
-              }, null, 8, _hoisted_15),
+              }, null, 8, _hoisted_14),
               createElementVNode("p", null, [
                 createElementVNode("a", {
                   href: `mailto:${__props.footerLogo.email}`,
                   target: "_blank",
                   class: "email"
-                }, toDisplayString(__props.footerLogo.email), 9, _hoisted_16)
+                }, toDisplayString(__props.footerLogo.email), 9, _hoisted_15)
               ])
             ])) : createCommentVNode("", true),
-            __props.footerOption ? (openBlock(), createElementBlock("div", _hoisted_17, [
-              createElementVNode("div", _hoisted_18, [
+            __props.footerOption ? (openBlock(), createElementBlock("div", _hoisted_16, [
+              createElementVNode("div", _hoisted_17, [
                 (openBlock(true), createElementBlock(Fragment, null, renderList(__props.footerOption.children, (link, index) => {
                   return openBlock(), createElementBlock(Fragment, {
                     key: link.href
@@ -160,7 +159,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     createElementVNode("a", {
                       href: link.href,
                       target: linkTarget(link.href, link == null ? void 0 : link.target)
-                    }, toDisplayString(link.title), 9, _hoisted_19),
+                    }, toDisplayString(link.title), 9, _hoisted_18),
                     index !== __props.footerOption.children.length - 1 ? (openBlock(), createBlock(unref(ODivider), {
                       key: 0,
                       direction: "v"
@@ -168,29 +167,29 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   ], 64);
                 }), 128))
               ]),
-              createElementVNode("p", _hoisted_20, [
-                createElementVNode("span", _hoisted_21, toDisplayString(__props.footerOption.licenseText), 1),
-                createElementVNode("span", _hoisted_22, toDisplayString(__props.footerOption.licenseInfo), 1)
+              createElementVNode("p", _hoisted_19, [
+                createElementVNode("span", _hoisted_20, toDisplayString(__props.footerOption.licenseText), 1),
+                createElementVNode("span", _hoisted_21, toDisplayString(__props.footerOption.licenseInfo), 1)
               ]),
-              createElementVNode("div", _hoisted_23, [
-                createElementVNode("div", _hoisted_24, [
-                  createElementVNode("p", _hoisted_25, toDisplayString(__props.footerOption.copyright), 1),
+              createElementVNode("div", _hoisted_22, [
+                createElementVNode("div", _hoisted_23, [
+                  createElementVNode("p", _hoisted_24, toDisplayString(__props.footerOption.copyright), 1),
                   createElementVNode("a", {
                     href: __props.footerOption.beianLink,
                     target: "_blank",
                     class: "beian-info"
-                  }, toDisplayString(__props.footerOption.beianInfo1), 9, _hoisted_26)
+                  }, toDisplayString(__props.footerOption.beianInfo1), 9, _hoisted_25)
                 ]),
-                createElementVNode("div", _hoisted_27, [
+                createElementVNode("div", _hoisted_26, [
                   createElementVNode("img", {
                     src: __props.footerOption.policeIcon,
                     class: "filing-img"
-                  }, null, 8, _hoisted_28),
-                  createElementVNode("p", _hoisted_29, toDisplayString(__props.footerOption.beianInfo2), 1)
+                  }, null, 8, _hoisted_27),
+                  createElementVNode("p", _hoisted_28, toDisplayString(__props.footerOption.beianInfo2), 1)
                 ])
               ])
             ])) : createCommentVNode("", true),
-            __props.qrcode ? (openBlock(), createElementBlock("div", _hoisted_30, [
+            __props.qrcode ? (openBlock(), createElementBlock("div", _hoisted_29, [
               (openBlock(true), createElementBlock(Fragment, null, renderList(__props.qrcode, (item, index) => {
                 return openBlock(), createElementBlock("div", {
                   key: index,
@@ -199,8 +198,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                   createElementVNode("img", {
                     src: item.img,
                     alt: ""
-                  }, null, 8, _hoisted_31),
-                  createElementVNode("p", _hoisted_32, toDisplayString(item.label), 1)
+                  }, null, 8, _hoisted_30),
+                  createElementVNode("p", _hoisted_31, toDisplayString(item.label), 1)
                 ]);
               }), 128))
             ])) : createCommentVNode("", true)

package/dist/treeshaking/components/header/OHeader.css

@@ -1,35 +1,35 @@
-.hover-icon-rotate .o-icon[data-v-17eb9d57] {
+.hover-icon-rotate .o-icon[data-v-c1620a61] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-17eb9d57] {
+.hover-icon-rotate:hover .o-icon[data-v-c1620a61] {
     transform: rotate(-180deg);
 }
 }
-.header[data-v-17eb9d57] {
+.header[data-v-c1620a61] {
   --o-header-height: 72px;
   --o-header-content-max-width: 1488px;
   --o-header-content-padding: 0;
 }
 @media (max-width: 1680px) {
-.header[data-v-17eb9d57] {
+.header[data-v-c1620a61] {
     --o-header-content-max-width: 100%;
     --o-header-content-padding: 64px;
 }
 }
 @media (max-width: 1440px) {
-.header[data-v-17eb9d57] {
+.header[data-v-c1620a61] {
     --o-header-height: 64px;
     --o-header-content-padding: 40px;
 }
 }
 @media (max-width: 1200px) {
-.header[data-v-17eb9d57] {
+.header[data-v-c1620a61] {
     --o-header-height: 56px;
     --o-header-content-padding: 32px;
 }
 }
-.header-wrap[data-v-17eb9d57] {
+.header-wrap[data-v-c1620a61] {
   background-color: var(--o-color-fill2);
   position: fixed;
   left: 0;
@@ -40,7 +40,7 @@
   backdrop-filter: blur(5px);
   height: var(--o-header-height);
 }
-.header-content[data-v-17eb9d57] {
+.header-content[data-v-c1620a61] {
   display: flex;
   align-items: center;
   height: 100%;
@@ -48,7 +48,7 @@
   margin: 0 auto;
   padding: 0 var(--o-header-content-padding);
 }
-.header-logo[data-v-17eb9d57] {
+.header-logo[data-v-c1620a61] {
   height: 100%;
   display: flex;
   align-items: center;
@@ -57,36 +57,36 @@
   flex-shrink: 0;
 }
 @media (min-width: 1201px) and (max-width: 1440px) {
-.header-logo[data-v-17eb9d57] {
+.header-logo[data-v-c1620a61] {
     margin-right: 12px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.header-logo[data-v-17eb9d57] {
+.header-logo[data-v-c1620a61] {
     margin-right: 8px;
 }
 }
-.logo[data-v-17eb9d57] {
+.logo[data-v-c1620a61] {
   height: 32px;
 }
-.header-nav-top[data-v-17eb9d57] {
+.header-nav-top[data-v-c1620a61] {
   flex: 1;
   height: 100%;
   min-width: 0;
   overflow: hidden;
   position: relative;
 }
-.header-nav-flatten[data-v-17eb9d57] {
+.header-nav-flatten[data-v-c1620a61] {
   flex: 1;
   height: 100%;
   min-width: 0;
   position: relative;
 }
-.header-toolbar[data-v-17eb9d57] {
+.header-toolbar[data-v-c1620a61] {
   height: 100%;
   position: relative;
 }
-.header-nav-content[data-v-17eb9d57] {
+.header-nav-content[data-v-c1620a61] {
   position: fixed;
   top: var(--o-header-height);
   left: 0;
@@ -96,6 +96,6 @@
   box-shadow: var(--o-shadow-1);
   overflow: hidden;
 }
-[data-o-theme*=dark] .header-wrap[data-v-17eb9d57] {
+[data-o-theme*=dark] .header-wrap[data-v-c1620a61] {
   border-bottom: 1px solid var(--o-color-control4);
 }

package/dist/treeshaking/components/header/OHeader.vue.d.ts

@@ -13,9 +13,9 @@ declare function __VLS_template(): {
         toolbar?(_: {}): any;
     };
     refs: {
-        contentRef: HTMLDivElement;
+        contentRef: HTMLElement;
     };
-    rootEl: HTMLDivElement;
+    rootEl: HTMLElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<NavT, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
@@ -29,8 +29,8 @@ declare const __VLS_component: import('vue').DefineComponent<NavT, {}, {}, {}, {
 }>, {
     isFlatten: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
-    contentRef: HTMLDivElement;
-}, HTMLDivElement>;
+    contentRef: HTMLElement;
+}, HTMLElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/treeshaking/components/header/OHeader.vue.mjs

@@ -1,7 +1,7 @@
 import _sfc_main from "./OHeader.vue2.mjs";
 import './OHeader.css';
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const OHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-17eb9d57"]]);
+const OHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c1620a61"]]);
 export {
   OHeader as default
 };

package/dist/treeshaking/components/header/OHeader.vue2.mjs

@@ -186,7 +186,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       cancelClose();
     });
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
+      return openBlock(), createElementBlock("header", _hoisted_1, [
         createElementVNode("div", {
           class: "header-wrap",
           onMousemove: onMousemoveHeader
@@ -239,11 +239,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ])) : createCommentVNode("", true)
           ])
         ], 32),
-        !props.isFlatten ? (openBlock(), createElementBlock("div", {
+        !props.isFlatten ? (openBlock(), createElementBlock("nav", {
           key: 0,
           ref_key: "contentRef",
           ref: contentRef,
           class: "header-nav-content",
+          "aria-label": "Site",
           onMousemove: onMousemoveHeader
         }, [
           (openBlock(true), createElementBlock(Fragment, null, renderList(navsWithChildren.value, (nav) => {

package/dist/treeshaking/components/header/index.d.ts

@@ -11,8 +11,8 @@ declare const OHeader: {
     }, import('vue').PublicProps, {
         isFlatten: boolean;
     }, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
-        contentRef: HTMLDivElement;
-    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        contentRef: HTMLElement;
+    }, HTMLElement, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};

package/dist/treeshaking/components/meeting/OMeetingPlayback.css

@@ -60,6 +60,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
+  gap: var(--o-r-gap-5);
 }
 .o-meeting-playback .left-card .video-header .video-title {
   font-weight: 500;
@@ -92,6 +93,7 @@
 }
 .o-meeting-playback .left-card .video-header .o-select {
   width: 150px;
+  flex-shrink: 0;
 }
 .o-meeting-playback .left-card .video-content {
   margin-top: var(--o-gap-5);

package/dist/treeshaking/components/meeting/OMeetingPlayback.vue.d.ts

@@ -1,4 +1,4 @@
-import { CaptionItemT, MeetingPlaybackPropsT } from './types';
+import { CaptionItemT, MeetingPlaybackPropsT, MeetingGroupType } from './types';
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
@@ -50,6 +50,7 @@ declare const __VLS_component: import('vue').DefineComponent<MeetingPlaybackProp
 }>, {
     data: import('./types').MeetingPlaybackPropsDataT;
     dates: string[];
+    groupType: MeetingGroupType;
     detail: import('./types').MeetingPlaybackPropsDetailT;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
     leftRef: HTMLDivElement;

package/dist/treeshaking/components/meeting/OMeetingPlayback.vue.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, watchEffect, watch, nextTick, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, createBlock, unref, Fragment, renderList, createCommentVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
+import { defineComponent, ref, watch, computed, watchEffect, nextTick, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, createBlock, unref, Fragment, renderList, createCommentVNode, normalizeClass, normalizeStyle, renderSlot } from "vue";
 import { transformSeconds, speakerNum, transformTime } from "./utils.mjs";
 import { OSelect, OOption, OTab, OTabPane, OScroller, OIcon, OIconChevronDown } from "@opensig/opendesign";
 import _sfc_main$3 from "./components/OMeetingPlaybackSubtitles.vue.mjs";
@@ -8,6 +8,7 @@ import _sfc_main$2 from "./components/OMeetingPlaybackVideo.vue.mjs";
 import './components/OMeetingPlaybackVideo.css';
 import { useI18n } from "../../i18n/index.mjs";
 import { PROGRESS_COLORS } from "./config.mjs";
+import { MeetingGroupType } from "./types.mjs";
 import _sfc_main$1 from "../common/TooltipText.vue.mjs";
 import '../common/TooltipText.css';
 const _hoisted_1 = { class: "o-meeting-playback" };
@@ -40,7 +41,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     dates: { default: () => [] },
     detail: { default: () => ({}) },
     data: { default: () => ({}) },
-    dev: { type: Boolean }
+    dev: { type: Boolean },
+    groupType: { default: MeetingGroupType.SIG }
   },
   emits: ["change-date"],
   setup(__props, { emit: __emit }) {
@@ -55,6 +57,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const setTrackIdx = (idx) => {
       trackIdx.value = idx;
     };
+    watch(
+      () => props.data,
+      () => {
+        trackIdx.value = 0;
+      }
+    );
     const captionsList = ref([]);
     const getCaptions = async (url) => {
       const res = await fetch(url);
@@ -308,8 +316,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                         createElementVNode("span", null, toDisplayString(__props.detail.sponsor), 1)
                       ]),
                       createElementVNode("div", _hoisted_8, [
-                        createElementVNode("span", null, toDisplayString(unref(t)("meeting.item2")), 1),
-                        createElementVNode("span", null, toDisplayString(__props.detail.groupName), 1)
+                        createElementVNode("span", null, toDisplayString(props.groupType === unref(MeetingGroupType).GROUP ? unref(t)("meeting.item2Group") : unref(t)("meeting.item2")), 1),
+                        createElementVNode("span", null, toDisplayString(__props.detail.groupName ?? __props.detail.group_name), 1)
                       ]),
                       createElementVNode("div", _hoisted_9, [
                         createElementVNode("span", null, toDisplayString(unref(t)("meeting.item3")), 1),

package/dist/treeshaking/components/meeting/components/OMeetingPlaybackSubtitles.css

@@ -551,6 +551,9 @@
 .o-meeting-playback-subtitles .o-tab .o-row {
   margin-top: 0;
 }
+.o-meeting-playback-subtitles .playback-empty {
+  height: 100%;
+}
 @media (max-width: 840px) {
 .o-meeting-playback-subtitles .captions-tab .captions-scroller {
     max-height: 600px;

package/dist/treeshaking/components/meeting/components/OMeetingPlaybackSubtitles.vue.mjs

@@ -1,4 +1,4 @@
-import { defineComponent, computed, ref, watch, nextTick, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, unref, withKeys, withModifiers, withCtx, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, createTextVNode, normalizeClass, withDirectives, renderSlot } from "vue";
+import { defineComponent, computed, useId, ref, watch, nextTick, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, createVNode, unref, withKeys, withModifiers, withCtx, toDisplayString, createCommentVNode, Fragment, renderList, createBlock, createTextVNode, normalizeClass, withDirectives, renderSlot } from "vue";
 import { OInput, OIcon, ODivider, OTab, OTabPane, OScroller, ORow, OCol } from "@opensig/opendesign";
 import { ElSelect, ElOption, ElCheckbox } from "element-plus";
 import "element-plus/es/components/select/style/css";
@@ -11,6 +11,7 @@ import IconChevronUp from "../../../_virtual/icon-chevron-up.mjs";
 import IconClose from "../../../_virtual/icon-close.mjs";
 import IconSpeaker from "../../../_virtual/icon-speaker.mjs";
 import { useDebounceFn } from "@vueuse/core";
+import OEmpty from "../../empty/OEmpty.vue.mjs";
 import { useI18n } from "../../../i18n/index.mjs";
 import { buildVueDompurifyHTMLDirective } from "vue-dompurify-html";
 const _hoisted_1 = { class: "o-meeting-playback-subtitles" };
@@ -26,7 +27,10 @@ const _hoisted_7 = { class: "num" };
 const _hoisted_8 = { class: "speaker" };
 const _hoisted_9 = { class: "start-time" };
 const _hoisted_10 = { class: "text" };
-const _hoisted_11 = { key: 1 };
+const _hoisted_11 = {
+  key: 1,
+  class: "playback-empty"
+};
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "OMeetingPlaybackSubtitles",
   props: {
@@ -39,6 +43,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     const { t } = useI18n();
     const currentIndex = computed(() => props.trackIdx);
+    const scrollerDomId = useId();
+    const getScrollerContainer = () => document.querySelector(`#${scrollerDomId} > .o-scroller-container`);
     const scrollContainer = ref();
     const wheelVisible = ref(false);
     const handleScroll = () => {
@@ -88,14 +94,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     onMounted(() => {
       var _a;
-      scrollContainer.value = document.querySelector("#captionsScrollDom > .o-scroller-container");
+      scrollContainer.value = getScrollerContainer();
       (_a = scrollContainer.value) == null ? void 0 : _a.addEventListener("wheel", handleScroll);
     });
     watch(
       () => computedCaptions.value,
       () => {
         var _a;
-        scrollContainer.value = document.querySelector("#captionsScrollDom > .o-scroller-container");
+        scrollContainer.value = getScrollerContainer();
         (_a = scrollContainer.value) == null ? void 0 : _a.addEventListener("wheel", handleScroll);
       }
     );
@@ -359,7 +365,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               default: withCtx(() => [
                 computedCaptions.value.length ? (openBlock(), createBlock(unref(OScroller), {
                   key: 0,
-                  id: "captionsScrollDom",
+                  id: unref(scrollerDomId),
                   class: "captions-scroller",
                   "show-type": "hover",
                   size: "small",
@@ -408,8 +414,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     })
                   ]),
                   _: 1
-                })) : (openBlock(), createElementBlock("div", _hoisted_11, [
-                  renderSlot(_ctx.$slots, "empty")
+                }, 8, ["id"])) : (openBlock(), createElementBlock("div", _hoisted_11, [
+                  renderSlot(_ctx.$slots, "empty", {}, () => [
+                    createVNode(OEmpty)
+                  ])
                 ]))
               ]),
               _: 3

package/dist/treeshaking/components/meeting/components/OMeetingPlaybackVideo.vue.mjs

@@ -1,10 +1,11 @@
-import { defineComponent, ref, watch, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, normalizeClass, toDisplayString, createCommentVNode, nextTick } from "vue";
+import { defineComponent, ref, useId, watch, onMounted, onUnmounted, openBlock, createElementBlock, createElementVNode, normalizeClass, unref, toDisplayString, createCommentVNode } from "vue";
 import videojs from "../../../_virtual/video.js/dist/video.es.js.mjs";
 import '../../../_virtual/video.js/dist/video-js.css';
 import { transformTime } from "../utils.mjs";
 import defaultPoster from "../../../assets/meeting/transparent.png.mjs";
 const _hoisted_1 = { class: "o-meeting-playback-video" };
-const _hoisted_2 = {
+const _hoisted_2 = ["id"];
+const _hoisted_3 = {
   key: 0,
   class: "poster-title"
 };
@@ -23,8 +24,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const timer = ref();
-    const colHeight = ref();
     const playerRef = ref();
+    const playerId = useId();
     const emits = __emit;
     const speakerMenuVisible = ref(false);
     const closeSpeakerMenu = () => {
@@ -98,7 +99,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const playStatus = ref("init");
     const videoInit = async () => {
       if (!props.src) return;
-      const player = videojs("playerId", {
+      const player = videojs(playerId, {
         controls: true,
         autoplay: false,
         preload: "auto",
@@ -168,9 +169,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       }
       if (props.vtt) {
-        videojs.registerComponent("SubtitleToggleButton", CustomSubsCapsButton);
-        if (!player.controlBar.children_.some((v) => v.name_ === "SubtitleToggleButton")) {
-          player.controlBar.addChild("SubtitleToggleButton", {}, 8);
+        const subtitleToggleName = `SubtitleToggleButton-${playerId}`;
+        videojs.registerComponent(subtitleToggleName, CustomSubsCapsButton);
+        if (!player.controlBar.children_.some((v) => v.name_ === subtitleToggleName)) {
+          player.controlBar.addChild(subtitleToggleName, {}, 8);
         }
       }
       const textTracks = player == null ? void 0 : player.textTracks().tracks_;
@@ -193,10 +195,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       player.one("loadedmetadata", () => {
         emits("getDuration", player.duration());
       });
-      nextTick(() => {
-        const container = document.getElementsByClassName("o-meeting-playback-video")[0];
-        colHeight.value = container.offsetHeight;
-      });
       playerRef.value = player;
     };
     onMounted(() => {
@@ -229,11 +227,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             [playStatus.value]: true
           }])
         }, [
-          _cache[0] || (_cache[0] = createElementVNode("video", {
+          createElementVNode("video", {
             class: "video-js",
-            id: "playerId"
-          }, null, -1)),
-          __props.posterTitle ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(__props.posterTitle), 1)) : createCommentVNode("", true)
+            id: unref(playerId)
+          }, null, 8, _hoisted_2),
+          __props.posterTitle ? (openBlock(), createElementBlock("div", _hoisted_3, toDisplayString(__props.posterTitle), 1)) : createCommentVNode("", true)
         ], 2)
       ]);
     };