pro-design-vue 1.2.8 → 1.2.9

package/dist/index.full.mjs

@@ -1,4 +1,4 @@
-/*! Pro Design Vue v1.2.8 */
+/*! Pro Design Vue v1.2.9 */
 
 import { Modal, theme as theme$1, ConfigProvider, App, Button as Button$1, Tooltip, Popconfirm, Dropdown, Menu, Slider, Drawer, Input, InputNumber, Form as Form$1, Space, Textarea, Select, TreeSelect, Checkbox as Checkbox$1, CheckboxGroup, RadioGroup, Radio as Radio$1, Cascader, Switch, Rate, DatePicker, RangePicker, TimePicker, TimeRangePicker, Upload, FormItemRest, Spin, message, Row as Row$1, Col, FormItem as FormItem$3, Steps, Popover, MenuItem, SubMenu, Empty, Badge, Tag, Pagination, InputSearch, Tree, Card, Tabs, TabPane } from 'ant-design-vue';
 import { inject, ref, getCurrentInstance, nextTick, h, reactive, defineComponent, createVNode, isVNode, Fragment, cloneVNode, provide, watch, computed, renderSlot, createPropsRestProxy, createBlock, openBlock, unref, mergeProps, withCtx, normalizeProps, guardReactiveProps, shallowRef, shallowReadonly, toValue, getCurrentScope, onScopeDispose, onMounted, hasInjectionContext, isRef, toRefs as toRefs$1, customRef, toRef as toRef$1, readonly, watchEffect, toRaw, createElementBlock, createCommentVNode, resolveDynamicComponent, createElementVNode, normalizeStyle, toDisplayString, normalizeClass, createSlots, useAttrs, useTemplateRef, defineAsyncComponent, Teleport, onUnmounted, Comment as Comment$1, useSlots, useModel, withModifiers, mergeModels, renderList, camelize, isReactive, onActivated, onDeactivated, onBeforeUnmount, triggerRef, resolveDirective, withDirectives, vShow, render as render$1, resolveComponent, createTextVNode, vModelText } from 'vue';
@@ -30,7 +30,7 @@ const SCROLL_FIXED_CLASS = `_scroll__fixed_`;
 const DEFAULT_NAMESPACE = "pro";
 const DEFAULT_LOCALE = "zh-CN";
 
-const version$1 = "1.2.8";
+const version$1 = "1.2.9";
 
 const makeInstaller = (components = []) => {
   const install = (app) => {
@@ -3389,7 +3389,7 @@ function generatorColorVariables(colorItems, dark, namespace) {
         if (colorValue) {
           const hslColor = convertToHslCssVar(colorValue);
           colorVariables[`--${namespace}-${name}-${key}`] = hslColor;
-          if (alias) {
+          if (alias && alias !== name) {
             colorVariables[`--${namespace}-${alias}-${key}`] = hslColor;
           }
           if (key === "500") {
@@ -8307,18 +8307,24 @@ function useCssVariables(isDark) {
   watch(
     [token, isDark],
     ([newToken, dark], [oldToken]) => {
+      const changedColorVariables = [
+        { alias: "primary", color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
+        { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
+        { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
+        { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
+      ].filter((item) => {
+        const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key];
+        const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
+        return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
+      });
       const colorVariables = generatorColorVariables(
-        [
-          { color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
-          { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
-          { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
-          { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
-        ].filter((item) => {
-          const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key];
-          const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
-          return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
-        }),
-        dark,
+        changedColorVariables,
+        false,
+        DEFAULT_NAMESPACE
+      );
+      const darkColorVariables = generatorColorVariables(
+        changedColorVariables,
+        true,
         DEFAULT_NAMESPACE
       );
       const colorMappings = {
@@ -8333,9 +8339,11 @@ function useCssVariables(isDark) {
           document.documentElement.style.setProperty(targetVar, colorValue);
         }
       });
+      updateCSSVariables(colorVariables);
       updateCSSVariables(
-        colorVariables,
-        dark ? ".dark, .dark[data-theme='custom'], .dark[data-theme='default']" : ":root"
+        darkColorVariables,
+        ".dark, .dark[data-theme='custom'], .dark[data-theme='default']",
+        "__pro-dark-styles__"
       );
       if (defaultToken.borderRadius !== newToken.borderRadius) {
         document.documentElement.style.setProperty(

package/es/packages/components/config-provider/src/update-css-variables.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"update-css-variables.mjs","sources":["../../../../../../../packages/components/config-provider/src/update-css-variables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-26 11:27:18\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 18:55:50\n * @Description:\n */\n/**\n * 更新 CSS 变量的函数\n * @param variables 要更新的 CSS 变量与其新值的映射\n */\nfunction updateCSSVariables(\n  variables: { [key: string]: string },\n  className = ':root',\n  id = '__pro-styles__',\n): void {\n  // 获取或创建内联样式表元素\n  const styleElement = document.querySelector(`#${id}`) || document.createElement('style')\n\n  styleElement.id = id\n\n  // 构建要更新的 CSS 变量的样式文本\n  let cssText = className + ' {'\n  for (const key in variables) {\n    if (Object.prototype.hasOwnProperty.call(variables, key)) {\n      cssText += `${key}: ${variables[key]};`\n    }\n  }\n  cssText += '}'\n\n  // 将样式文本赋值给内联样式表\n  styleElement.textContent = cssText\n\n  // 将内联样式表添加到文档头部\n  if (!document.querySelector(`#${id}`)) {\n    setTimeout(() => {\n      document.head.append(styleElement)\n    })\n  }\n}\n\nexport { updateCSSVariables }\n"],"names":[],"mappings":"AAWA,SAAS,kBAAA,CACP,SAAA,EACA,SAAA,GAAY,OAAA,EACZ,KAAK,gBAAA,EACC;AAEN,EAAA,MAAM,YAAA,GAAe,SAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,CAAA,CAAE,CAAA,IAAK,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAEvF,EAAA,YAAA,CAAa,EAAA,GAAK,EAAA;AAGlB,EAAA,IAAI,UAAU,SAAA,GAAY,IAAA;AAC1B,EAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,IAAA,IAAI,OAAO,SAAA,CAAU,cAAA,CAAe,IAAA,CAAK,SAAA,EAAW,GAAG,CAAA,EAAG;AACxD,MAAA,OAAA,IAAW,CAAA,EAAG,GAAG,CAAA,EAAA,EAAK,SAAA,CAAU,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,IACtC;AAAA,EACF;AACA,EAAA,OAAA,IAAW,GAAA;AAGX,EAAA,YAAA,CAAa,WAAA,GAAc,OAAA;AAG3B,EAAA,IAAI,CAAC,QAAA,CAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,EAAE,CAAA,EAAG;AACrC,IAAA,UAAA,CAAW,MAAM;AACf,MAAA,QAAA,CAAS,IAAA,CAAK,OAAO,YAAY,CAAA;AAAA,IACnC,CAAC,CAAA;AAAA,EACH;AACF;;;;"}
+{"version":3,"file":"update-css-variables.mjs","sources":["../../../../../../../packages/components/config-provider/src/update-css-variables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-26 11:27:18\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:24:56\n * @Description:\n */\n/**\n * 更新 CSS 变量的函数\n * @param variables 要更新的 CSS 变量与其新值的映射\n */\nfunction updateCSSVariables(\n  variables: { [key: string]: string },\n  className = ':root',\n  id = '__pro-styles__',\n): void {\n  // 获取或创建内联样式表元素\n  const styleElement = document.querySelector(`#${id}`) || document.createElement('style')\n\n  styleElement.id = id\n\n  // 构建要更新的 CSS 变量的样式文本\n  let cssText = className + ' {'\n  for (const key in variables) {\n    if (Object.prototype.hasOwnProperty.call(variables, key)) {\n      cssText += `${key}: ${variables[key]};`\n    }\n  }\n  cssText += '}'\n\n  // 将样式文本赋值给内联样式表\n  styleElement.textContent = cssText\n\n  // 将内联样式表添加到文档头部\n  if (!document.querySelector(`#${id}`)) {\n    setTimeout(() => {\n      document.head.append(styleElement)\n    })\n  }\n}\n\nexport { updateCSSVariables }\n"],"names":[],"mappings":"AAWA,SAAS,kBAAA,CACP,SAAA,EACA,SAAA,GAAY,OAAA,EACZ,KAAK,gBAAA,EACC;AAEN,EAAA,MAAM,YAAA,GAAe,SAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,CAAA,CAAE,CAAA,IAAK,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAEvF,EAAA,YAAA,CAAa,EAAA,GAAK,EAAA;AAGlB,EAAA,IAAI,UAAU,SAAA,GAAY,IAAA;AAC1B,EAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,IAAA,IAAI,OAAO,SAAA,CAAU,cAAA,CAAe,IAAA,CAAK,SAAA,EAAW,GAAG,CAAA,EAAG;AACxD,MAAA,OAAA,IAAW,CAAA,EAAG,GAAG,CAAA,EAAA,EAAK,SAAA,CAAU,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,IACtC;AAAA,EACF;AACA,EAAA,OAAA,IAAW,GAAA;AAGX,EAAA,YAAA,CAAa,WAAA,GAAc,OAAA;AAG3B,EAAA,IAAI,CAAC,QAAA,CAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,EAAE,CAAA,EAAG;AACrC,IAAA,UAAA,CAAW,MAAM;AACf,MAAA,QAAA,CAAS,IAAA,CAAK,OAAO,YAAY,CAAA;AAAA,IACnC,CAAC,CAAA;AAAA,EACH;AACF;;;;"}

package/es/packages/components/config-provider/src/useCssVariables.mjs

@@ -11,18 +11,24 @@ function useCssVariables(isDark) {
   watch(
     [token, isDark],
     ([newToken, dark], [oldToken]) => {
+      const changedColorVariables = [
+        { alias: "primary", color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
+        { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
+        { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
+        { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
+      ].filter((item) => {
+        const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key];
+        const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
+        return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
+      });
       const colorVariables = generatorColorVariables(
-        [
-          { color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
-          { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
-          { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
-          { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
-        ].filter((item) => {
-          const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key];
-          const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
-          return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
-        }),
-        dark,
+        changedColorVariables,
+        false,
+        DEFAULT_NAMESPACE
+      );
+      const darkColorVariables = generatorColorVariables(
+        changedColorVariables,
+        true,
         DEFAULT_NAMESPACE
       );
       const colorMappings = {
@@ -37,9 +43,11 @@ function useCssVariables(isDark) {
           document.documentElement.style.setProperty(targetVar, colorValue);
         }
       });
+      updateCSSVariables(colorVariables);
       updateCSSVariables(
-        colorVariables,
-        dark ? ".dark, .dark[data-theme='custom'], .dark[data-theme='default']" : ":root"
+        darkColorVariables,
+        ".dark, .dark[data-theme='custom'], .dark[data-theme='default']",
+        "__pro-dark-styles__"
       );
       if (defaultToken.borderRadius !== newToken.borderRadius) {
         document.documentElement.style.setProperty(

package/es/packages/components/config-provider/src/useCssVariables.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useCssVariables.mjs","sources":["../../../../../../../packages/components/config-provider/src/useCssVariables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-06-06 09:26:03\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 18:57:00\n * @Description:\n */\nimport { theme } from 'ant-design-vue'\nimport { watch, type ComputedRef } from 'vue'\nimport { DEFAULT_NAMESPACE } from '@pro-design-vue/constants'\nimport { generatorColorVariables } from '@pro-design-vue/utils'\nimport { updateCSSVariables } from './update-css-variables'\nimport { defaultDarkToken, defaultToken } from './defaultToken'\n\nexport function useCssVariables(isDark: ComputedRef<boolean>) {\n  const { useToken } = theme\n  const { token } = useToken()\n\n  watch(\n    [token, isDark],\n    ([newToken, dark], [oldToken]) => {\n      const colorVariables = generatorColorVariables(\n        [\n          { color: newToken.colorPrimary, name: 'primary', key: 'colorPrimary' },\n          { alias: 'warning', color: newToken.colorWarning, name: 'yellow', key: 'colorWarning' },\n          { alias: 'success', color: newToken.colorSuccess, name: 'green', key: 'colorSuccess' },\n          { alias: 'error', color: newToken.colorError, name: 'red', key: 'colorError' },\n        ].filter((item) => {\n          const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key]\n          const oldColor = oldToken?.[item.key] || defaultColor\n          return (\n            newToken[item.key] !== defaultColor ||\n            (newToken[item.key] === defaultColor && oldColor !== defaultColor)\n          )\n        }),\n        dark,\n        DEFAULT_NAMESPACE,\n      )\n      // 要设置的 CSS 变量映射\n      const colorMappings = {\n        [`--${DEFAULT_NAMESPACE}-green-500`]: `--${DEFAULT_NAMESPACE}-success`,\n        [`--${DEFAULT_NAMESPACE}-primary-500`]: `--${DEFAULT_NAMESPACE}-primary`,\n        [`--${DEFAULT_NAMESPACE}-red-500`]: `--${DEFAULT_NAMESPACE}-error`,\n        [`--${DEFAULT_NAMESPACE}-yellow-500`]: `--${DEFAULT_NAMESPACE}-warning`,\n      }\n\n      Object.entries(colorMappings).forEach(([sourceVar, targetVar]) => {\n        const colorValue = colorVariables[sourceVar]\n        if (colorValue) {\n          document.documentElement.style.setProperty(targetVar, colorValue)\n        }\n      })\n\n      updateCSSVariables(\n        colorVariables,\n        dark ? \".dark, .dark[data-theme='custom'], .dark[data-theme='default']\" : ':root',\n      )\n\n      if (defaultToken.borderRadius !== newToken.borderRadius) {\n        document.documentElement.style.setProperty(\n          `--${DEFAULT_NAMESPACE}-radius`,\n          `${newToken.borderRadius}px`,\n        )\n      }\n    },\n    {\n      immediate: true,\n    },\n  )\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useCssVariables.mjs","sources":["../../../../../../../packages/components/config-provider/src/useCssVariables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-06-06 09:26:03\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:25:14\n * @Description:\n */\nimport { theme } from 'ant-design-vue'\nimport { watch, type ComputedRef } from 'vue'\nimport { DEFAULT_NAMESPACE } from '@pro-design-vue/constants'\nimport { generatorColorVariables } from '@pro-design-vue/utils'\nimport { updateCSSVariables } from './update-css-variables'\nimport { defaultDarkToken, defaultToken } from './defaultToken'\n\nexport function useCssVariables(isDark: ComputedRef<boolean>) {\n  const { useToken } = theme\n  const { token } = useToken()\n\n  watch(\n    [token, isDark],\n    ([newToken, dark], [oldToken]) => {\n      const changedColorVariables = [\n        { alias: 'primary', color: newToken.colorPrimary, name: 'primary', key: 'colorPrimary' },\n        { alias: 'warning', color: newToken.colorWarning, name: 'yellow', key: 'colorWarning' },\n        { alias: 'success', color: newToken.colorSuccess, name: 'green', key: 'colorSuccess' },\n        { alias: 'error', color: newToken.colorError, name: 'red', key: 'colorError' },\n      ].filter((item) => {\n        const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key]\n        const oldColor = oldToken?.[item.key] || defaultColor\n        return (\n          newToken[item.key] !== defaultColor ||\n          (newToken[item.key] === defaultColor && oldColor !== defaultColor)\n        )\n      })\n      const colorVariables = generatorColorVariables(\n        changedColorVariables,\n        false,\n        DEFAULT_NAMESPACE,\n      )\n      const darkColorVariables = generatorColorVariables(\n        changedColorVariables,\n        true,\n        DEFAULT_NAMESPACE,\n      )\n      // 要设置的 CSS 变量映射\n      const colorMappings = {\n        [`--${DEFAULT_NAMESPACE}-green-500`]: `--${DEFAULT_NAMESPACE}-success`,\n        [`--${DEFAULT_NAMESPACE}-primary-500`]: `--${DEFAULT_NAMESPACE}-primary`,\n        [`--${DEFAULT_NAMESPACE}-red-500`]: `--${DEFAULT_NAMESPACE}-error`,\n        [`--${DEFAULT_NAMESPACE}-yellow-500`]: `--${DEFAULT_NAMESPACE}-warning`,\n      }\n\n      Object.entries(colorMappings).forEach(([sourceVar, targetVar]) => {\n        const colorValue = colorVariables[sourceVar]\n        if (colorValue) {\n          document.documentElement.style.setProperty(targetVar, colorValue)\n        }\n      })\n\n      updateCSSVariables(colorVariables)\n\n      updateCSSVariables(\n        darkColorVariables,\n        \".dark, .dark[data-theme='custom'], .dark[data-theme='default']\",\n        '__pro-dark-styles__',\n      )\n\n      if (defaultToken.borderRadius !== newToken.borderRadius) {\n        document.documentElement.style.setProperty(\n          `--${DEFAULT_NAMESPACE}-radius`,\n          `${newToken.borderRadius}px`,\n        )\n      }\n    },\n    {\n      immediate: true,\n    },\n  )\n}\n"],"names":[],"mappings":"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"}

package/es/packages/utils/color/generator.mjs

@@ -27,7 +27,7 @@ function generatorColorVariables(colorItems, dark, namespace) {
         if (colorValue) {
           const hslColor = convertToHslCssVar(colorValue);
           colorVariables[`--${namespace}-${name}-${key}`] = hslColor;
-          if (alias) {
+          if (alias && alias !== name) {
             colorVariables[`--${namespace}-${alias}-${key}`] = hslColor;
           }
           if (key === "500") {

package/es/packages/utils/color/generator.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"generator.mjs","sources":["../../../../../../packages/utils/color/generator.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-10 22:33:31\n * @LastEditors: shen\n * @LastEditTime: 2025-10-15 15:42:18\n * @Description:\n */\nimport { getColors } from 'theme-colors'\n\nimport { convertToHslCssVar, TinyColor } from './convert'\n\ninterface ColorItem {\n  alias?: string\n  color: string\n  name: string\n  key: string\n}\n\nconst darkColorKeyMap = {\n  50: '950',\n  100: '900',\n  200: '800',\n  300: '700',\n  400: '600',\n  500: '500',\n  600: '400',\n  700: '300',\n  800: '200',\n  900: '100',\n  950: '50',\n}\n\nfunction generatorColorVariables(colorItems: ColorItem[], dark: boolean, namespace?: string) {\n  const colorVariables: Record<string, string> = {}\n\n  colorItems.forEach(({ alias, color, name }) => {\n    if (color) {\n      const colorsMap = getColors(new TinyColor(color).toHexString())\n\n      let mainColor = colorsMap['500']\n\n      const colorKeys = Object.keys(colorsMap)\n      colorKeys.forEach((key) => {\n        const colorValue = !dark ? colorsMap[key] : colorsMap[darkColorKeyMap[key]]\n\n        if (colorValue) {\n          const hslColor = convertToHslCssVar(colorValue)\n          colorVariables[`--${namespace}-${name}-${key}`] = hslColor\n          if (alias) {\n            colorVariables[`--${namespace}-${alias}-${key}`] = hslColor\n          }\n\n          if (key === '500') {\n            mainColor = hslColor\n          }\n        }\n      })\n      if (alias && mainColor) {\n        colorVariables[`--${namespace}-${alias}`] = mainColor\n      }\n    }\n  })\n  return colorVariables\n}\n\nexport { generatorColorVariables }\n"],"names":[],"mappings":";;;;AAkBA,MAAM,eAAA,GAAkB;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAA;AAEA,SAAS,uBAAA,CAAwB,UAAA,EAAyB,IAAA,EAAe,SAAA,EAAoB;AAC3F,EAAA,MAAM,iBAAyC,EAAC;AAEhD,EAAA,UAAA,CAAW,QAAQ,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,MAAK,KAAM;AAC7C,IAAA,IAAI,KAAA,EAAO;AACT,MAAA,MAAM,YAAY,SAAA,CAAU,IAAI,UAAU,KAAK,CAAA,CAAE,aAAa,CAAA;AAE9D,MAAA,IAAI,SAAA,GAAY,UAAU,KAAK,CAAA;AAE/B,MAAA,MAAM,SAAA,GAAY,MAAA,CAAO,IAAA,CAAK,SAAS,CAAA;AACvC,MAAA,SAAA,CAAU,OAAA,CAAQ,CAAC,GAAA,KAAQ;AACzB,QAAA,MAAM,UAAA,GAAa,CAAC,IAAA,GAAO,SAAA,CAAU,GAAG,CAAA,GAAI,SAAA,CAAU,eAAA,CAAgB,GAAG,CAAC,CAAA;AAE1E,QAAA,IAAI,UAAA,EAAY;AACd,UAAA,MAAM,QAAA,GAAW,mBAAmB,UAAU,CAAA;AAC9C,UAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,IAAI,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAClD,UAAA,IAAI,KAAA,EAAO;AACT,YAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAAA,UACrD;AAEA,UAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,YAAA,SAAA,GAAY,QAAA;AAAA,UACd;AAAA,QACF;AAAA,MACF,CAAC,CAAA;AACD,MAAA,IAAI,SAAS,SAAA,EAAW;AACtB,QAAA,cAAA,CAAe,CAAA,EAAA,EAAK,SAAS,CAAA,CAAA,EAAI,KAAK,EAAE,CAAA,GAAI,SAAA;AAAA,MAC9C;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AACD,EAAA,OAAO,cAAA;AACT;;;;"}
+{"version":3,"file":"generator.mjs","sources":["../../../../../../packages/utils/color/generator.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-10 22:33:31\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:23:07\n * @Description:\n */\nimport { getColors } from 'theme-colors'\n\nimport { convertToHslCssVar, TinyColor } from './convert'\n\ninterface ColorItem {\n  alias?: string\n  color: string\n  name: string\n  key: string\n}\n\nconst darkColorKeyMap = {\n  50: '950',\n  100: '900',\n  200: '800',\n  300: '700',\n  400: '600',\n  500: '500',\n  600: '400',\n  700: '300',\n  800: '200',\n  900: '100',\n  950: '50',\n}\n\nfunction generatorColorVariables(colorItems: ColorItem[], dark: boolean, namespace?: string) {\n  const colorVariables: Record<string, string> = {}\n\n  colorItems.forEach(({ alias, color, name }) => {\n    if (color) {\n      const colorsMap = getColors(new TinyColor(color).toHexString())\n\n      let mainColor = colorsMap['500']\n\n      const colorKeys = Object.keys(colorsMap)\n      colorKeys.forEach((key) => {\n        const colorValue = !dark ? colorsMap[key] : colorsMap[darkColorKeyMap[key]]\n\n        if (colorValue) {\n          const hslColor = convertToHslCssVar(colorValue)\n          colorVariables[`--${namespace}-${name}-${key}`] = hslColor\n          if (alias && alias !== name) {\n            colorVariables[`--${namespace}-${alias}-${key}`] = hslColor\n          }\n\n          if (key === '500') {\n            mainColor = hslColor\n          }\n        }\n      })\n      if (alias && mainColor) {\n        colorVariables[`--${namespace}-${alias}`] = mainColor\n      }\n    }\n  })\n  return colorVariables\n}\n\nexport { generatorColorVariables }\n"],"names":[],"mappings":";;;;AAkBA,MAAM,eAAA,GAAkB;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAA;AAEA,SAAS,uBAAA,CAAwB,UAAA,EAAyB,IAAA,EAAe,SAAA,EAAoB;AAC3F,EAAA,MAAM,iBAAyC,EAAC;AAEhD,EAAA,UAAA,CAAW,QAAQ,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,MAAK,KAAM;AAC7C,IAAA,IAAI,KAAA,EAAO;AACT,MAAA,MAAM,YAAY,SAAA,CAAU,IAAI,UAAU,KAAK,CAAA,CAAE,aAAa,CAAA;AAE9D,MAAA,IAAI,SAAA,GAAY,UAAU,KAAK,CAAA;AAE/B,MAAA,MAAM,SAAA,GAAY,MAAA,CAAO,IAAA,CAAK,SAAS,CAAA;AACvC,MAAA,SAAA,CAAU,OAAA,CAAQ,CAAC,GAAA,KAAQ;AACzB,QAAA,MAAM,UAAA,GAAa,CAAC,IAAA,GAAO,SAAA,CAAU,GAAG,CAAA,GAAI,SAAA,CAAU,eAAA,CAAgB,GAAG,CAAC,CAAA;AAE1E,QAAA,IAAI,UAAA,EAAY;AACd,UAAA,MAAM,QAAA,GAAW,mBAAmB,UAAU,CAAA;AAC9C,UAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,IAAI,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAClD,UAAA,IAAI,KAAA,IAAS,UAAU,IAAA,EAAM;AAC3B,YAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAAA,UACrD;AAEA,UAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,YAAA,SAAA,GAAY,QAAA;AAAA,UACd;AAAA,QACF;AAAA,MACF,CAAC,CAAA;AACD,MAAA,IAAI,SAAS,SAAA,EAAW;AACtB,QAAA,cAAA,CAAe,CAAA,EAAA,EAAK,SAAS,CAAA,CAAA,EAAI,KAAK,EAAE,CAAA,GAAI,SAAA;AAAA,MAC9C;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AACD,EAAA,OAAO,cAAA;AACT;;;;"}

package/es/version.d.ts

@@ -1 +1 @@
-export declare const version = "1.2.8";
+export declare const version = "1.2.9";

package/es/version.mjs

@@ -1,4 +1,4 @@
-const version = "1.2.8";
+const version = "1.2.9";
 
 export { version };
 //# sourceMappingURL=version.mjs.map

package/es/version.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"version.mjs","sources":["../../../packages/pro-design-vue/version.ts"],"sourcesContent":["export const version = '1.2.8'\n"],"names":[],"mappings":"AAAO,MAAM,OAAA,GAAU;;;;"}
+{"version":3,"file":"version.mjs","sources":["../../../packages/pro-design-vue/version.ts"],"sourcesContent":["export const version = '1.2.9'\n"],"names":[],"mappings":"AAAO,MAAM,OAAA,GAAU;;;;"}

package/lib/packages/components/config-provider/src/update-css-variables.js.map

@@ -1 +1 @@
-{"version":3,"file":"update-css-variables.js","sources":["../../../../../../../packages/components/config-provider/src/update-css-variables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-26 11:27:18\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 18:55:50\n * @Description:\n */\n/**\n * 更新 CSS 变量的函数\n * @param variables 要更新的 CSS 变量与其新值的映射\n */\nfunction updateCSSVariables(\n  variables: { [key: string]: string },\n  className = ':root',\n  id = '__pro-styles__',\n): void {\n  // 获取或创建内联样式表元素\n  const styleElement = document.querySelector(`#${id}`) || document.createElement('style')\n\n  styleElement.id = id\n\n  // 构建要更新的 CSS 变量的样式文本\n  let cssText = className + ' {'\n  for (const key in variables) {\n    if (Object.prototype.hasOwnProperty.call(variables, key)) {\n      cssText += `${key}: ${variables[key]};`\n    }\n  }\n  cssText += '}'\n\n  // 将样式文本赋值给内联样式表\n  styleElement.textContent = cssText\n\n  // 将内联样式表添加到文档头部\n  if (!document.querySelector(`#${id}`)) {\n    setTimeout(() => {\n      document.head.append(styleElement)\n    })\n  }\n}\n\nexport { updateCSSVariables }\n"],"names":[],"mappings":";;AAWA,SAAS,kBAAA,CACP,SAAA,EACA,SAAA,GAAY,OAAA,EACZ,KAAK,gBAAA,EACC;AAEN,EAAA,MAAM,YAAA,GAAe,SAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,CAAA,CAAE,CAAA,IAAK,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAEvF,EAAA,YAAA,CAAa,EAAA,GAAK,EAAA;AAGlB,EAAA,IAAI,UAAU,SAAA,GAAY,IAAA;AAC1B,EAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,IAAA,IAAI,OAAO,SAAA,CAAU,cAAA,CAAe,IAAA,CAAK,SAAA,EAAW,GAAG,CAAA,EAAG;AACxD,MAAA,OAAA,IAAW,CAAA,EAAG,GAAG,CAAA,EAAA,EAAK,SAAA,CAAU,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,IACtC;AAAA,EACF;AACA,EAAA,OAAA,IAAW,GAAA;AAGX,EAAA,YAAA,CAAa,WAAA,GAAc,OAAA;AAG3B,EAAA,IAAI,CAAC,QAAA,CAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,EAAE,CAAA,EAAG;AACrC,IAAA,UAAA,CAAW,MAAM;AACf,MAAA,QAAA,CAAS,IAAA,CAAK,OAAO,YAAY,CAAA;AAAA,IACnC,CAAC,CAAA;AAAA,EACH;AACF;;;;"}
+{"version":3,"file":"update-css-variables.js","sources":["../../../../../../../packages/components/config-provider/src/update-css-variables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-26 11:27:18\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:24:56\n * @Description:\n */\n/**\n * 更新 CSS 变量的函数\n * @param variables 要更新的 CSS 变量与其新值的映射\n */\nfunction updateCSSVariables(\n  variables: { [key: string]: string },\n  className = ':root',\n  id = '__pro-styles__',\n): void {\n  // 获取或创建内联样式表元素\n  const styleElement = document.querySelector(`#${id}`) || document.createElement('style')\n\n  styleElement.id = id\n\n  // 构建要更新的 CSS 变量的样式文本\n  let cssText = className + ' {'\n  for (const key in variables) {\n    if (Object.prototype.hasOwnProperty.call(variables, key)) {\n      cssText += `${key}: ${variables[key]};`\n    }\n  }\n  cssText += '}'\n\n  // 将样式文本赋值给内联样式表\n  styleElement.textContent = cssText\n\n  // 将内联样式表添加到文档头部\n  if (!document.querySelector(`#${id}`)) {\n    setTimeout(() => {\n      document.head.append(styleElement)\n    })\n  }\n}\n\nexport { updateCSSVariables }\n"],"names":[],"mappings":";;AAWA,SAAS,kBAAA,CACP,SAAA,EACA,SAAA,GAAY,OAAA,EACZ,KAAK,gBAAA,EACC;AAEN,EAAA,MAAM,YAAA,GAAe,SAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,CAAA,CAAE,CAAA,IAAK,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAEvF,EAAA,YAAA,CAAa,EAAA,GAAK,EAAA;AAGlB,EAAA,IAAI,UAAU,SAAA,GAAY,IAAA;AAC1B,EAAA,KAAA,MAAW,OAAO,SAAA,EAAW;AAC3B,IAAA,IAAI,OAAO,SAAA,CAAU,cAAA,CAAe,IAAA,CAAK,SAAA,EAAW,GAAG,CAAA,EAAG;AACxD,MAAA,OAAA,IAAW,CAAA,EAAG,GAAG,CAAA,EAAA,EAAK,SAAA,CAAU,GAAG,CAAC,CAAA,CAAA,CAAA;AAAA,IACtC;AAAA,EACF;AACA,EAAA,OAAA,IAAW,GAAA;AAGX,EAAA,YAAA,CAAa,WAAA,GAAc,OAAA;AAG3B,EAAA,IAAI,CAAC,QAAA,CAAS,aAAA,CAAc,CAAA,CAAA,EAAI,EAAE,EAAE,CAAA,EAAG;AACrC,IAAA,UAAA,CAAW,MAAM;AACf,MAAA,QAAA,CAAS,IAAA,CAAK,OAAO,YAAY,CAAA;AAAA,IACnC,CAAC,CAAA;AAAA,EACH;AACF;;;;"}

package/lib/packages/components/config-provider/src/useCssVariables.js

@@ -13,18 +13,24 @@ function useCssVariables(isDark) {
   vue.watch(
     [token, isDark],
     ([newToken, dark], [oldToken]) => {
+      const changedColorVariables = [
+        { alias: "primary", color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
+        { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
+        { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
+        { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
+      ].filter((item) => {
+        const defaultColor = dark ? defaultToken.defaultDarkToken[item.key] : defaultToken.defaultToken[item.key];
+        const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
+        return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
+      });
       const colorVariables = generator.generatorColorVariables(
-        [
-          { color: newToken.colorPrimary, name: "primary", key: "colorPrimary" },
-          { alias: "warning", color: newToken.colorWarning, name: "yellow", key: "colorWarning" },
-          { alias: "success", color: newToken.colorSuccess, name: "green", key: "colorSuccess" },
-          { alias: "error", color: newToken.colorError, name: "red", key: "colorError" }
-        ].filter((item) => {
-          const defaultColor = dark ? defaultToken.defaultDarkToken[item.key] : defaultToken.defaultToken[item.key];
-          const oldColor = (oldToken == null ? void 0 : oldToken[item.key]) || defaultColor;
-          return newToken[item.key] !== defaultColor || newToken[item.key] === defaultColor && oldColor !== defaultColor;
-        }),
-        dark,
+        changedColorVariables,
+        false,
+        globals.DEFAULT_NAMESPACE
+      );
+      const darkColorVariables = generator.generatorColorVariables(
+        changedColorVariables,
+        true,
         globals.DEFAULT_NAMESPACE
       );
       const colorMappings = {
@@ -39,9 +45,11 @@ function useCssVariables(isDark) {
           document.documentElement.style.setProperty(targetVar, colorValue);
         }
       });
+      updateCssVariables.updateCSSVariables(colorVariables);
       updateCssVariables.updateCSSVariables(
-        colorVariables,
-        dark ? ".dark, .dark[data-theme='custom'], .dark[data-theme='default']" : ":root"
+        darkColorVariables,
+        ".dark, .dark[data-theme='custom'], .dark[data-theme='default']",
+        "__pro-dark-styles__"
       );
       if (defaultToken.defaultToken.borderRadius !== newToken.borderRadius) {
         document.documentElement.style.setProperty(

package/lib/packages/components/config-provider/src/useCssVariables.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCssVariables.js","sources":["../../../../../../../packages/components/config-provider/src/useCssVariables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-06-06 09:26:03\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 18:57:00\n * @Description:\n */\nimport { theme } from 'ant-design-vue'\nimport { watch, type ComputedRef } from 'vue'\nimport { DEFAULT_NAMESPACE } from '@pro-design-vue/constants'\nimport { generatorColorVariables } from '@pro-design-vue/utils'\nimport { updateCSSVariables } from './update-css-variables'\nimport { defaultDarkToken, defaultToken } from './defaultToken'\n\nexport function useCssVariables(isDark: ComputedRef<boolean>) {\n  const { useToken } = theme\n  const { token } = useToken()\n\n  watch(\n    [token, isDark],\n    ([newToken, dark], [oldToken]) => {\n      const colorVariables = generatorColorVariables(\n        [\n          { color: newToken.colorPrimary, name: 'primary', key: 'colorPrimary' },\n          { alias: 'warning', color: newToken.colorWarning, name: 'yellow', key: 'colorWarning' },\n          { alias: 'success', color: newToken.colorSuccess, name: 'green', key: 'colorSuccess' },\n          { alias: 'error', color: newToken.colorError, name: 'red', key: 'colorError' },\n        ].filter((item) => {\n          const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key]\n          const oldColor = oldToken?.[item.key] || defaultColor\n          return (\n            newToken[item.key] !== defaultColor ||\n            (newToken[item.key] === defaultColor && oldColor !== defaultColor)\n          )\n        }),\n        dark,\n        DEFAULT_NAMESPACE,\n      )\n      // 要设置的 CSS 变量映射\n      const colorMappings = {\n        [`--${DEFAULT_NAMESPACE}-green-500`]: `--${DEFAULT_NAMESPACE}-success`,\n        [`--${DEFAULT_NAMESPACE}-primary-500`]: `--${DEFAULT_NAMESPACE}-primary`,\n        [`--${DEFAULT_NAMESPACE}-red-500`]: `--${DEFAULT_NAMESPACE}-error`,\n        [`--${DEFAULT_NAMESPACE}-yellow-500`]: `--${DEFAULT_NAMESPACE}-warning`,\n      }\n\n      Object.entries(colorMappings).forEach(([sourceVar, targetVar]) => {\n        const colorValue = colorVariables[sourceVar]\n        if (colorValue) {\n          document.documentElement.style.setProperty(targetVar, colorValue)\n        }\n      })\n\n      updateCSSVariables(\n        colorVariables,\n        dark ? \".dark, .dark[data-theme='custom'], .dark[data-theme='default']\" : ':root',\n      )\n\n      if (defaultToken.borderRadius !== newToken.borderRadius) {\n        document.documentElement.style.setProperty(\n          `--${DEFAULT_NAMESPACE}-radius`,\n          `${newToken.borderRadius}px`,\n        )\n      }\n    },\n    {\n      immediate: true,\n    },\n  )\n}\n"],"names":["theme","watch","generatorColorVariables","defaultDarkToken","defaultToken","DEFAULT_NAMESPACE","updateCSSVariables"],"mappings":";;;;;;;;;AAcO,SAAS,gBAAgB,MAAA,EAA8B;AAC5D,EAAA,MAAM,EAAE,UAAS,GAAIA,kBAAA;AACrB,EAAA,MAAM,EAAE,KAAA,EAAM,GAAI,QAAA,EAAS;AAE3B,EAAAC,SAAA;AAAA,IACE,CAAC,OAAO,MAAM,CAAA;AAAA,IACd,CAAC,CAAC,QAAA,EAAU,IAAI,CAAA,EAAG,CAAC,QAAQ,CAAA,KAAM;AAChC,MAAA,MAAM,cAAA,GAAiBC,iCAAA;AAAA,QACrB;AAAA,UACE,EAAE,KAAA,EAAO,QAAA,CAAS,cAAc,IAAA,EAAM,SAAA,EAAW,KAAK,cAAA,EAAe;AAAA,UACrE,EAAE,OAAO,SAAA,EAAW,KAAA,EAAO,SAAS,YAAA,EAAc,IAAA,EAAM,QAAA,EAAU,GAAA,EAAK,cAAA,EAAe;AAAA,UACtF,EAAE,OAAO,SAAA,EAAW,KAAA,EAAO,SAAS,YAAA,EAAc,IAAA,EAAM,OAAA,EAAS,GAAA,EAAK,cAAA,EAAe;AAAA,UACrF,EAAE,OAAO,OAAA,EAAS,KAAA,EAAO,SAAS,UAAA,EAAY,IAAA,EAAM,KAAA,EAAO,GAAA,EAAK,YAAA;AAAa,SAC/E,CAAE,MAAA,CAAO,CAAC,IAAA,KAAS;AACjB,UAAA,MAAM,YAAA,GAAe,OAAOC,6BAAA,CAAiB,IAAA,CAAK,GAAG,CAAA,GAAIC,yBAAA,CAAa,KAAK,GAAG,CAAA;AAC9E,UAAA,MAAM,QAAA,GAAA,CAAW,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,IAAA,CAAK,GAAA,CAAA,KAAQ,YAAA;AACzC,UAAA,OACE,QAAA,CAAS,IAAA,CAAK,GAAG,CAAA,KAAM,YAAA,IACtB,SAAS,IAAA,CAAK,GAAG,CAAA,KAAM,YAAA,IAAgB,QAAA,KAAa,YAAA;AAAA,QAEzD,CAAC,CAAA;AAAA,QACD,IAAA;AAAA,QACAC;AAAA,OACF;AAEA,MAAA,MAAM,aAAA,GAAgB;AAAA,QACpB,CAAC,CAAA,EAAA,EAAKA,yBAAiB,CAAA,UAAA,CAAY,GAAG,KAAKA,yBAAiB,CAAA,QAAA,CAAA;AAAA,QAC5D,CAAC,CAAA,EAAA,EAAKA,yBAAiB,CAAA,YAAA,CAAc,GAAG,KAAKA,yBAAiB,CAAA,QAAA,CAAA;AAAA,QAC9D,CAAC,CAAA,EAAA,EAAKA,yBAAiB,CAAA,QAAA,CAAU,GAAG,KAAKA,yBAAiB,CAAA,MAAA,CAAA;AAAA,QAC1D,CAAC,CAAA,EAAA,EAAKA,yBAAiB,CAAA,WAAA,CAAa,GAAG,KAAKA,yBAAiB,CAAA,QAAA;AAAA,OAC/D;AAEA,MAAA,MAAA,CAAO,OAAA,CAAQ,aAAa,CAAA,CAAE,OAAA,CAAQ,CAAC,CAAC,SAAA,EAAW,SAAS,CAAA,KAAM;AAChE,QAAA,MAAM,UAAA,GAAa,eAAe,SAAS,CAAA;AAC3C,QAAA,IAAI,UAAA,EAAY;AACd,UAAA,QAAA,CAAS,eAAA,CAAgB,KAAA,CAAM,WAAA,CAAY,SAAA,EAAW,UAAU,CAAA;AAAA,QAClE;AAAA,MACF,CAAC,CAAA;AAED,MAAAC,qCAAA;AAAA,QACE,cAAA;AAAA,QACA,OAAO,gEAAA,GAAmE;AAAA,OAC5E;AAEA,MAAA,IAAIF,yBAAA,CAAa,YAAA,KAAiB,QAAA,CAAS,YAAA,EAAc;AACvD,QAAA,QAAA,CAAS,gBAAgB,KAAA,CAAM,WAAA;AAAA,UAC7B,KAAKC,yBAAiB,CAAA,OAAA,CAAA;AAAA,UACtB,CAAA,EAAG,SAAS,YAAY,CAAA,EAAA;AAAA,SAC1B;AAAA,MACF;AAAA,IACF,CAAA;AAAA,IACA;AAAA,MACE,SAAA,EAAW;AAAA;AACb,GACF;AACF;;;;"}
+{"version":3,"file":"useCssVariables.js","sources":["../../../../../../../packages/components/config-provider/src/useCssVariables.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-06-06 09:26:03\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:25:14\n * @Description:\n */\nimport { theme } from 'ant-design-vue'\nimport { watch, type ComputedRef } from 'vue'\nimport { DEFAULT_NAMESPACE } from '@pro-design-vue/constants'\nimport { generatorColorVariables } from '@pro-design-vue/utils'\nimport { updateCSSVariables } from './update-css-variables'\nimport { defaultDarkToken, defaultToken } from './defaultToken'\n\nexport function useCssVariables(isDark: ComputedRef<boolean>) {\n  const { useToken } = theme\n  const { token } = useToken()\n\n  watch(\n    [token, isDark],\n    ([newToken, dark], [oldToken]) => {\n      const changedColorVariables = [\n        { alias: 'primary', color: newToken.colorPrimary, name: 'primary', key: 'colorPrimary' },\n        { alias: 'warning', color: newToken.colorWarning, name: 'yellow', key: 'colorWarning' },\n        { alias: 'success', color: newToken.colorSuccess, name: 'green', key: 'colorSuccess' },\n        { alias: 'error', color: newToken.colorError, name: 'red', key: 'colorError' },\n      ].filter((item) => {\n        const defaultColor = dark ? defaultDarkToken[item.key] : defaultToken[item.key]\n        const oldColor = oldToken?.[item.key] || defaultColor\n        return (\n          newToken[item.key] !== defaultColor ||\n          (newToken[item.key] === defaultColor && oldColor !== defaultColor)\n        )\n      })\n      const colorVariables = generatorColorVariables(\n        changedColorVariables,\n        false,\n        DEFAULT_NAMESPACE,\n      )\n      const darkColorVariables = generatorColorVariables(\n        changedColorVariables,\n        true,\n        DEFAULT_NAMESPACE,\n      )\n      // 要设置的 CSS 变量映射\n      const colorMappings = {\n        [`--${DEFAULT_NAMESPACE}-green-500`]: `--${DEFAULT_NAMESPACE}-success`,\n        [`--${DEFAULT_NAMESPACE}-primary-500`]: `--${DEFAULT_NAMESPACE}-primary`,\n        [`--${DEFAULT_NAMESPACE}-red-500`]: `--${DEFAULT_NAMESPACE}-error`,\n        [`--${DEFAULT_NAMESPACE}-yellow-500`]: `--${DEFAULT_NAMESPACE}-warning`,\n      }\n\n      Object.entries(colorMappings).forEach(([sourceVar, targetVar]) => {\n        const colorValue = colorVariables[sourceVar]\n        if (colorValue) {\n          document.documentElement.style.setProperty(targetVar, colorValue)\n        }\n      })\n\n      updateCSSVariables(colorVariables)\n\n      updateCSSVariables(\n        darkColorVariables,\n        \".dark, .dark[data-theme='custom'], .dark[data-theme='default']\",\n        '__pro-dark-styles__',\n      )\n\n      if (defaultToken.borderRadius !== newToken.borderRadius) {\n        document.documentElement.style.setProperty(\n          `--${DEFAULT_NAMESPACE}-radius`,\n          `${newToken.borderRadius}px`,\n        )\n      }\n    },\n    {\n      immediate: true,\n    },\n  )\n}\n"],"names":["theme","watch","defaultDarkToken","defaultToken","generatorColorVariables","DEFAULT_NAMESPACE","updateCSSVariables"],"mappings":"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"}

package/lib/packages/utils/color/generator.js

@@ -29,7 +29,7 @@ function generatorColorVariables(colorItems, dark, namespace) {
         if (colorValue) {
           const hslColor = convert.convertToHslCssVar(colorValue);
           colorVariables[`--${namespace}-${name}-${key}`] = hslColor;
-          if (alias) {
+          if (alias && alias !== name) {
             colorVariables[`--${namespace}-${alias}-${key}`] = hslColor;
           }
           if (key === "500") {

package/lib/packages/utils/color/generator.js.map

@@ -1 +1 @@
-{"version":3,"file":"generator.js","sources":["../../../../../../packages/utils/color/generator.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-10 22:33:31\n * @LastEditors: shen\n * @LastEditTime: 2025-10-15 15:42:18\n * @Description:\n */\nimport { getColors } from 'theme-colors'\n\nimport { convertToHslCssVar, TinyColor } from './convert'\n\ninterface ColorItem {\n  alias?: string\n  color: string\n  name: string\n  key: string\n}\n\nconst darkColorKeyMap = {\n  50: '950',\n  100: '900',\n  200: '800',\n  300: '700',\n  400: '600',\n  500: '500',\n  600: '400',\n  700: '300',\n  800: '200',\n  900: '100',\n  950: '50',\n}\n\nfunction generatorColorVariables(colorItems: ColorItem[], dark: boolean, namespace?: string) {\n  const colorVariables: Record<string, string> = {}\n\n  colorItems.forEach(({ alias, color, name }) => {\n    if (color) {\n      const colorsMap = getColors(new TinyColor(color).toHexString())\n\n      let mainColor = colorsMap['500']\n\n      const colorKeys = Object.keys(colorsMap)\n      colorKeys.forEach((key) => {\n        const colorValue = !dark ? colorsMap[key] : colorsMap[darkColorKeyMap[key]]\n\n        if (colorValue) {\n          const hslColor = convertToHslCssVar(colorValue)\n          colorVariables[`--${namespace}-${name}-${key}`] = hslColor\n          if (alias) {\n            colorVariables[`--${namespace}-${alias}-${key}`] = hslColor\n          }\n\n          if (key === '500') {\n            mainColor = hslColor\n          }\n        }\n      })\n      if (alias && mainColor) {\n        colorVariables[`--${namespace}-${alias}`] = mainColor\n      }\n    }\n  })\n  return colorVariables\n}\n\nexport { generatorColorVariables }\n"],"names":["getColors","TinyColor","convertToHslCssVar"],"mappings":";;;;;;AAkBA,MAAM,eAAA,GAAkB;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAA;AAEA,SAAS,uBAAA,CAAwB,UAAA,EAAyB,IAAA,EAAe,SAAA,EAAoB;AAC3F,EAAA,MAAM,iBAAyC,EAAC;AAEhD,EAAA,UAAA,CAAW,QAAQ,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,MAAK,KAAM;AAC7C,IAAA,IAAI,KAAA,EAAO;AACT,MAAA,MAAM,YAAYA,eAAA,CAAU,IAAIC,kBAAU,KAAK,CAAA,CAAE,aAAa,CAAA;AAE9D,MAAA,IAAI,SAAA,GAAY,UAAU,KAAK,CAAA;AAE/B,MAAA,MAAM,SAAA,GAAY,MAAA,CAAO,IAAA,CAAK,SAAS,CAAA;AACvC,MAAA,SAAA,CAAU,OAAA,CAAQ,CAAC,GAAA,KAAQ;AACzB,QAAA,MAAM,UAAA,GAAa,CAAC,IAAA,GAAO,SAAA,CAAU,GAAG,CAAA,GAAI,SAAA,CAAU,eAAA,CAAgB,GAAG,CAAC,CAAA;AAE1E,QAAA,IAAI,UAAA,EAAY;AACd,UAAA,MAAM,QAAA,GAAWC,2BAAmB,UAAU,CAAA;AAC9C,UAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,IAAI,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAClD,UAAA,IAAI,KAAA,EAAO;AACT,YAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAAA,UACrD;AAEA,UAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,YAAA,SAAA,GAAY,QAAA;AAAA,UACd;AAAA,QACF;AAAA,MACF,CAAC,CAAA;AACD,MAAA,IAAI,SAAS,SAAA,EAAW;AACtB,QAAA,cAAA,CAAe,CAAA,EAAA,EAAK,SAAS,CAAA,CAAA,EAAI,KAAK,EAAE,CAAA,GAAI,SAAA;AAAA,MAC9C;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AACD,EAAA,OAAO,cAAA;AACT;;;;"}
+{"version":3,"file":"generator.js","sources":["../../../../../../packages/utils/color/generator.ts"],"sourcesContent":["/*\n * @Author: shen\n * @Date: 2025-05-10 22:33:31\n * @LastEditors: shen\n * @LastEditTime: 2025-10-16 19:23:07\n * @Description:\n */\nimport { getColors } from 'theme-colors'\n\nimport { convertToHslCssVar, TinyColor } from './convert'\n\ninterface ColorItem {\n  alias?: string\n  color: string\n  name: string\n  key: string\n}\n\nconst darkColorKeyMap = {\n  50: '950',\n  100: '900',\n  200: '800',\n  300: '700',\n  400: '600',\n  500: '500',\n  600: '400',\n  700: '300',\n  800: '200',\n  900: '100',\n  950: '50',\n}\n\nfunction generatorColorVariables(colorItems: ColorItem[], dark: boolean, namespace?: string) {\n  const colorVariables: Record<string, string> = {}\n\n  colorItems.forEach(({ alias, color, name }) => {\n    if (color) {\n      const colorsMap = getColors(new TinyColor(color).toHexString())\n\n      let mainColor = colorsMap['500']\n\n      const colorKeys = Object.keys(colorsMap)\n      colorKeys.forEach((key) => {\n        const colorValue = !dark ? colorsMap[key] : colorsMap[darkColorKeyMap[key]]\n\n        if (colorValue) {\n          const hslColor = convertToHslCssVar(colorValue)\n          colorVariables[`--${namespace}-${name}-${key}`] = hslColor\n          if (alias && alias !== name) {\n            colorVariables[`--${namespace}-${alias}-${key}`] = hslColor\n          }\n\n          if (key === '500') {\n            mainColor = hslColor\n          }\n        }\n      })\n      if (alias && mainColor) {\n        colorVariables[`--${namespace}-${alias}`] = mainColor\n      }\n    }\n  })\n  return colorVariables\n}\n\nexport { generatorColorVariables }\n"],"names":["getColors","TinyColor","convertToHslCssVar"],"mappings":";;;;;;AAkBA,MAAM,eAAA,GAAkB;AAAA,EACtB,EAAA,EAAI,KAAA;AAAA,EACJ,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK,KAAA;AAAA,EACL,GAAA,EAAK;AACP,CAAA;AAEA,SAAS,uBAAA,CAAwB,UAAA,EAAyB,IAAA,EAAe,SAAA,EAAoB;AAC3F,EAAA,MAAM,iBAAyC,EAAC;AAEhD,EAAA,UAAA,CAAW,QAAQ,CAAC,EAAE,KAAA,EAAO,KAAA,EAAO,MAAK,KAAM;AAC7C,IAAA,IAAI,KAAA,EAAO;AACT,MAAA,MAAM,YAAYA,eAAA,CAAU,IAAIC,kBAAU,KAAK,CAAA,CAAE,aAAa,CAAA;AAE9D,MAAA,IAAI,SAAA,GAAY,UAAU,KAAK,CAAA;AAE/B,MAAA,MAAM,SAAA,GAAY,MAAA,CAAO,IAAA,CAAK,SAAS,CAAA;AACvC,MAAA,SAAA,CAAU,OAAA,CAAQ,CAAC,GAAA,KAAQ;AACzB,QAAA,MAAM,UAAA,GAAa,CAAC,IAAA,GAAO,SAAA,CAAU,GAAG,CAAA,GAAI,SAAA,CAAU,eAAA,CAAgB,GAAG,CAAC,CAAA;AAE1E,QAAA,IAAI,UAAA,EAAY;AACd,UAAA,MAAM,QAAA,GAAWC,2BAAmB,UAAU,CAAA;AAC9C,UAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,IAAI,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAClD,UAAA,IAAI,KAAA,IAAS,UAAU,IAAA,EAAM;AAC3B,YAAA,cAAA,CAAe,KAAK,SAAS,CAAA,CAAA,EAAI,KAAK,CAAA,CAAA,EAAI,GAAG,EAAE,CAAA,GAAI,QAAA;AAAA,UACrD;AAEA,UAAA,IAAI,QAAQ,KAAA,EAAO;AACjB,YAAA,SAAA,GAAY,QAAA;AAAA,UACd;AAAA,QACF;AAAA,MACF,CAAC,CAAA;AACD,MAAA,IAAI,SAAS,SAAA,EAAW;AACtB,QAAA,cAAA,CAAe,CAAA,EAAA,EAAK,SAAS,CAAA,CAAA,EAAI,KAAK,EAAE,CAAA,GAAI,SAAA;AAAA,MAC9C;AAAA,IACF;AAAA,EACF,CAAC,CAAA;AACD,EAAA,OAAO,cAAA;AACT;;;;"}

package/lib/version.d.ts

@@ -1 +1 @@
-export declare const version = "1.2.8";
+export declare const version = "1.2.9";

package/lib/version.js

@@ -1,6 +1,6 @@
 'use strict';
 
-const version = "1.2.8";
+const version = "1.2.9";
 
 exports.version = version;
 //# sourceMappingURL=version.js.map

package/lib/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sources":["../../../packages/pro-design-vue/version.ts"],"sourcesContent":["export const version = '1.2.8'\n"],"names":[],"mappings":";;AAAO,MAAM,OAAA,GAAU;;;;"}
+{"version":3,"file":"version.js","sources":["../../../packages/pro-design-vue/version.ts"],"sourcesContent":["export const version = '1.2.9'\n"],"names":[],"mappings":";;AAAO,MAAM,OAAA,GAAU;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pro-design-vue",
-  "version": "1.2.8",
+  "version": "1.2.9",
   "description": "A Component Library for Vue 3",
   "keywords": [
     "pro design",