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

package/dist/treeshaking/components/header-search/OHeaderSearch.css

@@ -1,50 +1,60 @@
-.hover-icon-rotate .o-icon[data-v-a97b8e7c] {
+.hover-icon-rotate .o-icon[data-v-bfa0c69c] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-a97b8e7c] {
+.hover-icon-rotate:hover .o-icon[data-v-bfa0c69c] {
     transform: rotate(-180deg);
 }
 }
-.o-header-search[data-v-a97b8e7c] {
+.o-header-search[data-v-bfa0c69c] {
   position: relative;
   width: 160px;
   height: 32px;
 }
 @media (max-width: 1440px) {
-.o-header-search[data-v-a97b8e7c] {
+.o-header-search[data-v-bfa0c69c] {
     width: 120px;
+    height: 32px;
 }
 }
 @media (max-width: 840px) {
-.o-header-search[data-v-a97b8e7c] {
+.o-header-search[data-v-bfa0c69c] {
     width: 24px;
     height: 24px;
     margin-left: auto;
 }
 }
-.o-header-search-pos[data-v-a97b8e7c] {
+.o-header-search-pos[data-v-bfa0c69c] {
   position: absolute;
   top: 0;
   width: fit-content;
   background-color: var(--o-color-fill2);
   z-index: 100;
 }
-.o-header-search-pos.is-left[data-v-a97b8e7c] {
+.o-header-search-pos.is-left[data-v-bfa0c69c] {
   right: 0;
 }
-.o-header-search-pos.is-right[data-v-a97b8e7c] {
+.o-header-search-pos.is-right[data-v-bfa0c69c] {
   left: 0;
 }
-.o-header-search-pos.is-mobile[data-v-a97b8e7c] {
+.o-header-search-pos.is-mobile[data-v-bfa0c69c] {
   display: none;
 }
-.o-header-search-pos.is-pc.is-focus[data-v-a97b8e7c] {
+.o-header-search-pos.is-simple[data-v-bfa0c69c] {
+  display: none;
+}
+.o-header-search-pos.is-pc.is-focus[data-v-bfa0c69c] {
   box-shadow: var(--o-shadow-2);
   top: calc(-1 * var(--o-gap-4));
   border-radius: var(--o-radius-xs);
 }
-.o-header-search-pos.is-mobile.is-focus[data-v-a97b8e7c] {
+.o-header-search-pos.is-simple.is-focus[data-v-bfa0c69c] {
+  display: block;
+  box-shadow: var(--o-shadow-2);
+  top: calc(-1 * var(--o-gap-4));
+  border-radius: var(--o-radius-xs);
+}
+.o-header-search-pos.is-mobile.is-focus[data-v-bfa0c69c] {
   position: fixed;
   top: 0;
   right: 0;
@@ -57,56 +67,57 @@
   z-index: 100;
   overflow-y: auto;
 }
-.o-header-search-row[data-v-a97b8e7c] {
+.o-header-search-row[data-v-bfa0c69c] {
   display: flex;
   align-items: start;
 }
-.o-header-search-row.is-focus[data-v-a97b8e7c] {
+.o-header-search-row.is-focus[data-v-bfa0c69c] {
   padding: var(--o-gap-4);
   border-radius: var(--o-radius-xs);
 }
 @media (max-width: 840px) {
-.o-header-search-row.is-focus[data-v-a97b8e7c] {
+.o-header-search-row.is-focus[data-v-bfa0c69c] {
+    align-items: center;
     gap: var(--o-gap-4);
     padding: 10px var(--o-gap-4) var(--o-gap-4) var(--o-gap-4);
     border-radius: unset;
 }
 }
-.o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-input[data-v-bfa0c69c] {
   width: 160px;
   transition: width var(--o-duration-m2) var(--o-easing-standard-in);
 }
 @media (max-width: 1440px) {
-.o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-input[data-v-bfa0c69c] {
     width: 120px;
 }
 }
-.o-header-search-row.is-focus .o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-row.is-focus .o-header-search-input[data-v-bfa0c69c] {
   width: 480px;
 }
 @media (min-width: 1201px) and (max-width: 1440px) {
-.o-header-search-row.is-focus .o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-row.is-focus .o-header-search-input[data-v-bfa0c69c] {
     width: 360px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.o-header-search-row.is-focus .o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-row.is-focus .o-header-search-input[data-v-bfa0c69c] {
     width: 272px;
 }
 }
 @media (max-width: 840px) {
-.o-header-search-row.is-focus .o-header-search-input[data-v-a97b8e7c] {
+.o-header-search-row.is-focus .o-header-search-input[data-v-bfa0c69c] {
     flex: 1;
     width: auto;
 }
 }
-.o-header-search-back-icon[data-v-a97b8e7c] {
+.o-header-search-back-icon[data-v-bfa0c69c] {
   cursor: pointer;
   color: var(--o-color-info1);
   font-size: 20px;
   height: 30px;
 }
-.o-header-search-text[data-v-a97b8e7c] {
+.o-header-search-text[data-v-bfa0c69c] {
   white-space: nowrap;
   font-size: 16px;
   line-height: 24px;
@@ -115,11 +126,11 @@
   height: 30px;
 }
 @media (hover: hover) {
-.o-header-search-text[data-v-a97b8e7c]:hover {
+.o-header-search-text[data-v-bfa0c69c]:hover {
     color: var(--o-color-primary1);
 }
 }
-.o-header-search-drawer[data-v-a97b8e7c] {
+.o-header-search-drawer[data-v-bfa0c69c] {
   position: absolute;
   width: 100%;
   padding: var(--o-gap-4);
@@ -129,7 +140,7 @@
   border-radius: 0 0 var(--o-radius-xs) var(--o-radius-xs);
 }
 @media (max-width: 840px) {
-.o-header-search-drawer[data-v-a97b8e7c] {
+.o-header-search-drawer[data-v-bfa0c69c] {
     position: static;
     height: calc(100vh - 50px);
     padding-top: 0;
@@ -138,7 +149,7 @@
     border-radius: unset;
 }
 }
-.o-header-search-drawer[data-v-a97b8e7c]::before {
+.o-header-search-drawer[data-v-bfa0c69c]::before {
   content: "";
   position: absolute;
   left: 0;
@@ -148,45 +159,46 @@
   background-color: var(--o-color-fill2);
 }
 @media (max-width: 840px) {
-.o-header-search-drawer[data-v-a97b8e7c]::before {
+.o-header-search-drawer[data-v-bfa0c69c]::before {
     display: none;
 }
 }
-.o-header-search-mobile-icon[data-v-a97b8e7c] {
+.o-header-search-mobile-icon[data-v-bfa0c69c] {
   font-size: 24px;
   line-height: 28px;
-  color: var(--o-color-info1);
+  color: var(--o-color-info2);
   cursor: pointer;
   display: none;
 }
 @media (max-width: 840px) {
-.o-header-search-mobile-icon[data-v-a97b8e7c] {
+.o-header-search-mobile-icon[data-v-bfa0c69c] {
     display: block;
 }
 }
-.o-header-search-drawer-enter-active[data-v-a97b8e7c] {
+.o-header-search-drawer-enter-active[data-v-bfa0c69c] {
   transition: opacity var(--o-duration-m1);
 }
-.o-header-search-drawer-enter-from[data-v-a97b8e7c] {
+.o-header-search-drawer-enter-from[data-v-bfa0c69c] {
   opacity: 0;
 }
-.o-header-search.is-mobile-mode[data-v-a97b8e7c] {
+.o-header-search.is-mobile-mode[data-v-bfa0c69c] {
   width: 24px;
   height: 24px;
 }
-.o-header-search.is-mobile-mode .o-header-search-mobile-icon[data-v-a97b8e7c] {
+.o-header-search.is-mobile-mode .o-header-search-mobile-icon[data-v-bfa0c69c] {
   display: block;
 }
-.o-header-search.is-mobile-mode .o-header-search-row.is-focus[data-v-a97b8e7c] {
+.o-header-search.is-mobile-mode .o-header-search-row.is-focus[data-v-bfa0c69c] {
+  align-items: center;
   gap: var(--o-gap-4);
   padding: 10px var(--o-gap-4) var(--o-gap-4) var(--o-gap-4);
   border-radius: unset;
 }
-.o-header-search.is-mobile-mode .o-header-search-row.is-focus .o-header-search-input[data-v-a97b8e7c] {
+.o-header-search.is-mobile-mode .o-header-search-row.is-focus .o-header-search-input[data-v-bfa0c69c] {
   flex: 1;
   width: auto;
 }
-.o-header-search.is-mobile-mode .o-header-search-drawer[data-v-a97b8e7c] {
+.o-header-search.is-mobile-mode .o-header-search-drawer[data-v-bfa0c69c] {
   position: static;
   height: calc(100vh - 50px);
   padding-top: 0;
@@ -194,6 +206,21 @@
   box-shadow: unset;
   border-radius: unset;
 }
-.o-header-search.is-mobile-mode .o-header-search-drawer[data-v-a97b8e7c]::before {
+.o-header-search.is-mobile-mode .o-header-search-drawer[data-v-bfa0c69c]::before {
   display: none;
+}
+.o-header-search.is-simple[data-v-bfa0c69c] {
+  width: 24px;
+  height: 24px;
+}
+.o-header-search.is-simple .o-header-search-mobile-icon[data-v-bfa0c69c] {
+  display: block;
+}
+[data-v-bfa0c69c] .o-input.o_box-medium {
+  --_box-height: 32px;
+}
+@media (max-width: 840px) {
+[data-v-bfa0c69c] .o-input.o_box-medium {
+    --_box-height: 40px;
+}
 }

package/dist/treeshaking/components/header-search/OHeaderSearch.vue.d.ts

@@ -39,6 +39,8 @@ export interface OHeaderSearchPropsT {
     allowedImageTypes?: string[];
     /** 强制指定移动端模式，不传时由内部 lePadV 断点自动判断 */
     mobile?: boolean;
+    /** 简洁模式：PC 端也仅展示搜索图标，点击后展开输入框，默认 false */
+    simple?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
@@ -253,7 +255,7 @@ declare function __VLS_template(): {
                             type: import('vue').PropType<boolean | ((inputValue: string, lastValidInputValue: string) => string)>;
                         };
                         showPasswordEvent: {
-                            type: import('vue').PropType<"click" | "pointerdown">;
+                            type: import('vue' /** 强制指定移动端模式，不传时由内部 lePadV 断点自动判断 */).PropType<"click" | "pointerdown">;
                             default: string;
                         };
                         autoWidth: {
@@ -559,6 +561,7 @@ declare const __VLS_component: import('vue').DefineComponent<OHeaderSearchPropsT
     modelValue: string;
     clearable: boolean;
     debounce: number;
+    simple: boolean;
     imageUrl: string;
     enableImageSearch: boolean;
     maxImageSize: number;
@@ -736,7 +739,7 @@ declare const __VLS_component: import('vue').DefineComponent<OHeaderSearchPropsT
                         type: import('vue').PropType<boolean | ((inputValue: string, lastValidInputValue: string) => string)>;
                     };
                     showPasswordEvent: {
-                        type: import('vue').PropType<"click" | "pointerdown">;
+                        type: import('vue' /** 强制指定移动端模式，不传时由内部 lePadV 断点自动判断 */).PropType<"click" | "pointerdown">;
                         default: string;
                     };
                     autoWidth: {

package/dist/treeshaking/components/header-search/OHeaderSearch.vue.mjs

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

package/dist/treeshaking/components/header-search/OHeaderSearch.vue2.mjs

@@ -12,6 +12,7 @@ const _hoisted_1 = {
   key: 0,
   class: "o-header-search-drawer"
 };
+const previewLayerIgnore = ".o-layer";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "OHeaderSearch",
   props: {
@@ -47,7 +48,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     autoSaveHistory: { type: Boolean, default: true },
     showSuggestEmpty: { type: Boolean, default: true },
     allowedImageTypes: {},
-    mobile: { type: Boolean }
+    mobile: { type: Boolean },
+    simple: { type: Boolean, default: false }
   },
   emits: ["update:modelValue", "update:historyItems", "update:imageUrl", "focus", "blur", "input", "clear", "search", "recommend-click", "onestep-click", "history-click", "hot-click", "hot-refresh", "delete-history", "delete-history-item", "image-upload-start", "image-upload-success", "image-upload-error", "image-validate-error"],
   setup(__props, { expose: __expose, emit: __emit }) {
@@ -62,6 +64,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const internalImageStaged = ref(false);
     const internalImageUrl = ref("");
     const hasImage = computed(() => !!props.imageUrl || internalImageStaged.value);
+    const isPreviewVisible = ref(false);
     const innerValue = computed({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val)
@@ -89,12 +92,20 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return props.placeholder ?? t("search.placeholder");
     });
-    const emitInputDebounced = useDebounceFn((val) => emit("input", val), () => props.debounce);
+    const emitInputDebounced = useDebounceFn(
+      (val) => emit("input", val),
+      () => props.debounce
+    );
     watch(innerValue, (val) => emitInputDebounced(val));
-    onClickOutside(wrapperRef, () => {
-      if (isMobileMode.value) return;
-      closeDrawer();
-    });
+    onClickOutside(
+      wrapperRef,
+      () => {
+        if (isMobileMode.value) return;
+        if (isPreviewVisible.value) return;
+        closeDrawer();
+      },
+      { ignore: [previewLayerIgnore] }
+    );
     const openDrawer = () => {
       isShowDrawer.value = true;
     };
@@ -213,7 +224,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
-        class: normalizeClass(["o-header-search", { "is-mobile-mode": isMobileMode.value }])
+        class: normalizeClass(["o-header-search", { "is-mobile-mode": isMobileMode.value, "is-simple": props.simple && !isMobileMode.value }])
       }, [
         createElementVNode("div", {
           ref_key: "wrapperRef",
@@ -221,6 +232,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           class: normalizeClass(["o-header-search-pos", {
             "is-pc": !isMobileMode.value,
             "is-mobile": isMobileMode.value,
+            "is-simple": props.simple && !isMobileMode.value,
             "is-left": __props.expandDirection === "left",
             "is-right": __props.expandDirection === "right",
             "is-focus": isShowDrawer.value
@@ -264,7 +276,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               onImageUploadStart: handleImageUploadStart,
               onImageUploadSuccess: handleImageUploadSuccess,
               onImageUploadError: _cache[2] || (_cache[2] = (error, file) => emit("image-upload-error", error, file)),
-              onImageValidateError: _cache[3] || (_cache[3] = (reason, file) => emit("image-validate-error", reason, file))
+              onImageValidateError: _cache[3] || (_cache[3] = (reason, file) => emit("image-validate-error", reason, file)),
+              onPreviewChange: _cache[4] || (_cache[4] = (visible) => {
+                isPreviewVisible.value = visible;
+              })
             }, createSlots({
               prefix: withCtx(() => [
                 renderSlot(_ctx.$slots, "input-prefix", {}, void 0, true)
@@ -321,7 +336,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     onHistoryRemove: handleHistoryRemove,
                     onHistoryClear: handleHistoryClear,
                     onHotClick: handleHotClick,
-                    onHotRefresh: _cache[4] || (_cache[4] = ($event) => emit("hot-refresh"))
+                    onHotRefresh: _cache[5] || (_cache[5] = ($event) => emit("hot-refresh"))
                   }, createSlots({ _: 2 }, [
                     _ctx.$slots["recommend-header"] ? {
                       name: "recommend-header",
@@ -400,7 +415,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             _: 3
           })
         ], 2),
-        isMobileMode.value ? (openBlock(), createBlock(unref(OIcon), {
+        isMobileMode.value || props.simple ? (openBlock(), createBlock(unref(OIcon), {
           key: 0,
           class: "o-header-search-mobile-icon",
           onClick: openDrawer

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

@@ -16,6 +16,7 @@ declare const OHeaderSearch: {
         modelValue: string;
         clearable: boolean;
         debounce: number;
+        simple: boolean;
         imageUrl: string;
         enableImageSearch: boolean;
         maxImageSize: number;
@@ -498,6 +499,7 @@ declare const OHeaderSearch: {
         modelValue: string;
         clearable: boolean;
         debounce: number;
+        simple: boolean;
         imageUrl: string;
         enableImageSearch: boolean;
         maxImageSize: number;
@@ -534,6 +536,7 @@ declare const OHeaderSearch: {
     modelValue: string;
     clearable: boolean;
     debounce: number;
+    simple: boolean;
     imageUrl: string;
     enableImageSearch: boolean;
     maxImageSize: number;

package/dist/treeshaking/components/header-source-code/OHeaderSourceCode.css

@@ -1,17 +1,17 @@
-.hover-icon-rotate .o-icon[data-v-23114be6] {
+.hover-icon-rotate .o-icon[data-v-b9f5940a] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-23114be6] {
+.hover-icon-rotate:hover .o-icon[data-v-b9f5940a] {
     transform: rotate(-180deg);
 }
 }
-.source-code[data-v-23114be6] {
+.source-code[data-v-b9f5940a] {
   height: 100%;
   display: flex;
   align-items: center;
 }
-.source-code .info-wrap[data-v-23114be6] {
+.source-code .info-wrap[data-v-b9f5940a] {
   height: 100%;
   display: flex;
   align-items: center;
@@ -19,11 +19,11 @@
   cursor: pointer;
 }
 @media (hover: hover) {
-.source-code .info-wrap[data-v-23114be6]:hover {
+.source-code .info-wrap[data-v-b9f5940a]:hover {
     color: var(--o-color-primary1);
 }
 }
-.source-code .info-wrap .title[data-v-23114be6] {
+.source-code .info-wrap .title[data-v-b9f5940a] {
   display: flex;
   align-items: center;
   cursor: pointer;
@@ -32,101 +32,138 @@
   line-height: 22px;
 }
 @media (min-width: 1201px) and (max-width: 1680px) {
-.source-code .info-wrap .title[data-v-23114be6] {
+.source-code .info-wrap .title[data-v-b9f5940a] {
     font-size: 12px;
     line-height: 18px;
 }
 }
 @media (min-width: 841px) and (max-width: 1200px) {
-.source-code .info-wrap .title[data-v-23114be6] {
+.source-code .info-wrap .title[data-v-b9f5940a] {
     font-size: 12px;
     line-height: 18px;
 }
 }
 @media (min-width: 601px) and (max-width: 840px) {
-.source-code .info-wrap .title[data-v-23114be6] {
+.source-code .info-wrap .title[data-v-b9f5940a] {
     font-size: 12px;
     line-height: 18px;
 }
 }
 @media (max-width: 600px) {
-.source-code .info-wrap .title[data-v-23114be6] {
+.source-code .info-wrap .title[data-v-b9f5940a] {
     font-size: 12px;
     line-height: 18px;
 }
 }
-.source-code .list[data-v-23114be6] {
-  background: var(--o-color-fill2);
+@media (min-width: 1201px) and (max-width: 1680px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (min-width: 1201px) and (max-width: 1680px) and (min-width: 1201px) and (max-width: 1680px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 1201px) and (max-width: 1680px) and (min-width: 841px) and (max-width: 1200px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 1201px) and (max-width: 1680px) and (min-width: 601px) and (max-width: 840px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 1201px) and (max-width: 1680px) and (max-width: 600px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+@media (max-width: 1200px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 1200px) and (min-width: 1201px) and (max-width: 1680px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+@media (max-width: 1200px) and (min-width: 841px) and (max-width: 1200px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 1200px) and (min-width: 601px) and (max-width: 840px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 1200px) and (max-width: 600px) {
+.source-code .info-wrap .title[data-v-b9f5940a] {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+.source-code .list[data-v-b9f5940a] {
+  background: var(--o-color-control5-light);
   cursor: pointer;
   box-shadow: var(--o-shadow-1);
   border-radius: var(--o-radius_control-xs);
   padding: var(--o-gap-1);
   width: 144px;
 }
-.hover-icon-rotate .o-icon[data-v-23114be6] {
+.hover-icon-rotate .o-icon[data-v-b9f5940a] {
   transition: all var(--o-duration-m1) var(--o-easing-standard-in);
 }
 @media (hover: hover) {
-.hover-icon-rotate:hover .o-icon[data-v-23114be6] {
+.hover-icon-rotate:hover .o-icon[data-v-b9f5940a] {
     transform: rotate(-180deg);
 }
 }
-.icon[data-v-23114be6] {
+.icon[data-v-b9f5940a] {
   font-size: var(--o-icon_size_control-xs);
   margin-left: var(--o-gap-1);
 }
-.o-dropdown[data-v-23114be6] {
+.o-dropdown[data-v-b9f5940a] {
   height: 100%;
 }
-.dropdown-active .info-wrap[data-v-23114be6] {
+.dropdown-active .info-wrap[data-v-b9f5940a] {
   color: var(--o-color-primary1);
 }
-.dropdown-active .o-icon[data-v-23114be6] {
+.dropdown-active .o-icon[data-v-b9f5940a] {
   transform: rotate(-180deg);
 }
-.o-dropdown-item[data-v-23114be6] {
-  background: var(--o-color-fill2);
+.o-dropdown-item[data-v-b9f5940a] {
+  background: var(--o-color-control5-light);
   cursor: pointer;
   border-radius: var(--o-radius_control-xs);
-  padding: var(--o-gap-1) 12px;
+  padding: var(--o-gap-1) var(--o-gap-3);
   height: 32px;
-  font-size: 14px;
-  line-height: 22px;
-}
-@media (min-width: 1201px) and (max-width: 1680px) {
-.o-dropdown-item[data-v-23114be6] {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (min-width: 841px) and (max-width: 1200px) {
-.o-dropdown-item[data-v-23114be6] {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (min-width: 601px) and (max-width: 840px) {
-.o-dropdown-item[data-v-23114be6] {
-    font-size: 12px;
-    line-height: 18px;
-}
-}
-@media (max-width: 600px) {
-.o-dropdown-item[data-v-23114be6] {
-    font-size: 12px;
-    line-height: 18px;
-}
+  --dropdown-item-text-size: 14px;
+  --dropdown-item-text-height: 22px;
+  --dropdown-item-color: var(--o-color-info2);
 }
 @media (hover: hover) {
-.o-dropdown-item[data-v-23114be6]:hover {
+.o-dropdown-item[data-v-b9f5940a]:hover {
     background: var(--o-color-control2-light);
 }
 }
-.o-dropdown-item[data-v-23114be6]:active {
+.o-dropdown-item[data-v-b9f5940a]:active {
   color: var(--o-color-primary1);
   background: var(--o-color-control3-light);
   font-weight: 600;
 }
-.dropdown[data-v-23114be6] {
+.dropdown[data-v-b9f5940a] {
   --dropdown-list-radius: var(--o-radius-xs);
 }

package/dist/treeshaking/components/header-source-code/OHeaderSourceCode.vue.mjs

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