pro-design-vue 1.2.7 → 1.2.9

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Pro Design Vue v1.2.7 */
+/*! Pro Design Vue v1.2.9 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('ant-design-vue'), require('vue'), require('ant-design-vue/es/locale/zh_CN.js')) :
@@ -32,7 +32,7 @@
   const DEFAULT_NAMESPACE = "pro";
   const DEFAULT_LOCALE = "zh-CN";
 
-  const version$1 = "1.2.7";
+  const version$1 = "1.2.9";
 
   const makeInstaller = (components = []) => {
     const install = (app) => {
@@ -3391,7 +3391,7 @@
           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") {
@@ -8268,10 +8268,10 @@
     return vue.inject(proConfigProviderContextKey, {});
   };
 
-  function updateCSSVariables(variables, id = "__pro-styles__") {
+  function updateCSSVariables(variables, className = ":root", id = "__pro-styles__") {
     const styleElement = document.querySelector(`#${id}`) || document.createElement("style");
     styleElement.id = id;
-    let cssText = ":root {";
+    let cssText = className + " {";
     for (const key in variables) {
       if (Object.prototype.hasOwnProperty.call(variables, key)) {
         cssText += `${key}: ${variables[key]};`;
@@ -8309,18 +8309,24 @@
     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 ? 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 = {
@@ -8336,6 +8342,11 @@
           }
         });
         updateCSSVariables(colorVariables);
+        updateCSSVariables(
+          darkColorVariables,
+          ".dark, .dark[data-theme='custom'], .dark[data-theme='default']",
+          "__pro-dark-styles__"
+        );
         if (defaultToken.borderRadius !== newToken.borderRadius) {
           document.documentElement.style.setProperty(
             `--${DEFAULT_NAMESPACE}-radius`,