naive-ui 2.40.4 → 2.41.1

package/es/carousel/src/Carousel.mjs

@@ -4,7 +4,7 @@ import { useMergedState } from 'vooks';
 import { cloneVNode, computed, defineComponent, h, nextTick, normalizeStyle, onBeforeUnmount, onMounted, onUpdated, ref, toRef, Transition, vShow, watch, watchEffect, withDirectives } from 'vue';
 import { VResizeObserver } from 'vueuc';
 import { useConfig, useTheme, useThemeClass } from "../../_mixins/index.mjs";
-import { flatten, keep, resolveSlotWithProps } from "../../_utils/index.mjs";
+import { flatten, keep, resolveSlotWithTypedProps } from "../../_utils/index.mjs";
 import { carouselLight } from "../styles/index.mjs";
 import NCarouselArrow from "./CarouselArrow.mjs";
 import { provideCarouselContext } from "./CarouselContext.mjs";
@@ -86,6 +86,7 @@ let globalDragging = false;
 export default defineComponent({
   name: 'Carousel',
   props: carouselProps,
+  slots: Object,
   setup(props) {
     const {
       mergedClsPrefixRef,
@@ -876,14 +877,14 @@ export default defineComponent({
       }, withDirectives(h(Transition, Object.assign({}, transitionProps), {
         default: () => slide
       }), [[vShow, this.isActive(i)]]))) : slides)
-    }), this.showDots && dotSlotProps.total > 1 && resolveSlotWithProps(dotsSlot, dotSlotProps, () => [h(NCarouselDots, {
+    }), this.showDots && dotSlotProps.total > 1 && resolveSlotWithTypedProps(dotsSlot, dotSlotProps, () => [h(NCarouselDots, {
       key: dotType + dotPlacement,
       total: dotSlotProps.total,
       currentIndex: dotSlotProps.currentIndex,
       dotType: dotType,
       trigger: this.trigger,
       keyboard: this.keyboard
-    })]), showArrow && resolveSlotWithProps(arrowSlot, arrowSlotProps, () => [h(NCarouselArrow, null)]));
+    })]), showArrow && resolveSlotWithTypedProps(arrowSlot, arrowSlotProps, () => [h(NCarouselArrow, null)]));
   }
 });
 function filterCarouselItem(vnodes) {

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

@@ -17,3 +17,15 @@ export interface Size {
     width: number;
     height: number;
 }
+export interface CarouselArrowSlotProps {
+    total: number;
+    currentIndex: number;
+    to: (index: number) => void;
+    prev: () => void;
+    next: () => void;
+}
+export interface CarouselDotSlotProps {
+    total: number;
+    currentIndex: number;
+    to: (index: number) => void;
+}

package/es/cascader/index.d.ts

@@ -1,3 +1,3 @@
 export { cascaderProps, default as NCascader } from './src/Cascader';
-export type { CascaderProps } from './src/Cascader';
+export type { CascaderProps, CascaderSlots } from './src/Cascader';
 export type { CascaderInst, CascaderOption } from './src/interface';

package/es/cascader/src/Cascader.d.ts

@@ -1,11 +1,11 @@
 import type { InternalSelectionInst } from '../../_internal';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
-import type { FormValidationStatus } from '../../form/src/interface';
+import type { FormValidationStatus } from '../../form/src/public-types';
 import type { PopoverProps } from '../../popover';
 import type { SelectBaseOption } from '../../select/src/interface';
 import type { CascaderMenuInstance, CascaderOption, ExpandTrigger, Filter, Key, OnLoad, OnUpdateValue, SelectMenuInstance, Value } from './interface';
 import { type CheckStrategy } from 'treemate';
-import { type CSSProperties, type HTMLAttributes, type PropType, type VNode, type VNodeChild } from 'vue';
+import { type CSSProperties, type HTMLAttributes, type PropType, type SlotsType, type VNode, type VNodeChild } from 'vue';
 import { type FollowerInst, type FollowerPlacement } from 'vueuc';
 export declare const cascaderProps: {
     readonly allowCheckingNotLoaded: BooleanConstructor;
@@ -755,6 +755,12 @@ export declare const cascaderProps: {
     }>>>;
 };
 export type CascaderProps = ExtractPublicPropTypes<typeof cascaderProps>;
+export interface CascaderSlots {
+    action?: () => VNode[];
+    arrow?: () => VNode[];
+    empty?: () => VNode[];
+    'not-found'?: () => VNode[];
+}
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly allowCheckingNotLoaded: BooleanConstructor;
     readonly to: {
@@ -2666,5 +2672,5 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly disabledField: string;
     readonly leafOnly: boolean;
     readonly showPath: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<CascaderSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/cascader/src/Cascader.mjs

@@ -114,6 +114,7 @@ export const cascaderProps = Object.assign(Object.assign({}, useTheme.props), {
 export default defineComponent({
   name: 'Cascader',
   props: cascaderProps,
+  slots: Object,
   setup(props, {
     slots
   }) {

package/es/collapse/index.d.ts

@@ -1,4 +1,5 @@
 export { collapseProps, default as NCollapse } from './src/Collapse';
-export type { CollapseProps } from './src/Collapse';
+export type { CollapseProps, CollapseSlots } from './src/Collapse';
 export { collapseItemProps, default as NCollapseItem } from './src/CollapseItem';
-export type { CollapseItemProps } from './src/CollapseItem';
+export type { CollapseItemProps, CollapseItemSlots } from './src/CollapseItem';
+export type { CollapseArrowSlotProps, CollapseItemArrowSlotProps, CollapseItemHeaderExtraSlotProps, CollapseItemHeaderSlotProps } from './src/interface';

package/es/collapse/src/Collapse.d.ts

@@ -1,6 +1,6 @@
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
-import type { OnItemHeaderClick, OnUpdateExpandedNames } from './interface';
-import { type ExtractPropTypes, type PropType, type Ref, type Slots } from 'vue';
+import type { CollapseArrowSlotProps, CollapseItemHeaderExtraSlotProps, CollapseItemHeaderSlotProps, OnItemHeaderClick, OnUpdateExpandedNames } from './interface';
+import { type ExtractPropTypes, type PropType, type Ref, type SlotsType, type VNode } from 'vue';
 export declare const collapseProps: {
     readonly defaultExpandedNames: {
         readonly type: PropType<string | number | Array<string | number> | null>;
@@ -72,11 +72,17 @@ export declare const collapseProps: {
     }, any>>>;
 };
 export type CollapseProps = ExtractPublicPropTypes<typeof collapseProps>;
+export interface CollapseSlots {
+    default?: () => VNode[];
+    arrow?: (props: CollapseArrowSlotProps) => VNode[];
+    header?: (props: CollapseItemHeaderSlotProps) => VNode[];
+    'header-extra'?: (props: CollapseItemHeaderExtraSlotProps) => VNode[];
+}
 export interface NCollapseInjection {
     props: ExtractPropTypes<typeof collapseProps>;
     expandedNamesRef: Ref<string | number | Array<string | number> | null>;
     mergedClsPrefixRef: Ref<string>;
-    slots: Slots;
+    slots: CollapseSlots;
     toggleItem: (collapse: boolean, name: string | number, event: MouseEvent) => void;
 }
 export declare const collapseInjectionKey: import("vue").InjectionKey<NCollapseInjection>;
@@ -264,5 +270,5 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly accordion: boolean;
     readonly triggerAreas: ("extra" | "main" | "arrow")[];
     readonly onExpandedNamesChange: MaybeArray<OnUpdateExpandedNames> | undefined;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<CollapseSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/collapse/src/Collapse.mjs

@@ -46,6 +46,7 @@ export const collapseInjectionKey = createInjectionKey('n-collapse');
 export default defineComponent({
   name: 'Collapse',
   props: collapseProps,
+  slots: Object,
   setup(props, {
     slots
   }) {

package/es/collapse/src/CollapseItem.d.ts

@@ -1,5 +1,6 @@
 import type { ExtractPublicPropTypes } from '../../_utils';
-import { type PropType } from 'vue';
+import type { CollapseItemArrowSlotProps, CollapseItemHeaderExtraSlotProps, CollapseItemHeaderSlotProps } from './interface';
+import { type PropType, type VNode } from 'vue';
 export declare const collapseItemProps: {
     readonly title: StringConstructor;
     readonly name: PropType<string | number>;
@@ -7,6 +8,12 @@ export declare const collapseItemProps: {
     readonly displayDirective: PropType<"if" | "show">;
 };
 export type CollapseItemProps = ExtractPublicPropTypes<typeof collapseItemProps>;
+export interface CollapseItemSlots {
+    default?: () => VNode[];
+    header?: (props: CollapseItemHeaderSlotProps) => VNode[];
+    'header-extra'?: (props: CollapseItemHeaderExtraSlotProps) => VNode[];
+    arrow?: (props: CollapseItemArrowSlotProps) => VNode[];
+}
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly title: StringConstructor;
     readonly name: PropType<string | number>;
@@ -14,9 +21,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly displayDirective: PropType<"if" | "show">;
 }>, {
     rtlEnabled: import("vue").Ref<import("../../config-provider/src/internal-interface").RtlItem | undefined, import("../../config-provider/src/internal-interface").RtlItem | undefined> | undefined;
-    collapseSlots: Readonly<{
-        [name: string]: import("vue").Slot<any> | undefined;
-    }>;
+    collapseSlots: import("./Collapse").CollapseSlots;
     randomName: string;
     mergedClsPrefix: import("vue").Ref<string, string>;
     collapsed: import("vue").ComputedRef<boolean>;

package/es/collapse/src/CollapseItem.mjs

@@ -5,7 +5,7 @@ import { NBaseIcon } from "../../_internal/index.mjs";
 import { ChevronLeftIcon as ArrowLeftIcon, ChevronRightIcon as ArrowRightIcon } from "../../_internal/icons/index.mjs";
 import { useConfig } from "../../_mixins/index.mjs";
 import { useRtl } from "../../_mixins/use-rtl.mjs";
-import { resolveSlotWithProps, resolveWrappedSlotWithProps, throwError } from "../../_utils/index.mjs";
+import { resolveSlotWithTypedProps, resolveWrappedSlotWithProps, throwError } from "../../_utils/index.mjs";
 import { collapseInjectionKey } from "./Collapse.mjs";
 import NCollapseItemContent from "./CollapseItemContent.mjs";
 export const collapseItemProps = {
@@ -98,7 +98,7 @@ export default defineComponent({
       disabled,
       triggerAreas
     } = this;
-    const headerNode = resolveSlotWithProps($slots.header, {
+    const headerNode = resolveSlotWithTypedProps($slots.header, {
       collapsed
     }, () => [this.title]);
     const headerExtraSlot = $slots['header-extra'] || collapseSlots['header-extra'];
@@ -116,16 +116,13 @@ export default defineComponent({
       class: `${mergedClsPrefix}-collapse-item-arrow`,
       key: this.rtlEnabled ? 0 : 1,
       "data-arrow": true
-    }, resolveSlotWithProps(arrowSlot, {
+    }, resolveSlotWithTypedProps(arrowSlot, {
       collapsed
-    }, () => {
-      var _a;
-      return [h(NBaseIcon, {
-        clsPrefix: mergedClsPrefix
-      }, {
-        default: (_a = collapseSlots.expandIcon) !== null && _a !== void 0 ? _a : () => this.rtlEnabled ? h(ArrowLeftIcon, null) : h(ArrowRightIcon, null)
-      })];
-    })), arrowPlacement === 'left' && headerNode), resolveWrappedSlotWithProps(headerExtraSlot, {
+    }, () => [h(NBaseIcon, {
+      clsPrefix: mergedClsPrefix
+    }, {
+      default: () => this.rtlEnabled ? h(ArrowLeftIcon, null) : h(ArrowRightIcon, null)
+    })])), arrowPlacement === 'left' && headerNode), resolveWrappedSlotWithProps(headerExtraSlot, {
       collapsed
     }, children => h("div", {
       class: `${mergedClsPrefix}-collapse-item__header-extra`,

package/es/collapse/src/interface.d.ts

@@ -7,3 +7,15 @@ export interface HeaderClickInfo<T> {
     expanded: boolean;
     event: MouseEvent;
 }
+export interface CollapseArrowSlotProps {
+    collapsed: boolean;
+}
+export interface CollapseItemHeaderSlotProps {
+    collapsed: boolean;
+}
+export interface CollapseItemHeaderExtraSlotProps {
+    collapsed: boolean;
+}
+export interface CollapseItemArrowSlotProps {
+    collapsed: boolean;
+}

package/es/color-picker/index.d.ts

@@ -1,2 +1,2 @@
 export { colorPickerProps, default as NColorPicker } from './src/ColorPicker';
-export type { ColorPickerProps } from './src/ColorPicker';
+export type { ColorPickerProps, ColorPickerSlots } from './src/ColorPicker';

package/es/color-picker/src/ColorPicker.d.ts

@@ -2,7 +2,7 @@ import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { OnClear, OnUpdateValue, RenderLabel } from './interface';
 import type { ActionType, ColorPickerMode } from './utils';
 import { type HSLA, type RGBA } from 'seemly';
-import { type PropType, type Ref, type VNode } from 'vue';
+import { type PropType, type Ref, type SlotsType, type VNode } from 'vue';
 import { type FollowerPlacement } from 'vueuc';
 export declare const colorPickerProps: {
     readonly value: PropType<string | null>;
@@ -896,6 +896,11 @@ export declare const colorPickerProps: {
     }>>>;
 };
 export type ColorPickerProps = ExtractPublicPropTypes<typeof colorPickerProps>;
+export interface ColorPickerSlots {
+    default?: () => VNode[];
+    label?: (color: string | null) => VNode[];
+    action?: () => VNode[];
+}
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly value: PropType<string | null>;
     readonly show: {
@@ -2714,5 +2719,5 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly showAlpha: boolean;
     readonly modes: ColorPickerMode[];
     readonly showPreview: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<ColorPickerSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/color-picker/src/ColorPicker.mjs

@@ -63,6 +63,7 @@ export const colorPickerProps = Object.assign(Object.assign({}, useTheme.props),
 export default defineComponent({
   name: 'ColorPicker',
   props: colorPickerProps,
+  slots: Object,
   setup(props, {
     slots
   }) {
@@ -577,7 +578,6 @@ export default defineComponent({
   },
   render() {
     const {
-      $slots,
       mergedClsPrefix,
       onRender
     } = this;
@@ -594,8 +594,6 @@ export default defineComponent({
           hsla: this.hsla,
           disabled: this.mergedDisabled,
           onClick: this.handleTriggerClick
-        }, {
-          label: $slots.label
         })
       }), h(VFollower, {
         placement: this.placement,

package/es/color-picker/src/ColorPickerTrigger.d.ts

@@ -1,5 +1,5 @@
 import { type HSLA } from 'seemly';
-import { type PropType } from 'vue';
+import { type PropType, type SlotsType } from 'vue';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     clsPrefix: {
         type: StringConstructor;
@@ -34,5 +34,5 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     value: string | null;
     disabled: boolean;
     hsla: HSLA | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<Record<string, never>>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/color-picker/src/ColorPickerTrigger.mjs

@@ -3,6 +3,7 @@ import { defineComponent, h, inject } from 'vue';
 import { colorPickerInjectionKey } from "./context.mjs";
 export default defineComponent({
   name: 'ColorPickerTrigger',
+  slots: Object,
   props: {
     clsPrefix: {
       type: String,

package/es/color-picker/src/context.d.ts

@@ -1,9 +1,10 @@
-import type { ComputedRef, Ref, Slots } from 'vue';
+import type { ComputedRef, Ref } from 'vue';
 import type { MergedTheme } from '../../_mixins';
 import type { ColorPickerTheme } from '../styles';
+import type { ColorPickerSlots } from './ColorPicker';
 import type { RenderLabel } from './interface';
 export declare const colorPickerInjectionKey: import("vue").InjectionKey<{
     themeRef: ComputedRef<MergedTheme<ColorPickerTheme>>;
-    colorPickerSlots: Slots;
+    colorPickerSlots: ColorPickerSlots;
     renderLabelRef: Ref<RenderLabel | undefined>;
 }>;

package/es/components.d.ts

@@ -48,6 +48,7 @@ export * from './image';
 export * from './infinite-scroll';
 export * from './input';
 export * from './input-number';
+export * from './input-otp';
 export * from './layout';
 export * from './legacy-grid';
 export * from './legacy-transfer';

package/es/components.mjs

@@ -48,6 +48,7 @@ export * from "./image/index.mjs";
 export * from "./infinite-scroll/index.mjs";
 export * from "./input/index.mjs";
 export * from "./input-number/index.mjs";
+export * from "./input-otp/index.mjs";
 export * from "./layout/index.mjs";
 export * from "./legacy-grid/index.mjs";
 export * from "./legacy-transfer/index.mjs";

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

@@ -49,6 +49,7 @@ import type { IconWrapperTheme } from '../../icon-wrapper/styles';
 import type { IconTheme } from '../../icon/styles';
 import type { ImageTheme } from '../../image/styles';
 import type { InputNumberTheme } from '../../input-number/styles';
+import type { InputOtpTheme } from '../../input-otp/styles';
 import type { Size as InputSize } from '../../input/src/interface';
 import type { InputTheme } from '../../input/styles';
 import type { LayoutTheme } from '../../layout/styles';
@@ -190,6 +191,7 @@ export interface GlobalThemeWithoutCommon {
     Marquee?: MarqueeTheme;
     InternalSelectMenu?: InternalSelectMenuTheme;
     InternalSelection?: InternalSelectionTheme;
+    InputOtp?: InputOtpTheme;
 }
 export interface GlobalComponentConfig {
     Pagination?: {

package/es/data-table/index.d.ts

@@ -1,4 +1,4 @@
 export { default as NDataTable } from './src/DataTable';
 export { dataTableProps } from './src/interface';
-export type { TableBaseColumn as DataTableBaseColumn, TableColumn as DataTableColumn, TableColumnGroup as DataTableColumnGroup, ColumnKey as DataTableColumnKey, TableColumns as DataTableColumns, CreateRowClassName as DataTableCreateRowClassName, CreateRowKey as DataTableCreateRowKey, CreateRowProps as DataTableCreateRowProps, CreateSummary as DataTableCreateSummary, TableExpandColumn as DataTableExpandColumn, FilterState as DataTableFilterState, DataTableInst, DataTableProps, RenderFilter as DataTableRenderFilter, RenderFilterIcon as DataTableRenderFilterIcon, RenderSorter as DataTableRenderSorter, RenderSorterIcon as DataTableRenderSorterIcon, RowData as DataTableRowData, RowKey as DataTableRowKey, TableSelectionColumn as DataTableSelectionColumn, SortState as DataTableSortState } from './src/interface';
+export type { TableBaseColumn as DataTableBaseColumn, TableColumn as DataTableColumn, TableColumnGroup as DataTableColumnGroup, ColumnKey as DataTableColumnKey, TableColumns as DataTableColumns, CreateRowClassName as DataTableCreateRowClassName, CreateRowKey as DataTableCreateRowKey, CreateRowProps as DataTableCreateRowProps, CreateSummary as DataTableCreateSummary, TableExpandColumn as DataTableExpandColumn, FilterState as DataTableFilterState, DataTableInst, DataTableProps, RenderFilter as DataTableRenderFilter, RenderFilterIcon as DataTableRenderFilterIcon, RenderSorter as DataTableRenderSorter, RenderSorterIcon as DataTableRenderSorterIcon, RowData as DataTableRowData, RowKey as DataTableRowKey, TableSelectionColumn as DataTableSelectionColumn, DataTableSlots, SortOrder as DataTableSortOrder, SortState as DataTableSortState } from './src/interface';
 export * from './src/publicTypes';

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

@@ -1,4 +1,5 @@
-import type { CsvOptionsType, MainTableRef, RowKey } from './interface';
+import type { CsvOptionsType, DataTableSlots, MainTableRef, RowKey } from './interface';
+import { type SlotsType } from 'vue';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     readonly onUnstableColumnResize: import("vue").PropType<(resizedWidth: number, limitedWidth: number, column: import("./interface").TableBaseColumn, getColumnWidth: (key: import("./interface").ColumnKey) => number | undefined) => void>;
     readonly pagination: {
@@ -3871,12 +3872,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         '--n-td-color-striped': string;
         '--n-td-color-striped-modal': string;
         '--n-td-color-striped-popover': string;
-        'n-td-color-sorting': string;
-        'n-td-color-sorting-modal': string;
-        'n-td-color-sorting-popover': string;
-        'n-th-color-sorting': string;
-        'n-th-color-sorting-modal': string;
-        'n-th-color-sorting-popover': string;
+        '--n-td-color-sorting': string;
+        '--n-td-color-sorting-modal': string;
+        '--n-td-color-sorting-popover': string;
+        '--n-th-color-sorting': string;
+        '--n-th-color-sorting-modal': string;
+        '--n-th-color-sorting-popover': string;
     }> | undefined;
     themeClass: import("vue").Ref<string, string> | undefined;
     onRender: (() => void) | undefined;
@@ -6516,5 +6517,5 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     readonly summaryPlacement: "top" | "bottom";
     readonly paginationBehaviorOnFilter: "first" | "current";
     readonly spinProps: import("../../_internal").BaseLoadingExposedProps;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<DataTableSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

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

@@ -19,6 +19,7 @@ export default defineComponent({
   name: 'DataTable',
   alias: ['AdvancedTable'],
   props: dataTableProps,
+  slots: Object,
   setup(props, {
     slots
   }) {
@@ -374,12 +375,12 @@ export default defineComponent({
         '--n-td-color-striped': tdColorStriped,
         '--n-td-color-striped-modal': tdColorStripedModal,
         '--n-td-color-striped-popover': tdColorStripedPopover,
-        'n-td-color-sorting': tdColorSorting,
-        'n-td-color-sorting-modal': tdColorSortingModal,
-        'n-td-color-sorting-popover': tdColorSortingPopover,
-        'n-th-color-sorting': thColorSorting,
-        'n-th-color-sorting-modal': thColorSortingModal,
-        'n-th-color-sorting-popover': thColorSortingPopover
+        '--n-td-color-sorting': tdColorSorting,
+        '--n-td-color-sorting-modal': tdColorSortingModal,
+        '--n-td-color-sorting-popover': tdColorSortingPopover,
+        '--n-th-color-sorting': thColorSorting,
+        '--n-th-color-sorting-modal': thColorSortingModal,
+        '--n-th-color-sorting-popover': thColorSortingPopover
       };
     });
     const themeClassHandle = inlineThemeDisabled ? useThemeClass('data-table', computed(() => props.size[0]), cssVarsRef, props) : undefined;

package/es/data-table/src/TableParts/Body.d.ts

@@ -13,9 +13,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     scrollTo: import("../../../scrollbar/src/Scrollbar").ScrollTo;
     bodyWidth: import("vue").Ref<number | null, number | null>;
     summaryPlacement: import("vue").Ref<"top" | "bottom", "top" | "bottom">;
-    dataTableSlots: Readonly<{
-        [name: string]: import("vue").Slot<any> | undefined;
-    }>;
+    dataTableSlots: import("../interface").DataTableSlots;
     componentId: string;
     scrollbarInstRef: import("vue").Ref<{
         $el: HTMLElement;

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

@@ -1,5 +1,5 @@
 import type { TreeMate, TreeNode } from 'treemate';
-import type { CSSProperties, ExtractPropTypes, HTMLAttributes, PropType, Ref, Slots, VNodeChild } from 'vue';
+import type { CSSProperties, ExtractPropTypes, HTMLAttributes, PropType, Ref, VNode, VNodeChild } from 'vue';
 import type { VirtualListInst } from 'vueuc';
 import type { BaseLoadingExposedProps } from '../../_internal';
 import type { MergedTheme } from '../../_mixins';
@@ -2618,6 +2618,11 @@ export declare const dataTableProps: {
         }>;
     }>>>;
 };
+export interface DataTableSlots {
+    default?: () => VNode[];
+    empty?: () => VNode[];
+    loading?: () => VNode[];
+}
 export type FilterOptionValue = string | number;
 export type ColumnKey = string | number;
 export type RowKey = string | number;
@@ -2731,7 +2736,7 @@ export type DataTableSelectionOptions<T = InternalRowData> = Array<DataTableSele
 }>;
 export interface DataTableInjection {
     props: DataTableSetupProps;
-    slots: Slots;
+    slots: DataTableSlots;
     indentRef: Ref<number>;
     childTriggerColIndexRef: Ref<number>;
     componentId: string;

package/es/data-table/src/styles/index.cssr.mjs

@@ -60,6 +60,7 @@ export default c([cB('data-table', `
  --n-merged-th-color: var(--n-th-color);
  --n-merged-td-color: var(--n-td-color);
  --n-merged-border-color: var(--n-border-color);
+ --n-merged-th-color-hover: var(--n-th-color-hover);
  --n-merged-th-color-sorting: var(--n-th-color-sorting);
  --n-merged-td-color-hover: var(--n-td-color-hover);
  --n-merged-td-color-sorting: var(--n-td-color-sorting);

package/es/data-table/src/use-group-header.mjs

@@ -9,12 +9,13 @@ function getRowsAndCols(columns, getResizableWidth) {
   let maxDepth = -1;
   let totalRowSpan = 0;
   let hasEllipsis = false;
+  let currentLeafIndex = 0;
   function ensureMaxDepth(columns, currentDepth) {
     if (currentDepth > maxDepth) {
       rows[currentDepth] = [];
       maxDepth = currentDepth;
     }
-    columns.forEach((column, index) => {
+    columns.forEach(column => {
       if ('children' in column) {
         ensureMaxDepth(column.children, currentDepth + 1);
       } else {
@@ -23,7 +24,7 @@ function getRowsAndCols(columns, getResizableWidth) {
           key: getColKey(column),
           style: createCustomWidthStyle(column, key !== undefined ? formatLength(getResizableWidth(key)) : undefined),
           column,
-          index,
+          index: currentLeafIndex++,
           // The width property is only applied to horizontally virtual scroll table
           width: column.width === undefined ? 128 : Number(column.width)
         });
@@ -36,7 +37,7 @@ function getRowsAndCols(columns, getResizableWidth) {
     });
   }
   ensureMaxDepth(columns, 0);
-  let currentLeafIndex = 0;
+  currentLeafIndex = 0;
   function ensureColLayout(columns, currentDepth) {
     let hideUntilIndex = 0;
     columns.forEach(column => {

package/es/date-picker/index.d.ts

@@ -1,3 +1,4 @@
 export { default as NDatePicker } from './src/DatePicker';
+export type { DatePickerSlots } from './src/DatePicker';
 export { datePickerProps } from './src/props';
 export type * from './src/public-types';

package/es/date-picker/src/DatePicker.d.ts

@@ -1,7 +1,29 @@
 import type { FormattedValue, PanelRef, Value } from './interface';
-import { type ExtractPropTypes, type Ref } from 'vue';
+import { type ExtractPropTypes, type Ref, type SlotsType, type VNode } from 'vue';
 import { datePickerProps } from './props';
 export type DatePickerSetupProps = ExtractPropTypes<typeof datePickerProps>;
+export interface DatePickerSlots {
+    'date-icon'?: () => VNode[];
+    footer?: () => VNode[];
+    'next-month'?: () => VNode[];
+    'next-year'?: () => VNode[];
+    'prev-month'?: () => VNode[];
+    'prev-year'?: () => VNode[];
+    separator?: () => VNode[];
+    confirm?: (props: {
+        onConfirm: () => void;
+        disabled: boolean;
+        text: string;
+    }) => VNode[];
+    clear?: (props: {
+        onClear: () => void;
+        text: string;
+    }) => VNode[];
+    now?: (props: {
+        onNow: () => void;
+        text: string;
+    }) => VNode[];
+}
 declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly to: {
         type: import("vue").PropType<HTMLElement | string | boolean>;
@@ -63,7 +85,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly firstDayOfWeek: import("vue").PropType<import("./interface").FirstDayOfWeek>;
     readonly inputReadonly: BooleanConstructor;
     readonly closeOnSelect: BooleanConstructor;
-    readonly status: import("vue").PropType<import("../../form/src/interface").FormValidationStatus>;
+    readonly status: import("vue").PropType<import("../..").FormValidationStatus>;
     readonly timePickerProps: import("vue").PropType<import("../..").TimePickerProps | [import("../..").TimePickerProps, import("../..").TimePickerProps]>;
     readonly onClear: import("vue").PropType<() => void>;
     readonly onConfirm: import("vue").PropType<import("./interface").OnConfirm>;
@@ -2020,7 +2042,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
         }, any>;
     }>>>;
 }>, {
-    mergedStatus: import("vue").ComputedRef<import("../../form/src/interface").FormValidationStatus | undefined>;
+    mergedStatus: import("vue").ComputedRef<import("../..").FormValidationStatus | undefined>;
     mergedClsPrefix: Ref<string, string>;
     mergedBordered: import("vue").ComputedRef<boolean>;
     namespace: import("vue").ComputedRef<string | undefined>;
@@ -3341,7 +3363,7 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly firstDayOfWeek: import("vue").PropType<import("./interface").FirstDayOfWeek>;
     readonly inputReadonly: BooleanConstructor;
     readonly closeOnSelect: BooleanConstructor;
-    readonly status: import("vue").PropType<import("../../form/src/interface").FormValidationStatus>;
+    readonly status: import("vue").PropType<import("../..").FormValidationStatus>;
     readonly timePickerProps: import("vue").PropType<import("../..").TimePickerProps | [import("../..").TimePickerProps, import("../..").TimePickerProps]>;
     readonly onClear: import("vue").PropType<() => void>;
     readonly onConfirm: import("vue").PropType<import("./interface").OnConfirm>;
@@ -5316,5 +5338,5 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
     readonly closeOnSelect: boolean;
     readonly bindCalendarMonths: boolean;
     readonly yearRange: [number, number];
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, SlotsType<DatePickerSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/date-picker/src/DatePicker.mjs

@@ -24,6 +24,7 @@ import { dualCalendarValidation, uniCalendarValidation } from "./validation-util
 export default defineComponent({
   name: 'DatePicker',
   props: datePickerProps,
+  slots: Object,
   setup(props, {
     slots
   }) {

package/es/date-picker/src/interface.d.ts

@@ -1,4 +1,4 @@
-import type { Ref, Slots, UnwrapNestedRefs } from 'vue';
+import type { Ref, UnwrapNestedRefs } from 'vue';
 import type { VirtualListInst } from 'vueuc';
 import type { ScrollbarInst } from '../../_internal';
 import type { MergedTheme } from '../../_mixins';
@@ -7,6 +7,7 @@ import type { NDateLocale, NLocale } from '../../locales';
 import type { IsHourDisabled, IsMinuteDisabled, IsSecondDisabled } from '../../time-picker/src/interface';
 import type { TimePickerProps } from '../../time-picker/src/TimePicker';
 import type { DatePickerTheme } from '../styles/light';
+import type { DatePickerSlots } from './DatePicker';
 import type { dualCalendarValidation, uniCalendarValidation } from './validation-utils';
 export type Value = number | [number, number];
 export type DefaultTime = string | [string | undefined, string | undefined];
@@ -71,7 +72,7 @@ export type DatePickerInjection = {
     monthFormatRef: Ref<string>;
     yearFormatRef: Ref<string>;
     quarterFormatRef: Ref<string>;
-    datePickerSlots: Slots;
+    datePickerSlots: DatePickerSlots;
     yearRangeRef: Ref<[number, number]>;
 } & ReturnType<typeof uniCalendarValidation> & ReturnType<typeof dualCalendarValidation>;
 export declare const datePickerInjectionKey: import("vue").InjectionKey<DatePickerInjection>;