naive-ui 2.35.0 → 2.36.0

package/es/virtual-list/index.js

@@ -0,0 +1 @@
+export { default as NVirtualList, virtualListProps } from './src/VirtualList';

package/es/virtual-list/src/VirtualList.d.ts

@@ -0,0 +1,146 @@
+import { type PropType, type CSSProperties } from 'vue';
+import type { ExtractPublicPropTypes } from '../../_utils';
+import { type ScrollbarProps } from '../../scrollbar/src/Scrollbar';
+import { type VScrollToOptions, type ItemData } from 'vueuc/lib/virtual-list/src/type';
+export { type VirtualListInst } from 'vueuc';
+export declare const virtualListProps: {
+    readonly scrollbarProps: PropType<ScrollbarProps>;
+    readonly items: {
+        readonly type: PropType<ItemData[]>;
+        readonly default: () => never[];
+    };
+    readonly itemSize: {
+        readonly type: NumberConstructor;
+        readonly required: true;
+    };
+    readonly itemResizable: BooleanConstructor;
+    readonly itemsStyle: PropType<string | CSSProperties>;
+    readonly visibleItemsTag: {
+        readonly type: PropType<string | object>;
+        readonly default: "div";
+    };
+    readonly visibleItemsProps: ObjectConstructor;
+    readonly ignoreItemResize: BooleanConstructor;
+    readonly onScroll: PropType<(event: Event) => void>;
+    readonly onWheel: PropType<(event: WheelEvent) => void>;
+    readonly onResize: PropType<(entry: ResizeObserverEntry) => void>;
+    readonly defaultScrollKey: PropType<string | number>;
+    readonly defaultScrollIndex: NumberConstructor;
+    readonly keyField: {
+        readonly type: StringConstructor;
+        readonly default: "key";
+    };
+    readonly paddingTop: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+    readonly paddingBottom: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+};
+export type VirtualListProps = ExtractPublicPropTypes<typeof virtualListProps>;
+declare const _default: import("vue").DefineComponent<{
+    readonly scrollbarProps: PropType<ScrollbarProps>;
+    readonly items: {
+        readonly type: PropType<ItemData[]>;
+        readonly default: () => never[];
+    };
+    readonly itemSize: {
+        readonly type: NumberConstructor;
+        readonly required: true;
+    };
+    readonly itemResizable: BooleanConstructor;
+    readonly itemsStyle: PropType<string | CSSProperties>;
+    readonly visibleItemsTag: {
+        readonly type: PropType<string | object>;
+        readonly default: "div";
+    };
+    readonly visibleItemsProps: ObjectConstructor;
+    readonly ignoreItemResize: BooleanConstructor;
+    readonly onScroll: PropType<(event: Event) => void>;
+    readonly onWheel: PropType<(event: WheelEvent) => void>;
+    readonly onResize: PropType<(entry: ResizeObserverEntry) => void>;
+    readonly defaultScrollKey: PropType<string | number>;
+    readonly defaultScrollIndex: NumberConstructor;
+    readonly keyField: {
+        readonly type: StringConstructor;
+        readonly default: "key";
+    };
+    readonly paddingTop: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+    readonly paddingBottom: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+}, {
+    scrollTo: (options: VScrollToOptions | number, y?: number) => void;
+    scrollbarInstRef: import("vue").Ref<{
+        $el: HTMLElement;
+        containerRef: HTMLElement | null;
+        contentRef: HTMLElement | null;
+        containerScrollTop: number;
+        syncUnifiedContainer: () => void;
+        scrollTo: import("../../_internal/scrollbar/src/Scrollbar").ScrollTo;
+        scrollBy: import("../../_internal/scrollbar/src/Scrollbar").ScrollBy;
+        sync: () => void;
+        handleMouseEnterWrapper: () => void;
+        handleMouseLeaveWrapper: () => void;
+    } | null>;
+    virtualListInstRef: import("vue").Ref<{
+        listElRef: HTMLElement;
+        itemsElRef: HTMLElement | null;
+        scrollTo: import("vueuc/lib/virtual-list/src/VirtualList").ScrollTo;
+    } | null>;
+    getScrollContainer: () => HTMLElement | null | undefined;
+    getScrollContent: () => HTMLElement | null | undefined;
+    handleScroll: (e: Event) => void;
+    handleResize: (e: ResizeObserverEntry) => void;
+    handleWheel: (e: WheelEvent) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly scrollbarProps: PropType<ScrollbarProps>;
+    readonly items: {
+        readonly type: PropType<ItemData[]>;
+        readonly default: () => never[];
+    };
+    readonly itemSize: {
+        readonly type: NumberConstructor;
+        readonly required: true;
+    };
+    readonly itemResizable: BooleanConstructor;
+    readonly itemsStyle: PropType<string | CSSProperties>;
+    readonly visibleItemsTag: {
+        readonly type: PropType<string | object>;
+        readonly default: "div";
+    };
+    readonly visibleItemsProps: ObjectConstructor;
+    readonly ignoreItemResize: BooleanConstructor;
+    readonly onScroll: PropType<(event: Event) => void>;
+    readonly onWheel: PropType<(event: WheelEvent) => void>;
+    readonly onResize: PropType<(entry: ResizeObserverEntry) => void>;
+    readonly defaultScrollKey: PropType<string | number>;
+    readonly defaultScrollIndex: NumberConstructor;
+    readonly keyField: {
+        readonly type: StringConstructor;
+        readonly default: "key";
+    };
+    readonly paddingTop: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+    readonly paddingBottom: {
+        readonly type: PropType<string | number>;
+        readonly default: 0;
+    };
+}>>, {
+    readonly paddingBottom: string | number;
+    readonly paddingTop: string | number;
+    readonly items: ItemData[];
+    readonly itemResizable: boolean;
+    readonly visibleItemsTag: string | object;
+    readonly ignoreItemResize: boolean;
+    readonly keyField: string;
+}, {}>;
+export default _default;

package/es/virtual-list/src/VirtualList.js

@@ -0,0 +1,102 @@
+import { h, defineComponent, ref } from 'vue';
+import { NxScrollbar } from '../../_internal';
+import { VVirtualList } from 'vueuc';
+export const virtualListProps = {
+    scrollbarProps: Object,
+    items: {
+        type: Array,
+        default: () => []
+    },
+    itemSize: {
+        type: Number,
+        required: true
+    },
+    itemResizable: Boolean,
+    itemsStyle: [String, Object],
+    visibleItemsTag: {
+        type: [String, Object],
+        default: 'div'
+    },
+    visibleItemsProps: Object,
+    ignoreItemResize: Boolean,
+    onScroll: Function,
+    onWheel: Function,
+    onResize: Function,
+    defaultScrollKey: [Number, String],
+    defaultScrollIndex: Number,
+    keyField: {
+        type: String,
+        default: 'key'
+    },
+    paddingTop: {
+        type: [Number, String],
+        default: 0
+    },
+    paddingBottom: {
+        type: [Number, String],
+        default: 0
+    }
+};
+export default defineComponent({
+    name: 'VirtualList',
+    props: virtualListProps,
+    setup(props) {
+        const scrollbarInstRef = ref(null);
+        const virtualListInstRef = ref(null);
+        function syncScrollbar() {
+            const { value: scrollbarInst } = scrollbarInstRef;
+            if (scrollbarInst)
+                scrollbarInst.sync();
+        }
+        function handleScroll(e) {
+            var _a;
+            syncScrollbar();
+            (_a = props.onScroll) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        }
+        function handleResize(e) {
+            var _a;
+            syncScrollbar();
+            (_a = props.onResize) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        }
+        function handleWheel(e) {
+            var _a;
+            (_a = props.onWheel) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        }
+        function scrollTo(options, y) {
+            var _a, _b;
+            if (typeof options === 'number') {
+                (_a = virtualListInstRef.value) === null || _a === void 0 ? void 0 : _a.scrollTo(options, y !== null && y !== void 0 ? y : 0);
+            }
+            else {
+                (_b = virtualListInstRef.value) === null || _b === void 0 ? void 0 : _b.scrollTo(options);
+            }
+        }
+        function getScrollContainer() {
+            var _a;
+            return (_a = virtualListInstRef.value) === null || _a === void 0 ? void 0 : _a.listElRef;
+        }
+        function getScrollContent() {
+            var _a;
+            return (_a = virtualListInstRef.value) === null || _a === void 0 ? void 0 : _a.itemsElRef;
+        }
+        return {
+            scrollTo,
+            scrollbarInstRef,
+            virtualListInstRef,
+            getScrollContainer,
+            getScrollContent,
+            handleScroll,
+            handleResize,
+            handleWheel
+        };
+    },
+    render() {
+        return (h(NxScrollbar, Object.assign({}, this.scrollbarProps, { ref: "scrollbarInstRef", container: this.getScrollContainer, content: this.getScrollContent }), {
+            default: () => {
+                return (h(VVirtualList, { ref: "virtualListInstRef", showScrollbar: false, items: this.items, itemSize: this.itemSize, itemResizable: this.itemResizable, itemsStyle: this.itemsStyle, visibleItemsTag: this.visibleItemsTag, visibleItemsProps: this.visibleItemsProps, ignoreItemResize: this.ignoreItemResize, keyField: this.keyField, defaultScrollKey: this.defaultScrollKey, defaultScrollIndex: this.defaultScrollIndex, paddingTop: this.paddingTop, paddingBottom: this.paddingBottom, onScroll: this.handleScroll, onResize: this.handleResize, onWheel: this.handleWheel }, {
+                    default: ({ item, index }) => { var _a, _b; return (_b = (_a = this.$slots).default) === null || _b === void 0 ? void 0 : _b.call(_a, { item, index }); }
+                }));
+            }
+        }));
+    }
+});

package/es/watermark/src/Watermark.js

@@ -129,6 +129,13 @@ export default defineComponent({
                     ctx.fillText(content, canvasOffsetLeft, canvasOffsetTop + lineHeight * ratio);
                     base64UrlRef.value = canvas.toDataURL();
                 }
+                else if (!content) {
+                    // For example, you are using the input box to customize the watermark
+                    // content, but after clearing the input box, the content is empty,
+                    // and the canvas content is empty. Clear canvas when content is empty
+                    ctx.clearRect(0, 0, canvas.width, canvas.height);
+                    base64UrlRef.value = canvas.toDataURL();
+                }
             }
             else {
                 warnOnce('watermark', 'Canvas is not supported in the browser.');

package/lib/_internal/fade-in-expand-transition/src/FadeInExpandTransition.js

@@ -104,6 +104,7 @@ exports.default = (0, vue_1.defineComponent)({
                 ;
                 resolvedProps.mode = mode;
             }
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
             return (0, vue_1.h)(type, resolvedProps, slots);
         };
     }

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

@@ -553,11 +553,14 @@ const Scrollbar = (0, vue_1.defineComponent)({
         if (!this.scrollable)
             return (_a = $slots.default) === null || _a === void 0 ? void 0 : _a.call($slots);
         const triggerIsNone = this.trigger === 'none';
-        const createYRail = (style) => {
+        const createYRail = (className, style) => {
             return ((0, vue_1.h)("div", { ref: "yRailRef", class: [
                     `${mergedClsPrefix}-scrollbar-rail`,
-                    `${mergedClsPrefix}-scrollbar-rail--vertical`
-                ], "data-scrollbar-rail": true, style: [style || '', this.verticalRailStyle], "aria-hiddens": true }, (0, vue_1.h)((triggerIsNone ? _utils_1.Wrapper : vue_1.Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
+                    `${mergedClsPrefix}-scrollbar-rail--vertical`,
+                    className
+                ], "data-scrollbar-rail": true, style: [style || '', this.verticalRailStyle], "aria-hiddens": true }, (0, vue_1.h)(
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+            (triggerIsNone ? _utils_1.Wrapper : vue_1.Transition), triggerIsNone ? null : { 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
@@ -598,11 +601,13 @@ const Scrollbar = (0, vue_1.defineComponent)({
                                 this.contentClass
                             ] }, $slots))
                     }))),
-                internalHoistYRail ? null : createYRail(undefined),
+                internalHoistYRail ? null : createYRail(undefined, undefined),
                 this.xScrollable && ((0, vue_1.h)("div", { ref: "xRailRef", class: [
                         `${mergedClsPrefix}-scrollbar-rail`,
                         `${mergedClsPrefix}-scrollbar-rail--horizontal`
-                    ], style: this.horizontalRailStyle, "data-scrollbar-rail": true, "aria-hidden": true }, (0, vue_1.h)((triggerIsNone ? _utils_1.Wrapper : vue_1.Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
+                    ], style: this.horizontalRailStyle, "data-scrollbar-rail": true, "aria-hidden": true }, (0, vue_1.h)(
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                (triggerIsNone ? _utils_1.Wrapper : vue_1.Transition), triggerIsNone ? null : { 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,
                             right: rtlEnabled ? this.xBarLeftPx : undefined,
@@ -617,7 +622,7 @@ const Scrollbar = (0, vue_1.defineComponent)({
         if (internalHoistYRail) {
             return ((0, vue_1.h)(vue_1.Fragment, null,
                 scrollbarNode,
-                createYRail(this.cssVars)));
+                createYRail(this.themeClass, this.cssVars)));
         }
         else {
             return scrollbarNode;

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

@@ -424,8 +424,8 @@ declare const _default: import("vue").DefineComponent<{
     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 | any>, selected: boolean) => import("vue").VNodeChild)>, SelectGroupOption, SelectIgnoredOption>[]>;
     empty: import("vue").ComputedRef<boolean>;
-    virtualListContainer(): HTMLElement;
-    virtualListContent(): HTMLElement;
+    virtualListContainer(): HTMLElement | undefined;
+    virtualListContent(): HTMLElement | null | undefined;
     doScroll: (e: Event) => void;
     handleFocusin: (e: FocusEvent) => void;
     handleFocusout: (e: FocusEvent) => void;
@@ -689,8 +689,8 @@ declare const _default: import("vue").DefineComponent<{
     size: Size;
     show: boolean;
     multiple: boolean;
-    focusable: boolean;
     loading: boolean;
+    focusable: boolean;
     inlineThemeDisabled: boolean;
     scrollable: boolean;
     showCheckmark: boolean;

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

@@ -329,6 +329,7 @@ exports.default = (0, vue_1.defineComponent)({
                 themeClass,
                 this.multiple && `${clsPrefix}-base-select-menu--multiple`
             ], 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 }, {
                 default: () => {

package/lib/_internal/select-menu/src/styles/index.cssr.js

@@ -48,6 +48,14 @@ exports.default = (0, cssr_1.cB)('base-select-menu', `
  `), (0, cssr_1.cE)('loading', `
  color: var(--n-loading-color);
  font-size: var(--n-loading-size);
+ `), (0, cssr_1.cE)('header', `
+ padding: 8px var(--n-option-padding-left);
+ font-size: var(--n-option-font-size);
+ transition: 
+ color .3s var(--n-bezier),
+ border-color .3s var(--n-bezier);
+ border-bottom: 1px solid var(--n-action-divider-color);
+ color: var(--n-action-text-color);
  `), (0, cssr_1.cE)('action', `
  padding: 8px var(--n-option-padding-left);
  font-size: var(--n-option-font-size);

package/lib/_internal/selection/src/Selection.d.ts

@@ -488,7 +488,9 @@ declare const _default: import("vue").DefineComponent<{
     singleElRef: import("vue").Ref<HTMLElement | null>;
     patternInputWrapperRef: import("vue").Ref<HTMLElement | null>;
     overflowRef: import("vue").Ref<{
-        sync: () => void;
+        sync: (options: {
+            showAllItemsBeforeCalculate: boolean;
+        }) => void;
     } | null>;
     inputTagElRef: import("vue").Ref<HTMLElement | null>;
     handleMouseDown: (e: MouseEvent) => void;

package/lib/_internal/selection/src/Selection.js

@@ -92,7 +92,9 @@ exports.default = (0, vue_1.defineComponent)({
                 if (patternInputEl) {
                     patternInputEl.style.width = `${patternInputMirrorEl.offsetWidth}px`;
                     if (props.maxTagCount !== 'responsive') {
-                        (_a = overflowRef.value) === null || _a === void 0 ? void 0 : _a.sync();
+                        (_a = overflowRef.value) === null || _a === void 0 ? void 0 : _a.sync({
+                            showAllItemsBeforeCalculate: false
+                        });
                     }
                 }
             }
@@ -505,7 +507,7 @@ exports.default = (0, vue_1.defineComponent)({
                 } }, {
                 default: createOriginalTagNodes,
                 counter: renderCounter
-            }))) : maxTagCountNumeric ? (createOriginalTagNodes().concat(counter)) : (createOriginalTagNodes());
+            }))) : maxTagCountNumeric && counter ? (createOriginalTagNodes().concat(counter)) : (createOriginalTagNodes());
             const renderPopover = useMaxTagCount
                 ? () => ((0, vue_1.h)("div", { class: `${clsPrefix}-base-selection-popover` }, maxTagCountResponsive
                     ? createOriginalTagNodes()

package/lib/_styles/common/_common.js

@@ -18,7 +18,7 @@ exports.default = {
     fontSizeLarge: '15px',
     fontSizeHuge: '16px',
     lineHeight: '1.6',
-    heightMini: '16px',
+    heightMini: '16px', // private now, it's too small
     heightTiny: '22px',
     heightSmall: '28px',
     heightMedium: '34px',

package/lib/_styles/common/light.js

@@ -16,8 +16,8 @@ const base = {
     alpha1: '0.82',
     alpha2: '0.72',
     alpha3: '0.38',
-    alpha4: '0.24',
-    alpha5: '0.18',
+    alpha4: '0.24', // disabled text, placeholder, icon
+    alpha5: '0.18', // disabled placeholder
     alphaClose: '0.6',
     alphaDisabled: '0.5',
     alphaDisabledInput: '0.02',

package/lib/_utils/composable/use-collection.d.ts

@@ -1,4 +1,4 @@
 import { type Ref, type InjectionKey } from 'vue';
-export declare function useInjectionInstanceCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, registerKeyRef: Ref<any>): void;
+export declare function useInjectionInstanceCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, registerKeyRef: Ref<string | undefined>): void;
 export declare function useInjectionCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, valueRef: Ref<any>): void;
 export declare function useInjectionElementCollection(injectionName: string | InjectionKey<unknown>, collectionKey: string, getElement: () => HTMLElement | null): void;

package/lib/_utils/composable/use-collection.js

@@ -18,6 +18,8 @@ function useInjectionInstanceCollection(injectionName, collectionKey, registerKe
         registerInstance(undefined, registerKeyRef.value);
     });
     function registerInstance(key, oldKey) {
+        if (!injection)
+            return;
         const collection = injection[collectionKey];
         if (oldKey !== undefined)
             removeInstance(collection, oldKey);

package/lib/_utils/css/color-to-class.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.color2Class = void 0;
 function color2Class(color) {
-    return color.replace(/#|\(|\)|,|\s/g, '_');
+    return color.replace(/#|\(|\)|,|\s|\./g, '_');
 }
 exports.color2Class = color2Class;

package/lib/affix/src/Affix.d.ts

@@ -27,7 +27,7 @@ export declare const affixProps: {
         readonly default: undefined;
     };
 };
-export declare const affixPropKeys: ("bottom" | "top" | "position" | "target" | "listenTo" | "triggerTop" | "triggerBottom" | "offsetTop" | "offsetBottom")[];
+export declare const affixPropKeys: ("target" | "top" | "bottom" | "position" | "listenTo" | "triggerTop" | "triggerBottom" | "offsetTop" | "offsetBottom")[];
 export type AffixProps = ExtractPublicPropTypes<typeof affixProps>;
 declare const _default: import("vue").DefineComponent<{
     readonly listenTo: PropType<string | ScrollTarget | (() => HTMLElement) | undefined>;
@@ -85,8 +85,8 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: undefined;
     };
 }>>, {
-    readonly position: "absolute" | "fix";
     readonly target: (() => HTMLElement) | undefined;
+    readonly position: "absolute" | "fix";
     readonly offsetTop: number | undefined;
     readonly offsetBottom: number | undefined;
 }, {}>;

package/lib/affix/src/Affix.js

@@ -113,11 +113,13 @@ exports.default = (0, vue_1.defineComponent)({
                 return;
             const scrollTop = (0, utils_1.getScrollTop)(scrollTarget);
             if (affixedRef.value) {
-                if (scrollTop < topAffixedTriggerScrollTopRef.value) {
+                if (topAffixedTriggerScrollTopRef.value !== null &&
+                    scrollTop < topAffixedTriggerScrollTopRef.value) {
                     stickToTopRef.value = false;
                     topAffixedTriggerScrollTopRef.value = null;
                 }
-                if (scrollTop > bottomAffixedTriggerScrollTopRef.value) {
+                if (bottomAffixedTriggerScrollTopRef.value !== null &&
+                    scrollTop > bottomAffixedTriggerScrollTopRef.value) {
                     stickToBottomRef.value = false;
                     bottomAffixedTriggerScrollTopRef.value = null;
                 }

package/lib/alert/src/Alert.js

@@ -133,7 +133,9 @@ exports.default = (0, vue_1.defineComponent)({
                     style: this.cssVars,
                     role: 'alert'
                 };
-                return this.visible ? ((0, vue_1.h)("div", Object.assign({}, (0, vue_1.mergeProps)(this.$attrs, attrs)),
+                return this.visible ? (
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                (0, vue_1.h)("div", Object.assign({}, (0, vue_1.mergeProps)(this.$attrs, attrs)),
                     this.closable && ((0, vue_1.h)(_internal_1.NBaseClose, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-alert__close`, onClick: this.handleCloseClick })),
                     this.bordered && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-alert__border` })),
                     this.showIcon && ((0, vue_1.h)("div", { class: `${mergedClsPrefix}-alert__icon`, "aria-hidden": "true" }, (0, _utils_1.resolveSlot)($slots.icon, () => [

package/lib/anchor/src/AnchorAdapter.d.ts

@@ -262,8 +262,8 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     readonly type: "block" | "rail";
     readonly bound: number;
-    readonly position: "absolute" | "fix";
     readonly target: (() => HTMLElement) | undefined;
+    readonly position: "absolute" | "fix";
     readonly affix: boolean;
     readonly offsetTop: number | undefined;
     readonly offsetBottom: number | undefined;

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

@@ -1529,8 +1529,8 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     readonly options: AutoCompleteOptions;
     readonly disabled: boolean | undefined;
-    readonly to: string | boolean | HTMLElement;
     readonly loading: boolean;
+    readonly to: string | boolean | HTMLElement;
     readonly bordered: boolean | undefined;
     readonly placement: FollowerPlacement;
     readonly clearable: boolean;

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

@@ -2054,9 +2054,9 @@ declare const Button: import("vue").DefineComponent<{
     readonly text: boolean;
     readonly circle: boolean;
     readonly disabled: boolean;
+    readonly loading: boolean;
     readonly focusable: boolean;
     readonly strong: boolean;
-    readonly loading: boolean;
     readonly bordered: boolean;
     readonly tertiary: boolean;
     readonly ghost: boolean;

package/lib/button/src/Button.js

@@ -466,7 +466,7 @@ const Button = (0, vue_1.defineComponent)({
 });
 exports.default = Button;
 // XButton is for tsx type checking
-// It's not compitable with render function `h`
+// It's not compatible with render function `h`
 // Currently we don't expose it as public
 // If there's any issue about this, we may expose it
 // Since most people use template, the type checking phase doesn't work as tsx

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

@@ -7,9 +7,13 @@ export interface CardSegmented {
 }
 export declare const cardBaseProps: {
     readonly title: StringConstructor;
+    readonly contentClass: StringConstructor;
     readonly contentStyle: PropType<string | CSSProperties>;
+    readonly headerClass: StringConstructor;
     readonly headerStyle: PropType<string | CSSProperties>;
+    readonly headerExtraClass: StringConstructor;
     readonly headerExtraStyle: PropType<string | CSSProperties>;
+    readonly footerClass: StringConstructor;
     readonly footerStyle: PropType<string | CSSProperties>;
     readonly embedded: BooleanConstructor;
     readonly segmented: {
@@ -33,12 +37,16 @@ export declare const cardBaseProps: {
         readonly default: "div";
     };
 };
-export declare const cardBasePropKeys: ("tag" | "size" | "title" | "role" | "bordered" | "closable" | "contentStyle" | "onClose" | "headerStyle" | "footerStyle" | "hoverable" | "embedded" | "headerExtraStyle" | "segmented")[];
+export declare const cardBasePropKeys: ("tag" | "size" | "title" | "role" | "bordered" | "closable" | "contentClass" | "contentStyle" | "onClose" | "headerClass" | "headerStyle" | "footerClass" | "footerStyle" | "hoverable" | "embedded" | "headerExtraClass" | "headerExtraStyle" | "segmented")[];
 export declare const cardProps: {
     title: StringConstructor;
+    contentClass: StringConstructor;
     contentStyle: PropType<string | CSSProperties>;
+    headerClass: StringConstructor;
     headerStyle: PropType<string | CSSProperties>;
+    headerExtraClass: StringConstructor;
     headerExtraStyle: PropType<string | CSSProperties>;
+    footerClass: StringConstructor;
     footerStyle: PropType<string | CSSProperties>;
     embedded: BooleanConstructor;
     segmented: {
@@ -176,9 +184,13 @@ export declare const cardProps: {
 export type CardProps = ExtractPublicPropTypes<typeof cardProps>;
 declare const _default: import("vue").DefineComponent<{
     title: StringConstructor;
+    contentClass: StringConstructor;
     contentStyle: PropType<string | CSSProperties>;
+    headerClass: StringConstructor;
     headerStyle: PropType<string | CSSProperties>;
+    headerExtraClass: StringConstructor;
     headerExtraStyle: PropType<string | CSSProperties>;
+    footerClass: StringConstructor;
     footerStyle: PropType<string | CSSProperties>;
     embedded: BooleanConstructor;
     segmented: {
@@ -499,9 +511,13 @@ declare const _default: import("vue").DefineComponent<{
     onRender: (() => void) | undefined;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     title: StringConstructor;
+    contentClass: StringConstructor;
     contentStyle: PropType<string | CSSProperties>;
+    headerClass: StringConstructor;
     headerStyle: PropType<string | CSSProperties>;
+    headerExtraClass: StringConstructor;
     headerExtraStyle: PropType<string | CSSProperties>;
+    footerClass: StringConstructor;
     footerStyle: PropType<string | CSSProperties>;
     embedded: BooleanConstructor;
     segmented: {