naive-ui 2.21.5 → 2.23.2

package/es/form/src/FormItemGridItem.d.ts

@@ -28,15 +28,15 @@ export declare const formItemGiProps: {
         readonly default: undefined;
     };
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -59,15 +59,15 @@ export declare const formItemGiProps: {
         labelTextAlignHorizontal: string;
     }, any>>;
     readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -90,15 +90,15 @@ export declare const formItemGiProps: {
         labelTextAlignHorizontal: string;
     }, any>>>;
     readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -168,15 +168,15 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
     readonly theme: import("vue").PropType<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -199,15 +199,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>>;
     readonly themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -230,15 +230,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>>>;
     readonly builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -277,6 +277,12 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: true;
     };
 }, {
+    formItemInstRef: import("vue").Ref<{
+        validate: import("./interface").FormItemValidate;
+        restoreValidation: () => void;
+        path?: string | undefined;
+        internalValidate: import("./interface").FormItemInternalValidate;
+    } | null>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -321,15 +327,15 @@ declare const _default: import("vue").DefineComponent<{
     size?: "small" | "medium" | "large" | undefined;
     path?: string | undefined;
     theme?: import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -352,15 +358,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any> | undefined;
     themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -383,15 +389,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>> | undefined;
     builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;

package/es/form/src/FormItemGridItem.js

@@ -24,6 +24,7 @@ export default defineComponent({
             }
         };
         return {
+            formItemInstRef,
             validate,
             restoreValidation
         };

package/es/form/src/FormItemRow.d.ts

@@ -28,15 +28,15 @@ declare const formItemRowProps: {
         readonly default: undefined;
     };
     theme: import("vue").PropType<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -59,15 +59,15 @@ declare const formItemRowProps: {
         labelTextAlignHorizontal: string;
     }, any>>;
     themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -90,15 +90,15 @@ declare const formItemRowProps: {
         labelTextAlignHorizontal: string;
     }, any>>>;
     builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -173,15 +173,15 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
     theme: import("vue").PropType<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -204,15 +204,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>>;
     themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -235,15 +235,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>>>;
     builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -288,6 +288,12 @@ declare const _default: import("vue").DefineComponent<{
     alignItems: StringConstructor;
     justifyContent: StringConstructor;
 }, {
+    formItemColInstRef: import("vue").Ref<{
+        validate: import("./interface").FormItemValidate;
+        restoreValidation: () => void;
+        path?: string | undefined;
+        internalValidate: import("./interface").FormItemInternalValidate;
+    } | null>;
     validate: import("./interface").FormItemValidate;
     restoreValidation: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
@@ -335,15 +341,15 @@ declare const _default: import("vue").DefineComponent<{
     justifyContent?: string | undefined;
     path?: string | undefined;
     theme?: import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -366,15 +372,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any> | undefined;
     themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;
@@ -397,15 +403,15 @@ declare const _default: import("vue").DefineComponent<{
         labelTextAlignHorizontal: string;
     }, any>> | undefined;
     builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Form", {
+        blankHeightSmall: string;
+        blankHeightMedium: string;
+        blankHeightLarge: string;
         lineHeight: string;
         labelTextColor: string;
         asteriskColor: string;
         feedbackTextColorError: string;
         feedbackTextColorWarning: string;
         feedbackTextColor: string;
-        blankHeightSmall: string;
-        blankHeightMedium: string;
-        blankHeightLarge: string;
         feedbackPadding: string;
         feedbackHeightSmall: string;
         feedbackHeightMedium: string;

package/es/form/src/FormItemRow.js

@@ -21,6 +21,7 @@ export default defineComponent({
             }
         };
         return {
+            formItemColInstRef,
             validate,
             restoreValidation
         };

package/es/form/src/styles/form-item.cssr.js

@@ -1,50 +1,50 @@
 import { cB, cE, cM } from '../../../_utils/cssr';
 import fadeDownTranstion from '../../../_styles/transitions/fade-down.cssr'; // vars:
-// --line-height
-// --blank-height
-// --feedback-padding
-// --feedback-font-size
-// --label-font-size-left
-// --label-font-size-top
-// --label-height
-// --label-padding
-// --asterisk-color
-// --label-text-color
-// --bezier
-// --feedback-text-color
-// --feedback-text-color-warning
-// --feedback-text-color-error
-// --label-text-align
-// --label-padding
+// --n-line-height
+// --n-blank-height
+// --n-feedback-padding
+// --n-feedback-font-size
+// --n-label-font-size-left
+// --n-label-font-size-top
+// --n-label-height
+// --n-label-padding
+// --n-asterisk-color
+// --n-label-text-color
+// --n-bezier
+// --n-feedback-text-color
+// --n-feedback-text-color-warning
+// --n-feedback-text-color-error
+// --n-label-text-align
+// --n-label-padding
 
 export default cB('form-item', {
   display: 'grid',
-  lineHeight: 'var(--line-height)'
+  lineHeight: 'var(--n-line-height)'
 }, [cB('form-item-label', `
  grid-area: label;
  align-items: center;
  line-height: 1.25;
- text-align: var(--label-text-align);
- font-size: var(--label-font-size);
- height: var(--label-height);
- padding: var(--label-padding);
- color: var(--label-text-color);
- transition: color .3s var(--bezier);
+ text-align: var(--n-label-text-align);
+ font-size: var(--n-label-font-size);
+ height: var(--n-label-height);
+ padding: var(--n-label-padding);
+ color: var(--n-label-text-color);
+ transition: color .3s var(--n-bezier);
  box-sizing: border-box;
  `, [cE('asterisk', `
- color: var(--asterisk-color);
- transition: color .3s var(--bezier);
+ color: var(--n-asterisk-color);
+ transition: color .3s var(--n-bezier);
  `)]), cB('form-item-blank', {
   gridArea: 'blank',
-  minHeight: 'var(--blank-height)'
+  minHeight: 'var(--n-blank-height)'
 }), cM('left-labelled', `
  grid-template-areas:
  "label blank"
  "label feedback";
  grid-template-columns: auto minmax(0, 1fr);
  `, [cB('form-item-label', `
- height: var(--blank-height);
- line-height: var(--blank-height);
+ height: var(--n-blank-height);
+ line-height: var(--n-blank-height);
  box-sizing: border-box;
  white-space: nowrap;
  flex-shrink: 0;
@@ -54,7 +54,7 @@ export default cB('form-item', {
  "label"
  "blank"
  "feedback";
- grid-template-rows: var(--label-height) 1fr;
+ grid-template-rows: var(--n-label-height) 1fr;
  grid-template-columns: minmax(0, 100%);
  `, [cM('no-label', `
  grid-template-areas:
@@ -64,7 +64,7 @@ export default cB('form-item', {
  `), cB('form-item-label', {
   display: 'flex',
   alignItems: 'flex-end',
-  justifyContent: 'var(--label-text-align)'
+  justifyContent: 'var(--n-label-text-align)'
 })]), cB('form-item-blank', `
  box-sizing: border-box;
  display: flex;
@@ -73,18 +73,18 @@ export default cB('form-item', {
  `), cB('form-item-feedback-wrapper', `
  grid-area: feedback;
  box-sizing: border-box;
- min-height: var(--feedback-height);
- font-size: var(--feedback-font-size);
- padding: var(--feedback-padding);
+ min-height: var(--n-feedback-height);
+ font-size: var(--n-feedback-font-size);
+ padding: var(--n-feedback-padding);
  line-height: 1.25;
  transform-origin: top left;
  `, [cB('form-item-feedback', {
-  transition: 'color .3s var(--bezier)',
-  color: 'var(--feedback-text-color)'
+  transition: 'color .3s var(--n-bezier)',
+  color: 'var(--n-feedback-text-color)'
 }, [cM('warning', {
-  color: 'var(--feedback-text-color-warning)'
+  color: 'var(--n-feedback-text-color-warning)'
 }), cM('error', {
-  color: 'var(--feedback-text-color-error)'
+  color: 'var(--n-feedback-text-color-error)'
 }), fadeDownTranstion({
   fromOffset: '-3px',
   enterDuration: '.3s',

package/es/form/styles/_common.d.ts

@@ -1,7 +1,4 @@
 declare const _default: {
-    blankHeightSmall: string;
-    blankHeightMedium: string;
-    blankHeightLarge: string;
     feedbackPadding: string;
     feedbackHeightSmall: string;
     feedbackHeightMedium: string;

package/es/form/styles/_common.js

@@ -1,7 +1,4 @@
 export default {
-    blankHeightSmall: '28px',
-    blankHeightMedium: '34px',
-    blankHeightLarge: '40px',
     feedbackPadding: '4px 0 0 2px',
     feedbackHeightSmall: '24px',
     feedbackHeightMedium: '24px',

package/es/form/styles/light.d.ts

@@ -1,15 +1,15 @@
 import type { ThemeCommonVars } from '../../_styles/common';
 import type { Theme } from '../../_mixins';
 export declare const self: (vars: ThemeCommonVars) => {
+    blankHeightSmall: string;
+    blankHeightMedium: string;
+    blankHeightLarge: string;
     lineHeight: string;
     labelTextColor: string;
     asteriskColor: string;
     feedbackTextColorError: string;
     feedbackTextColorWarning: string;
     feedbackTextColor: string;
-    blankHeightSmall: string;
-    blankHeightMedium: string;
-    blankHeightLarge: string;
     feedbackPadding: string;
     feedbackHeightSmall: string;
     feedbackHeightMedium: string;

package/es/form/styles/light.js

@@ -1,8 +1,8 @@
 import { commonLight } from '../../_styles/common';
 import commonVariables from './_common';
 export const self = (vars) => {
-    const { textColor1, errorColor, warningColor, lineHeight, textColor3 } = vars;
-    return Object.assign(Object.assign({}, commonVariables), { lineHeight, labelTextColor: textColor1, asteriskColor: errorColor, feedbackTextColorError: errorColor, feedbackTextColorWarning: warningColor, feedbackTextColor: textColor3 });
+    const { heightSmall, heightMedium, heightLarge, textColor1, errorColor, warningColor, lineHeight, textColor3 } = vars;
+    return Object.assign(Object.assign({}, commonVariables), { blankHeightSmall: heightSmall, blankHeightMedium: heightMedium, blankHeightLarge: heightLarge, lineHeight, labelTextColor: textColor1, asteriskColor: errorColor, feedbackTextColorError: errorColor, feedbackTextColorWarning: warningColor, feedbackTextColor: textColor3 });
 };
 const formLight = {
     name: 'Form',

package/es/gradient-text/src/GradientText.d.ts

@@ -115,11 +115,11 @@ declare const _default: import("vue").DefineComponent<{
     styleFontSize: import("vue").ComputedRef<string | number | undefined>;
     styleBgImage: import("vue").ComputedRef<string | undefined>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--rotate': string;
-        '--color-start': string;
-        '--color-end': string;
-        '--font-weight': string;
+        '--n-bezier': string;
+        '--n-rotate': string;
+        '--n-color-start': string;
+        '--n-color-end': string;
+        '--n-font-weight': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;

package/es/gradient-text/src/GradientText.js

@@ -48,11 +48,11 @@ export default defineComponent({
                 const { value: type } = compatibleTypeRef;
                 const { common: { cubicBezierEaseInOut }, self: { rotate, [createKey('colorStart', type)]: colorStart, [createKey('colorEnd', type)]: colorEnd, fontWeight } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--rotate': rotate,
-                    '--color-start': colorStart,
-                    '--color-end': colorEnd,
-                    '--font-weight': fontWeight
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-rotate': rotate,
+                    '--n-color-start': colorStart,
+                    '--n-color-end': colorEnd,
+                    '--n-font-weight': fontWeight
                 };
             })
         };

package/es/gradient-text/src/styles/index.cssr.js

@@ -1,19 +1,19 @@
 import { cB } from '../../../_utils/cssr'; // vars:
-// --font-weight
-// --rotate
-// --bezier
-// --color-start
-// --color-end
+// --n-font-weight
+// --n-rotate
+// --n-bezier
+// --n-color-start
+// --n-color-end
 
 export default cB('gradient-text', `
  display: inline-block;
- font-weight: var(--font-weight);
+ font-weight: var(--n-font-weight);
  -webkit-background-clip: text;
  background-clip: text;
  color: #0000;
  white-space: nowrap;
- background-image: linear-gradient(var(--rotate), var(--color-start) 0%, var(--color-end) 100%);
+ background-image: linear-gradient(var(--n-rotate), var(--n-color-start) 0%, var(--n-color-end) 100%);
  transition:
- --color-start .3s var(--bezier),
- --color-end .3s var(--bezier);
+ --n-color-start .3s var(--n-bezier),
+ --n-color-end .3s var(--n-bezier);
 `);

package/es/icon/src/Icon.d.ts

@@ -35,13 +35,13 @@ declare const _default: import("vue").DefineComponent<{
         color: string | undefined;
     }>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--color': string;
-        '--opacity': string;
+        '--n-bezier': string;
+        '--n-color': string;
+        '--n-opacity': string;
     } | {
-        '--bezier': string;
-        '--color'?: undefined;
-        '--opacity'?: undefined;
+        '--n-bezier': string;
+        '--n-color'?: undefined;
+        '--n-opacity'?: undefined;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     depth?: unknown;

package/es/icon/src/Icon.js

@@ -26,13 +26,13 @@ export default defineComponent({
                 if (depth !== undefined) {
                     const { color, [`opacity${depth}Depth`]: opacity } = self;
                     return {
-                        '--bezier': cubicBezierEaseInOut,
-                        '--color': color,
-                        '--opacity': opacity
+                        '--n-bezier': cubicBezierEaseInOut,
+                        '--n-color': color,
+                        '--n-opacity': opacity
                     };
                 }
                 return {
-                    '--bezier': cubicBezierEaseInOut
+                    '--n-bezier': cubicBezierEaseInOut
                 };
             })
         };