naive-ui 2.35.0 → 2.36.0

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

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

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

@@ -547,11 +547,14 @@ const Scrollbar = 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 (h("div", { ref: "yRailRef", class: [
                     `${mergedClsPrefix}-scrollbar-rail`,
-                    `${mergedClsPrefix}-scrollbar-rail--vertical`
-                ], "data-scrollbar-rail": true, style: [style || '', this.verticalRailStyle], "aria-hiddens": true }, h((triggerIsNone ? Wrapper : Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
+                    `${mergedClsPrefix}-scrollbar-rail--vertical`,
+                    className
+                ], "data-scrollbar-rail": true, style: [style || '', this.verticalRailStyle], "aria-hiddens": true }, h(
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+            (triggerIsNone ? Wrapper : Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
                 default: () => this.needYBar && this.isShowYBar && !this.isIos ? (h("div", { class: `${mergedClsPrefix}-scrollbar-rail__scrollbar`, style: {
                         height: this.yBarSizePx,
                         top: this.yBarTopPx
@@ -592,11 +595,13 @@ const Scrollbar = defineComponent({
                                 this.contentClass
                             ] }, $slots))
                     }))),
-                internalHoistYRail ? null : createYRail(undefined),
+                internalHoistYRail ? null : createYRail(undefined, undefined),
                 this.xScrollable && (h("div", { ref: "xRailRef", class: [
                         `${mergedClsPrefix}-scrollbar-rail`,
                         `${mergedClsPrefix}-scrollbar-rail--horizontal`
-                    ], style: this.horizontalRailStyle, "data-scrollbar-rail": true, "aria-hidden": true }, h((triggerIsNone ? Wrapper : Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
+                    ], style: this.horizontalRailStyle, "data-scrollbar-rail": true, "aria-hidden": true }, h(
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                (triggerIsNone ? Wrapper : Transition), triggerIsNone ? null : { name: 'fade-in-transition' }, {
                     default: () => this.needXBar && this.isShowXBar && !this.isIos ? (h("div", { class: `${mergedClsPrefix}-scrollbar-rail__scrollbar`, style: {
                             width: this.xBarSizePx,
                             right: rtlEnabled ? this.xBarLeftPx : undefined,
@@ -611,7 +616,7 @@ const Scrollbar = defineComponent({
         if (internalHoistYRail) {
             return (h(Fragment, null,
                 scrollbarNode,
-                createYRail(this.cssVars)));
+                createYRail(this.themeClass, this.cssVars)));
         }
         else {
             return scrollbarNode;

package/es/_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/es/_internal/select-menu/src/SelectMenu.js

@@ -324,6 +324,7 @@ export default 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 },
+            resolveWrappedSlot($slots.header, (children) => children && (h("div", { class: `${clsPrefix}-base-select-menu__header`, "data-header": true, key: "header" }, children))),
             this.loading ? (h("div", { class: `${clsPrefix}-base-select-menu__loading` },
                 h(NInternalLoading, { clsPrefix: clsPrefix, strokeWidth: 20 }))) : !this.empty ? (h(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/es/_internal/select-menu/src/styles/index.cssr.js

@@ -43,6 +43,14 @@ export default cB('base-select-menu', `
  `), cE('loading', `
  color: var(--n-loading-color);
  font-size: var(--n-loading-size);
+ `), 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);
  `), cE('action', `
  padding: 8px var(--n-option-padding-left);
  font-size: var(--n-option-font-size);

package/es/_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/es/_internal/selection/src/Selection.js

@@ -87,7 +87,9 @@ export default 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
+                        });
                     }
                 }
             }
@@ -500,7 +502,7 @@ export default defineComponent({
                 } }, {
                 default: createOriginalTagNodes,
                 counter: renderCounter
-            }))) : maxTagCountNumeric ? (createOriginalTagNodes().concat(counter)) : (createOriginalTagNodes());
+            }))) : maxTagCountNumeric && counter ? (createOriginalTagNodes().concat(counter)) : (createOriginalTagNodes());
             const renderPopover = useMaxTagCount
                 ? () => (h("div", { class: `${clsPrefix}-base-selection-popover` }, maxTagCountResponsive
                     ? createOriginalTagNodes()

package/es/_styles/common/_common.js

@@ -16,7 +16,7 @@ export 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/es/_styles/common/light.js

@@ -11,8 +11,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/es/_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/es/_utils/composable/use-collection.js

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

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

@@ -1,3 +1,3 @@
 export function color2Class(color) {
-    return color.replace(/#|\(|\)|,|\s/g, '_');
+    return color.replace(/#|\(|\)|,|\s|\./g, '_');
 }

package/es/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/es/affix/src/Affix.js

@@ -107,11 +107,13 @@ export default defineComponent({
                 return;
             const scrollTop = 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/es/alert/src/Alert.js

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

package/es/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/es/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/es/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/es/button/src/Button.js

@@ -460,7 +460,7 @@ const Button = defineComponent({
 });
 export 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/es/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: {

package/es/card/src/Card.js

@@ -8,9 +8,13 @@ import { cardLight } from '../styles';
 import style from './styles/index.cssr';
 export const cardBaseProps = {
     title: String,
+    contentClass: String,
     contentStyle: [Object, String],
+    headerClass: String,
     headerStyle: [Object, String],
+    headerExtraClass: String,
     headerExtraStyle: [Object, String],
+    footerClass: String,
     footerStyle: [Object, String],
     embedded: Boolean,
     segmented: {
@@ -101,7 +105,7 @@ export default defineComponent({
         };
     },
     render() {
-        const { segmented, bordered, hoverable, mergedClsPrefix, rtlEnabled, onRender, embedded, tag: Component, $slots } = this;
+        const { footerStyle, headerExtraClass, headerClass, contentClass, segmented, bordered, hoverable, mergedClsPrefix, rtlEnabled, onRender, embedded, tag: Component, $slots } = this;
         onRender === null || onRender === void 0 ? void 0 : onRender();
         return (h(Component, { class: [
                 `${mergedClsPrefix}-card`,
@@ -122,14 +126,17 @@ export default defineComponent({
             ], style: this.cssVars, role: this.role },
             resolveWrappedSlot($slots.cover, (children) => children && (h("div", { class: `${mergedClsPrefix}-card-cover`, role: "none" }, children))),
             resolveWrappedSlot($slots.header, (children) => {
-                return children || this.title || this.closable ? (h("div", { class: `${mergedClsPrefix}-card-header`, style: this.headerStyle },
+                return children || this.title || this.closable ? (h("div", { class: [`${mergedClsPrefix}-card-header`, headerClass], style: this.headerStyle },
                     h("div", { class: `${mergedClsPrefix}-card-header__main`, role: "heading" }, children || this.title),
-                    resolveWrappedSlot($slots['header-extra'], (children) => children && (h("div", { class: `${mergedClsPrefix}-card-header__extra`, style: this.headerExtraStyle }, children))),
+                    resolveWrappedSlot($slots['header-extra'], (children) => children && (h("div", { class: [
+                            `${mergedClsPrefix}-card-header__extra`,
+                            headerExtraClass
+                        ], style: this.headerExtraStyle }, children))),
                     this.closable ? (h(NBaseClose, { clsPrefix: mergedClsPrefix, class: `${mergedClsPrefix}-card-header__close`, onClick: this.handleCloseClick, absolute: true })) : null)) : null;
             }),
-            resolveWrappedSlot($slots.default, (children) => children && (h("div", { class: `${mergedClsPrefix}-card__content`, style: this.contentStyle, role: "none" }, children))),
+            resolveWrappedSlot($slots.default, (children) => children && (h("div", { class: [`${mergedClsPrefix}-card__content`, contentClass], style: this.contentStyle, role: "none" }, children))),
             resolveWrappedSlot($slots.footer, (children) => children && [
-                h("div", { class: `${mergedClsPrefix}-card__footer`, style: this.footerStyle, role: "none" }, children)
+                h("div", { class: [`${mergedClsPrefix}-card__footer`, footerStyle], style: this.footerStyle, role: "none" }, children)
             ]),
             resolveWrappedSlot($slots.action, (children) => children && (h("div", { class: `${mergedClsPrefix}-card__action`, role: "none" }, children)))));
     }

package/es/carousel/src/Carousel.d.ts

@@ -2,7 +2,7 @@ import type { CSSProperties, PropType, Ref, TransitionProps, VNode } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
 import type { ArrowScopedSlotProps, DotScopedSlotProps, Size } from './interface';
 declare const transitionProperties: readonly ["transitionDuration", "transitionTimingFunction"];
-type TransitionStyle = Partial<Pick<CSSProperties, typeof transitionProperties[number]>>;
+type TransitionStyle = Partial<Pick<CSSProperties, (typeof transitionProperties)[number]>>;
 export declare const carouselProps: {
     defaultIndex: {
         type: NumberConstructor;
@@ -15,7 +15,7 @@ export declare const carouselProps: {
         default: string;
     };
     dotPlacement: {
-        type: PropType<"left" | "right" | "bottom" | "top">;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: string;
     };
     slidesPerView: {
@@ -109,7 +109,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     dotPlacement: {
-        type: PropType<"left" | "right" | "bottom" | "top">;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: string;
     };
     slidesPerView: {
@@ -246,7 +246,7 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
     };
     dotPlacement: {
-        type: PropType<"left" | "right" | "bottom" | "top">;
+        type: PropType<"left" | "right" | "top" | "bottom">;
         default: string;
     };
     slidesPerView: {
@@ -336,7 +336,7 @@ declare const _default: import("vue").DefineComponent<{
     keyboard: boolean;
     dotType: "dot" | "line";
     defaultIndex: number;
-    dotPlacement: "left" | "right" | "bottom" | "top";
+    dotPlacement: "left" | "right" | "top" | "bottom";
     slidesPerView: number | "auto";
     spaceBetween: number;
     centeredSlides: boolean;

package/es/carousel/src/Carousel.js

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-argument */
 import { h, defineComponent, ref, cloneVNode, computed, onBeforeUnmount, watch, withDirectives, vShow, Transition, toRef, nextTick, onMounted, watchEffect, normalizeStyle, onUpdated } from 'vue';
 import { VResizeObserver } from 'vueuc';
 import { useMergedState } from 'vooks';
@@ -442,7 +443,7 @@ export default defineComponent({
                 dragStartX = touchEvent.clientX;
             }
             if (props.touchable) {
-                on('touchmove', document, handleTouchmove, { passive: true });
+                on('touchmove', document, handleTouchmove);
                 on('touchend', document, handleTouchend);
                 on('touchcancel', document, handleTouchend);
             }

package/es/checkbox/src/Checkbox.d.ts

@@ -23,11 +23,11 @@ export declare const checkboxProps: {
         default: boolean;
     };
     checkedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     uncheckedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     'onUpdate:checked': PropType<MaybeArray<OnUpdateChecked>>;
@@ -148,11 +148,11 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     checkedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     uncheckedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     'onUpdate:checked': PropType<MaybeArray<OnUpdateChecked>>;
@@ -451,11 +451,11 @@ declare const _default: import("vue").DefineComponent<{
         default: boolean;
     };
     checkedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     uncheckedValue: {
-        type: (BooleanConstructor | StringConstructor | NumberConstructor)[];
+        type: (StringConstructor | BooleanConstructor | NumberConstructor)[];
         default: boolean;
     };
     'onUpdate:checked': PropType<MaybeArray<OnUpdateChecked>>;

package/es/color-picker/src/ColorPickerSwatches.js

@@ -14,9 +14,10 @@ function normalizeColor(color, mode) {
     return color;
 }
 function getHexFromName(color) {
-    const ctx = document
-        .createElement('canvas')
-        .getContext('2d');
+    const ctx = document.createElement('canvas').getContext('2d');
+    if (!ctx) {
+        return '#000000';
+    }
     ctx.fillStyle = color;
     return ctx.fillStyle;
 }

package/es/components.d.ts

@@ -59,6 +59,7 @@ export * from './popconfirm';
 export * from './popover';
 export * from './popselect';
 export * from './progress';
+export * from './qr-code';
 export * from './radio';
 export * from './rate';
 export * from './result';
@@ -68,6 +69,7 @@ export * from './skeleton';
 export * from './slider';
 export * from './space';
 export * from './spin';
+export * from './split';
 export * from './statistic';
 export * from './steps';
 export * from './switch';
@@ -84,6 +86,7 @@ export * from './tree';
 export * from './tree-select';
 export * from './typography';
 export * from './upload';
+export * from './virtual-list';
 export * from './watermark';
 export * from './discrete';
 export * from './equation';

package/es/components.js

@@ -59,6 +59,7 @@ export * from './popconfirm';
 export * from './popover';
 export * from './popselect';
 export * from './progress';
+export * from './qr-code';
 export * from './radio';
 export * from './rate';
 export * from './result';
@@ -68,6 +69,7 @@ export * from './skeleton';
 export * from './slider';
 export * from './space';
 export * from './spin';
+export * from './split';
 export * from './statistic';
 export * from './steps';
 export * from './switch';
@@ -84,6 +86,7 @@ export * from './tree';
 export * from './tree-select';
 export * from './typography';
 export * from './upload';
+export * from './virtual-list';
 export * from './watermark';
 export * from './discrete';
 export * from './equation';

package/es/config-provider/src/config.js

@@ -1,8 +1,8 @@
 export const defaultBreakpoints = {
-    xs: 0,
-    s: 640,
-    m: 1024,
-    l: 1280,
-    xl: 1536,
+    xs: 0, // mobile
+    s: 640, // tablet
+    m: 1024, // laptop s
+    l: 1280, // laptop
+    xl: 1536, // laptop l
     xxl: 1920 // normal desktop display
 };

package/es/config-provider/src/internal-interface.d.ts

@@ -53,6 +53,7 @@ import type { PopconfirmTheme } from '../../popconfirm/styles';
 import type { PopoverTheme } from '../../popover/styles';
 import type { PopselectTheme } from '../../popselect/styles';
 import type { ProgressTheme } from '../../progress/styles';
+import type { QrCodeTheme } from '../../qr-code/styles';
 import type { RadioTheme } from '../../radio/styles';
 import type { RateTheme } from '../../rate/styles';
 import type { ResultTheme } from '../../result/styles';
@@ -94,6 +95,7 @@ import type { CollapseTransitionTheme } from '../../collapse-transition/styles';
 import type { ButtonGroupTheme } from '../../button-group/styles/light';
 import type { RowTheme } from '../../legacy-grid/styles';
 import type { Katex } from './katex';
+import type { SplitTheme } from '../../split/styles';
 export interface GlobalThemeWithoutCommon {
     Alert?: AlertTheme;
     Anchor?: AnchorTheme;
@@ -150,6 +152,7 @@ export interface GlobalThemeWithoutCommon {
     Popover?: PopoverTheme;
     Popselect?: PopselectTheme;
     Progress?: ProgressTheme;
+    QrCode?: QrCodeTheme;
     Radio?: RadioTheme;
     Rate?: RateTheme;
     Result?: ResultTheme;
@@ -175,6 +178,7 @@ export interface GlobalThemeWithoutCommon {
     Typography?: TypographyTheme;
     Upload?: UploadTheme;
     Watermark?: WatermarkTheme;
+    Split?: SplitTheme;
     Row?: RowTheme;
     InternalSelectMenu?: InternalSelectMenuTheme;
     InternalSelection?: InternalSelectionTheme;

package/es/data-table/src/DataTable.d.ts

@@ -76,7 +76,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly flexHeight: BooleanConstructor;
     readonly summaryPlacement: {
-        readonly type: import("vue").PropType<"bottom" | "top">;
+        readonly type: import("vue").PropType<"top" | "bottom">;
         readonly default: "bottom";
     };
     readonly paginationBehaviorOnFilter: {
@@ -3821,7 +3821,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     readonly flexHeight: BooleanConstructor;
     readonly summaryPlacement: {
-        readonly type: import("vue").PropType<"bottom" | "top">;
+        readonly type: import("vue").PropType<"top" | "bottom">;
         readonly default: "bottom";
     };
     readonly paginationBehaviorOnFilter: {
@@ -6221,7 +6221,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly childrenKey: string;
     readonly indent: number;
     readonly flexHeight: boolean;
-    readonly summaryPlacement: "bottom" | "top";
+    readonly summaryPlacement: "top" | "bottom";
     readonly paginationBehaviorOnFilter: "first" | "current";
     readonly spinProps: import("../../_internal").BaseLoadingExposedProps;
 }, {}>;

package/es/data-table/src/DataTable.js

@@ -174,6 +174,7 @@ export default defineComponent({
             clearFilter,
             scrollTo: (arg0, arg1) => {
                 var _a;
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
                 (_a = mainTableInstRef.value) === null || _a === void 0 ? void 0 : _a.scrollTo(arg0, arg1);
             }
         };