@opendesign-plus/components 0.0.1-rc.39 → 0.0.1-rc.40

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-252ea1d2"]]);
+const HeaderContent = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-aef9f468"]]);
 export {
   HeaderContent as default
 };

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

@@ -1,35 +1,35 @@
-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 { defineComponent, ref, resolveDirective, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle, createVNode, withCtx, Fragment, renderList, toDisplayString, withDirectives, createBlock, createTextVNode, createCommentVNode, resolveDynamicComponent } from "vue";
+import { OScroller, OTag, OIcon, OPopover } from "@opensig/opendesign";
 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" };
-const _hoisted_4 = { class: "content-container" };
-const _hoisted_5 = ["href", "target"];
-const _hoisted_6 = { class: "item-name" };
-const _hoisted_7 = {
+const _hoisted_1 = { class: "header-content-nav" };
+const _hoisted_2 = { class: "nav-sub-content" };
+const _hoisted_3 = { class: "content-left" };
+const _hoisted_4 = { class: "content-label" };
+const _hoisted_5 = { class: "content-container" };
+const _hoisted_6 = ["href", "target"];
+const _hoisted_7 = { class: "item-name" };
+const _hoisted_8 = {
   key: 0,
   class: "desc-container"
 };
-const _hoisted_8 = ["title"];
-const _hoisted_9 = {
+const _hoisted_9 = { class: "popover-item-desc" };
+const _hoisted_10 = {
   key: 0,
   class: "split-line"
 };
-const _hoisted_10 = {
+const _hoisted_11 = {
   key: 1,
   class: "content-right"
 };
-const _hoisted_11 = { class: "content-label" };
-const _hoisted_12 = ["href", "target"];
-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 _hoisted_12 = { class: "content-label" };
+const _hoisted_13 = ["href", "target"];
+const _hoisted_14 = { class: "popover-shortcut" };
+const _hoisted_15 = ["href", "target"];
+const _hoisted_16 = ["src"];
+const _hoisted_17 = { class: "review-content" };
+const _hoisted_18 = { class: "review-label" };
+const _hoisted_19 = { class: "review-property" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "HeaderContent",
   props: {
@@ -45,7 +45,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const props = __props;
     const { locale } = useI18n();
-    const { theme } = useTheme();
+    const { theme, isDark } = useTheme();
     const navVisible = ref(false);
     const onMouseEnter = () => {
       var _a;
@@ -107,128 +107,161 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             class: "nav-background-right",
             style: normalizeStyle({ backgroundImage: `url(${props.bgRight})` })
           }, null, 4),
-          createVNode(ContentWrapper, null, {
-            default: withCtx(() => [
-              createVNode(unref(OScroller), {
-                class: "nav-scroller",
-                "show-type": "always",
-                size: "small",
-                "disabled-y": ""
-              }, {
-                default: withCtx(() => {
-                  var _a2, _b2, _c2, _d, _e, _f, _g, _h;
-                  return [
-                    createElementVNode("div", _hoisted_1, [
-                      createElementVNode("div", _hoisted_2, [
-                        (openBlock(true), createElementBlock(Fragment, null, renderList((_a2 = props.itemData) == null ? void 0 : _a2.children, (sub, s) => {
-                          return openBlock(), createElementBlock("div", {
-                            class: "item-sub",
-                            key: s
-                          }, [
-                            createElementVNode("span", _hoisted_3, toDisplayString(sub.label), 1),
-                            createElementVNode("div", _hoisted_4, [
-                              (openBlock(true), createElementBlock(Fragment, null, renderList(sub.children, (subItem) => {
-                                return openBlock(), createElementBlock("div", {
-                                  key: subItem.label,
-                                  class: "content-item"
+          createElementVNode("div", _hoisted_1, [
+            createVNode(unref(OScroller), {
+              class: "nav-scroller",
+              "show-type": "always",
+              size: "small",
+              "disabled-y": ""
+            }, {
+              default: withCtx(() => {
+                var _a2, _b2, _c2, _d, _e, _f, _g, _h;
+                return [
+                  createElementVNode("div", _hoisted_2, [
+                    createElementVNode("div", _hoisted_3, [
+                      (openBlock(true), createElementBlock(Fragment, null, renderList((_a2 = props.itemData) == null ? void 0 : _a2.children, (sub, s) => {
+                        return openBlock(), createElementBlock("div", {
+                          class: "item-sub",
+                          key: s
+                        }, [
+                          createElementVNode("span", _hoisted_4, toDisplayString(sub.label), 1),
+                          createElementVNode("div", _hoisted_5, [
+                            (openBlock(true), createElementBlock(Fragment, null, renderList(sub.children, (subItem) => {
+                              return openBlock(), createElementBlock("div", {
+                                key: subItem.label,
+                                class: normalizeClass(["content-item", { "content-item-disabled": subItem == null ? void 0 : subItem.disabled }])
+                              }, [
+                                withDirectives((openBlock(), createElementBlock("a", {
+                                  href: subItem.href,
+                                  target: (subItem == null ? void 0 : subItem.target) || "_self",
+                                  rel: "noopener noreferrer",
+                                  class: "item-label"
                                 }, [
-                                  withDirectives((openBlock(), createElementBlock("a", {
-                                    href: subItem.href,
-                                    target: (subItem == null ? void 0 : subItem.target) || "_self",
-                                    rel: "noopener noreferrer",
-                                    class: "item-label"
-                                  }, [
-                                    createElementVNode("span", _hoisted_6, toDisplayString(subItem.label), 1),
-                                    subItem.icon ? (openBlock(), createBlock(unref(OIcon), { key: 0 }, {
-                                      default: withCtx(() => [
-                                        (openBlock(), createBlock(resolveDynamicComponent(subItem.icon)))
-                                      ]),
-                                      _: 2
-                                    }, 1024)) : createCommentVNode("", true),
-                                    subItem.tag ? (openBlock(), createBlock(unref(OTag), {
-                                      key: 1,
-                                      round: "pill",
-                                      color: "danger",
-                                      size: "small",
-                                      class: "content-tag"
-                                    }, {
-                                      default: withCtx(() => [
-                                        createTextVNode(toDisplayString(subItem.tag), 1)
-                                      ]),
-                                      _: 2
-                                    }, 1024)) : createCommentVNode("", true)
-                                  ], 8, _hoisted_5)), [
-                                    [_directive_analytics, () => onClickNavHref(sub, subItem)]
-                                  ]),
-                                  subItem.description ? (openBlock(), createElementBlock("div", _hoisted_7, [
-                                    createElementVNode("p", {
-                                      class: "item-desc",
-                                      title: showDesc.value ? subItem.description : void 0,
-                                      onMouseenter: _cache[0] || (_cache[0] = ($event) => descMouseenter($event))
-                                    }, toDisplayString(subItem.description), 41, _hoisted_8)
-                                  ])) : createCommentVNode("", true)
-                                ]);
-                              }), 128))
-                            ])
-                          ]);
-                        }), 128))
-                      ]),
-                      ((_c2 = (_b2 = props.itemData) == null ? void 0 : _b2.shortcut) == null ? void 0 : _c2.length) ? (openBlock(), createElementBlock("div", _hoisted_9)) : createCommentVNode("", true),
-                      ((_e = (_d = props.itemData) == null ? void 0 : _d.shortcut) == null ? void 0 : _e.length) ? (openBlock(), createElementBlock("div", _hoisted_10, [
-                        createElementVNode("span", _hoisted_11, toDisplayString(unref(locale) === "zh" ? "快捷链接" : "Quick Link"), 1),
-                        !((_f = props.itemData) == null ? void 0 : _f.withPicture) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList((_g = props.itemData) == null ? void 0 : _g.shortcut, (shortcut) => {
-                          return openBlock(), createElementBlock("div", {
-                            key: shortcut.label,
-                            class: "shortcut"
-                          }, [
-                            withDirectives((openBlock(), createElementBlock("a", {
-                              href: shortcut.href,
-                              target: (shortcut == null ? void 0 : shortcut.target) || "_self",
-                              rel: "noopener noreferrer",
-                              class: "shortcut-link"
-                            }, [
-                              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)))
+                                  createElementVNode("span", _hoisted_7, toDisplayString(subItem.label), 1),
+                                  subItem.tag ? (openBlock(), createBlock(unref(OTag), {
+                                    key: 0,
+                                    round: "pill",
+                                    color: "danger",
+                                    size: "small",
+                                    class: "content-tag"
+                                  }, {
+                                    default: withCtx(() => [
+                                      createTextVNode(toDisplayString(subItem.tag), 1)
+                                    ]),
+                                    _: 2
+                                  }, 1024)) : createCommentVNode("", true),
+                                  subItem.icon ? (openBlock(), createBlock(unref(OIcon), { key: 1 }, {
+                                    default: withCtx(() => [
+                                      (openBlock(), createBlock(resolveDynamicComponent(subItem.icon)))
+                                    ]),
+                                    _: 2
+                                  }, 1024)) : createCommentVNode("", true)
+                                ], 8, _hoisted_6)), [
+                                  [_directive_analytics, () => onClickNavHref(sub, subItem)]
                                 ]),
-                                _: 2
-                              }, 1024)) : createCommentVNode("", true)
-                            ], 8, _hoisted_12)), [
-                              [_directive_analytics, () => onClickShortcut(shortcut)]
-                            ])
-                          ]);
-                        }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList((_h = props.itemData) == null ? void 0 : _h.shortcut, (shortcut) => {
-                          return withDirectives((openBlock(), createElementBlock("a", {
-                            key: shortcut.label,
+                                subItem.description ? (openBlock(), createElementBlock("div", _hoisted_8, [
+                                  showDesc.value ? (openBlock(), createBlock(unref(OPopover), {
+                                    key: 0,
+                                    trigger: "hover",
+                                    position: "bottom",
+                                    "adjust-min-width": false,
+                                    "adjust-width": false
+                                  }, {
+                                    target: withCtx(() => [
+                                      createElementVNode("p", {
+                                        class: normalizeClass(["item-desc", [`item-desc-line-${subItem == null ? void 0 : subItem.line}`]]),
+                                        onMouseenter: _cache[0] || (_cache[0] = ($event) => descMouseenter($event))
+                                      }, toDisplayString(subItem.description), 35)
+                                    ]),
+                                    default: withCtx(() => [
+                                      createElementVNode("p", _hoisted_9, toDisplayString(subItem.description), 1)
+                                    ]),
+                                    _: 2
+                                  }, 1024)) : (openBlock(), createElementBlock("p", {
+                                    key: 1,
+                                    class: normalizeClass(["item-desc", [`item-desc-line-${subItem == null ? void 0 : subItem.line}`]]),
+                                    onMouseenter: _cache[1] || (_cache[1] = ($event) => descMouseenter($event))
+                                  }, toDisplayString(subItem.description), 35))
+                                ])) : createCommentVNode("", true)
+                              ], 2);
+                            }), 128))
+                          ])
+                        ]);
+                      }), 128))
+                    ]),
+                    ((_c2 = (_b2 = props.itemData) == null ? void 0 : _b2.shortcut) == null ? void 0 : _c2.length) ? (openBlock(), createElementBlock("div", _hoisted_10)) : createCommentVNode("", true),
+                    ((_e = (_d = props.itemData) == null ? void 0 : _d.shortcut) == null ? void 0 : _e.length) ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                      createElementVNode("span", _hoisted_12, toDisplayString(unref(locale) === "zh" ? "快捷链接" : "Quick Link"), 1),
+                      !((_f = props.itemData) == null ? void 0 : _f.withPicture) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList((_g = props.itemData) == null ? void 0 : _g.shortcut, (shortcut) => {
+                        return openBlock(), createElementBlock("div", {
+                          key: shortcut.label,
+                          class: "shortcut"
+                        }, [
+                          withDirectives((openBlock(), createElementBlock("a", {
                             href: shortcut.href,
                             target: (shortcut == null ? void 0 : shortcut.target) || "_self",
                             rel: "noopener noreferrer",
-                            class: "review"
+                            class: "shortcut-link"
                           }, [
-                            createElementVNode("img", {
-                              src: shortcut.picture,
-                              class: "review-picture"
-                            }, 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_14)), [
+                            showDesc.value ? (openBlock(), createBlock(unref(OPopover), {
+                              key: 0,
+                              trigger: "hover",
+                              position: "bottom",
+                              "adjust-min-width": false,
+                              "adjust-width": false
+                            }, {
+                              target: withCtx(() => [
+                                createElementVNode("p", {
+                                  class: "shortcut-title",
+                                  onMouseenter: _cache[2] || (_cache[2] = ($event) => descMouseenter($event))
+                                }, toDisplayString(shortcut.label), 33)
+                              ]),
+                              default: withCtx(() => [
+                                createElementVNode("p", _hoisted_14, toDisplayString(shortcut.label), 1)
+                              ]),
+                              _: 2
+                            }, 1024)) : (openBlock(), createElementBlock("p", {
+                              key: 1,
+                              class: "shortcut-title",
+                              onMouseenter: _cache[3] || (_cache[3] = ($event) => descMouseenter($event))
+                            }, toDisplayString(shortcut.label), 33)),
+                            shortcut.icon ? (openBlock(), createBlock(unref(OIcon), { key: 2 }, {
+                              default: withCtx(() => [
+                                (openBlock(), createBlock(resolveDynamicComponent(shortcut.icon)))
+                              ]),
+                              _: 2
+                            }, 1024)) : createCommentVNode("", true)
+                          ], 8, _hoisted_13)), [
                             [_directive_analytics, () => onClickShortcut(shortcut)]
-                          ]);
-                        }), 128))
-                      ])) : createCommentVNode("", true)
-                    ])
-                  ];
-                }),
-                _: 1
-              })
-            ]),
-            _: 1
-          })
+                          ])
+                        ]);
+                      }), 128)) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList((_h = props.itemData) == null ? void 0 : _h.shortcut, (shortcut) => {
+                        return withDirectives((openBlock(), createElementBlock("a", {
+                          key: shortcut.label,
+                          href: shortcut.href,
+                          target: (shortcut == null ? void 0 : shortcut.target) || "_self",
+                          rel: "noopener noreferrer",
+                          class: "review"
+                        }, [
+                          createElementVNode("img", {
+                            src: unref(isDark) && (shortcut == null ? void 0 : shortcut.pictureDark) ? shortcut == null ? void 0 : shortcut.pictureDark : shortcut.picture,
+                            class: "review-picture"
+                          }, null, 8, _hoisted_16),
+                          createElementVNode("div", _hoisted_17, [
+                            createElementVNode("p", _hoisted_18, toDisplayString(shortcut.label), 1),
+                            createElementVNode("div", _hoisted_19, toDisplayString(shortcut.remark), 1)
+                          ])
+                        ], 8, _hoisted_15)), [
+                          [_directive_analytics, () => onClickShortcut(shortcut)]
+                        ]);
+                      }), 128))
+                    ])) : createCommentVNode("", true)
+                  ])
+                ];
+              }),
+              _: 1
+            })
+          ])
         ], 2)) : createCommentVNode("", true)
       ], 32);
     };

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

@@ -0,0 +1,267 @@
+.hover-icon-rotate .o-icon[data-v-a4e6916a] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-a4e6916a] {
+    transform: rotate(-180deg);
+}
+}
+.header-nav-wrap[data-v-a4e6916a] {
+  height: 100%;
+}
+.header-nav-wrap .header-nav[data-v-a4e6916a] {
+  height: 100%;
+  display: flex;
+  justify-content: space-between;
+  width: calc(100% - 64px);
+  align-items: center;
+}
+.header-nav-wrap .header-nav-scroll[data-v-a4e6916a] {
+  width: calc(100% - 64px - 24px);
+}
+.o-nav[data-v-a4e6916a] {
+  --o-before-left: 0;
+  height: 100%;
+  position: relative;
+  overflow-y: hidden;
+  overflow-x: auto;
+}
+.o-nav[data-v-a4e6916a]::after, .o-nav[data-v-a4e6916a]::before {
+  content: "";
+  position: absolute;
+  width: 50px;
+  height: 100%;
+  top: 0;
+  z-index: 9;
+}
+.o-nav[data-v-a4e6916a]::after {
+  right: 0;
+  background-image: linear-gradient(90deg, rgba(var(--o-grey-1), 0) 0%, rgba(var(--o-grey-1), 1) 100%);
+}
+.o-nav[data-v-a4e6916a]::before {
+  background-image: linear-gradient(0, rgba(var(--o-grey-1), 0) 0%, rgba(var(--o-grey-1), 1) 100%);
+  display: none;
+}
+.o-nav[data-v-a4e6916a]::-webkit-scrollbar {
+  display: none;
+}
+.right-icon[data-v-a4e6916a] {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  width: 16px;
+  height: 16px;
+  border-radius: var(--o-radius-xs);
+}
+.right-icon .o-icon[data-v-a4e6916a] {
+  --icon-size: 16px;
+}
+@media (hover: hover) {
+.right-icon[data-v-a4e6916a]:hover {
+    background-color: var(--o-color-control2-light);
+    color: var(--o-color-link2);
+}
+}
+.right-icon[data-v-a4e6916a]:active {
+  color: var(--o-color-link3);
+}
+[data-o-theme*=dark] .o-nav[data-v-a4e6916a]::after, [data-o-theme*=dark] .o-nav[data-v-a4e6916a]::before {
+  background-image: linear-gradient(90deg, rgba(var(--o-grey-4), 0) 0%, rgba(var(--o-grey-4), 1) 100%);
+}
+.o-nav-scroll[data-v-a4e6916a]::after {
+  display: none;
+}
+.o-nav-scroll[data-v-a4e6916a]::before {
+  left: var(--o-before-left);
+  display: block;
+}
+.nav-list[data-v-a4e6916a] {
+  display: flex;
+  height: 100%;
+  width: fit-content;
+  flex-wrap: nowrap;
+  white-space: nowrap;
+  padding: 0;
+  margin: 0;
+}
+.nav-item-li[data-v-a4e6916a] {
+  position: relative;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  color: var(--o-color-info1);
+  pointer-events: auto;
+  transition: color var(--o-duration-s) var(--o-easing-standard);
+}
+.nav-item-li .nav-item[data-v-a4e6916a] {
+  cursor: default;
+  display: flex;
+  align-items: center;
+  padding: 22px var(--o-gap-4);
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 1440px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    padding: 18px 12px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.nav-item-li .nav-item[data-v-a4e6916a] {
+    padding: 14px 8px;
+}
+}
+.nav-item-li .nav-text[data-v-a4e6916a] {
+  position: relative;
+}
+.nav-item-li .nav-text[data-v-a4e6916a]::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  opacity: 0;
+  bottom: -24px;
+  width: 100%;
+  height: 2px;
+  border-radius: 1px;
+  background: var(--o-color-primary1);
+  transition: all var(--o-duration-s) var(--o-easing-standard);
+}
+@media (max-width: 1440px) {
+.nav-item-li .nav-text[data-v-a4e6916a]::after {
+    bottom: -21px;
+}
+}
+@media (max-width: 1200px) {
+.nav-item-li .nav-text[data-v-a4e6916a]::after {
+    bottom: -17px;
+}
+}
+.nav-item-li .nav-item-link[data-v-a4e6916a] {
+  cursor: pointer;
+}
+.nav-item-li.is-selected .nav-text[data-v-a4e6916a], .nav-item-li.is-active .nav-text[data-v-a4e6916a] {
+  color: var(--o-color-primary1);
+  z-index: 99;
+  font-weight: 600;
+}
+.nav-item-li.is-selected .nav-text[data-v-a4e6916a]::after, .nav-item-li.is-active .nav-text[data-v-a4e6916a]::after {
+  opacity: 1;
+}
+.nav-item-li.is-disabled[data-v-a4e6916a] {
+  color: var(--o-color-info4);
+  pointer-events: none;
+}
+.dropdown-wrapper[data-v-a4e6916a] {
+  position: absolute;
+  top: calc(100% - 4px);
+  left: 0;
+  display: none;
+  padding-top: 8px;
+  transition: opacity var(--o-duration-s) var(--o-easing-standard);
+}
+.dropdown-wrapper .dropdown-body[data-v-a4e6916a] {
+  padding: 6px;
+  background-color: var(--o-color-fill2);
+  border-radius: var(--o-radius-xs);
+  box-shadow: var(--o-shadow-2);
+}
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a] {
+  font-weight: 400;
+  white-space: nowrap;
+  display: flex;
+  align-items: center;
+  padding: 6px 12px;
+  min-width: 100px;
+  border-radius: var(--o-radius-xs);
+  color: var(--o-color-info2);
+  background-color: transparent;
+  transition: background-color var(--o-duration-s) var(--o-easing-standard);
+  cursor: pointer;
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (hover: hover) {
+.dropdown-wrapper .dropdown-item[data-v-a4e6916a]:hover {
+    background-color: var(--o-color-control2-light);
+    color: var(--o-color-primary1);
+}
+}
+.dropdown-wrapper .dropdown-item-disabled[data-v-a4e6916a] {
+  color: var(--o-color-info4);
+  pointer-events: none;
+}
+.dropdown-wrapper .dropdown-link[data-v-a4e6916a] {
+  color: inherit;
+  display: flex;
+  align-items: center;
+  width: 100%;
+}
+.dropdown-wrapper .dropdown-link .o-tag[data-v-a4e6916a] {
+  margin-left: var(--o-gap-2);
+  transform: scale(0.75);
+  transform-origin: left center;
+}
+.dropdown-wrapper[data-v-a4e6916a] .jump-out-icon {
+  font-size: 16px;
+  margin-left: 4px;
+}
+.dropdown-wrapper[data-v-a4e6916a] .jump-out-icon path {
+  fill: currentColor;
+  stroke: transparent;
+}
+.dropdown-wrapper[data-v-a4e6916a] .jump-out-icon path[fill=none] {
+  display: none;
+}
+@media (hover: hover) {
+.nav-item:hover .dropdown-wrapper[data-v-a4e6916a] {
+    display: block;
+}
+}

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

@@ -0,0 +1,19 @@
+import { NavLiT } from '../types.ts';
+export interface OHeaderEmitsT {
+    (e: 'handle-mouseenter', val: any): void;
+    (e: 'handle-mouseleave', val: any): void;
+    (e: 'handle-click', val: any): void;
+}
+declare const _default: import('vue').DefineComponent<NavLiT, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "handle-mouseenter": (val: any) => any;
+    "handle-mouseleave": (val: any) => any;
+    "handle-click": (val: any) => any;
+}, string, import('vue').PublicProps, Readonly<NavLiT> & Readonly<{
+    "onHandle-mouseenter"?: ((val: any) => any) | undefined;
+    "onHandle-mouseleave"?: ((val: any) => any) | undefined;
+    "onHandle-click"?: ((val: any) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    navRef: HTMLDivElement;
+    navListRef: HTMLUListElement;
+}, HTMLElement>;
+export default _default;

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

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