@opendesign-plus-test/components 0.0.1-rc.145 → 0.0.1-rc.147

package/dist/treeshaking/components/video/OVideoDetail.vue.d.ts

@@ -0,0 +1,7 @@
+import { CourseCollectionT } from './types';
+type __VLS_Props = {
+    data: CourseCollectionT;
+    layout?: 'horizontal' | 'vertical';
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;

package/dist/treeshaking/components/video/OVideoDetail.vue.mjs

@@ -0,0 +1,318 @@
+import { defineComponent, ref, computed, openBlock, createElementBlock, Fragment, createElementVNode, createVNode, unref, normalizeStyle, withCtx, toDisplayString, createCommentVNode, normalizeClass, createBlock, renderList, createTextVNode, createSlots } from "vue";
+import { OCard, ODivider, OScroller, OMenu, OMenuItem, OIcon, OLink, ODialog } from "@opensig/opendesign";
+import IconVideo from "../../_virtual/icon-video.mjs";
+import IconMaterial from "../../_virtual/icon-material.mjs";
+import IconRight from "../../_virtual/icon-chevron-right.mjs";
+import { useScreen } from "@opendesign-plus/composables";
+import { useI18n } from "../../i18n/index.mjs";
+import _sfc_main$1 from "../common/WordAvatar.vue.mjs";
+import '../common/WordAvatar.css';
+const _hoisted_1 = { class: "o-video-detail-content-wrapper" };
+const _hoisted_2 = { class: "o-video-card-item-header" };
+const _hoisted_3 = { class: "o-video-card-item-content o-video-info-desc" };
+const _hoisted_4 = { class: "o-video-card-item-content-font" };
+const _hoisted_5 = { class: "o-video-card-item-header" };
+const _hoisted_6 = { class: "o-video-card-item-header-title" };
+const _hoisted_7 = ["title"];
+const _hoisted_8 = { class: "o-video-course-main-header" };
+const _hoisted_9 = ["src"];
+const _hoisted_10 = { class: "o-video-course-info-wrapper" };
+const _hoisted_11 = { class: "o-video-course-info-title" };
+const _hoisted_12 = { class: "o-video-course-info-avatar" };
+const _hoisted_13 = { class: "o-video-info-detail-wrapper" };
+const _hoisted_14 = { class: "o-video-info-detail-name" };
+const _hoisted_15 = { class: "o-video-info-detail-position" };
+const _hoisted_16 = { class: "o-video-course-info-content-title" };
+const _hoisted_17 = { class: "o-video-course-info-content" };
+const _hoisted_18 = { class: "o-video-material-download-wrapper" };
+const _hoisted_19 = { class: "o-video-material-download-info" };
+const _hoisted_20 = { class: "o-video-material-download-tip" };
+const _hoisted_21 = {
+  key: 0,
+  class: "o-video-material-download-size"
+};
+const _hoisted_22 = { class: "o-video-dlg-title" };
+const _hoisted_23 = { class: "o-video-dlg-body" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OVideoDetail",
+  props: {
+    data: {},
+    layout: {}
+  },
+  setup(__props) {
+    var _a, _b, _c;
+    const props = __props;
+    const { lePadV } = useScreen();
+    const { t } = useI18n();
+    const videoUrl = ref(((_c = (_b = (_a = props.data) == null ? void 0 : _a.courseList) == null ? void 0 : _b[0]) == null ? void 0 : _c.link) || "");
+    const currentCourse = computed(() => {
+      var _a2, _b2;
+      return (_b2 = (_a2 = props.data) == null ? void 0 : _a2.courseList) == null ? void 0 : _b2.find((item) => item.link === videoUrl.value);
+    });
+    const hasMenu = computed(() => {
+      var _a2, _b2;
+      return (((_b2 = (_a2 = props.data) == null ? void 0 : _a2.courseList) == null ? void 0 : _b2.length) || 0) > 1;
+    });
+    const showDialog = ref(false);
+    const toggleDialog = (val) => {
+      showDialog.value = val;
+    };
+    return (_ctx, _cache) => {
+      var _a2;
+      return openBlock(), createElementBlock(Fragment, null, [
+        createElementVNode("div", _hoisted_1, [
+          createVNode(unref(OCard), {
+            class: "o-video-card-item",
+            style: normalizeStyle({ "--video-banner-url": ((_a2 = props.data) == null ? void 0 : _a2.banner) ? `url(${props.data.banner})` : "none" })
+          }, {
+            header: withCtx(() => {
+              var _a3;
+              return [
+                createElementVNode("div", _hoisted_2, toDisplayString((_a3 = props.data) == null ? void 0 : _a3.title), 1)
+              ];
+            }),
+            footer: withCtx(() => {
+              var _a3, _b2, _c2, _d;
+              return [
+                createElementVNode("div", _hoisted_3, [
+                  ((_a3 = props.data) == null ? void 0 : _a3.editorName) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                    createElementVNode("span", _hoisted_4, toDisplayString(unref(t)("video.editor")) + " " + toDisplayString((_b2 = props.data) == null ? void 0 : _b2.editorName) + "(" + toDisplayString((_c2 = props.data) == null ? void 0 : _c2.editorEmail) + ") ", 1),
+                    createVNode(unref(ODivider), { direction: "v" })
+                  ], 64)) : createCommentVNode("", true),
+                  createElementVNode("span", null, toDisplayString(unref(t)("video.lastUpdated")) + " " + toDisplayString((_d = props.data) == null ? void 0 : _d.lastUpdated), 1)
+                ])
+              ];
+            }),
+            _: 1
+          }, 8, ["style"]),
+          createElementVNode("div", {
+            class: normalizeClass(["o-video-card-video-list", [
+              `o-video-card-video-list--${props.layout || "horizontal"}`,
+              { "o-video-card-video-list--no-menu": !hasMenu.value }
+            ]])
+          }, [
+            hasMenu.value ? (openBlock(), createBlock(unref(OCard), {
+              key: 0,
+              class: "o-video-course-menu-card"
+            }, {
+              header: withCtx(() => {
+                var _a3, _b2;
+                return [
+                  createElementVNode("div", _hoisted_5, [
+                    createElementVNode("div", _hoisted_6, toDisplayString(unref(t)("video.sessionList")), 1),
+                    createElementVNode("div", {
+                      class: "o-video-card-item-header-menu-wrapper",
+                      onClick: _cache[0] || (_cache[0] = ($event) => toggleDialog(true))
+                    }, [
+                      createElementVNode("div", {
+                        class: "o-video-card-item-header-menu",
+                        title: (_a3 = currentCourse.value) == null ? void 0 : _a3.title
+                      }, toDisplayString((_b2 = currentCourse.value) == null ? void 0 : _b2.title), 9, _hoisted_7),
+                      createVNode(unref(OIcon), null, {
+                        default: withCtx(() => [
+                          createVNode(unref(IconRight))
+                        ]),
+                        _: 1
+                      })
+                    ])
+                  ])
+                ];
+              }),
+              default: withCtx(() => [
+                createVNode(unref(OScroller), {
+                  "disabled-x": "",
+                  "show-type": "always",
+                  size: "small",
+                  class: "o-video-video-scroller"
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(OMenu), {
+                      modelValue: videoUrl.value,
+                      "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => videoUrl.value = $event)
+                    }, {
+                      default: withCtx(() => {
+                        var _a3;
+                        return [
+                          (openBlock(true), createElementBlock(Fragment, null, renderList((_a3 = props.data) == null ? void 0 : _a3.courseList, (item) => {
+                            return openBlock(), createBlock(unref(OMenuItem), {
+                              key: item.id,
+                              value: item.link,
+                              title: item.title
+                            }, {
+                              icon: withCtx(() => [
+                                createVNode(unref(OIcon), null, {
+                                  default: withCtx(() => [
+                                    createVNode(unref(IconVideo))
+                                  ]),
+                                  _: 1
+                                })
+                              ]),
+                              default: withCtx(() => [
+                                createTextVNode(" " + toDisplayString(item.title), 1)
+                              ]),
+                              _: 2
+                            }, 1032, ["value", "title"]);
+                          }), 128))
+                        ];
+                      }),
+                      _: 1
+                    }, 8, ["modelValue"])
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })) : createCommentVNode("", true),
+            createVNode(unref(OCard), { class: "o-video-course-video-card" }, {
+              header: withCtx(() => {
+                var _a3;
+                return [
+                  createElementVNode("div", _hoisted_8, toDisplayString((_a3 = currentCourse.value) == null ? void 0 : _a3.title), 1)
+                ];
+              }),
+              default: withCtx(() => [
+                createElementVNode("video", {
+                  controls: "",
+                  muted: "",
+                  preload: "auto",
+                  class: "o-video-video-player",
+                  src: videoUrl.value
+                }, null, 8, _hoisted_9)
+              ]),
+              _: 1
+            }),
+            createVNode(unref(OCard), { class: "o-video-course-info-card" }, createSlots({
+              default: withCtx(() => {
+                var _a3, _b2, _c2, _d;
+                return [
+                  createElementVNode("div", _hoisted_10, [
+                    createElementVNode("div", _hoisted_11, toDisplayString(unref(t)("video.featuredSpeaker")), 1),
+                    createElementVNode("div", _hoisted_12, [
+                      (openBlock(true), createElementBlock(Fragment, null, renderList((_a3 = currentCourse.value) == null ? void 0 : _a3.speakers, (speaker) => {
+                        return openBlock(), createElementBlock("div", {
+                          key: speaker.id,
+                          class: "o-video-course-info-avatar-item"
+                        }, [
+                          createVNode(_sfc_main$1, {
+                            name: speaker.name,
+                            src: speaker.image,
+                            style: { width: "var(--avatar-size)", height: "var(--avatar-size)" }
+                          }, null, 8, ["name", "src"]),
+                          createElementVNode("div", _hoisted_13, [
+                            createElementVNode("div", _hoisted_14, toDisplayString(speaker.name), 1),
+                            createElementVNode("div", _hoisted_15, toDisplayString(speaker.title), 1)
+                          ])
+                        ]);
+                      }), 128))
+                    ]),
+                    createElementVNode("div", _hoisted_16, toDisplayString(unref(t)("video.abstract")), 1),
+                    createElementVNode("div", _hoisted_17, toDisplayString((_b2 = currentCourse.value) == null ? void 0 : _b2.description), 1),
+                    createElementVNode("div", _hoisted_18, [
+                      createElementVNode("div", _hoisted_19, [
+                        createVNode(unref(OIcon), null, {
+                          default: withCtx(() => [
+                            createVNode(unref(IconMaterial))
+                          ]),
+                          _: 1
+                        }),
+                        createElementVNode("div", _hoisted_20, toDisplayString(unref(t)("video.downloadCourseware")), 1),
+                        ((_c2 = currentCourse.value) == null ? void 0 : _c2.materialSize) ? (openBlock(), createElementBlock("span", _hoisted_21, toDisplayString(currentCourse.value.materialSize), 1)) : createCommentVNode("", true)
+                      ]),
+                      createVNode(unref(OLink), {
+                        color: "primary",
+                        target: "_self",
+                        href: (_d = currentCourse.value) == null ? void 0 : _d.material
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(unref(t)("video.download")), 1)
+                        ]),
+                        _: 1
+                      }, 8, ["href"])
+                    ])
+                  ])
+                ];
+              }),
+              _: 2
+            }, [
+              __props.layout === "vertical" ? {
+                name: "header",
+                fn: withCtx(() => [
+                  _cache[6] || (_cache[6] = createElementVNode("div", { class: "o-video-card-item-header" }, toDisplayString("视频介绍材料"), -1))
+                ]),
+                key: "0"
+              } : void 0
+            ]), 1024)
+          ], 2)
+        ]),
+        createVNode(unref(ODialog), {
+          visible: showDialog.value,
+          "onUpdate:visible": _cache[5] || (_cache[5] = ($event) => showDialog.value = $event),
+          "phone-half-full": unref(lePadV),
+          scrollbar: true,
+          class: "o-video-courses-dialog-mb"
+        }, {
+          header: withCtx(() => [
+            createElementVNode("p", _hoisted_22, toDisplayString(unref(t)("video.sessionList")), 1)
+          ]),
+          footer: withCtx(() => [
+            createElementVNode("div", {
+              class: "o-video-dlg-action",
+              onClick: _cache[4] || (_cache[4] = ($event) => toggleDialog(false)),
+              style: { "cursor": "pointer" }
+            }, toDisplayString(unref(t)("video.cancel")), 1)
+          ]),
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_23, [
+              createVNode(unref(OScroller), {
+                "disabled-x": "",
+                "show-type": "always",
+                size: "small",
+                class: "o-video-video-scroller"
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(OMenu), {
+                    modelValue: videoUrl.value,
+                    "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => videoUrl.value = $event)
+                  }, {
+                    default: withCtx(() => {
+                      var _a3;
+                      return [
+                        (openBlock(true), createElementBlock(Fragment, null, renderList((_a3 = props.data) == null ? void 0 : _a3.courseList, (item) => {
+                          return openBlock(), createBlock(unref(OMenuItem), {
+                            key: item.id,
+                            value: item.link,
+                            title: item.title,
+                            onClick: _cache[2] || (_cache[2] = ($event) => toggleDialog(false))
+                          }, {
+                            icon: withCtx(() => [
+                              createVNode(unref(OIcon), null, {
+                                default: withCtx(() => [
+                                  createVNode(unref(IconVideo))
+                                ]),
+                                _: 1
+                              })
+                            ]),
+                            default: withCtx(() => [
+                              createTextVNode(" " + toDisplayString(item.title), 1)
+                            ]),
+                            _: 2
+                          }, 1032, ["value", "title"]);
+                        }), 128))
+                      ];
+                    }),
+                    _: 1
+                  }, 8, ["modelValue"])
+                ]),
+                _: 1
+              })
+            ])
+          ]),
+          _: 1
+        }, 8, ["visible", "phone-half-full"])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/video/OVideoDetail.vue3.mjs

@@ -0,0 +1,5 @@
+import _sfc_main from "./OVideoDetail.vue.mjs";
+import './OVideoDetail.css';
+export {
+  _sfc_main as default
+};

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

@@ -0,0 +1,27 @@
+import { App } from 'vue';
+declare const OVideoDetail: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+        data: import('./types').CourseCollectionT;
+        layout?: "horizontal" | "vertical";
+    }> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{
+        data: import('./types').CourseCollectionT;
+        layout?: "horizontal" | "vertical";
+    }> & Readonly<{}>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{
+    data: import('./types').CourseCollectionT;
+    layout?: "horizontal" | "vertical";
+}> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: App): void;
+};
+export { OVideoDetail };
+export * from './types';

package/dist/treeshaking/components/video/index.mjs

@@ -0,0 +1,10 @@
+import _sfc_main from "./OVideoDetail.vue.mjs";
+import './OVideoDetail.css';
+const OVideoDetail = Object.assign(_sfc_main, {
+  install(app) {
+    app.component("OVideoDetail", _sfc_main);
+  }
+});
+export {
+  OVideoDetail
+};

package/dist/treeshaking/components/video/types.d.ts

@@ -0,0 +1,24 @@
+export interface SpeakerT {
+    id: string;
+    name: string;
+    title: string;
+    image?: string;
+}
+export interface CourseItemT {
+    id: string;
+    title: string;
+    link: string;
+    description: string;
+    material: string;
+    materialSize?: string;
+    speakers: SpeakerT[];
+}
+export interface CourseCollectionT {
+    id: string;
+    title: string;
+    lastUpdated: string;
+    courseList: CourseItemT[];
+    banner?: string;
+    editorName?: string;
+    editorEmail?: string;
+}

package/dist/treeshaking/i18n/en.mjs

@@ -364,7 +364,16 @@ const en = {
   "common.empty": "No data",
   "common.search": "Search",
   "common.filter": "Filter",
-  "common.more2": "View More"
+  "common.more2": "View More",
+  "video.editor": "Editor:",
+  "video.lastUpdated": "Last updated:",
+  "video.sessionList": "Session List",
+  "video.featuredSpeaker": "Featured Speaker",
+  "video.abstract": "Abstract",
+  "video.downloadCourseware": "Download Courseware",
+  "video.download": "Download",
+  "video.cancel": "Cancel",
+  "logo.tip": "Listed in no particular order"
 };
 export {
   en as default

package/dist/treeshaking/i18n/zh.mjs

@@ -367,7 +367,16 @@ const zh = {
   "common.search": "搜索",
   "common.confirm2": "确定",
   "common.filter": "筛选",
-  "common.more2": "查看更多"
+  "common.more2": "查看更多",
+  "video.editor": "责任编辑：",
+  "video.lastUpdated": "最近更新：",
+  "video.sessionList": "视频列表",
+  "video.featuredSpeaker": "主讲嘉宾",
+  "video.abstract": "内容简介",
+  "video.downloadCourseware": "课件下载",
+  "video.download": "下载",
+  "video.cancel": "取消",
+  "logo.tip": "注：排名不分先后"
 };
 export {
   zh as default

package/dist/treeshaking/index.d.ts

@@ -20,3 +20,4 @@ export * from './components/meeting';
 export * from './components/search';
 export * from './components/section';
 export * from './components/sig';
+export * from './components/video';

package/dist/treeshaking/index.mjs

@@ -19,6 +19,7 @@ import { OMeetingCalendar, OMeetingForm, OMeetingMyCalendar, OMeetingPlayback, O
 import { OSearchInput } from "./components/search/index.mjs";
 import { OSection } from "./components/section/index.mjs";
 import { OSigDetail, OSigList } from "./components/sig/index.mjs";
+import { OVideoDetail } from "./components/video/index.mjs";
 import { CalendarDataType, MeetingGroupType } from "./components/meeting/types.mjs";
 import { EventsStatusT } from "./components/events/types.mjs";
 import { NavType } from "./components/header/types.mjs";
@@ -64,5 +65,6 @@ export {
   OSection,
   OSigDetail,
   OSigList,
+  OVideoDetail,
   createSvgIcon
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opendesign-plus-test/components",
-  "version": "0.0.1-rc.145",
+  "version": "0.0.1-rc.147",
   "type": "module",
   "publishConfig": {
     "access": "public",

package/dist/treeshaking/_virtual/icon-filter.mjs

@@ -1,21 +0,0 @@
-import { openBlock, createElementBlock, createElementVNode } from "vue";
-const _hoisted_1 = {
-  version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  width: "24",
-  height: "24",
-  viewBox: "0 0 24 24"
-};
-function render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1, [..._cache[0] || (_cache[0] = [
-    createElementVNode("path", {
-      opacity: "0.8",
-      fill: "#000",
-      d: "M17.286 5c0.676 0 1.213 0.546 1.213 1.21 0 0.227-0.064 0.449-0.184 0.641l-0.065 0.093-1.24 1.62c-0.149 0.194-0.433 0.236-0.634 0.092-0.181-0.129-0.234-0.364-0.134-0.551l0.039-0.060 1.24-1.62c0.046-0.060 0.071-0.136 0.071-0.214 0-0.169-0.113-0.302-0.253-0.329l-0.054-0.005h-10.573c-0.064 0-0.126 0.022-0.179 0.064-0.126 0.099-0.162 0.281-0.092 0.426l0.036 0.059 4.207 5.495c0.138 0.18 0.221 0.394 0.243 0.617l0.006 0.112 0.015 3.985c0 0.088 0.033 0.171 0.087 0.232l0.045 0.042 1.525 1.158c0.052 0.040 0.114 0.060 0.176 0.060 0.146-0.001 0.274-0.116 0.301-0.275l0.005-0.062-0.020-5.134c-0.001-0.228 0.063-0.452 0.184-0.645l0.065-0.094 1.804-2.357c0.149-0.194 0.433-0.236 0.634-0.092 0.181 0.129 0.234 0.364 0.134 0.551l-0.039 0.060-1.805 2.357c-0.035 0.045-0.058 0.099-0.067 0.157l-0.005 0.059 0.020 5.134c0.003 0.663-0.533 1.212-1.209 1.214-0.23 0.001-0.454-0.063-0.647-0.183l-0.094-0.064-1.525-1.158c-0.267-0.203-0.436-0.506-0.471-0.834l-0.007-0.124-0.015-3.985c-0-0.059-0.015-0.115-0.041-0.165l-0.030-0.047-4.207-5.495c-0.401-0.523-0.308-1.272 0.211-1.682 0.183-0.145 0.405-0.234 0.637-0.256l0.117-0.006h10.573z"
-    }, null, -1)
-  ])]);
-}
-const IconFilter = { name: "components-icon-filter", render };
-export {
-  IconFilter as default
-};

package/dist/treeshaking/components/common/ThFilter.css

@@ -1,146 +0,0 @@
-.hover-icon-rotate .o-icon {
-  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
-}
-@media (hover: hover) {
-.hover-icon-rotate:hover .o-icon {
-    transform: rotate(-180deg);
-}
-}
-.th-filter-wrapper {
-  display: flex;
-  column-gap: var(--o-gap-2);
-  flex-wrap: nowrap;
-  align-items: center;
-}
-.th-filter-wrapper > span:first-child {
-  word-break: keep-all;
-}
-.th-filter-wrapper .filter-wrapper {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-}
-.th-filter-wrapper .filter-wrapper > * {
-  flex-shrink: 0;
-}
-.th-filter-wrapper .filter-wrapper .filter-hover-icon {
-  display: none;
-}
-.th-filter-wrapper .filter-wrapper .filter-icon {
-  font-size: 24px;
-  line-height: 32px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 20px;
-    line-height: 28px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 18px;
-    line-height: 26px;
-}
-}
-@media (max-width: 600px) {
-.th-filter-wrapper .filter-wrapper .filter-icon {
-    font-size: 16px;
-    line-height: 24px;
-}
-}
-.th-filter-wrapper .filter-wrapper:hover .filter-icon, .th-filter-wrapper .filter-wrapper.has-checked .filter-icon {
-  color: var(--o-color-primary1);
-}
-.th-filter-wrapper .filter-wrapper:hover .o-icon path, .th-filter-wrapper .filter-wrapper.has-checked .o-icon path {
-  fill: currentColor;
-}
-.th-filter-dropdown .o-dropdown-item {
-  min-width: 80px;
-  max-width: calc(var(--table-width, 300) * 0.8px);
-  --dropdown-item-justify: flex-start;
-  --dropdown-item-padding: 7px 12px;
-}
-.th-filter-dropdown .o-dropdown-item.is-active {
-  font-weight: 500;
-  background-color: var(--dropdown-item-bg-color-hover);
-  color: var(--dropdown-item-color-hover);
-}
-.th-filter-popover {
-  --popup-radius: var(--o-radius-xs);
-}
-.th-filter-popover .o-popup-body {
-  padding: var(--o-gap-2) 0 0 0;
-}
-.th-filter-popover .list-content-wrapper {
-  display: flex;
-}
-.th-filter-popover .list-content-wrapper .o-scrollbar-wrapper:first-child {
-  border-right: 1px solid rgb(224, 226, 230);
-}
-.th-filter-popover .content-wrapper {
-  padding: 0 var(--o-gap-4);
-  overflow: auto;
-  max-height: 300px;
-}
-.th-filter-popover .content-wrapper .o-checkbox-group {
-  flex-shrink: 0;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label {
-  flex-grow: 1;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper {
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper .o-svg-icon {
-  font-size: 24px;
-}
-.th-filter-popover .btn-wrapper {
-  min-width: 158px;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding-bottom: var(--o-gap-3);
-  font-size: 16px;
-  line-height: 24px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 14px;
-    line-height: 22px;
-}
-}
-@media (max-width: 600px) {
-.th-filter-popover .btn-wrapper {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-.th-filter-popover .btn-wrapper .o-link {
-  width: 80px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}