naive-ui 2.23.0 → 2.24.1

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

@@ -13,7 +13,7 @@ declare const formItemRowProps: {
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
     };
-    requireMarkPlacement: import("vue").PropType<"left" | "right">;
+    requireMarkPlacement: import("vue").PropType<"left" | "right" | "right-hanging">;
     showFeedback: {
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
@@ -27,16 +27,17 @@ declare const formItemRowProps: {
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
     };
+    labelProps: import("vue").PropType<import("vue").LabelHTMLAttributes>;
     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 +60,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 +91,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;
@@ -158,7 +159,7 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
     };
-    requireMarkPlacement: import("vue").PropType<"left" | "right">;
+    requireMarkPlacement: import("vue").PropType<"left" | "right" | "right-hanging">;
     showFeedback: {
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
@@ -172,16 +173,17 @@ declare const _default: import("vue").DefineComponent<{
         readonly type: import("vue").PropType<boolean | undefined>;
         readonly default: undefined;
     };
+    labelProps: import("vue").PropType<import("vue").LabelHTMLAttributes>;
     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 +206,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 +237,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 +290,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<{
@@ -309,6 +317,7 @@ declare const _default: import("vue").DefineComponent<{
     validationStatus?: unknown;
     feedback?: unknown;
     showLabel?: unknown;
+    labelProps?: unknown;
     theme?: unknown;
     themeOverrides?: unknown;
     builtinThemeOverrides?: unknown;
@@ -335,15 +344,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 +375,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 +406,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;
@@ -432,13 +441,14 @@ declare const _default: import("vue").DefineComponent<{
     labelStyle?: string | import("vue").CSSProperties | undefined;
     labelWidth?: string | number | undefined;
     showRequireMark?: boolean | undefined;
-    requireMarkPlacement?: "left" | "right" | undefined;
+    requireMarkPlacement?: "left" | "right" | "right-hanging" | undefined;
     showFeedback?: boolean | undefined;
     showLabel?: boolean | undefined;
     rulePath?: string | undefined;
     rule?: import("./interface").FormItemRule | import("./interface").FormItemRule[] | undefined;
     validationStatus?: "error" | "success" | "warning" | undefined;
     feedback?: string | undefined;
+    labelProps?: import("vue").LabelHTMLAttributes | undefined;
 }>, {
     push: import("../../legacy-grid/src/interface").Span;
     first: boolean;

package/lib/form/src/FormItemRow.js

@@ -42,6 +42,7 @@ exports.default = (0, vue_1.defineComponent)({
             }
         };
         return {
+            formItemColInstRef,
             validate,
             restoreValidation
         };

package/lib/form/src/interface.d.ts

@@ -1,4 +1,4 @@
-import { InjectionKey } from 'vue';
+import { InjectionKey, Ref } from 'vue';
 import { ValidateError, RuleItem, ValidateOption } from 'async-validator';
 import { FormSetupProps } from './Form';
 export interface FormRules {
@@ -32,7 +32,11 @@ export interface FormItemInst {
 }
 export declare type FormItemColRef = FormItemInst;
 export declare type FormItemRowRef = FormItemInst;
-export declare type FormInjection = FormSetupProps;
+export interface FormInjection {
+    props: FormSetupProps;
+    maxChildLabelWidthRef: Ref<number | undefined>;
+    deriveMaxChildLabelWidth: (currentWidth: number) => void;
+}
 export declare const formInjectionKey: InjectionKey<FormInjection>;
 export declare const formItemInstsInjectionKey: InjectionKey<unknown>;
 export declare type LabelAlign = 'left' | 'center' | 'right';

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

@@ -13,52 +13,54 @@ Object.defineProperty(exports, "__esModule", {
 const cssr_1 = require("../../../_utils/cssr");
 
 const fade_down_cssr_1 = __importDefault(require("../../../_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
 
 
 exports.default = (0, cssr_1.cB)('form-item', {
   display: 'grid',
-  lineHeight: 'var(--line-height)'
+  lineHeight: 'var(--n-line-height)'
 }, [(0, cssr_1.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;
  `, [(0, cssr_1.cE)('asterisk', `
- color: var(--asterisk-color);
- transition: color .3s var(--bezier);
+ color: var(--n-asterisk-color);
+ transition: color .3s var(--n-bezier);
+ `), (0, cssr_1.cE)('asterisk-placeholder', `
+ visibility: hidden; 
  `)]), (0, cssr_1.cB)('form-item-blank', {
   gridArea: 'blank',
-  minHeight: 'var(--blank-height)'
+  minHeight: 'var(--n-blank-height)'
 }), (0, cssr_1.cM)('left-labelled', `
  grid-template-areas:
  "label blank"
  "label feedback";
  grid-template-columns: auto minmax(0, 1fr);
  `, [(0, cssr_1.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;
@@ -68,7 +70,7 @@ exports.default = (0, cssr_1.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%);
  `, [(0, cssr_1.cM)('no-label', `
  grid-template-areas:
@@ -78,7 +80,7 @@ exports.default = (0, cssr_1.cB)('form-item', {
  `), (0, cssr_1.cB)('form-item-label', {
   display: 'flex',
   alignItems: 'flex-end',
-  justifyContent: 'var(--label-text-align)'
+  justifyContent: 'var(--n-label-text-align)'
 })]), (0, cssr_1.cB)('form-item-blank', `
  box-sizing: border-box;
  display: flex;
@@ -87,18 +89,18 @@ exports.default = (0, cssr_1.cB)('form-item', {
  `), (0, cssr_1.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;
  `, [(0, cssr_1.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)'
 }, [(0, cssr_1.cM)('warning', {
-  color: 'var(--feedback-text-color-warning)'
+  color: 'var(--n-feedback-text-color-warning)'
 }), (0, cssr_1.cM)('error', {
-  color: 'var(--feedback-text-color-error)'
+  color: 'var(--n-feedback-text-color-error)'
 }), (0, fade_down_cssr_1.default)({
   fromOffset: '-3px',
   enterDuration: '.3s',

package/lib/form/src/utils.d.ts

@@ -6,11 +6,11 @@ export declare function formItemSize(props: FormItemSetupProps): {
 };
 export declare function formItemMisc(props: FormItemSetupProps): {
     validationErrored: import("vue").Ref<boolean>;
-    mergedLabelStyle: ComputedRef<(string | import("vue").CSSProperties | undefined)[]>;
+    mergedLabelStyle: ComputedRef<(import("vue").StyleValue | undefined)[]>;
     mergedLabelPlacement: ComputedRef<import("./interface").LabelPlacement>;
     mergedLabelAlign: ComputedRef<import("./interface").LabelAlign | undefined>;
     mergedShowRequireMark: ComputedRef<boolean | undefined>;
-    mergedRequireMarkPlacement: ComputedRef<"left" | "right" | undefined>;
+    mergedRequireMarkPlacement: ComputedRef<"left" | "right" | "right-hanging">;
     mergedValidationStatus: ComputedRef<"error" | "success" | "warning" | undefined>;
     mergedShowFeedback: ComputedRef<boolean>;
     mergedShowLabel: ComputedRef<boolean>;

package/lib/form/src/utils.js

@@ -11,8 +11,8 @@ function formItemSize(props) {
         mergedSize: (0, vue_1.computed)(() => {
             if (props.size !== undefined)
                 return props.size;
-            if ((NForm === null || NForm === void 0 ? void 0 : NForm.size) !== undefined)
-                return NForm.size;
+            if ((NForm === null || NForm === void 0 ? void 0 : NForm.props.size) !== undefined)
+                return NForm.props.size;
             return 'medium';
         })
     };
@@ -25,11 +25,20 @@ function formItemMisc(props) {
         if (mergedLabelPlacementRef.value === 'top')
             return;
         const { labelWidth } = props;
-        if (labelWidth !== undefined) {
+        if (labelWidth !== undefined && labelWidth !== 'auto') {
             return (0, _utils_1.formatLength)(labelWidth);
         }
-        if ((NForm === null || NForm === void 0 ? void 0 : NForm.labelWidth) !== undefined) {
-            return (0, _utils_1.formatLength)(NForm.labelWidth);
+        if (labelWidth === 'auto' || (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelWidth) === 'auto') {
+            const autoComputedWidth = NForm === null || NForm === void 0 ? void 0 : NForm.maxChildLabelWidthRef.value;
+            if (autoComputedWidth !== undefined) {
+                return (0, _utils_1.formatLength)(autoComputedWidth);
+            }
+            else {
+                return undefined;
+            }
+        }
+        if ((NForm === null || NForm === void 0 ? void 0 : NForm.props.labelWidth) !== undefined) {
+            return (0, _utils_1.formatLength)(NForm.props.labelWidth);
         }
         return undefined;
     });
@@ -37,37 +46,39 @@ function formItemMisc(props) {
         const { labelPlacement } = props;
         if (labelPlacement !== undefined)
             return labelPlacement;
-        if (NForm === null || NForm === void 0 ? void 0 : NForm.labelPlacement)
-            return NForm.labelPlacement;
+        if (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelPlacement)
+            return NForm.props.labelPlacement;
         return 'top';
     });
     const mergedLabelAlignRef = (0, vue_1.computed)(() => {
         const { labelAlign } = props;
         if (labelAlign)
             return labelAlign;
-        if (NForm === null || NForm === void 0 ? void 0 : NForm.labelAlign)
-            return NForm.labelAlign;
+        if (NForm === null || NForm === void 0 ? void 0 : NForm.props.labelAlign)
+            return NForm.props.labelAlign;
         return undefined;
     });
     const mergedLabelStyleRef = (0, vue_1.computed)(() => {
+        var _a;
         return [
+            (_a = props.labelProps) === null || _a === void 0 ? void 0 : _a.style,
+            props.labelStyle,
             {
                 width: mergedLabelWidthRef.value
-            },
-            props.labelStyle
+            }
         ];
     });
     const mergedShowRequireMarkRef = (0, vue_1.computed)(() => {
         const { showRequireMark } = props;
         if (showRequireMark !== undefined)
             return showRequireMark;
-        return NForm === null || NForm === void 0 ? void 0 : NForm.showRequireMark;
+        return NForm === null || NForm === void 0 ? void 0 : NForm.props.showRequireMark;
     });
     const mergedRequireMarkPlacementRef = (0, vue_1.computed)(() => {
         const { requireMarkPlacement } = props;
         if (requireMarkPlacement !== undefined)
             return requireMarkPlacement;
-        return NForm === null || NForm === void 0 ? void 0 : NForm.requireMarkPlacement;
+        return (NForm === null || NForm === void 0 ? void 0 : NForm.props.requireMarkPlacement) || 'right';
     });
     const validationErroredRef = (0, vue_1.ref)(false);
     const mergedValidationStatusRef = (0, vue_1.computed)(() => {
@@ -82,16 +93,16 @@ function formItemMisc(props) {
         const { showFeedback } = props;
         if (showFeedback !== undefined)
             return showFeedback;
-        if ((NForm === null || NForm === void 0 ? void 0 : NForm.showFeedback) !== undefined)
-            return NForm.showFeedback;
+        if ((NForm === null || NForm === void 0 ? void 0 : NForm.props.showFeedback) !== undefined)
+            return NForm.props.showFeedback;
         return true;
     });
     const mergedShowLabelRef = (0, vue_1.computed)(() => {
         const { showLabel } = props;
         if (showLabel !== undefined)
             return showLabel;
-        if ((NForm === null || NForm === void 0 ? void 0 : NForm.showLabel) !== undefined)
-            return NForm.showLabel;
+        if ((NForm === null || NForm === void 0 ? void 0 : NForm.props.showLabel) !== undefined)
+            return NForm.props.showLabel;
         return true;
     });
     return {
@@ -129,7 +140,7 @@ function formItemRule(props) {
                 rules.push(rule);
         }
         if (NForm) {
-            const { rules: formRules } = NForm;
+            const { rules: formRules } = NForm.props;
             const { value: rulePath } = compatibleRulePathRef;
             if (formRules !== undefined && rulePath !== undefined) {
                 const formRule = (0, lodash_1.get)(formRules, rulePath);

package/lib/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/lib/form/styles/_common.js

@@ -1,9 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = {
-    blankHeightSmall: '28px',
-    blankHeightMedium: '34px',
-    blankHeightLarge: '40px',
     feedbackPadding: '4px 0 0 2px',
     feedbackHeightSmall: '24px',
     feedbackHeightMedium: '24px',

package/lib/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/lib/form/styles/light.js

@@ -7,8 +7,8 @@ exports.self = void 0;
 const common_1 = require("../../_styles/common");
 const _common_1 = __importDefault(require("./_common"));
 const self = (vars) => {
-    const { textColor1, errorColor, warningColor, lineHeight, textColor3 } = vars;
-    return Object.assign(Object.assign({}, _common_1.default), { 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({}, _common_1.default), { blankHeightSmall: heightSmall, blankHeightMedium: heightMedium, blankHeightLarge: heightLarge, lineHeight, labelTextColor: textColor1, asteriskColor: errorColor, feedbackTextColorError: errorColor, feedbackTextColorWarning: warningColor, feedbackTextColor: textColor3 });
 };
 exports.self = self;
 const formLight = {

package/lib/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/lib/gradient-text/src/GradientText.js

@@ -53,11 +53,11 @@ exports.default = (0, vue_1.defineComponent)({
                 const { value: type } = compatibleTypeRef;
                 const { common: { cubicBezierEaseInOut }, self: { rotate, [(0, _utils_1.createKey)('colorStart', type)]: colorStart, [(0, _utils_1.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/lib/gradient-text/src/styles/index.cssr.js

@@ -5,22 +5,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars:
-// --font-weight
-// --rotate
-// --bezier
-// --color-start
-// --color-end
+// --n-font-weight
+// --n-rotate
+// --n-bezier
+// --n-color-start
+// --n-color-end
 
 
 exports.default = (0, cssr_1.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/lib/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;