naive-ui 2.43.2 → 2.44.0

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

@@ -76,6 +76,7 @@ declare const scrollbarProps: {
     readonly onResize: PropType<(e: ResizeObserverEntry) => void>;
     readonly internalOnUpdateScrollLeft: PropType<(scrollLeft: number) => void>;
     readonly internalHoistYRail: BooleanConstructor;
+    readonly internalExposeWidthCssVar: BooleanConstructor;
     readonly yPlacement: {
         readonly type: PropType<"left" | "right">;
         readonly default: "right";
@@ -152,6 +153,7 @@ declare const Scrollbar: import("vue").DefineComponent<import("vue").ExtractProp
     readonly onResize: PropType<(e: ResizeObserverEntry) => void>;
     readonly internalOnUpdateScrollLeft: PropType<(scrollLeft: number) => void>;
     readonly internalHoistYRail: BooleanConstructor;
+    readonly internalExposeWidthCssVar: BooleanConstructor;
     readonly yPlacement: {
         readonly type: PropType<"left" | "right">;
         readonly default: "right";
@@ -219,6 +221,7 @@ declare const Scrollbar: import("vue").DefineComponent<import("vue").ExtractProp
     handleContainerResize: (e: ResizeObserverEntry) => void;
     handleYScrollMouseDown: (e: MouseEvent) => void;
     handleXScrollMouseDown: (e: MouseEvent) => void;
+    containerWidth: import("vue").Ref<number | null, number | null>;
     cssVars: import("vue").ComputedRef<{
         '--n-scrollbar-bezier': string;
         '--n-scrollbar-color': string;
@@ -281,6 +284,7 @@ declare const Scrollbar: import("vue").DefineComponent<import("vue").ExtractProp
     readonly onResize: PropType<(e: ResizeObserverEntry) => void>;
     readonly internalOnUpdateScrollLeft: PropType<(scrollLeft: number) => void>;
     readonly internalHoistYRail: BooleanConstructor;
+    readonly internalExposeWidthCssVar: BooleanConstructor;
     readonly yPlacement: {
         readonly type: PropType<"left" | "right">;
         readonly default: "right";
@@ -326,15 +330,16 @@ declare const Scrollbar: import("vue").DefineComponent<import("vue").ExtractProp
         railColor: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    readonly trigger: "none" | "hover";
     readonly duration: number;
     readonly scrollable: boolean;
     readonly xScrollable: boolean;
-    readonly yPlacement: "left" | "right";
-    readonly xPlacement: "top" | "bottom";
+    readonly trigger: "none" | "hover";
     readonly useUnifiedContainer: boolean;
     readonly triggerDisplayManually: boolean;
     readonly internalHoistYRail: boolean;
+    readonly internalExposeWidthCssVar: boolean;
+    readonly yPlacement: "left" | "right";
+    readonly xPlacement: "top" | "bottom";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 type NativeScrollbarProps = Omit<HTMLAttributes, keyof ScrollbarInternalProps>;
 type MergedProps = Partial<ScrollbarInternalProps & NativeScrollbarProps>;

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

@@ -24,7 +24,7 @@ const scrollbarProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props)
         default: 'hover'
     }, useUnifiedContainer: Boolean, triggerDisplayManually: Boolean, 
     // If container is set, resize observer won't not attached
-    container: Function, content: Function, containerClass: String, containerStyle: [String, Object], contentClass: [String, Array], contentStyle: [String, Object], horizontalRailStyle: [String, Object], verticalRailStyle: [String, Object], onScroll: Function, onWheel: Function, onResize: Function, internalOnUpdateScrollLeft: Function, internalHoistYRail: Boolean, yPlacement: {
+    container: Function, content: Function, containerClass: String, containerStyle: [String, Object], contentClass: [String, Array], contentStyle: [String, Object], horizontalRailStyle: [String, Object], verticalRailStyle: [String, Object], onScroll: Function, onWheel: Function, onResize: Function, internalOnUpdateScrollLeft: Function, internalHoistYRail: Boolean, internalExposeWidthCssVar: Boolean, yPlacement: {
         type: String,
         default: 'right'
     }, xPlacement: {
@@ -575,7 +575,7 @@ const Scrollbar = (0, vue_1.defineComponent)({
             handleContentResize,
             handleContainerResize,
             handleYScrollMouseDown,
-            handleXScrollMouseDown, cssVars: inlineThemeDisabled ? undefined : cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender });
+            handleXScrollMouseDown, containerWidth: containerWidthRef, cssVars: inlineThemeDisabled ? undefined : cssVarsRef, themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass, onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender });
     },
     render() {
         var _a;
@@ -618,7 +618,12 @@ const Scrollbar = (0, vue_1.defineComponent)({
                 this.container ? ((_b = $slots.default) === null || _b === void 0 ? void 0 : _b.call($slots)) : ((0, vue_1.h)("div", { role: "none", ref: "containerRef", class: [
                         `${mergedClsPrefix}-scrollbar-container`,
                         this.containerClass
-                    ], style: this.containerStyle, onScroll: this.handleScroll, onWheel: this.onWheel },
+                    ], style: [
+                        this.containerStyle,
+                        this.internalExposeWidthCssVar
+                            ? { '--n-scrollbar-current-width': (0, seemly_1.pxfy)(this.containerWidth) }
+                            : undefined
+                    ], onScroll: this.handleScroll, onWheel: this.onWheel },
                     (0, vue_1.h)(vueuc_1.VResizeObserver, { onResize: this.handleContentResize }, {
                         default: () => ((0, vue_1.h)("div", { ref: "contentRef", role: "none", style: [
                                 {

package/lib/_internal/select-menu/src/SelectMenu.d.ts

@@ -3,6 +3,7 @@ import type { PropType } from 'vue';
 import type { VirtualListInst } from 'vueuc';
 import type { SelectGroupOption, SelectIgnoredOption, SelectOption, SelectTreeMate, Value } from '../../../select/src/interface';
 import type { ScrollbarInst } from '../../scrollbar';
+import type { ScrollbarProps } from '../../scrollbar/src/Scrollbar';
 import type { NodeProps, RenderLabel, RenderOption, Size } from './interface';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     clsPrefix: {
@@ -67,6 +68,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     inlineThemeDisabled: BooleanConstructor;
+    scrollbarProps: PropType<ScrollbarProps>;
     onToggle: PropType<(tmNode: TreeNode<SelectOption>) => void>;
     theme: PropType<import("../../../_mixins").Theme<"InternalSelectMenu", {
         optionFontSizeTiny: string;
@@ -395,6 +397,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     padding: import("vue").ComputedRef<import("seemly").Margin>;
     flattenedNodes: import("vue").ComputedRef<TreeNode<import("../../../select/src/interface").SelectBaseOption<string | number, string | ((option: import("../../../select/src/interface").SelectBaseOption<string | number, string | /*elided*/ any>, selected: boolean) => import("vue").VNodeChild)>, SelectGroupOption, SelectIgnoredOption>[]>;
     empty: import("vue").ComputedRef<boolean>;
+    mergedRenderEmpty: import("vue").ComputedRef<(() => import("vue").VNodeChild) | undefined>;
     virtualListContainer(): HTMLElement | undefined;
     virtualListContent(): HTMLElement | null | undefined;
     doScroll: (e: Event) => void;
@@ -495,6 +498,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     inlineThemeDisabled: BooleanConstructor;
+    scrollbarProps: PropType<ScrollbarProps>;
     onToggle: PropType<(tmNode: TreeNode<SelectOption>) => void>;
     theme: PropType<import("../../../_mixins").Theme<"InternalSelectMenu", {
         optionFontSizeTiny: string;
@@ -701,10 +705,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     value: Value | null;
     size: Size;
     inlineThemeDisabled: boolean;
+    scrollable: boolean;
     loading: boolean;
     show: boolean;
     focusable: boolean;
-    scrollable: boolean;
     multiple: boolean;
     virtualScroll: boolean;
     valueField: string;

package/lib/_internal/select-menu/src/SelectMenu.js

@@ -53,11 +53,11 @@ exports.default = (0, vue_1.defineComponent)({
         }, loading: Boolean, focusable: Boolean, renderLabel: Function, renderOption: Function, nodeProps: Function, showCheckmark: { type: Boolean, default: true }, onMousedown: Function, onScroll: Function, onFocus: Function, onBlur: Function, onKeyup: Function, onKeydown: Function, onTabOut: Function, onMouseenter: Function, onMouseleave: Function, onResize: Function, resetMenuOnOptionsChange: {
             type: Boolean,
             default: true
-        }, inlineThemeDisabled: Boolean, 
+        }, inlineThemeDisabled: Boolean, scrollbarProps: Object, 
         // deprecated
         onToggle: Function }),
     setup(props) {
-        const { mergedClsPrefixRef, mergedRtlRef } = (0, _mixins_1.useConfig)(props);
+        const { mergedClsPrefixRef, mergedRtlRef, mergedComponentPropsRef } = (0, _mixins_1.useConfig)(props);
         const rtlEnabledRef = (0, _mixins_1.useRtl)('InternalSelectMenu', mergedRtlRef, mergedClsPrefixRef);
         const themeRef = (0, _mixins_1.useTheme)('InternalSelectMenu', '-internal-select-menu', index_cssr_1.default, styles_1.internalSelectMenuLight, props, (0, vue_1.toRef)(props, 'clsPrefix'));
         const selfRef = (0, vue_1.ref)(null);
@@ -142,6 +142,10 @@ exports.default = (0, vue_1.defineComponent)({
             const tmNodes = flattenedNodesRef.value;
             return tmNodes && tmNodes.length === 0;
         });
+        const mergedRenderEmptyRef = (0, vue_1.computed)(() => {
+            var _a, _b;
+            return (_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.Select) === null || _b === void 0 ? void 0 : _b.renderEmpty;
+        });
         function doToggle(tmNode) {
             const { onToggle } = props;
             if (onToggle)
@@ -306,7 +310,7 @@ exports.default = (0, vue_1.defineComponent)({
         };
         (0, _utils_1.useOnResize)(selfRef, props.onResize);
         return Object.assign({ mergedTheme: themeRef, mergedClsPrefix: mergedClsPrefixRef, rtlEnabled: rtlEnabledRef, virtualListRef,
-            scrollbarRef, itemSize: itemSizeRef, padding: paddingRef, flattenedNodes: flattenedNodesRef, empty: emptyRef, virtualListContainer() {
+            scrollbarRef, itemSize: itemSizeRef, padding: paddingRef, flattenedNodes: flattenedNodesRef, empty: emptyRef, mergedRenderEmpty: mergedRenderEmptyRef, virtualListContainer() {
                 const { value } = virtualListRef;
                 return value === null || value === void 0 ? void 0 : value.listElRef;
             },
@@ -334,7 +338,7 @@ exports.default = (0, vue_1.defineComponent)({
             ], style: this.cssVars, onFocusin: this.handleFocusin, onFocusout: this.handleFocusout, onKeyup: this.handleKeyUp, onKeydown: this.handleKeyDown, onMousedown: this.handleMouseDown, onMouseenter: this.onMouseenter, onMouseleave: this.onMouseleave },
             (0, _utils_1.resolveWrappedSlot)($slots.header, children => children && ((0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__header`, "data-header": true, key: "header" }, children))),
             this.loading ? ((0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__loading` },
-                (0, vue_1.h)(loading_1.default, { clsPrefix: clsPrefix, strokeWidth: 20 }))) : !this.empty ? ((0, vue_1.h)(scrollbar_1.NScrollbar, { ref: "scrollbarRef", theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, scrollable: this.scrollable, container: virtualScroll ? this.virtualListContainer : undefined, content: virtualScroll ? this.virtualListContent : undefined, onScroll: virtualScroll ? undefined : this.doScroll }, {
+                (0, vue_1.h)(loading_1.default, { clsPrefix: clsPrefix, strokeWidth: 20 }))) : !this.empty ? ((0, vue_1.h)(scrollbar_1.NScrollbar, Object.assign({ ref: "scrollbarRef", theme: mergedTheme.peers.Scrollbar, themeOverrides: mergedTheme.peerOverrides.Scrollbar, scrollable: this.scrollable, container: virtualScroll ? this.virtualListContainer : undefined, content: virtualScroll ? this.virtualListContent : undefined, onScroll: virtualScroll ? undefined : this.doScroll }, this.scrollbarProps), {
                 default: () => {
                     return virtualScroll ? ((0, vue_1.h)(vueuc_1.VirtualList, { ref: "virtualListRef", class: `${clsPrefix}-virtual-list`, items: this.flattenedNodes, itemSize: this.itemSize, showScrollbar: false, paddingTop: this.padding.top, paddingBottom: this.padding.bottom, onResize: this.handleVirtualListResize, onScroll: this.handleVirtualListScroll, itemResizable: true }, {
                         default: ({ item: tmNode }) => {
@@ -345,9 +349,12 @@ exports.default = (0, vue_1.defineComponent)({
                             paddingBottom: this.padding.bottom
                         } }, this.flattenedNodes.map(tmNode => tmNode.isGroup ? ((0, vue_1.h)(SelectGroupHeader_1.default, { key: tmNode.key, clsPrefix: clsPrefix, tmNode: tmNode })) : ((0, vue_1.h)(SelectOption_1.default, { clsPrefix: clsPrefix, key: tmNode.key, tmNode: tmNode })))));
                 }
-            })) : ((0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__empty`, "data-empty": true }, (0, _utils_1.resolveSlot)($slots.empty, () => [
-                (0, vue_1.h)(empty_1.NEmpty, { theme: mergedTheme.peers.Empty, themeOverrides: mergedTheme.peerOverrides.Empty, size: this.size })
-            ]))),
+            })) : ((0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__empty`, "data-empty": true }, (0, _utils_1.resolveSlot)($slots.empty, () => {
+                var _a;
+                return [
+                    ((_a = this.mergedRenderEmpty) === null || _a === void 0 ? void 0 : _a.call(this)) || ((0, vue_1.h)(empty_1.NEmpty, { theme: mergedTheme.peers.Empty, themeOverrides: mergedTheme.peerOverrides.Empty, size: this.size }))
+                ];
+            }))),
             (0, _utils_1.resolveWrappedSlot)($slots.action, children => children && [
                 (0, vue_1.h)("div", { class: `${clsPrefix}-base-select-menu__action`, "data-action": true, key: "action" }, children),
                 (0, vue_1.h)(focus_detector_1.default, { onFocus: this.onTabOut, key: "focus-detector" })

package/lib/_mixins/use-form-item.d.ts

@@ -1,6 +1,5 @@
 import type { ComputedRef, Ref } from 'vue';
-import type { FormValidationStatus } from '../form/src/public-types';
-type FormItemSize = 'small' | 'medium' | 'large';
+import type { FormItemSize, FormValidationStatus } from '../form/src/public-types';
 type AllowedSize = 'tiny' | 'small' | 'medium' | 'large' | 'huge' | number;
 export interface FormItemInjection {
     path: Ref<string | undefined>;

package/lib/auto-complete/src/AutoComplete.d.ts

@@ -1,6 +1,7 @@
 import type { TreeNode } from 'treemate';
 import type { HTMLAttributes, InputHTMLAttributes, PropType, SlotsType, VNode } from 'vue';
 import type { FollowerPlacement } from 'vueuc';
+import type { ScrollbarProps } from '../../_internal';
 import type { RenderLabel, RenderOption } from '../../_internal/select-menu/src/interface';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { FormValidationStatus } from '../../form/src/public-types';
@@ -58,6 +59,7 @@ export declare const autoCompleteProps: {
     readonly onSelect: PropType<MaybeArray<OnSelect>>;
     readonly onBlur: PropType<MaybeArray<(e: FocusEvent) => void>>;
     readonly onFocus: PropType<MaybeArray<(e: FocusEvent) => void>>;
+    readonly scrollbarProps: PropType<ScrollbarProps>;
     readonly onInput: PropType<MaybeArray<OnUpdateValue> | undefined>;
     readonly theme: PropType<import("../../_mixins").Theme<"AutoComplete", {
         menuBoxShadow: string;
@@ -557,6 +559,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly onSelect: PropType<MaybeArray<OnSelect>>;
     readonly onBlur: PropType<MaybeArray<(e: FocusEvent) => void>>;
     readonly onFocus: PropType<MaybeArray<(e: FocusEvent) => void>>;
+    readonly scrollbarProps: PropType<ScrollbarProps>;
     readonly onInput: PropType<MaybeArray<OnUpdateValue> | undefined>;
     readonly theme: PropType<import("../../_mixins").Theme<"AutoComplete", {
         menuBoxShadow: string;
@@ -1331,6 +1334,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly onSelect: PropType<MaybeArray<OnSelect>>;
     readonly onBlur: PropType<MaybeArray<(e: FocusEvent) => void>>;
     readonly onFocus: PropType<MaybeArray<(e: FocusEvent) => void>>;
+    readonly scrollbarProps: PropType<ScrollbarProps>;
     readonly onInput: PropType<MaybeArray<OnUpdateValue> | undefined>;
     readonly theme: PropType<import("../../_mixins").Theme<"AutoComplete", {
         menuBoxShadow: string;

package/lib/auto-complete/src/AutoComplete.js

@@ -39,7 +39,7 @@ exports.autoCompleteProps = Object.assign(Object.assign({}, _mixins_1.useTheme.p
     }, value: String, blurAfterSelect: Boolean, clearAfterSelect: Boolean, getShow: Function, showEmpty: Boolean, inputProps: Object, renderOption: Function, renderLabel: Function, size: String, options: {
         type: Array,
         default: () => []
-    }, zIndex: Number, status: String, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onSelect: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], 
+    }, zIndex: Number, status: String, 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array], onSelect: [Function, Array], onBlur: [Function, Array], onFocus: [Function, Array], scrollbarProps: Object, 
     // deprecated
     onInput: [Function, Array] });
 exports.default = (0, vue_1.defineComponent)({
@@ -285,7 +285,7 @@ exports.default = (0, vue_1.defineComponent)({
                                     ], style: [
                                         menuProps === null || menuProps === void 0 ? void 0 : menuProps.style,
                                         this.cssVars
-                                    ], treeMate: this.treeMate, multiple: false, renderLabel: this.renderLabel, renderOption: this.renderOption, size: "medium", onToggle: this.handleToggle }), { empty: () => { var _a, _b; return (_b = (_a = this.$slots).empty) === null || _b === void 0 ? void 0 : _b.call(_a); } }), [
+                                    ], treeMate: this.treeMate, multiple: false, renderLabel: this.renderLabel, renderOption: this.renderOption, size: "medium", onToggle: this.handleToggle, scrollbarProps: this.scrollbarProps }), { empty: () => { var _a, _b; return (_b = (_a = this.$slots).empty) === null || _b === void 0 ? void 0 : _b.call(_a); } }), [
                                     [
                                         vdirs_1.clickoutside,
                                         this.handleClickOutsideMenu,

package/lib/breadcrumb/src/BreadcrumbItem.d.ts

@@ -6,6 +6,10 @@ export declare const breadcrumbItemProps: {
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly showSeparator: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly onClick: PropType<(e: MouseEvent) => void>;
 };
 export type BreadcrumbItemProps = Partial<ExtractPropTypes<typeof breadcrumbItemProps>>;
@@ -20,6 +24,10 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly showSeparator: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly onClick: PropType<(e: MouseEvent) => void>;
 }>, (() => null) | (() => JSX.Element), {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ExtractPropTypes<{
     readonly separator: StringConstructor;
@@ -28,8 +36,13 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         readonly type: BooleanConstructor;
         readonly default: true;
     };
+    readonly showSeparator: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
     readonly onClick: PropType<(e: MouseEvent) => void>;
 }>> & Readonly<{}>, {
     readonly clickable: boolean;
+    readonly showSeparator: boolean;
 }, SlotsType<BreadcrumbItemSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/breadcrumb/src/BreadcrumbItem.js

@@ -12,6 +12,10 @@ exports.breadcrumbItemProps = {
         type: Boolean,
         default: true
     },
+    showSeparator: {
+        type: Boolean,
+        default: true
+    },
     onClick: Function
 };
 exports.default = (0, vue_1.defineComponent)({
@@ -42,12 +46,12 @@ exports.default = (0, vue_1.defineComponent)({
                     href: props.href,
                     onClick: props.onClick
                 }, slots),
-                (0, vue_1.h)("span", { class: `${mergedClsPrefix}-breadcrumb-item__separator`, "aria-hidden": "true" }, (0, _utils_1.resolveSlot)(slots.separator, () => {
+                props.showSeparator && ((0, vue_1.h)("span", { class: `${mergedClsPrefix}-breadcrumb-item__separator`, "aria-hidden": "true" }, (0, _utils_1.resolveSlot)(slots.separator, () => {
                     var _a;
                     return [
                         (_a = props.separator) !== null && _a !== void 0 ? _a : separatorRef.value
                     ];
-                }))));
+                })))));
         };
     }
 });

package/lib/button/index.d.ts

@@ -1,2 +1,3 @@
 export { buttonProps, default as NButton, XButton as NxButton } from './src/Button';
 export type { ButtonProps, ButtonSlots } from './src/Button';
+export type * from './src/public-types';

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

@@ -1,7 +1,7 @@
 import type { ButtonHTMLAttributes, ExtractPropTypes, PropType, SlotsType, VNode, VNodeChild } from 'vue';
 import type { BaseWaveRef } from '../../_internal';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
-import type { Size, Type } from './interface';
+import type { ButtonSize, ButtonSpinProps, ButtonType } from './public-types';
 export declare const buttonProps: {
     readonly color: StringConstructor;
     readonly textColor: StringConstructor;
@@ -10,7 +10,7 @@ export declare const buttonProps: {
     readonly loading: BooleanConstructor;
     readonly disabled: BooleanConstructor;
     readonly circle: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<ButtonSize>;
     readonly ghost: BooleanConstructor;
     readonly round: BooleanConstructor;
     readonly secondary: BooleanConstructor;
@@ -30,7 +30,7 @@ export declare const buttonProps: {
         readonly default: "button";
     };
     readonly type: {
-        readonly type: PropType<Type>;
+        readonly type: PropType<ButtonType>;
         readonly default: "default";
     };
     readonly dashed: BooleanConstructor;
@@ -52,6 +52,7 @@ export declare const buttonProps: {
         readonly type: BooleanConstructor;
         readonly default: boolean;
     };
+    readonly spinProps: PropType<ButtonSpinProps>;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -678,7 +679,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
     readonly loading: BooleanConstructor;
     readonly disabled: BooleanConstructor;
     readonly circle: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<ButtonSize>;
     readonly ghost: BooleanConstructor;
     readonly round: BooleanConstructor;
     readonly secondary: BooleanConstructor;
@@ -698,7 +699,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
         readonly default: "button";
     };
     readonly type: {
-        readonly type: PropType<Type>;
+        readonly type: PropType<ButtonType>;
         readonly default: "default";
     };
     readonly dashed: BooleanConstructor;
@@ -720,6 +721,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
         readonly type: BooleanConstructor;
         readonly default: boolean;
     };
+    readonly spinProps: PropType<ButtonSpinProps>;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -1398,7 +1400,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
     readonly loading: BooleanConstructor;
     readonly disabled: BooleanConstructor;
     readonly circle: BooleanConstructor;
-    readonly size: PropType<Size>;
+    readonly size: PropType<ButtonSize>;
     readonly ghost: BooleanConstructor;
     readonly round: BooleanConstructor;
     readonly secondary: BooleanConstructor;
@@ -1418,7 +1420,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
         readonly default: "button";
     };
     readonly type: {
-        readonly type: PropType<Type>;
+        readonly type: PropType<ButtonType>;
         readonly default: "default";
     };
     readonly dashed: BooleanConstructor;
@@ -1440,6 +1442,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
         readonly type: BooleanConstructor;
         readonly default: boolean;
     };
+    readonly spinProps: PropType<ButtonSpinProps>;
     readonly theme: PropType<import("../../_mixins").Theme<"Button", {
         heightTiny: string;
         heightSmall: string;
@@ -2054,7 +2057,7 @@ declare const Button: import("vue").DefineComponent<ExtractPropTypes<{
     }, any>>>;
 }>> & Readonly<{}>, {
     readonly disabled: boolean;
-    readonly type: Type;
+    readonly type: ButtonType;
     readonly bordered: boolean;
     readonly block: boolean;
     readonly loading: boolean;

package/lib/button/src/Button.js

@@ -40,7 +40,7 @@ exports.buttonProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props),
     }, onClick: [Function, Array], nativeFocusBehavior: {
         type: Boolean,
         default: !browser_1.isSafari
-    } });
+    }, spinProps: Object });
 const Button = (0, vue_1.defineComponent)({
     name: 'Button',
     props: exports.buttonProps,
@@ -67,9 +67,11 @@ const Button = (0, vue_1.defineComponent)({
                 && props.bordered);
         });
         const NButtonGroup = (0, vue_1.inject)(context_1.buttonGroupInjectionKey, {});
+        const { inlineThemeDisabled, mergedClsPrefixRef, mergedRtlRef, mergedComponentPropsRef } = (0, _mixins_1.useConfig)(props);
         const { mergedSizeRef } = (0, _mixins_1.useFormItem)({}, {
             defaultSize: 'medium',
             mergedSize: (NFormItem) => {
+                var _a, _b;
                 const { size } = props;
                 if (size)
                     return size;
@@ -77,9 +79,11 @@ const Button = (0, vue_1.defineComponent)({
                 if (buttonGroupSize)
                     return buttonGroupSize;
                 const { mergedSize: formItemSize } = NFormItem || {};
-                if (formItemSize) {
+                if (formItemSize)
                     return formItemSize.value;
-                }
+                const configSize = (_b = (_a = mergedComponentPropsRef === null || mergedComponentPropsRef === void 0 ? void 0 : mergedComponentPropsRef.value) === null || _a === void 0 ? void 0 : _a.Button) === null || _b === void 0 ? void 0 : _b.size;
+                if (configSize)
+                    return configSize;
                 return 'medium';
             }
         });
@@ -137,7 +141,6 @@ const Button = (0, vue_1.defineComponent)({
         const handleBlur = () => {
             enterPressedRef.value = false;
         };
-        const { inlineThemeDisabled, mergedClsPrefixRef, mergedRtlRef } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('Button', '-button', index_cssr_1.default, styles_1.buttonLight, props, mergedClsPrefixRef);
         const rtlEnabledRef = (0, use_rtl_1.useRtl)('Button', mergedRtlRef, mergedClsPrefixRef);
         const cssVarsRef = (0, vue_1.computed)(() => {
@@ -456,7 +459,7 @@ const Button = (0, vue_1.defineComponent)({
                         margin: (0, _utils_1.isSlotEmpty)(this.$slots.default) ? '0' : ''
                     } },
                     (0, vue_1.h)(_internal_1.NIconSwitchTransition, null, {
-                        default: () => this.loading ? ((0, vue_1.h)(_internal_1.NBaseLoading, { clsPrefix: mergedClsPrefix, key: "loading", class: `${mergedClsPrefix}-icon-slot`, strokeWidth: 20 })) : ((0, vue_1.h)("div", { key: "icon", class: `${mergedClsPrefix}-icon-slot`, role: "none" }, this.renderIcon ? this.renderIcon() : children))
+                        default: () => this.loading ? ((0, vue_1.h)(_internal_1.NBaseLoading, Object.assign({ clsPrefix: mergedClsPrefix, key: "loading", class: `${mergedClsPrefix}-icon-slot`, strokeWidth: 20 }, this.spinProps))) : ((0, vue_1.h)("div", { key: "icon", class: `${mergedClsPrefix}-icon-slot`, role: "none" }, this.renderIcon ? this.renderIcon() : children))
                     }))))
             }),
             this.iconPlacement === 'left' && children,

package/lib/button/src/public-types.d.ts

@@ -0,0 +1,4 @@
+import type { SharedSpinProps } from '../../_internal';
+export type ButtonSize = 'tiny' | 'small' | 'medium' | 'large';
+export type ButtonSpinProps = SharedSpinProps;
+export type ButtonType = 'default' | 'tertiary' | 'primary' | 'info' | 'success' | 'warning' | 'error';

package/lib/button-group/src/ButtonGroup.d.ts

@@ -1,34 +1,24 @@
 import type { PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
-import type { Size } from '../../button/src/interface';
+import type { ButtonSize } from '../../button/src/public-types';
 export interface ButtonGroupInjection {
-    size?: Size | undefined;
+    size?: ButtonSize | undefined;
 }
 export declare const buttonGroupProps: {
-    readonly size: {
-        readonly type: PropType<Size | undefined>;
-        readonly default: undefined;
-    };
+    readonly size: PropType<ButtonSize | undefined>;
     readonly vertical: BooleanConstructor;
 };
 export type ButtonGroupProps = ExtractPublicPropTypes<typeof buttonGroupProps>;
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    readonly size: {
-        readonly type: PropType<Size | undefined>;
-        readonly default: undefined;
-    };
+    readonly size: PropType<ButtonSize | undefined>;
     readonly vertical: BooleanConstructor;
 }>, {
     rtlEnabled: import("vue").Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined, import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
     mergedClsPrefix: import("vue").Ref<string, string>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    readonly size: {
-        readonly type: PropType<Size | undefined>;
-        readonly default: undefined;
-    };
+    readonly size: PropType<ButtonSize | undefined>;
     readonly vertical: BooleanConstructor;
 }>> & Readonly<{}>, {
-    readonly size: Size | undefined;
     readonly vertical: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/button-group/src/ButtonGroup.js

@@ -10,10 +10,7 @@ const use_rtl_1 = require("../../_mixins/use-rtl");
 const context_1 = require("./context");
 const index_cssr_1 = __importDefault(require("./styles/index.cssr"));
 exports.buttonGroupProps = {
-    size: {
-        type: String,
-        default: undefined
-    },
+    size: String,
     vertical: Boolean
 };
 exports.default = (0, vue_1.defineComponent)({

package/lib/card/index.d.ts

@@ -1,2 +1,3 @@
 export { cardProps, default as NCard } from './src/Card';
 export type { CardProps, CardSegmented, CardSlots } from './src/Card';
+export type * from './src/public-types';

package/lib/card/src/Card.d.ts

@@ -1,5 +1,6 @@
 import type { CSSProperties, PropType, SlotsType, VNode, VNodeChild } from 'vue';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
+import type { CardSize } from './public-types';
 export interface CardSegmented {
     content?: boolean | 'soft';
     footer?: boolean | 'soft';
@@ -9,6 +10,7 @@ export declare const cardBaseProps: {
     readonly title: PropType<string | (() => VNodeChild)>;
     readonly contentClass: StringConstructor;
     readonly contentStyle: PropType<CSSProperties | string>;
+    readonly contentScrollable: BooleanConstructor;
     readonly headerClass: StringConstructor;
     readonly headerStyle: PropType<CSSProperties | string>;
     readonly headerExtraClass: StringConstructor;
@@ -20,10 +22,7 @@ export declare const cardBaseProps: {
         readonly type: PropType<boolean | CardSegmented>;
         readonly default: false;
     };
-    readonly size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    readonly size: PropType<CardSize>;
     readonly bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -43,11 +42,12 @@ export declare const cardBaseProps: {
     readonly headerExtra: PropType<() => VNodeChild>;
     readonly closeFocusable: BooleanConstructor;
 };
-export declare const cardBasePropKeys: ("size" | "title" | "bordered" | "closable" | "onClose" | "content" | "cover" | "footer" | "tag" | "contentClass" | "contentStyle" | "headerClass" | "headerStyle" | "headerExtraClass" | "headerExtraStyle" | "footerClass" | "footerStyle" | "embedded" | "segmented" | "hoverable" | "role" | "action" | "headerExtra" | "closeFocusable")[];
+export declare const cardBasePropKeys: ("size" | "title" | "bordered" | "closable" | "onClose" | "content" | "contentClass" | "contentStyle" | "cover" | "footer" | "tag" | "contentScrollable" | "headerClass" | "headerStyle" | "headerExtraClass" | "headerExtraStyle" | "footerClass" | "footerStyle" | "embedded" | "segmented" | "hoverable" | "role" | "action" | "headerExtra" | "closeFocusable")[];
 export declare const cardProps: {
     title: PropType<string | (() => VNodeChild)>;
     contentClass: StringConstructor;
     contentStyle: PropType<CSSProperties | string>;
+    contentScrollable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -59,10 +59,7 @@ export declare const cardProps: {
         readonly type: PropType<boolean | CardSegmented>;
         readonly default: false;
     };
-    size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    size: PropType<CardSize>;
     bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -206,6 +203,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     title: PropType<string | (() => VNodeChild)>;
     contentClass: StringConstructor;
     contentStyle: PropType<CSSProperties | string>;
+    contentScrollable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -217,10 +215,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: PropType<boolean | CardSegmented>;
         readonly default: false;
     };
-    size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    size: PropType<CardSize>;
     bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -435,6 +430,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     title: PropType<string | (() => VNodeChild)>;
     contentClass: StringConstructor;
     contentStyle: PropType<CSSProperties | string>;
+    contentScrollable: BooleanConstructor;
     headerClass: StringConstructor;
     headerStyle: PropType<CSSProperties | string>;
     headerExtraClass: StringConstructor;
@@ -446,10 +442,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly type: PropType<boolean | CardSegmented>;
         readonly default: false;
     };
-    size: {
-        readonly type: PropType<"small" | "medium" | "large" | "huge">;
-        readonly default: "medium";
-    };
+    size: PropType<CardSize>;
     bordered: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -580,10 +573,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         closeSize: string;
     }, any>>>;
 }>> & Readonly<{}>, {
-    size: "small" | "medium" | "large" | "huge";
     bordered: boolean;
     closable: boolean;
     tag: keyof HTMLElementTagNameMap;
+    contentScrollable: boolean;
     embedded: boolean;
     segmented: boolean | CardSegmented;
     hoverable: boolean;