@opendesign-plus/components 0.0.1-rc.36 → 0.0.1-rc.38

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

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

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

@@ -1,7 +1,8 @@
 import { defineComponent, ref, resolveDirective, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle, createVNode, withCtx, Fragment, renderList, toDisplayString, withDirectives, createBlock, resolveDynamicComponent, createCommentVNode, createTextVNode } from "vue";
 import { OScroller, OIcon, OTag } from "@opensig/opendesign";
 import ContentWrapper from "../../common/ContentWrapper.vue.mjs";
-import { useLocale, useTheme } from "@opendesign-plus/composables";
+import { useTheme } from "../../../shared/theme.mjs";
+import { useI18n } from "../../../i18n/index.mjs";
 const _hoisted_1 = { class: "nav-sub-content" };
 const _hoisted_2 = { class: "content-left" };
 const _hoisted_3 = { class: "content-label" };
@@ -23,11 +24,12 @@ const _hoisted_10 = {
 };
 const _hoisted_11 = { class: "content-label" };
 const _hoisted_12 = ["href", "target"];
-const _hoisted_13 = ["href", "target"];
-const _hoisted_14 = ["src"];
-const _hoisted_15 = { class: "review-content" };
-const _hoisted_16 = { class: "review-label" };
-const _hoisted_17 = { class: "review-property" };
+const _hoisted_13 = ["title"];
+const _hoisted_14 = ["href", "target"];
+const _hoisted_15 = ["src"];
+const _hoisted_16 = { class: "review-content" };
+const _hoisted_17 = { class: "review-label" };
+const _hoisted_18 = { class: "review-property" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "HeaderContent",
   props: {
@@ -42,7 +44,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const emit = __emit;
     const props = __props;
-    const { locale } = useLocale();
+    const { locale } = useI18n();
     const { theme } = useTheme();
     const navVisible = ref(false);
     const onMouseEnter = () => {
@@ -51,7 +53,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       navVisible.value = true;
     };
     const onMouseLeave = () => {
-      emit("handle-mouseenter-sub", "");
+      emit("handle-mouseleave-sub", "");
       navVisible.value = false;
     };
     const showDesc = ref(false);
@@ -185,7 +187,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                               rel: "noopener noreferrer",
                               class: "shortcut-link"
                             }, [
-                              createElementVNode("span", null, toDisplayString(shortcut.label), 1),
+                              createElementVNode("span", {
+                                title: shortcut.label
+                              }, toDisplayString(shortcut.label), 9, _hoisted_13),
                               shortcut.icon ? (openBlock(), createBlock(unref(OIcon), { key: 0 }, {
                                 default: withCtx(() => [
                                   (openBlock(), createBlock(resolveDynamicComponent(shortcut.icon)))
@@ -207,12 +211,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                             createElementVNode("img", {
                               src: shortcut.picture,
                               class: "review-picture"
-                            }, null, 8, _hoisted_14),
-                            createElementVNode("div", _hoisted_15, [
-                              createElementVNode("p", _hoisted_16, toDisplayString(shortcut.label), 1),
-                              createElementVNode("div", _hoisted_17, toDisplayString(shortcut.remark), 1)
+                            }, null, 8, _hoisted_15),
+                            createElementVNode("div", _hoisted_16, [
+                              createElementVNode("p", _hoisted_17, toDisplayString(shortcut.label), 1),
+                              createElementVNode("div", _hoisted_18, toDisplayString(shortcut.remark), 1)
                             ])
-                          ], 8, _hoisted_13)), [
+                          ], 8, _hoisted_14)), [
                             [_directive_analytics, () => onClickShortcut(shortcut)]
                           ]);
                         }), 128))

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

@@ -1,31 +1,31 @@
-.hover-icon-rotate .o-icon[data-v-fe042238] {
+.hover-icon-rotate .o-icon[data-v-7e0de1ab] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-fe042238] {
+.hover-icon-rotate:hover .o-icon[data-v-7e0de1ab] {
     transform: rotate(-180deg);
 }
 }
-.header-nav-wrap[data-v-fe042238] {
+.header-nav-wrap[data-v-7e0de1ab] {
   height: 100%;
 }
-.header-nav-wrap .header-nav[data-v-fe042238] {
+.header-nav-wrap .header-nav[data-v-7e0de1ab] {
   height: 100%;
   display: flex;
   justify-content: space-between;
   width: calc(100% - 64px);
   align-items: center;
 }
-.header-nav-wrap .header-nav-scroll[data-v-fe042238] {
+.header-nav-wrap .header-nav-scroll[data-v-7e0de1ab] {
   width: calc(100% - 64px - 24px);
 }
-.o-nav[data-v-fe042238] {
+.o-nav[data-v-7e0de1ab] {
   height: 100%;
   position: relative;
   overflow-y: hidden;
   overflow-x: auto;
 }
-.o-nav[data-v-fe042238]::after {
+.o-nav[data-v-7e0de1ab]::after {
   content: "";
   position: absolute;
   width: 50px;
@@ -35,16 +35,16 @@
   background-image: linear-gradient(90deg, rgba(var(--o-grey-1), 0) 0%, rgba(var(--o-grey-1), 1) 100%);
   z-index: 0;
 }
-.o-nav[data-v-fe042238]::-webkit-scrollbar {
+.o-nav[data-v-7e0de1ab]::-webkit-scrollbar {
   display: none;
 }
-.o-nav.dark[data-v-fe042238]::after {
+[data-o-theme*=dark] .o-nav[data-v-7e0de1ab]::after {
   background-image: linear-gradient(90deg, rgba(var(--o-grey-4), 0) 0%, rgba(var(--o-grey-4), 1) 100%);
 }
-.o-nav-scroll[data-v-fe042238]::after {
+.o-nav-scroll[data-v-7e0de1ab]::after {
   display: none;
 }
-.o-nav-list[data-v-fe042238] {
+.o-nav-list[data-v-7e0de1ab] {
   display: flex;
   height: 100%;
   width: fit-content;
@@ -53,7 +53,7 @@
   padding: 0;
   margin: 0;
 }
-.o-nav-list li[data-v-fe042238] {
+.o-nav-list li[data-v-7e0de1ab] {
   position: relative;
   display: flex;
   align-items: center;
@@ -61,10 +61,10 @@
   color: var(--o-color-info1);
   transition: all var(--o-duration-s) var(--o-easing-standard);
 }
-.o-nav-list li .nav-text[data-v-fe042238] {
+.o-nav-list li .nav-text[data-v-7e0de1ab] {
   position: relative;
 }
-.o-nav-list li .nav-text[data-v-fe042238]::after {
+.o-nav-list li .nav-text[data-v-7e0de1ab]::after {
   content: "";
   position: absolute;
   left: 0;
@@ -76,16 +76,16 @@
   background: var(--o-color-primary1);
   transition: all var(--o-duration-s) var(--o-easing-standard);
 }
-.o-nav-list li.is-selected .nav-text[data-v-fe042238], .o-nav-list li.is-active .nav-text[data-v-fe042238] {
+.o-nav-list li.is-selected .nav-text[data-v-7e0de1ab], .o-nav-list li.is-active .nav-text[data-v-7e0de1ab] {
   color: var(--o-color-primary1);
   z-index: 99;
   font-weight: 500;
 }
-.o-nav-list li.is-selected .nav-text[data-v-fe042238]::after, .o-nav-list li.is-active .nav-text[data-v-fe042238]::after {
+.o-nav-list li.is-selected .nav-text[data-v-7e0de1ab]::after, .o-nav-list li.is-active .nav-text[data-v-7e0de1ab]::after {
   content: "";
   opacity: 1;
 }
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
   cursor: default;
   display: flex;
   align-items: center;
@@ -94,48 +94,48 @@
   line-height: 24px;
 }
 @media (min-width: 1201px) and (max-width: 1680px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (min-width: 601px) and (max-width: 840px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (max-width: 600px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     font-size: 12px;
     line-height: 18px;
 }
 }
 @media (min-width: 1201px) and (max-width: 1680px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     padding: 22px 12px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.o-nav-list .nav-item[data-v-fe042238] {
+.o-nav-list .nav-item[data-v-7e0de1ab] {
     padding: 22px 8px;
 }
 }
 @media (min-width: 841px) and (max-width: 1000px) {
-.o-nav-list .nav-item.en[data-v-fe042238] {
+.o-nav-list .nav-item.en[data-v-7e0de1ab] {
     padding: var(--o-gap-2);
 }
 }
-.o-nav-list .item-other[data-v-fe042238] {
+.o-nav-list .item-other[data-v-7e0de1ab] {
   cursor: pointer;
 }
-.o-nav-list .item-other .content-tag[data-v-fe042238] {
+.o-nav-list .item-other .content-tag[data-v-7e0de1ab] {
   margin-left: var(--o-gap-2);
   --layout-pkg-radius: var(--o-radius-xs);
 }

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

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

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

@@ -2,7 +2,6 @@ import { defineComponent, ref, onMounted, nextTick, onUnmounted, resolveDirectiv
 import { OIcon, OTag } from "@opensig/opendesign";
 import IconCaretLeft from "../../../_virtual/icon-caret-left.mjs";
 import IconCaretRight from "../../../_virtual/icon-caret-right.mjs";
-import { useTheme } from "@opendesign-plus/composables";
 import { useDebounceFn } from "@vueuse/core";
 const _hoisted_1 = { class: "header-nav-wrap" };
 const _hoisted_2 = {
@@ -28,7 +27,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: ["handle-mouseenter", "handle-mouseleave", "handle-click"],
   setup(__props, { emit: __emit }) {
     const emit = __emit;
-    const { isDark } = useTheme();
     const props = __props;
     const navRef = ref();
     const navListRef = ref();
@@ -132,7 +130,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createElementVNode("div", {
             ref_key: "navRef",
             ref: navRef,
-            class: normalizeClass(["o-nav", { "o-nav-scroll": navVisibleLeft.value || !navVisibleRight.value, dark: unref(isDark) }])
+            class: normalizeClass(["o-nav", { "o-nav-scroll": navVisibleLeft.value || !navVisibleRight.value }])
           }, [
             createElementVNode("ul", {
               ref_key: "navListRef",

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

@@ -22,9 +22,9 @@ declare const __VLS_component: import('vue').DefineComponent<NavMobileItemT, {},
     "onOn-click"?: (() => any) | undefined;
     "onLang-click"?: ((val: LangItemT) => any) | undefined;
 }>, {
-    navData: import('../../../index.ts').NavItemT[];
-    codeData: import('../../../index.ts').CodeT[];
-    langData: import('../../../index.ts').LangT[];
+    navData: import('../types.ts').NavItemT[];
+    codeData: import('../types.ts').CodeT[];
+    langData: import('../types.ts').LangT[];
     menuShow: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

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

@@ -1,26 +1,28 @@
 import { App } from 'vue';
 declare const OHeader: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('../../index').NavT> & Readonly<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').NavT> & Readonly<{
         "onHandle-click"?: ((val: any) => any) | undefined;
         "onGo-home"?: (() => any) | undefined;
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
         "handle-click": (val: any) => any;
         "go-home": () => any;
-    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
+        contentRef: HTMLDivElement;
+    }, HTMLDivElement, import('vue').ComponentProvideOptions, {
         P: {};
         B: {};
         D: {};
         C: {};
         M: {};
         Defaults: {};
-    }, Readonly<import('../../index').NavT> & Readonly<{
+    }, Readonly<import('./types').NavT> & Readonly<{
         "onHandle-click"?: ((val: any) => any) | undefined;
         "onGo-home"?: (() => any) | undefined;
     }>, {}, {}, {}, {}, {}>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<import('../../index').NavT> & Readonly<{
+} & import('vue').ComponentOptionsBase<Readonly<import('./types').NavT> & Readonly<{
     "onHandle-click"?: ((val: any) => any) | undefined;
     "onGo-home"?: (() => any) | undefined;
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
@@ -36,13 +38,13 @@ declare const OHeader: {
     install(app: App): void;
 };
 declare const OHeaderMobile: {
-    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('../../index').NavT> & Readonly<{
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').NavT> & Readonly<{
         "onGo-home"?: (() => any) | undefined;
-        "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+        "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
         "onGo-back"?: (() => any) | undefined;
     }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
         "go-home": () => any;
-        "lang-click": (val: import('../../index').LangItemT) => any;
+        "lang-click": (val: import('./types').LangItemT) => any;
         "go-back": () => any;
     }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {
         mobileNav: ({
@@ -50,12 +52,12 @@ declare const OHeaderMobile: {
             $data: {};
             $props: {
                 readonly menuShow: boolean;
-                readonly navData: import('../../index').NavItemT[];
-                readonly codeData?: import('../../index').CodeT[] | undefined;
-                readonly langData?: import('../../index').LangT[] | undefined;
+                readonly navData: import('./types').NavItemT[];
+                readonly codeData?: import('./types').CodeT[] | undefined;
+                readonly langData?: import('./types').LangT[] | undefined;
                 readonly "onHandle-click"?: ((val: any) => any) | undefined;
                 readonly "onOn-click"?: (() => any) | undefined;
-                readonly "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+                readonly "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
             } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps;
             $attrs: import('vue').Attrs;
             $refs: {
@@ -67,20 +69,20 @@ declare const OHeaderMobile: {
             $root: import('vue').ComponentPublicInstance | null;
             $parent: import('vue').ComponentPublicInstance | null;
             $host: Element | null;
-            $emit: ((event: "handle-click", val: any) => void) & ((event: "on-click") => void) & ((event: "lang-click", val: import('../../index').LangItemT) => void);
+            $emit: ((event: "handle-click", val: any) => void) & ((event: "on-click") => void) & ((event: "lang-click", val: import('./types').LangItemT) => void);
             $el: HTMLDivElement;
-            $options: import('vue').ComponentOptionsBase<Readonly<import('../../index').NavMobileItemT> & Readonly<{
+            $options: import('vue').ComponentOptionsBase<Readonly<import('./types').NavMobileItemT> & Readonly<{
                 "onHandle-click"?: ((val: any) => any) | undefined;
                 "onOn-click"?: (() => any) | undefined;
-                "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+                "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
             }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
                 "handle-click": (val: any) => any;
                 "on-click": () => any;
-                "lang-click": (val: import('../../index').LangItemT) => any;
+                "lang-click": (val: import('./types').LangItemT) => any;
             }, string, {
-                navData: import('../../index').NavItemT[];
-                codeData: import('../../index').CodeT[];
-                langData: import('../../index').LangT[];
+                navData: import('./types').NavItemT[];
+                codeData: import('./types').CodeT[];
+                langData: import('./types').LangT[];
                 menuShow: boolean;
             }, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
@@ -103,14 +105,14 @@ declare const OHeaderMobile: {
             $nextTick: typeof import('vue').nextTick;
             $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import('@vue/reactivity').OnCleanup]) => any : (...args: [any, any, import('@vue/reactivity').OnCleanup]) => any, options?: import('vue').WatchOptions): import('vue').WatchStopHandle;
         } & Readonly<{
-            navData: import('../../index').NavItemT[];
-            codeData: import('../../index').CodeT[];
-            langData: import('../../index').LangT[];
+            navData: import('./types').NavItemT[];
+            codeData: import('./types').CodeT[];
+            langData: import('./types').LangT[];
             menuShow: boolean;
-        }> & Omit<Readonly<import('../../index').NavMobileItemT> & Readonly<{
+        }> & Omit<Readonly<import('./types').NavMobileItemT> & Readonly<{
             "onHandle-click"?: ((val: any) => any) | undefined;
             "onOn-click"?: (() => any) | undefined;
-            "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+            "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
         }>, "navData" | "codeData" | "langData" | "menuShow"> & {} & import('vue').ComponentCustomProperties & {} & {
             $slots: {
                 tool?(_: {}): any;
@@ -123,21 +125,21 @@ declare const OHeaderMobile: {
         C: {};
         M: {};
         Defaults: {};
-    }, Readonly<import('../../index').NavT> & Readonly<{
+    }, Readonly<import('./types').NavT> & Readonly<{
         "onGo-home"?: (() => any) | undefined;
-        "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+        "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
         "onGo-back"?: (() => any) | undefined;
     }>, {}, {}, {}, {}, {}>;
     __isFragment?: never;
     __isTeleport?: never;
     __isSuspense?: never;
-} & import('vue').ComponentOptionsBase<Readonly<import('../../index').NavT> & Readonly<{
+} & import('vue').ComponentOptionsBase<Readonly<import('./types').NavT> & Readonly<{
     "onGo-home"?: (() => any) | undefined;
-    "onLang-click"?: ((val: import('../../index').LangItemT) => any) | undefined;
+    "onLang-click"?: ((val: import('./types').LangItemT) => any) | undefined;
     "onGo-back"?: (() => any) | undefined;
 }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
     "go-home": () => any;
-    "lang-click": (val: import('../../index').LangItemT) => any;
+    "lang-click": (val: import('./types').LangItemT) => any;
     "go-back": () => any;
 }, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
     $slots: {

package/dist/treeshaking/components/header-language-switcher/OHeaderLanguageSwitcher.css

@@ -1,34 +1,43 @@
-.hover-icon-rotate .o-icon[data-v-07aa851a] {
+.hover-icon-rotate .o-icon[data-v-f4b40fad] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-07aa851a] {
+.hover-icon-rotate:hover .o-icon[data-v-f4b40fad] {
     transform: rotate(-180deg);
 }
 }
-.hide-lang[data-v-07aa851a] {
+.hide-lang[data-v-f4b40fad] {
   display: none;
 }
-.header-lang[data-v-07aa851a] {
+.header-lang[data-v-f4b40fad] {
   height: calc(100% + 10px);
   display: flex;
   align-items: center;
 }
-.header-lang .info-wrap[data-v-07aa851a] {
+.header-lang .info-wrap[data-v-f4b40fad] {
   height: 100%;
   display: flex;
   align-items: center;
   cursor: pointer;
 }
-.header-lang .info-wrap .icon[data-v-07aa851a] {
+.header-lang .info-wrap .icon[data-v-f4b40fad] {
   font-size: var(--o-icon_size_control-m);
   position: relative;
   color: var(--o-color-info1);
 }
-.header-lang .info-wrap .icon[data-v-07aa851a]:hover {
-  color: var(--o-color-primary1);
+@media (hover: hover) {
+.header-lang .info-wrap .icon[data-v-f4b40fad]:hover {
+    color: var(--o-color-primary1);
+    background-color: var(--o-color-control2-light);
+    border-radius: var(--o-radius-xs);
+}
+}
+@media (max-width: 1200px) {
+.header-lang .info-wrap .icon[data-v-f4b40fad] {
+    font-size: var(--o-icon_size_control-s);
 }
-.header-lang .info-wrap .locale-tag[data-v-07aa851a] {
+}
+.header-lang .info-wrap .locale-tag[data-v-f4b40fad] {
   position: absolute;
   font-size: 10px;
   height: 12px;
@@ -40,20 +49,25 @@
   left: 12px;
   top: 11px;
 }
-.header-lang .info-wrap .locale-tag.is-en[data-v-07aa851a] {
+.header-lang .info-wrap .locale-tag.is-en[data-v-f4b40fad] {
   width: 16px;
 }
-.header-lang.is-disabled .info-wrap[data-v-07aa851a] {
+.header-lang.is-disabled .info-wrap[data-v-f4b40fad] {
   color: var(--o-color-info4);
   cursor: not-allowed;
 }
-.header-lang.is-disabled .info-wrap[data-v-07aa851a]:hover {
+.header-lang.is-disabled .info-wrap[data-v-f4b40fad]:hover {
   color: var(--o-color-info4);
 }
-.header-lang.is-disabled .info-wrap .o-icon[data-v-07aa851a] {
+.header-lang.is-disabled .info-wrap .o-icon[data-v-f4b40fad] {
   color: inherit;
 }
-.header-lang .list[data-v-07aa851a] {
+@media (hover: hover) {
+.header-lang.is-disabled .info-wrap .o-icon[data-v-f4b40fad]:hover {
+    background-color: transparent;
+}
+}
+.header-lang .list[data-v-f4b40fad] {
   background: var(--o-color-fill2);
   cursor: pointer;
   box-shadow: var(--o-shadow-1);
@@ -61,10 +75,10 @@
   padding: var(--o-gap-1);
   width: 144px;
 }
-.o-dropdown[data-v-07aa851a] {
+.o-dropdown[data-v-f4b40fad] {
   height: 100%;
 }
-.o-dropdown-item[data-v-07aa851a] {
+.o-dropdown-item[data-v-f4b40fad] {
   background: var(--o-color-fill2);
   cursor: pointer;
   border-radius: var(--o-radius_control-xs);
@@ -73,27 +87,27 @@
   color: var(--o-color-info1);
 }
 @media (hover: hover) {
-.o-dropdown-item[data-v-07aa851a]:hover {
+.o-dropdown-item[data-v-f4b40fad]:hover {
     background: var(--o-color-control2-light);
 }
 }
-.o-dropdown-item.is-active[data-v-07aa851a] {
+.o-dropdown-item.is-active[data-v-f4b40fad] {
   color: var(--o-color-primary1);
   background: var(--o-color-control3-light);
 }
-.dropdown[data-v-07aa851a] {
+.dropdown[data-v-f4b40fad] {
   --dropdown-list-radius: var(--o-radius-xs);
 }
-.mobile-change-language[data-v-07aa851a] {
+.mobile-change-language[data-v-f4b40fad] {
   display: flex;
   align-items: center;
 }
-.mobile-change-language .o-divider[data-v-07aa851a] {
+.mobile-change-language .o-divider[data-v-f4b40fad] {
   margin: 0;
   height: 8px;
   background-color: var(--o-color-control4);
 }
-.mobile-change-language span[data-v-07aa851a] {
+.mobile-change-language span[data-v-f4b40fad] {
   color: var(--o-color-info1);
   text-align: center;
   cursor: pointer;
@@ -102,39 +116,39 @@
   line-height: 24px;
 }
 @media (min-width: 1201px) and (max-width: 1680px) {
-.mobile-change-language span[data-v-07aa851a] {
+.mobile-change-language span[data-v-f4b40fad] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.mobile-change-language span[data-v-07aa851a] {
+.mobile-change-language span[data-v-f4b40fad] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (min-width: 601px) and (max-width: 840px) {
-.mobile-change-language span[data-v-07aa851a] {
+.mobile-change-language span[data-v-f4b40fad] {
     font-size: 14px;
     line-height: 22px;
 }
 }
 @media (max-width: 600px) {
-.mobile-change-language span[data-v-07aa851a] {
+.mobile-change-language span[data-v-f4b40fad] {
     font-size: 12px;
     line-height: 18px;
 }
 }
-.mobile-change-language span.active[data-v-07aa851a] {
+.mobile-change-language span.active[data-v-f4b40fad] {
   color: var(--o-color-primary1);
   font-weight: 500;
 }
-.mobile-change-language.is-disabled span[data-v-07aa851a] {
+.mobile-change-language.is-disabled span[data-v-f4b40fad] {
   color: var(--o-color-info4);
   cursor: not-allowed;
 }
 @media (hover: hover) {
-.mobile-change-language.is-disabled span[data-v-07aa851a]:hover {
+.mobile-change-language.is-disabled span[data-v-f4b40fad]:hover {
     color: var(--o-color-info4);
 }
 }

package/dist/treeshaking/components/header-language-switcher/OHeaderLanguageSwitcher.vue.mjs

@@ -2,7 +2,7 @@ import _sfc_main from "./OHeaderLanguageSwitcher.vue2.mjs";
 import './OHeaderLanguageSwitcher.css';
 import './OHeaderLanguageSwitcher2.css';
 import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
-const _OHeaderLanguageSwitcher = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-07aa851a"]]);
+const _OHeaderLanguageSwitcher = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-f4b40fad"]]);
 export {
   _OHeaderLanguageSwitcher as default
 };

package/dist/treeshaking/components/header-language-switcher/OHeaderLanguageSwitcher.vue2.mjs

@@ -65,7 +65,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           optionPosition: "bottom",
           "option-width-mode": "auto",
           optionWrapClass: {
-            "dropdown": true,
+            dropdown: true,
             "is-disabled": __props.disabled
           }
         }, {