naive-ui 2.22.0 → 2.23.0

package/lib/_internal/scrollbar/src/ScrollBar.d.ts

@@ -49,10 +49,6 @@ declare const scrollbarProps: {
         readonly type: BooleanConstructor;
         readonly default: false;
     };
-    readonly showScrollbar: {
-        readonly type: BooleanConstructor;
-        readonly default: true;
-    };
     readonly container: PropType<() => HTMLElement | null | undefined>;
     readonly content: PropType<() => HTMLElement | null | undefined>;
     readonly containerClass: StringConstructor;
@@ -97,10 +93,6 @@ declare const Scrollbar: import("vue").DefineComponent<{
         readonly type: BooleanConstructor;
         readonly default: false;
     };
-    readonly showScrollbar: {
-        readonly type: BooleanConstructor;
-        readonly default: true;
-    };
     readonly container: PropType<() => HTMLElement | null | undefined>;
     readonly content: PropType<() => HTMLElement | null | undefined>;
     readonly containerClass: StringConstructor;
@@ -164,7 +156,6 @@ declare const Scrollbar: import("vue").DefineComponent<{
     readonly duration?: unknown;
     readonly scrollable?: unknown;
     readonly xScrollable?: unknown;
-    readonly showScrollbar?: unknown;
     readonly container?: unknown;
     readonly content?: unknown;
     readonly containerClass?: unknown;
@@ -183,7 +174,6 @@ declare const Scrollbar: import("vue").DefineComponent<{
 } & {
     size: number;
     duration: number;
-    showScrollbar: boolean;
     scrollable: boolean;
     xScrollable: boolean;
 } & {
@@ -214,7 +204,6 @@ declare const Scrollbar: import("vue").DefineComponent<{
 }>, {
     size: number;
     duration: number;
-    showScrollbar: boolean;
     scrollable: boolean;
     xScrollable: boolean;
 }>;

package/lib/_internal/scrollbar/src/ScrollBar.js

@@ -23,9 +23,6 @@ const scrollbarProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props)
     }, xScrollable: {
         type: Boolean,
         default: false
-    }, showScrollbar: {
-        type: Boolean,
-        default: true
     }, 
     // If container is set, resize observer won't not attached
     container: Function, content: Function, containerClass: String, containerStyle: [String, Object], contentClass: String, contentStyle: [String, Object], horizontalRailStyle: [String, Object], verticalRailStyle: [String, Object], onScroll: Function, onWheel: Function, onResize: Function, internalOnUpdateScrollLeft: Function });
@@ -479,7 +476,7 @@ const Scrollbar = (0, vue_1.defineComponent)({
         };
     },
     render() {
-        const { $slots, mergedClsPrefix, showScrollbar } = this;
+        const { $slots, mergedClsPrefix } = this;
         if (!this.scrollable)
             return (0, vue_1.renderSlot)($slots, 'default');
         const createChildren = () => (0, vue_1.h)('div', (0, vue_1.mergeProps)(this.$attrs, {
@@ -504,20 +501,20 @@ const Scrollbar = (0, vue_1.defineComponent)({
                             this.contentClass
                         ] }, $slots))
                 }))),
-            showScrollbar && ((0, vue_1.h)("div", { ref: "yRailRef", class: `${mergedClsPrefix}-scrollbar-rail ${mergedClsPrefix}-scrollbar-rail--vertical`, style: [this.horizontalRailStyle] },
+            (0, vue_1.h)("div", { ref: "yRailRef", class: `${mergedClsPrefix}-scrollbar-rail ${mergedClsPrefix}-scrollbar-rail--vertical`, style: [this.horizontalRailStyle] },
                 (0, vue_1.h)(vue_1.Transition, { name: "fade-in-transition" }, {
                     default: () => this.needYBar && this.isShowYBar && !this.isIos ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-scrollbar-rail__scrollbar`, style: {
                             height: this.yBarSizePx,
                             top: this.yBarTopPx
                         }, onMousedown: this.handleYScrollMouseDown })) : null
-                }))),
-            showScrollbar && ((0, vue_1.h)("div", { ref: "xRailRef", class: `${mergedClsPrefix}-scrollbar-rail ${mergedClsPrefix}-scrollbar-rail--horizontal`, style: [this.verticalRailStyle] },
+                })),
+            (0, vue_1.h)("div", { ref: "xRailRef", class: `${mergedClsPrefix}-scrollbar-rail ${mergedClsPrefix}-scrollbar-rail--horizontal`, style: [this.verticalRailStyle] },
                 (0, vue_1.h)(vue_1.Transition, { name: "fade-in-transition" }, {
                     default: () => this.needXBar && this.isShowXBar && !this.isIos ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-scrollbar-rail__scrollbar`, style: {
                             width: this.xBarSizePx,
                             left: this.xBarLeftPx
                         }, onMousedown: this.handleXScrollMouseDown })) : null
-                })))
+                }))
         ]);
         return this.container ? (createChildren()) : ((0, vue_1.h)(vueuc_1.VResizeObserver, { onResize: this.handleContainerResize }, {
             default: createChildren

package/lib/badge/src/Badge.d.ts

@@ -111,12 +111,12 @@ declare const _default: import("vue").DefineComponent<{
     handleAfterEnter: () => void;
     handleAfterLeave: () => void;
     cssVars: import("vue").ComputedRef<{
-        '--font-size': string;
-        '--font-family': string;
-        '--color': string;
-        '--ripple-color': string;
-        '--bezier': string;
-        '--ripple-bezier': string;
+        '--n-font-size': string;
+        '--n-font-family': string;
+        '--n-color': string;
+        '--n-ripple-color': string;
+        '--n-bezier': string;
+        '--n-ripple-bezier': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly value?: unknown;

package/lib/badge/src/Badge.js

@@ -57,12 +57,12 @@ exports.default = (0, vue_1.defineComponent)({
                 const { type, color: propColor } = props;
                 const { common: { cubicBezierEaseInOut, cubicBezierEaseOut }, self: { [(0, _utils_1.createKey)('color', type)]: color, fontFamily, fontSize } } = themeRef.value;
                 return {
-                    '--font-size': fontSize,
-                    '--font-family': fontFamily,
-                    '--color': propColor || color,
-                    '--ripple-color': propColor || color,
-                    '--bezier': cubicBezierEaseInOut,
-                    '--ripple-bezier': cubicBezierEaseOut
+                    '--n-font-size': fontSize,
+                    '--n-font-family': fontFamily,
+                    '--n-color': propColor || color,
+                    '--n-ripple-color': propColor || color,
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-ripple-bezier': cubicBezierEaseOut
                 };
             })
         };

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

@@ -13,30 +13,30 @@ Object.defineProperty(exports, "__esModule", {
 const cssr_1 = require("../../../_utils/cssr");
 
 const fade_in_scale_up_cssr_1 = __importDefault(require("../../../_styles/transitions/fade-in-scale-up.cssr")); // vars:
-// --color
-// --ripple-color
-// --bezier
-// --ripple-bezier
-// --font-size
-// --font-family
+// --n-color
+// --n-ripple-color
+// --n-bezier
+// --n-ripple-bezier
+// --n-font-size
+// --n-font-family
 
 
 exports.default = (0, cssr_1.c)([(0, cssr_1.c)('@keyframes badge-wave-spread', {
   from: {
-    boxShadow: '0 0 0.5px 0px var(--ripple-color)',
+    boxShadow: '0 0 0.5px 0px var(--n-ripple-color)',
     opacity: 0.6
   },
   to: {
     // don't use exact 5px since chrome will display the animation with glitches
-    boxShadow: '0 0 0.5px 4.5px var(--ripple-color)',
+    boxShadow: '0 0 0.5px 4.5px var(--n-ripple-color)',
     opacity: 0
   }
 }), (0, cssr_1.cB)('badge', `
  display: inline-flex;
  position: relative;
  vertical-align: middle;
- color: var(--color);
- font-family: var(--font-family);
+ color: var(--n-color);
+ font-family: var(--n-font-family);
  `, [(0, cssr_1.cM)('as-is', [(0, cssr_1.cB)('badge-sup', {
   position: 'static',
   transform: 'translateX(0)'
@@ -53,10 +53,10 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('@keyframes badge-wave-spread', {
 }, [(0, cssr_1.c)('::before', {
   borderRadius: '4px'
 })])]), (0, cssr_1.cB)('badge-sup', `
- background: var(--color);
+ background: var(--n-color);
  transition:
- background-color .3s var(--bezier),
- color .3s var(--bezier);
+ background-color .3s var(--n-bezier),
+ color .3s var(--n-bezier);
  color: #FFF;
  position: absolute;
  height: 18px;
@@ -64,7 +64,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('@keyframes badge-wave-spread', {
  border-radius: 9px;
  padding: 0 6px;
  text-align: center;
- font-size: var(--font-size);
+ font-size: var(--n-font-size);
  transform: translateX(-50%);
  left: 100%;
  bottom: calc(100% - 9px);
@@ -78,7 +78,7 @@ exports.default = (0, cssr_1.c)([(0, cssr_1.c)('@keyframes badge-wave-spread', {
   animationDuration: '2s',
   animationIterationCount: 'infinite',
   animationDelay: '1s',
-  animationTimingFunction: 'var(--ripple-bezier)',
+  animationTimingFunction: 'var(--n-ripple-bezier)',
   animationName: 'badge-wave-spread'
 }), (0, cssr_1.c)('&::before', `
  opacity: 0;

package/lib/button/src/Button.d.ts

@@ -41,11 +41,12 @@ declare const buttonProps: {
         readonly type: PropType<"button" | "reset" | "submit">;
         readonly default: "button";
     };
-    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
     readonly bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
+    readonly internalAutoFocus: BooleanConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -700,11 +701,12 @@ declare const Button: import("vue").DefineComponent<{
         readonly type: PropType<"button" | "reset" | "submit">;
         readonly default: "button";
     };
-    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
     readonly bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly onClick: PropType<MaybeArray<(e: MouseEvent) => void>>;
+    readonly internalAutoFocus: BooleanConstructor;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -1318,8 +1320,8 @@ declare const Button: import("vue").DefineComponent<{
         rippleDuration: string;
     }, any>>>;
 }, {
-    selfRef: import("vue").Ref<HTMLElement | null>;
-    waveRef: import("vue").Ref<{
+    selfElRef: import("vue").Ref<HTMLElement | null>;
+    waveElRef: import("vue").Ref<{
         play: () => void;
     } | null>;
     mergedClsPrefix: import("vue").ComputedRef<string>;
@@ -1393,8 +1395,9 @@ declare const Button: import("vue").DefineComponent<{
     readonly dashed?: unknown;
     readonly iconPlacement?: unknown;
     readonly attrType?: unknown;
-    readonly onClick?: unknown;
     readonly bordered?: unknown;
+    readonly onClick?: unknown;
+    readonly internalAutoFocus?: unknown;
     readonly theme?: unknown;
     readonly themeOverrides?: unknown;
     readonly builtinThemeOverrides?: unknown;
@@ -1418,6 +1421,7 @@ declare const Button: import("vue").DefineComponent<{
     quaternary: boolean;
     iconPlacement: "left" | "right";
     attrType: "button" | "reset" | "submit";
+    internalAutoFocus: boolean;
 } & {
     color?: string | undefined;
     size?: Size | undefined;
@@ -2055,6 +2059,7 @@ declare const Button: import("vue").DefineComponent<{
     quaternary: boolean;
     iconPlacement: "left" | "right";
     attrType: "button" | "reset" | "submit";
+    internalAutoFocus: boolean;
 }>;
 declare type NativeButtonProps = Omit<ButtonHTMLAttributes, keyof ButtonProps>;
 declare type MergedProps = Partial<ButtonProps & NativeButtonProps>;

package/lib/button/src/Button.js

@@ -33,10 +33,10 @@ const buttonProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), {
     }, attrType: {
         type: String,
         default: 'button'
-    }, onClick: [Function, Array], bordered: {
+    }, bordered: {
         type: Boolean,
         default: true
-    } });
+    }, onClick: [Function, Array], internalAutoFocus: Boolean });
 const Button = (0, vue_1.defineComponent)({
     name: 'Button',
     props: buttonProps,
@@ -50,9 +50,18 @@ const Button = (0, vue_1.defineComponent)({
                 }
             });
         }
-        const selfRef = (0, vue_1.ref)(null);
-        const waveRef = (0, vue_1.ref)(null);
+        const selfElRef = (0, vue_1.ref)(null);
+        const waveElRef = (0, vue_1.ref)(null);
         const enterPressedRef = (0, vue_1.ref)(false);
+        (0, vue_1.onMounted)(() => {
+            const { value: selfEl } = selfElRef;
+            if (selfEl &&
+                !props.disabled &&
+                props.focusable &&
+                props.internalAutoFocus) {
+                selfEl.focus({ preventScroll: true });
+            }
+        });
         const showBorderRef = (0, vooks_1.useMemo)(() => {
             return (!props.quaternary &&
                 !props.tertiary &&
@@ -88,19 +97,17 @@ const Button = (0, vue_1.defineComponent)({
                 return;
             }
             if (mergedFocusableRef.value) {
-                (_a = selfRef.value) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
+                (_a = selfElRef.value) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
             }
         };
         const handleClick = (e) => {
+            var _a;
             if (!props.disabled && !props.loading) {
                 const { onClick } = props;
                 if (onClick)
                     (0, _utils_1.call)(onClick, e);
                 if (!props.text) {
-                    const { value } = waveRef;
-                    if (value) {
-                        value.play();
-                    }
+                    (_a = waveElRef.value) === null || _a === void 0 ? void 0 : _a.play();
                 }
             }
         };
@@ -132,8 +139,8 @@ const Button = (0, vue_1.defineComponent)({
         const themeRef = (0, _mixins_1.useTheme)('Button', 'Button', button_cssr_1.default, styles_1.buttonLight, props, mergedClsPrefixRef);
         const rtlEnabledRef = (0, use_rtl_1.default)('Button', NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef, mergedClsPrefixRef);
         return {
-            selfRef,
-            waveRef,
+            selfElRef,
+            waveElRef,
             mergedClsPrefix: mergedClsPrefixRef,
             mergedFocusable: mergedFocusableRef,
             mergedSize: mergedSizeRef,
@@ -389,7 +396,7 @@ const Button = (0, vue_1.defineComponent)({
     },
     render() {
         const { $slots, mergedClsPrefix, tag: Component } = this;
-        return ((0, vue_1.h)(Component, { ref: "selfRef", class: [
+        return ((0, vue_1.h)(Component, { ref: "selfElRef", class: [
                 `${mergedClsPrefix}-button`,
                 `${mergedClsPrefix}-button--${this.type}-type`,
                 `${mergedClsPrefix}-button--${this.mergedSize}-type`,
@@ -413,7 +420,7 @@ const Button = (0, vue_1.defineComponent)({
                     }))) : null
             }),
             $slots.default && this.iconPlacement === 'left' ? ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-button__content` }, $slots)) : null,
-            !this.text ? ((0, vue_1.h)(_internal_1.NBaseWave, { ref: "waveRef", clsPrefix: mergedClsPrefix })) : null,
+            !this.text ? ((0, vue_1.h)(_internal_1.NBaseWave, { ref: "waveElRef", clsPrefix: mergedClsPrefix })) : null,
             this.showBorder ? ((0, vue_1.h)("div", { "aria-hidden": true, class: `${mergedClsPrefix}-button__border`, style: this.customColorCssVars })) : null,
             this.showBorder ? ((0, vue_1.h)("div", { "aria-hidden": true, class: `${mergedClsPrefix}-button__state-border`, style: this.customColorCssVars })) : null));
     }

package/lib/data-table/src/TableParts/Body.js

@@ -286,7 +286,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
         if (scrollX)
             contentStyle.width = '100%';
-        const tableNode = ((0, vue_1.h)(_internal_1.NScrollbar, { ref: "scrollbarInstRef", scrollable: scrollable || isBasicAutoLayout, showScrollbar: !this.bodyShowHeaderOnly, class: `${mergedClsPrefix}-data-table-base-table-body`, style: this.bodyStyle, theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, contentStyle: contentStyle, container: virtualScroll ? this.virtualListContainer : undefined, content: virtualScroll ? this.virtualListContent : undefined, horizontalRailStyle: { zIndex: 3 }, verticalRailStyle: { zIndex: 3 }, xScrollable: xScrollable, onScroll: virtualScroll ? undefined : this.handleTableBodyScroll, internalOnUpdateScrollLeft: setHeaderScrollLeft, onResize: onResize }, {
+        const tableNode = ((0, vue_1.h)(_internal_1.NScrollbar, { ref: "scrollbarInstRef", scrollable: scrollable || isBasicAutoLayout, class: `${mergedClsPrefix}-data-table-base-table-body`, style: this.bodyStyle, theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, contentStyle: contentStyle, container: virtualScroll ? this.virtualListContainer : undefined, content: virtualScroll ? this.virtualListContent : undefined, horizontalRailStyle: { zIndex: 3 }, verticalRailStyle: { zIndex: 3 }, xScrollable: xScrollable, onScroll: virtualScroll ? undefined : this.handleTableBodyScroll, internalOnUpdateScrollLeft: setHeaderScrollLeft, onResize: onResize }, {
             default: () => {
                 // coordinate to pass if there are cells that cross row & col
                 const cordToPass = {};

package/lib/dialog/src/Dialog.js

@@ -139,10 +139,10 @@ exports.default = (0, vue_1.defineComponent)({
             $slots.action || positiveText || negativeText || action ? ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-dialog__action` }, (0, vue_1.renderSlot)($slots, 'action', undefined, action
                 ? () => [(0, _utils_1.render)(action)]
                 : () => [
-                    this.negativeText && ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, ghost: true, size: "small", onClick: handleNegativeClick }, {
+                    this.negativeText && ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, ghost: true, size: "small", onClick: handleNegativeClick, internalAutoFocus: !this.positiveText }, {
                         default: () => (0, _utils_1.render)(this.negativeText)
                     })),
-                    this.positiveText && ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, disabled: loading, loading: loading, size: "small", type: type === 'default' ? 'primary' : type, onClick: handlePositiveClick }, {
+                    this.positiveText && ((0, vue_1.h)(button_1.NButton, { theme: mergedTheme.peers.Button, themeOverrides: mergedTheme.peerOverrides.Button, disabled: loading, loading: loading, size: "small", type: type === 'default' ? 'primary' : type, onClick: handlePositiveClick, internalAutoFocus: true }, {
                         default: () => (0, _utils_1.render)(this.positiveText)
                     }))
                 ]))) : null));

package/lib/divider/src/Divider.d.ts

@@ -49,10 +49,10 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--color': string;
-        '--text-color': string;
-        '--font-weight': string;
+        '--n-bezier': string;
+        '--n-color': string;
+        '--n-text-color': 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 titlePlacement?: unknown;

package/lib/divider/src/Divider.js

@@ -22,10 +22,10 @@ exports.default = (0, vue_1.defineComponent)({
             cssVars: (0, vue_1.computed)(() => {
                 const { common: { cubicBezierEaseInOut }, self: { color, textColor, fontWeight } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--color': color,
-                    '--text-color': textColor,
-                    '--font-weight': fontWeight
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-color': color,
+                    '--n-text-color': textColor,
+                    '--n-font-weight': fontWeight
                 };
             })
         };

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

@@ -5,10 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 
 const cssr_1 = require("../../../_utils/cssr"); // vars:
-// --bezier
-// --color
-// --text-color
-// --font-weight
+// --n-bezier
+// --n-color
+// --n-text-color
+// --n-font-weight
 
 
 exports.default = (0, cssr_1.cB)('divider', `
@@ -17,10 +17,10 @@ exports.default = (0, cssr_1.cB)('divider', `
  width: 100%;
  box-sizing: border-box;
  font-size: 16px;
- color: var(--text-color);
+ color: var(--n-text-color);
  transition:
- color .3s var(--bezier),
- background-color .3s var(--bezier);
+ color .3s var(--n-bezier),
+ background-color .3s var(--n-bezier);
 `, [(0, cssr_1.cNotM)('vertical', `
  margin-top: 24px;
  margin-bottom: 24px;
@@ -33,7 +33,7 @@ exports.default = (0, cssr_1.cB)('divider', `
  margin-left: 12px;
  margin-right: 12px;
  white-space: nowrap;
- font-weight: var(--font-weight);
+ font-weight: var(--n-font-weight);
  `), (0, cssr_1.cM)('title-position-left', [(0, cssr_1.cE)('line', [(0, cssr_1.cM)('left', {
   width: '28px'
 })])]), (0, cssr_1.cM)('title-position-right', [(0, cssr_1.cE)('line', [(0, cssr_1.cM)('right', {
@@ -52,14 +52,14 @@ exports.default = (0, cssr_1.cB)('divider', `
  width: 1px;
  `), (0, cssr_1.cE)('line', `
  border: none;
- transition: background-color .3s var(--bezier), border-color .3s var(--bezier);
+ transition: background-color .3s var(--n-bezier), border-color .3s var(--n-bezier);
  height: 1px;
  width: 100%;
  margin: 0;
  `), (0, cssr_1.cNotM)('dashed', [(0, cssr_1.cE)('line', {
-  backgroundColor: 'var(--color)'
+  backgroundColor: 'var(--n-color)'
 })]), (0, cssr_1.cM)('dashed', [(0, cssr_1.cE)('line', {
-  borderColor: 'var(--color)'
+  borderColor: 'var(--n-color)'
 })]), (0, cssr_1.cM)('vertical', {
-  backgroundColor: 'var(--color)'
+  backgroundColor: 'var(--n-color)'
 })]);

package/lib/input-number/src/utils.js

@@ -14,7 +14,7 @@ function parse(value) {
 exports.parse = parse;
 // can be parsed to number but shouldn't be applied when inputing
 function isWipValue(value) {
-    return /^\d+\.$/.test(value) || /^\.\d+$/.test(value);
+    return /^(-)?\d+\.$/.test(value) || /^\.\d+$/.test(value);
 }
 exports.isWipValue = isWipValue;
 // string => boolean (expected, not implemented)

package/lib/switch/src/Switch.js

@@ -86,6 +86,8 @@ exports.default = (0, vue_1.defineComponent)({
             nTriggerFormBlur();
         }
         function handleClick() {
+            if (props.loading)
+                return;
             if (!mergedDisabledRef.value) {
                 if (mergedValueRef.value !== props.checkedValue) {
                     doUpdateValue(props.checkedValue);
@@ -105,12 +107,16 @@ exports.default = (0, vue_1.defineComponent)({
             pressedRef.value = false;
         }
         function handleKeyup(e) {
+            if (props.loading)
+                return;
             if (e.code === 'Space') {
                 doUpdateValue(!mergedValueRef.value);
                 pressedRef.value = false;
             }
         }
         function handleKeydown(e) {
+            if (props.loading)
+                return;
             if (e.code === 'Space') {
                 e.preventDefault();
                 pressedRef.value = true;
@@ -168,6 +174,7 @@ exports.default = (0, vue_1.defineComponent)({
                 checked && `${mergedClsPrefix}-switch--active`,
                 mergedDisabled && `${mergedClsPrefix}-switch--disabled`,
                 this.round && `${mergedClsPrefix}-switch--round`,
+                this.loading && `${mergedClsPrefix}-switch--loading`,
                 this.pressed && `${mergedClsPrefix}-switch--pressed`
             ], tabindex: !this.mergedDisabled ? 0 : undefined, style: this.cssVars, onClick: this.handleClick, onFocus: this.handleFocus, onBlur: this.handleBlur, onKeyup: this.handleKeyup, onKeydown: this.handleKeydown },
             (0, vue_1.h)("div", { class: `${mergedClsPrefix}-switch__rail`, "aria-hidden": "true", style: mergedRailStyle },

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

@@ -133,4 +133,6 @@ exports.default = (0, cssr_1.cB)('switch', `
 })]), (0, cssr_1.cM)('disabled', [(0, cssr_1.cE)('rail', `
  cursor: not-allowed;
  opacity: .5;
+ `)]), (0, cssr_1.cM)('loading', [(0, cssr_1.cE)('rail', `
+ pointer-events: none;
  `)])]);

package/lib/typography/src/a.d.ts

@@ -402,8 +402,8 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--text-color': string;
-        '--bezier': string;
+        '--n-text-color': string;
+        '--n-bezier': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly theme?: unknown;

package/lib/typography/src/a.js

@@ -19,8 +19,8 @@ exports.default = (0, vue_1.defineComponent)({
             cssVars: (0, vue_1.computed)(() => {
                 const { common: { cubicBezierEaseInOut }, self: { aTextColor } } = themeRef.value;
                 return {
-                    '--text-color': aTextColor,
-                    '--bezier': cubicBezierEaseInOut
+                    '--n-text-color': aTextColor,
+                    '--n-bezier': cubicBezierEaseInOut
                 };
             })
         };

package/lib/typography/src/blockquote.d.ts

@@ -404,11 +404,11 @@ declare const _default: import("vue").DefineComponent<{
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--font-size': string;
-        '--line-height': string;
-        '--prefix-color': string;
-        '--text-color': string;
+        '--n-bezier': string;
+        '--n-font-size': string;
+        '--n-line-height': string;
+        '--n-prefix-color': string;
+        '--n-text-color': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly alignText?: unknown;

package/lib/typography/src/blockquote.js

@@ -19,11 +19,11 @@ exports.default = (0, vue_1.defineComponent)({
             cssVars: (0, vue_1.computed)(() => {
                 const { common: { cubicBezierEaseInOut }, self: { blockquoteTextColor, blockquotePrefixColor, blockquoteLineHeight, blockquoteFontSize } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--font-size': blockquoteFontSize,
-                    '--line-height': blockquoteLineHeight,
-                    '--prefix-color': blockquotePrefixColor,
-                    '--text-color': blockquoteTextColor
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-font-size': blockquoteFontSize,
+                    '--n-line-height': blockquoteLineHeight,
+                    '--n-prefix-color': blockquotePrefixColor,
+                    '--n-text-color': blockquoteTextColor
                 };
             })
         };

package/lib/typography/src/create-header.d.ts

@@ -415,14 +415,14 @@ declare const _default: (level: '1' | '2' | '3' | '4' | '5' | '6') => import("vu
 }, {
     mergedClsPrefix: import("vue").ComputedRef<string>;
     cssVars: import("vue").ComputedRef<{
-        '--bezier': string;
-        '--font-size': string;
-        '--margin': string;
-        '--bar-color': string;
-        '--bar-width': string;
-        '--font-weight': string;
-        '--text-color': string;
-        '--prefix-width': string;
+        '--n-bezier': string;
+        '--n-font-size': string;
+        '--n-margin': string;
+        '--n-bar-color': string;
+        '--n-bar-width': string;
+        '--n-font-weight': string;
+        '--n-text-color': string;
+        '--n-prefix-width': string;
     }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly type?: unknown;

package/lib/typography/src/create-header.js

@@ -25,14 +25,14 @@ exports.default = (level) => (0, vue_1.defineComponent)({
                 const { type } = props;
                 const { common: { cubicBezierEaseInOut }, self: { headerFontWeight, headerTextColor, [(0, _utils_1.createKey)('headerPrefixWidth', level)]: prefixWidth, [(0, _utils_1.createKey)('headerFontSize', level)]: fontSize, [(0, _utils_1.createKey)('headerMargin', level)]: margin, [(0, _utils_1.createKey)('headerBarWidth', level)]: barWidth, [(0, _utils_1.createKey)('headerBarColor', type)]: barColor } } = themeRef.value;
                 return {
-                    '--bezier': cubicBezierEaseInOut,
-                    '--font-size': fontSize,
-                    '--margin': margin,
-                    '--bar-color': barColor,
-                    '--bar-width': barWidth,
-                    '--font-weight': headerFontWeight,
-                    '--text-color': headerTextColor,
-                    '--prefix-width': prefixWidth
+                    '--n-bezier': cubicBezierEaseInOut,
+                    '--n-font-size': fontSize,
+                    '--n-margin': margin,
+                    '--n-bar-color': barColor,
+                    '--n-bar-width': barWidth,
+                    '--n-font-weight': headerFontWeight,
+                    '--n-text-color': headerTextColor,
+                    '--n-prefix-width': prefixWidth
                 };
             })
         };