naive-ui 2.23.1 → 2.24.2

package/lib/progress/src/styles/index.cssr.js

@@ -5,27 +5,27 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars
-// --bezier
-// --fill-color
-// --font-size
-// --font-size-circle
-// --font-weight-circle
-// --icon-color
-// --icon-size-circle
-// --icon-size-line
-// --line-bg-processing
-// --rail-color
-// --rail-height
-// --text-color-circle
-// --text-color-line-inner
-// --text-color-line-outer
+// --n-bezier
+// --n-fill-color
+// --n-font-size
+// --n-font-size-circle
+// --n-font-weight-circle
+// --n-icon-color
+// --n-icon-size-circle
+// --n-icon-size-line
+// --n-line-bg-processing
+// --n-rail-color
+// --n-rail-height
+// --n-text-color-circle
+// --n-text-color-line-inner
+// --n-text-color-line-outer
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
   display: 'inline-block'
 }, [(0, cssr_1.cB)('progress-icon', `
- color: var(--icon-color);
- transition: color .3s var(--bezier);
+ color: var(--n-icon-color);
+ transition: color .3s var(--n-bezier);
  `), (0, cssr_1.cM)('line', `
  width: 100%;
  display: block;
@@ -39,16 +39,16 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
 }), (0, cssr_1.cB)('progress-icon', `
  width: 30px;
  padding-left: 14px;
- height: var(--icon-size-line);
- line-height: var(--icon-size-line);
- font-size: var(--icon-size-line);
+ height: var(--n-icon-size-line);
+ line-height: var(--n-icon-size-line);
+ font-size: var(--n-icon-size-line);
  `, [(0, cssr_1.cM)('as-text', `
- color: var(--text-color-line-outer);
+ color: var(--n-text-color-line-outer);
  text-align: center;
  width: 40px;
- font-size: var(--font-size);
+ font-size: var(--n-font-size);
  padding-left: 4px;
- transition: color .3s var(--bezier);
+ transition: color .3s var(--n-bezier);
  `)])]), (0, cssr_1.cM)('circle', {
   width: '120px'
 }, [(0, cssr_1.cB)('progress-custom-content', `
@@ -67,10 +67,10 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
  display: flex;
  align-items: center;
  color: inherit;
- font-size: var(--font-size-circle);
- color: var(--text-color-circle);
- font-weight: var(--font-weight-circle);
- transition: color .3s var(--bezier);
+ font-size: var(--n-font-size-circle);
+ color: var(--n-text-color-circle);
+ font-weight: var(--n-font-weight-circle);
+ transition: color .3s var(--n-bezier);
  white-space: nowrap;
  `), (0, cssr_1.cB)('progress-icon', `
  position: absolute;
@@ -79,14 +79,14 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  align-items: center;
- color: var(--icon-color);
- font-size: var(--icon-size-circle);
- `)]), (0, cssr_1.cM)('multiple-circle', {
-  width: '200px',
-  color: 'inherit'
-}, [(0, cssr_1.cB)('progress-text', `
- font-weight: var(--font-weight-circle);
- color: var(--text-color-circle);
+ color: var(--n-icon-color);
+ font-size: var(--n-icon-size-circle);
+ `)]), (0, cssr_1.cM)('multiple-circle', `
+ width: 200px;
+ color: inherit;
+ `, [(0, cssr_1.cB)('progress-text', `
+ font-weight: var(--n-font-weight-circle);
+ color: var(--n-text-color-circle);
  position: absolute;
  left: 50%;
  top: 50%;
@@ -94,7 +94,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
  display: flex;
  align-items: center;
  justify-content: center;
- transition: color .3s var(--bezier);
+ transition: color .3s var(--n-bezier);
  `)]), (0, cssr_1.cB)('progress-content', {
   position: 'relative'
 }), (0, cssr_1.cB)('progress-graph', {
@@ -102,43 +102,43 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
 }, [(0, cssr_1.cB)('progress-graph-circle', [(0, cssr_1.c)('svg', {
   verticalAlign: 'bottom'
 }), (0, cssr_1.cB)('progress-graph-circle-fill', `
- stroke: var(--fill-color);
+ stroke: var(--n-fill-color);
  transition:
- opacity .3s var(--bezier),
- stroke .3s var(--bezier),
- stroke-dasharray .3s var(--bezier);
+ opacity .3s var(--n-bezier),
+ stroke .3s var(--n-bezier),
+ stroke-dasharray .3s var(--n-bezier);
  `, [(0, cssr_1.cM)('empty', {
   opacity: 0
 })]), (0, cssr_1.cB)('progress-graph-circle-rail', `
- transition: stroke .3s var(--bezier);
+ transition: stroke .3s var(--n-bezier);
  overflow: hidden;
- stroke: var(--rail-color);
- `)]), (0, cssr_1.cB)('progress-graph-line', [(0, cssr_1.cM)('indicator-inside', [(0, cssr_1.cB)('progress-graph-line-rail', {
-  height: '16px',
-  borderRadius: '10px'
-}, [(0, cssr_1.cB)('progress-graph-line-fill', {
-  height: 'inherit',
-  borderRadius: '10px'
-}), (0, cssr_1.cB)('progress-graph-line-indicator', `
+ stroke: var(--n-rail-color);
+ `)]), (0, cssr_1.cB)('progress-graph-line', [(0, cssr_1.cM)('indicator-inside', [(0, cssr_1.cB)('progress-graph-line-rail', `
+ height: 16px;
+ line-height: 16px;
+ border-radius: 10px;
+ `, [(0, cssr_1.cB)('progress-graph-line-fill', `
+ height: inherit;
+ border-radius: 10px;
+ `), (0, cssr_1.cB)('progress-graph-line-indicator', `
  background: #0000;
  white-space: nowrap;
  text-align: right;
  margin-left: 14px;
  margin-right: 14px;
  height: inherit;
- line-height: 16px;
  font-size: 12px;
- color: var(--text-color-line-inner);
- transition: color .3s var(--bezier);
+ color: var(--n-text-color-line-inner);
+ transition: color .3s var(--n-bezier);
  `)])]), (0, cssr_1.cM)('indicator-inside-label', `
  height: 16px;
  display: flex;
  align-items: center;
- `, [(0, cssr_1.cB)('progress-graph-line-rail', {
-  flex: 1,
-  transition: 'background-color .3s var(--bezier)'
-}), (0, cssr_1.cB)('progress-graph-line-indicator', `
- background: var(--fill-color);
+ `, [(0, cssr_1.cB)('progress-graph-line-rail', `
+ flex: 1;
+ transition: background-color .3s var(--n-bezier);
+ `), (0, cssr_1.cB)('progress-graph-line-indicator', `
+ background: var(--n-fill-color);
  font-size: 12px;
  transform: translateZ(0);
  display: flex;
@@ -149,32 +149,32 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.cB)('progress', {
  border-radius: 10px;
  position: absolute;
  white-space: nowrap;
- color: var(--text-color-line-inner);
+ color: var(--n-text-color-line-inner);
  transition:
- right .2s var(--bezier),
- color .3s var(--bezier),
- background-color .3s var(--bezier);
+ right .2s var(--n-bezier),
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
  `)]), (0, cssr_1.cB)('progress-graph-line-rail', `
  position: relative;
  overflow: hidden;
- height: var(--rail-height);
+ height: var(--n-rail-height);
  border-radius: 5px;
- background-color: var(--rail-color);
- transition: background-color .3s var(--bezier);
+ background-color: var(--n-rail-color);
+ transition: background-color .3s var(--n-bezier);
  `, [(0, cssr_1.cB)('progress-graph-line-fill', `
- background: var(--fill-color);
+ background: var(--n-fill-color);
  position: relative;
  border-radius: 5px;
  height: inherit;
  width: 100%;
  max-width: 0%;
  transition:
- background-color .3s var(--bezier),
- max-width .2s var(--bezier);
+ background-color .3s var(--n-bezier),
+ max-width .2s var(--n-bezier);
  `, [(0, cssr_1.cM)('processing', [(0, cssr_1.c)('&::after', `
  content: "";
- background-image: var(--line-bg-processing);
- animation: progress-processing-animation 2s var(--bezier) infinite;
+ background-image: var(--n-line-bg-processing);
+ animation: progress-processing-animation 2s var(--n-bezier) infinite;
  `)])])])])])]), (0, cssr_1.c)('@keyframes progress-processing-animation', `
  0% {
  position: absolute;

package/lib/radio/src/Radio.d.ts

@@ -134,44 +134,46 @@ declare const _default: import("vue").DefineComponent<{
     }, any>>>;
 }, import("./use-radio").UseRadio & {
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--box-shadow': string;
-        '--box-shadow-active': string;
-        '--box-shadow-disabled': string;
-        '--box-shadow-focus': string;
-        '--box-shadow-hover': string;
-        '--color': string;
-        '--color-disabled': string;
-        '--dot-color-active': string;
-        '--dot-color-disabled': string;
-        '--font-size': string;
-        '--radio-size': string;
-        '--text-color': string;
-        '--text-color-disabled': string;
-        '--label-padding': string;
+        '--n-bezier': string;
+        '--n-box-shadow': string;
+        '--n-box-shadow-active': string;
+        '--n-box-shadow-disabled': string;
+        '--n-box-shadow-focus': string;
+        '--n-box-shadow-hover': string;
+        '--n-color': string;
+        '--n-color-disabled': string;
+        '--n-dot-color-active': string;
+        '--n-dot-color-disabled': string;
+        '--n-font-size': string;
+        '--n-radio-size': string;
+        '--n-text-color': string;
+        '--n-text-color-disabled': string;
+        '--n-label-padding': string;
     }>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    name?: unknown;
-    value?: unknown;
-    checked?: unknown;
-    defaultChecked?: unknown;
-    disabled?: unknown;
-    size?: unknown;
-    onUpdateChecked?: unknown;
-    'onUpdate:checked'?: unknown;
-    checkedValue?: unknown;
-    theme?: unknown;
-    themeOverrides?: unknown;
-    builtinThemeOverrides?: unknown;
-} & {
-    value: string | number;
-    defaultChecked: boolean;
-} & {
-    name?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    disabled?: boolean | undefined;
-    checked?: boolean | undefined;
-    theme?: import("../../_mixins").Theme<"Radio", {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    name: StringConstructor;
+    value: {
+        readonly type: import("vue").PropType<string | number>;
+        readonly default: "on";
+    };
+    checked: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly default: undefined;
+    };
+    defaultChecked: BooleanConstructor;
+    disabled: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly default: undefined;
+    };
+    size: import("vue").PropType<"small" | "medium" | "large">;
+    onUpdateChecked: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
+    'onUpdate:checked': import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
+    checkedValue: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+    theme: import("vue").PropType<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -206,8 +208,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
+    }, any>>;
+    themeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -242,8 +244,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
+    }, any>>>;
+    builtinThemeOverrides: import("vue").PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -278,11 +280,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any>> | undefined;
-    "onUpdate:checked"?: import("../../_utils").MaybeArray<(value: boolean) => void> | undefined;
-    onUpdateChecked?: import("../../_utils").MaybeArray<(value: boolean) => void> | undefined;
-    checkedValue?: boolean | undefined;
-}>, {
+    }, any>>>;
+}>>, {
     value: string | number;
     disabled: boolean | undefined;
     checked: boolean | undefined;

package/lib/radio/src/Radio.js

@@ -20,21 +20,21 @@ exports.default = (0, vue_1.defineComponent)({
                 const { mergedSize: { value: size } } = radio;
                 const { common: { cubicBezierEaseInOut }, self: { boxShadow, boxShadowActive, boxShadowDisabled, boxShadowFocus, boxShadowHover, color, colorDisabled, textColor, textColorDisabled, dotColorActive, dotColorDisabled, labelPadding, [(0, _utils_1.createKey)('fontSize', size)]: fontSize, [(0, _utils_1.createKey)('radioSize', size)]: radioSize } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--box-shadow': boxShadow,
-                    '--box-shadow-active': boxShadowActive,
-                    '--box-shadow-disabled': boxShadowDisabled,
-                    '--box-shadow-focus': boxShadowFocus,
-                    '--box-shadow-hover': boxShadowHover,
-                    '--color': color,
-                    '--color-disabled': colorDisabled,
-                    '--dot-color-active': dotColorActive,
-                    '--dot-color-disabled': dotColorDisabled,
-                    '--font-size': fontSize,
-                    '--radio-size': radioSize,
-                    '--text-color': textColor,
-                    '--text-color-disabled': textColorDisabled,
-                    '--label-padding': labelPadding
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-box-shadow': boxShadow,
+                    '--n-box-shadow-active': boxShadowActive,
+                    '--n-box-shadow-disabled': boxShadowDisabled,
+                    '--n-box-shadow-focus': boxShadowFocus,
+                    '--n-box-shadow-hover': boxShadowHover,
+                    '--n-color': color,
+                    '--n-color-disabled': colorDisabled,
+                    '--n-dot-color-active': dotColorActive,
+                    '--n-dot-color-disabled': dotColorDisabled,
+                    '--n-font-size': fontSize,
+                    '--n-radio-size': radioSize,
+                    '--n-text-color': textColor,
+                    '--n-text-color-disabled': textColorDisabled,
+                    '--n-label-padding': labelPadding
                 };
             })
         });

package/lib/radio/src/RadioButton.d.ts

@@ -24,28 +24,30 @@ declare const _default: import("vue").DefineComponent<{
         readonly validator: () => boolean;
         readonly default: undefined;
     };
-}, import("./use-radio").UseRadio, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly name?: unknown;
-    readonly value?: unknown;
-    readonly checked?: unknown;
-    readonly defaultChecked?: unknown;
-    readonly disabled?: unknown;
-    readonly size?: unknown;
-    readonly onUpdateChecked?: unknown;
-    readonly 'onUpdate:checked'?: unknown;
-    readonly checkedValue?: unknown;
-} & {
-    value: string | number;
-    defaultChecked: boolean;
-} & {
-    name?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    disabled?: boolean | undefined;
-    checked?: boolean | undefined;
-    "onUpdate:checked"?: import("../../_utils").MaybeArray<(value: boolean) => void> | undefined;
-    onUpdateChecked?: import("../../_utils").MaybeArray<(value: boolean) => void> | undefined;
-    checkedValue?: boolean | undefined;
-}>, {
+}, import("./use-radio").UseRadio, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly name: StringConstructor;
+    readonly value: {
+        readonly type: import("vue").PropType<string | number>;
+        readonly default: "on";
+    };
+    readonly checked: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly default: undefined;
+    };
+    readonly defaultChecked: BooleanConstructor;
+    readonly disabled: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly default: undefined;
+    };
+    readonly size: import("vue").PropType<"small" | "medium" | "large">;
+    readonly onUpdateChecked: import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
+    readonly 'onUpdate:checked': import("vue").PropType<import("../../_utils").MaybeArray<(value: boolean) => void> | undefined>;
+    readonly checkedValue: {
+        readonly type: import("vue").PropType<boolean | undefined>;
+        readonly validator: () => boolean;
+        readonly default: undefined;
+    };
+}>>, {
     value: string | number;
     disabled: boolean | undefined;
     checked: boolean | undefined;

package/lib/radio/src/RadioGroup.d.ts

@@ -254,40 +254,36 @@ declare const _default: import("vue").DefineComponent<{
     handleFocusout: (e: FocusEvent) => void;
     handleFocusin: (e: FocusEvent) => void;
     cssVars: import("vue").ComputedRef<{
-        '--font-size': string;
-        '--bezier': string;
-        '--button-border-color': string;
-        '--button-border-color-active': string;
-        '--button-border-radius': string;
-        '--button-box-shadow': string;
-        '--button-box-shadow-focus': string;
-        '--button-box-shadow-hover': string;
-        '--button-color-active': string;
-        '--button-text-color': string;
-        '--button-text-color-hover': string;
-        '--button-text-color-active': string;
-        '--height': string;
-        '--opacity-disabled': string;
+        '--n-font-size': string;
+        '--n-bezier': string;
+        '--n-button-border-color': string;
+        '--n-button-border-color-active': string;
+        '--n-button-border-radius': string;
+        '--n-button-box-shadow': string;
+        '--n-button-box-shadow-focus': string;
+        '--n-button-box-shadow-hover': string;
+        '--n-button-color-active': string;
+        '--n-button-text-color': string;
+        '--n-button-text-color-hover': string;
+        '--n-button-text-color-active': string;
+        '--n-height': string;
+        '--n-opacity-disabled': string;
     }>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
-    readonly name?: unknown;
-    readonly value?: unknown;
-    readonly defaultValue?: unknown;
-    readonly size?: unknown;
-    readonly disabled?: unknown;
-    readonly 'onUpdate:value'?: unknown;
-    readonly onUpdateValue?: unknown;
-    readonly theme?: unknown;
-    readonly themeOverrides?: unknown;
-    readonly builtinThemeOverrides?: unknown;
-} & {
-    defaultValue: string | number | null;
-} & {
-    value?: string | number | null | undefined;
-    name?: string | undefined;
-    size?: "small" | "medium" | "large" | undefined;
-    disabled?: boolean | undefined;
-    theme?: import("../../_mixins").Theme<"Radio", {
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly name: StringConstructor;
+    readonly value: PropType<string | number | null>;
+    readonly defaultValue: {
+        readonly type: PropType<string | number | null>;
+        readonly default: null;
+    };
+    readonly size: PropType<"small" | "medium" | "large">;
+    readonly disabled: {
+        readonly type: PropType<boolean | undefined>;
+        readonly default: undefined;
+    };
+    readonly 'onUpdate:value': PropType<MaybeArray<OnUpdateValue>>;
+    readonly onUpdateValue: PropType<MaybeArray<OnUpdateValue>>;
+    readonly theme: PropType<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -322,8 +318,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any> | undefined;
-    themeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
+    }, any>>;
+    readonly themeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -358,8 +354,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any>> | undefined;
-    builtinThemeOverrides?: import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
+    }, any>>>;
+    readonly builtinThemeOverrides: PropType<import("../../_mixins/use-theme").ExtractThemeOverrides<import("../../_mixins").Theme<"Radio", {
         buttonHeightSmall: string;
         buttonHeightMedium: string;
         buttonHeightLarge: string;
@@ -394,10 +390,8 @@ declare const _default: import("vue").DefineComponent<{
         radioSizeMedium: string;
         radioSizeLarge: string;
         labelPadding: string;
-    }, any>> | undefined;
-    "onUpdate:value"?: MaybeArray<OnUpdateValue> | undefined;
-    onUpdateValue?: MaybeArray<OnUpdateValue> | undefined;
-}>, {
+    }, any>>>;
+}>>, {
     disabled: boolean | undefined;
     defaultValue: string | number | null;
 }>;

package/lib/radio/src/RadioGroup.js

@@ -131,20 +131,20 @@ exports.default = (0, vue_1.defineComponent)({
                 const { value: size } = mergedSizeRef;
                 const { common: { cubicBezierEaseInOut }, self: { buttonBorderColor, buttonBorderColorActive, buttonBorderRadius, buttonBoxShadow, buttonBoxShadowFocus, buttonBoxShadowHover, buttonColorActive, buttonTextColor, buttonTextColorActive, buttonTextColorHover, opacityDisabled, [(0, _utils_1.createKey)('buttonHeight', size)]: height, [(0, _utils_1.createKey)('fontSize', size)]: fontSize } } = themeRef.value;
                 return {
-                    '--font-size': fontSize,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--button-border-color': buttonBorderColor,
-                    '--button-border-color-active': buttonBorderColorActive,
-                    '--button-border-radius': buttonBorderRadius,
-                    '--button-box-shadow': buttonBoxShadow,
-                    '--button-box-shadow-focus': buttonBoxShadowFocus,
-                    '--button-box-shadow-hover': buttonBoxShadowHover,
-                    '--button-color-active': buttonColorActive,
-                    '--button-text-color': buttonTextColor,
-                    '--button-text-color-hover': buttonTextColorHover,
-                    '--button-text-color-active': buttonTextColorActive,
-                    '--height': height,
-                    '--opacity-disabled': opacityDisabled
+                    '--n-font-size': fontSize,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-button-border-color': buttonBorderColor,
+                    '--n-button-border-color-active': buttonBorderColorActive,
+                    '--n-button-border-radius': buttonBorderRadius,
+                    '--n-button-box-shadow': buttonBoxShadow,
+                    '--n-button-box-shadow-focus': buttonBoxShadowFocus,
+                    '--n-button-box-shadow-hover': buttonBoxShadowHover,
+                    '--n-button-color-active': buttonColorActive,
+                    '--n-button-text-color': buttonTextColor,
+                    '--n-button-text-color-hover': buttonTextColorHover,
+                    '--n-button-text-color-active': buttonTextColorActive,
+                    '--n-height': height,
+                    '--n-opacity-disabled': opacityDisabled
                 };
             })
         };