naive-ui 2.30.7 → 2.32.0

package/es/collapse-transition/src/CollapseTransition.d.ts

@@ -1,6 +1,6 @@
 import { PropType } from 'vue';
 import type { ExtractPublicPropTypes } from '../../_utils';
-declare const collapseProps: {
+export declare const collapseTransitionProps: {
     readonly show: {
         readonly type: BooleanConstructor;
         readonly default: true;
@@ -21,7 +21,7 @@ declare const collapseProps: {
         bezier: string;
     }, any>>>;
 };
-export declare type CollapseTransitionProps = ExtractPublicPropTypes<typeof collapseProps>;
+export declare type CollapseTransitionProps = ExtractPublicPropTypes<typeof collapseTransitionProps>;
 declare const _default: import("vue").DefineComponent<{
     readonly show: {
         readonly type: BooleanConstructor;

package/es/collapse-transition/src/CollapseTransition.js

@@ -1,11 +1,11 @@
 import { computed, h, defineComponent, mergeProps, watchEffect } from 'vue';
 import { useConfig, useTheme, useThemeClass } from '../../_mixins';
-import useRtl from '../../_mixins/use-rtl';
+import { useRtl } from '../../_mixins/use-rtl';
 import { warnOnce } from '../../_utils';
 import style from './styles/index.cssr';
 import { collapseTransitionLight } from '../styles';
 import { NFadeInExpandTransition } from '../../_internal';
-const collapseProps = Object.assign(Object.assign({}, useTheme.props), { show: {
+export const collapseTransitionProps = Object.assign(Object.assign({}, useTheme.props), { show: {
         type: Boolean,
         default: true
     }, appear: Boolean, 
@@ -19,7 +19,7 @@ const collapseProps = Object.assign(Object.assign({}, useTheme.props), { show: {
     } });
 export default defineComponent({
     name: 'CollapseTransition',
-    props: collapseProps,
+    props: collapseTransitionProps,
     inheritAttrs: false,
     setup(props) {
         if (process.env.NODE_ENV !== 'production') {

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

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

package/es/color-picker/index.js

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

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

@@ -4,7 +4,7 @@ import { FollowerPlacement } from 'vueuc';
 import type { ExtractPublicPropTypes, MaybeArray } from '../../_utils';
 import type { ColorPickerMode } from './utils';
 import { OnUpdateValue, RenderLabel } from './interface';
-export declare const colorPickerPanelProps: {
+export declare const colorPickerProps: {
     readonly value: PropType<string | null>;
     readonly show: {
         readonly type: PropType<boolean | undefined>;
@@ -888,7 +888,7 @@ export declare const colorPickerPanelProps: {
         }, any>;
     }>>>;
 };
-export declare type ColorPickerProps = ExtractPublicPropTypes<typeof colorPickerPanelProps>;
+export declare type ColorPickerProps = ExtractPublicPropTypes<typeof colorPickerProps>;
 declare const _default: import("vue").DefineComponent<{
     readonly value: PropType<string | null>;
     readonly show: {

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

@@ -17,7 +17,7 @@ import ColorPickerSwatches from './ColorPickerSwatches';
 import ColorPreview from './ColorPreview';
 import { colorPickerInjectionKey } from './context';
 import style from './styles/index.cssr';
-export const colorPickerPanelProps = Object.assign(Object.assign({}, useTheme.props), { value: String, show: {
+export const colorPickerProps = Object.assign(Object.assign({}, useTheme.props), { value: String, show: {
         type: Boolean,
         default: undefined
     }, defaultShow: Boolean, defaultValue: String, modes: {
@@ -39,7 +39,7 @@ export const colorPickerPanelProps = Object.assign(Object.assign({}, useTheme.pr
     }, internalActions: Array, size: String, renderLabel: Function, onComplete: Function, onConfirm: Function, 'onUpdate:show': [Function, Array], onUpdateShow: [Function, Array], 'onUpdate:value': [Function, Array], onUpdateValue: [Function, Array] });
 export default defineComponent({
     name: 'ColorPicker',
-    props: colorPickerPanelProps,
+    props: colorPickerProps,
     setup(props, { slots }) {
         const selfRef = ref(null);
         let upcomingValue = null;

package/es/components.d.ts

@@ -44,6 +44,7 @@ export * from './input';
 export * from './input-number';
 export * from './layout';
 export * from './legacy-grid';
+export * from './legacy-transfer';
 export * from './list';
 export * from './loading-bar';
 export * from './log';

package/es/components.js

@@ -44,6 +44,7 @@ export * from './input';
 export * from './input-number';
 export * from './layout';
 export * from './legacy-grid';
+export * from './legacy-transfer';
 export * from './list';
 export * from './loading-bar';
 export * from './log';

package/es/config-provider/src/ConfigProvider.d.ts

@@ -65,10 +65,17 @@ export declare const configProviderProps: {
             confirm: string;
             clear: string;
         };
-        Transfer: {
+        LegacyTransfer: {
             sourceTitle: string;
             targetTitle: string;
         };
+        Transfer: {
+            selectAll: string;
+            unselectAll: string;
+            clearAll: string;
+            total: (num: number) => string;
+            selected: (num: number) => string;
+        };
         Empty: {
             description: string;
         };
@@ -208,10 +215,17 @@ declare const _default: import("vue").DefineComponent<{
             confirm: string;
             clear: string;
         };
-        Transfer: {
+        LegacyTransfer: {
             sourceTitle: string;
             targetTitle: string;
         };
+        Transfer: {
+            selectAll: string;
+            unselectAll: string;
+            clearAll: string;
+            total: (num: number) => string;
+            selected: (num: number) => string;
+        };
         Empty: {
             description: string;
         };
@@ -355,10 +369,17 @@ declare const _default: import("vue").DefineComponent<{
             confirm: string;
             clear: string;
         };
-        Transfer: {
+        LegacyTransfer: {
             sourceTitle: string;
             targetTitle: string;
         };
+        Transfer: {
+            selectAll: string;
+            unselectAll: string;
+            clearAll: string;
+            total: (num: number) => string;
+            selected: (num: number) => string;
+        };
         Empty: {
             description: string;
         };

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

@@ -37,6 +37,7 @@ import type { ImageTheme } from '../../image/styles';
 import type { InputTheme } from '../../input/styles';
 import type { InputNumberTheme } from '../../input-number/styles';
 import type { LayoutTheme } from '../../layout/styles';
+import type { LegacyTransferTheme } from '../../legacy-transfer/styles';
 import type { ListTheme } from '../../list/styles';
 import type { LoadingBarTheme } from '../../loading-bar/styles';
 import type { LogTheme } from '../../log/styles';
@@ -90,6 +91,7 @@ import type { GlobalTheme, GlobalThemeOverrides } from './interface';
 import type { EmptyProps } from '../../empty';
 import type { CollapseTransitionTheme } from '../../collapse-transition/styles';
 import type { ButtonGroupTheme } from '../../button-group/styles/light';
+import type { RowTheme } from '../../legacy-grid/styles';
 export interface GlobalThemeWithoutCommon {
     Alert?: AlertTheme;
     Anchor?: AnchorTheme;
@@ -130,6 +132,7 @@ export interface GlobalThemeWithoutCommon {
     Input?: InputTheme;
     InputNumber?: InputNumberTheme;
     Layout?: LayoutTheme;
+    LegacyTransfer?: LegacyTransferTheme;
     List?: ListTheme;
     LoadingBar?: LoadingBarTheme;
     Log?: LogTheme;
@@ -169,6 +172,7 @@ export interface GlobalThemeWithoutCommon {
     Typography?: TypographyTheme;
     Upload?: UploadTheme;
     Watermark?: WatermarkTheme;
+    Row?: RowTheme;
     InternalSelectMenu?: InternalSelectMenuTheme;
     InternalSelection?: InternalSelectionTheme;
 }

package/es/countdown/index.d.ts

@@ -1,2 +1,2 @@
-export { default as NCountdown } from './src/Countdown';
-export type { CountdownProps, CountdownTimeInfo } from './src/Countdown';
+export { default as NCountdown, countdownProps } from './src/Countdown';
+export type { CountdownProps, CountdownTimeInfo, CountdownInst } from './src/Countdown';

package/es/countdown/index.js

@@ -1 +1 @@
-export { default as NCountdown } from './src/Countdown';
+export { default as NCountdown, countdownProps } from './src/Countdown';

package/es/countdown/src/Countdown.d.ts

@@ -6,7 +6,10 @@ export interface CountdownTimeInfo {
     seconds: number;
     milliseconds: number;
 }
-declare const countdownProps: {
+export interface CountdownInst {
+    reset: () => void;
+}
+export declare const countdownProps: {
     duration: {
         type: NumberConstructor;
         default: number;
@@ -38,7 +41,11 @@ declare const _default: import("vue").DefineComponent<{
     };
     render: PropType<(props: CountdownTimeInfo) => VNodeChild>;
     onFinish: PropType<() => void>;
-}, () => VNodeChild, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, CountdownInst & {
+    distance: import("vue").Ref<number>;
+    getTimeInfo: (distance: number) => CountdownTimeInfo;
+    getDisplayValue: (info: CountdownTimeInfo) => string;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     duration: {
         type: NumberConstructor;
         default: number;

package/es/countdown/src/Countdown.js

@@ -1,5 +1,5 @@
 import { defineComponent, onMounted, onBeforeUnmount, watchEffect, ref } from 'vue';
-const countdownProps = {
+export const countdownProps = {
     duration: {
         type: Number,
         default: 0
@@ -112,32 +112,48 @@ export default defineComponent({
         onBeforeUnmount(() => {
             stopTimer();
         });
-        return () => {
-            const { render, precision } = props;
-            const { value: distance } = distanceRef;
-            let timeInfo;
-            switch (precision) {
-                case 0:
-                    timeInfo = getTimeInfo(distance + 999);
-                    timeInfo.milliseconds = 0;
-                    break;
-                case 1:
-                    timeInfo = getTimeInfo(distance + 99);
-                    timeInfo.milliseconds = Math.floor(timeInfo.milliseconds / 100) * 100;
-                    break;
-                case 2:
-                    timeInfo = getTimeInfo(distance + 9);
-                    timeInfo.milliseconds = Math.floor(timeInfo.milliseconds / 10) * 10;
-                    break;
-                case 3:
-                    timeInfo = getTimeInfo(distance);
-            }
-            if (render) {
-                return render(timeInfo);
-            }
-            else {
-                return getDisplayValue(timeInfo);
+        function reset() {
+            distanceRef.value = props.duration;
+            elapsed = 0;
+            pnow = performance.now();
+            if (props.active && finished) {
+                frame();
             }
+            finished = false;
+        }
+        const countdownExposedMethod = {
+            reset
         };
+        return Object.assign(countdownExposedMethod, {
+            distance: distanceRef,
+            getTimeInfo,
+            getDisplayValue
+        });
+    },
+    render() {
+        const { render, precision, distance, getTimeInfo, getDisplayValue } = this;
+        let timeInfo;
+        switch (precision) {
+            case 0:
+                timeInfo = getTimeInfo(distance + 999);
+                timeInfo.milliseconds = 0;
+                break;
+            case 1:
+                timeInfo = getTimeInfo(distance + 99);
+                timeInfo.milliseconds = Math.floor(timeInfo.milliseconds / 100) * 100;
+                break;
+            case 2:
+                timeInfo = getTimeInfo(distance + 9);
+                timeInfo.milliseconds = Math.floor(timeInfo.milliseconds / 10) * 10;
+                break;
+            case 3:
+                timeInfo = getTimeInfo(distance);
+        }
+        if (render) {
+            return render(timeInfo);
+        }
+        else {
+            return getDisplayValue(timeInfo);
+        }
     }
 });

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

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

package/es/data-table/index.js

@@ -1 +1 @@
-export { default as NDataTable } from './src/DataTable';
+export { default as NDataTable, dataTableProps } from './src/DataTable';

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

@@ -1176,6 +1176,7 @@ declare const _default: import("vue").DefineComponent<{
             tmNode: TmNode;
             key: import("treemate").Key;
             striped: boolean;
+            index: number;
         }[];
         hasChildren: boolean;
     }>;
@@ -1212,6 +1213,9 @@ declare const _default: import("vue").DefineComponent<{
     handleCheckboxUpdateChecked: (tmNode: {
         key: RowKey;
     }, checked: boolean, shiftKey: boolean) => void;
+    handleRadioUpdateChecked: (tmNode: {
+        key: RowKey;
+    }) => void;
     handleUpdateExpanded: (key: RowKey, tmNode: TmNode | null) => void;
     renderCell: import("vue").Ref<((value: any, rowData: object, column: import("../interface").TableBaseColumn<import("../interface").InternalRowData>) => import("vue").VNodeChild) | undefined>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{

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

@@ -13,24 +13,27 @@ import { createRowClassName, getColKey, isColumnSorting } from '../utils';
 import Cell from './Cell';
 import ExpandTrigger from './ExpandTrigger';
 import RenderSafeCheckbox from './BodyCheckbox';
+import RenderSafeRadio from './BodyRadio';
 import TableHeader from './Header';
 function flatten(rowInfos, expandedRowKeys) {
     const fRows = [];
-    function traverse(rs) {
+    function traverse(rs, rootIndex) {
         rs.forEach((r) => {
             if (r.children && expandedRowKeys.has(r.key)) {
                 fRows.push({
                     tmNode: r,
                     striped: false,
-                    key: r.key
+                    key: r.key,
+                    index: rootIndex
                 });
-                traverse(r.children);
+                traverse(r.children, rootIndex);
             }
             else {
                 fRows.push({
                     key: r.key,
                     tmNode: r,
-                    striped: false
+                    striped: false,
+                    index: rootIndex
                 });
             }
         });
@@ -39,7 +42,7 @@ function flatten(rowInfos, expandedRowKeys) {
         fRows.push(rowInfo);
         const { children } = rowInfo.tmNode;
         if (children && expandedRowKeys.has(rowInfo.key)) {
-            traverse(children);
+            traverse(children, rowInfo.index);
         }
     });
     return fRows;
@@ -109,7 +112,7 @@ export default defineComponent({
                         }
                     });
                     if (checked) {
-                        doCheck(rowKeysToCheck);
+                        doCheck(rowKeysToCheck, false);
                     }
                     else {
                         doUncheck(rowKeysToCheck);
@@ -119,13 +122,16 @@ export default defineComponent({
                 }
             }
             if (checked) {
-                doCheck(tmNode.key);
+                doCheck(tmNode.key, false);
             }
             else {
                 doUncheck(tmNode.key);
             }
             lastSelectedKey = tmNode.key;
         }
+        function handleRadioUpdateChecked(tmNode) {
+            doCheck(tmNode.key, true);
+        }
         function getScrollContainer() {
             if (!shouldDisplaySomeTablePartRef.value) {
                 const { value: emptyEl } = emptyElRef;
@@ -283,16 +289,18 @@ export default defineComponent({
                         return {
                             tmNode,
                             key: tmNode.key,
-                            striped: index % 2 === 1
+                            striped: index % 2 === 1,
+                            index
                         };
                     }
-                    : (tmNode) => {
+                    : (tmNode, index) => {
                         if (!tmNode.isLeaf)
                             hasChildren = true;
                         return {
                             tmNode,
                             key: tmNode.key,
-                            striped: false
+                            striped: false,
+                            index
                         };
                     });
                 return {
@@ -308,6 +316,7 @@ export default defineComponent({
             virtualListContent,
             handleTableBodyScroll,
             handleCheckboxUpdateChecked,
+            handleRadioUpdateChecked,
             handleUpdateExpanded,
             renderCell }, exposedMethods);
     },
@@ -331,7 +340,7 @@ export default defineComponent({
                 const cordToPass = {};
                 // coordinate to related hover keys
                 const cordKey = {};
-                const { cols, paginatedDataAndInfo, mergedTheme, fixedColumnLeftMap, fixedColumnRightMap, currentPage, rowClassName, mergedSortState, mergedExpandedRowKeySet, componentId, childTriggerColIndex, rowProps, handleMouseenterTable, handleMouseleaveTable, renderExpand, summary, handleCheckboxUpdateChecked, handleUpdateExpanded } = this;
+                const { cols, paginatedDataAndInfo, mergedTheme, fixedColumnLeftMap, fixedColumnRightMap, currentPage, rowClassName, mergedSortState, mergedExpandedRowKeySet, componentId, childTriggerColIndex, rowProps, handleMouseenterTable, handleMouseleaveTable, renderExpand, summary, handleCheckboxUpdateChecked, handleRadioUpdateChecked, handleUpdateExpanded } = this;
                 const { length: colCount } = cols;
                 let mergedData;
                 // if there is children in data, we should expand mergedData first
@@ -350,7 +359,8 @@ export default defineComponent({
                                 tmNode: {
                                     rawNode: row,
                                     disabled: true
-                                }
+                                },
+                                index: -1
                             }))
                         ];
                     }
@@ -363,7 +373,8 @@ export default defineComponent({
                                 tmNode: {
                                     rawNode: summaryRows,
                                     disabled: true
-                                }
+                                },
+                                index: -1
                             }
                         ];
                     }
@@ -381,7 +392,8 @@ export default defineComponent({
                         displayedData.push(rowInfo, {
                             isExpandedRow: true,
                             key: `${rowInfo.key}-expand`,
-                            tmNode: rowInfo.tmNode
+                            tmNode: rowInfo.tmNode,
+                            index: rowInfo.index
                         });
                     }
                     else {
@@ -393,26 +405,29 @@ export default defineComponent({
                 paginatedData.forEach(({ tmNode }, rowIndex) => {
                     rowIndexToKey[rowIndex] = tmNode.key;
                 });
-                const renderRow = (rowInfo, rowIndex, isVirtual) => {
+                const renderRow = (rowInfo, displayedRowIndex, isVirtual) => {
+                    const { index: actualRowIndex } = rowInfo;
                     if ('isExpandedRow' in rowInfo) {
                         const { tmNode: { key, rawNode } } = rowInfo;
                         return (h("tr", { class: `${mergedClsPrefix}-data-table-tr`, key: `${key}__expand` },
                             h("td", { class: [
                                     `${mergedClsPrefix}-data-table-td`,
                                     `${mergedClsPrefix}-data-table-td--last-col`,
-                                    rowIndex + 1 === rowCount &&
+                                    displayedRowIndex + 1 === rowCount &&
                                         `${mergedClsPrefix}-data-table-td--last-row`
-                                ], colspan: colCount }, renderExpand(rawNode, rowIndex))));
+                                ], colspan: colCount }, renderExpand(rawNode, actualRowIndex))));
                     }
                     const isSummary = 'isSummaryRow' in rowInfo;
                     const striped = !isSummary && rowInfo.striped;
                     const { tmNode, key: rowKey } = rowInfo;
                     const { rawNode: rowData } = tmNode;
                     const expanded = mergedExpandedRowKeySet.has(rowKey);
-                    const props = rowProps ? rowProps(rowData, rowIndex) : undefined;
+                    const props = rowProps
+                        ? rowProps(rowData, actualRowIndex)
+                        : undefined;
                     const mergedRowClassName = typeof rowClassName === 'string'
                         ? rowClassName
-                        : createRowClassName(rowData, rowIndex, rowClassName);
+                        : createRowClassName(rowData, actualRowIndex, rowClassName);
                     const row = (h("tr", Object.assign({ onMouseenter: () => {
                             this.hoverKey = rowKey;
                         }, key: rowKey, class: [
@@ -422,8 +437,8 @@ export default defineComponent({
                             mergedRowClassName
                         ] }, props), cols.map((col, colIndex) => {
                         var _a, _b, _c, _d, _e;
-                        if (!isVirtual && rowIndex in cordToPass) {
-                            const cordOfRowToPass = cordToPass[rowIndex];
+                        if (displayedRowIndex in cordToPass) {
+                            const cordOfRowToPass = cordToPass[displayedRowIndex];
                             const indexInCordOfRowToPass = cordOfRowToPass.indexOf(colIndex);
                             if (~indexInCordOfRowToPass) {
                                 cordOfRowToPass.splice(indexInCordOfRowToPass, 1);
@@ -437,29 +452,30 @@ export default defineComponent({
                         const mergedColSpan = isSummary
                             ? ((_a = rowInfo.tmNode.rawNode[colKey]) === null || _a === void 0 ? void 0 : _a.colSpan) || 1 // optional for #1276
                             : colSpan
-                                ? colSpan(rowData, rowIndex)
+                                ? colSpan(rowData, actualRowIndex)
                                 : 1;
                         const mergedRowSpan = isSummary
                             ? ((_b = rowInfo.tmNode.rawNode[colKey]) === null || _b === void 0 ? void 0 : _b.rowSpan) || 1 // optional for #1276
                             : rowSpan
-                                ? rowSpan(rowData, rowIndex)
+                                ? rowSpan(rowData, actualRowIndex)
                                 : 1;
                         const isLastCol = colIndex + mergedColSpan === colCount;
-                        const isLastRow = rowIndex + mergedRowSpan === rowCount;
+                        const isLastRow = displayedRowIndex + mergedRowSpan === rowCount;
                         const isCrossRowTd = mergedRowSpan > 1;
                         if (isCrossRowTd) {
-                            cordKey[rowIndex] = {
+                            cordKey[displayedRowIndex] = {
                                 [colIndex]: []
                             };
                         }
                         if (mergedColSpan > 1 || isCrossRowTd) {
-                            for (let i = rowIndex; i < rowIndex + mergedRowSpan; ++i) {
+                            for (let i = displayedRowIndex; i < displayedRowIndex + mergedRowSpan; ++i) {
                                 if (isCrossRowTd) {
-                                    cordKey[rowIndex][colIndex].push(rowIndexToKey[i]);
+                                    cordKey[displayedRowIndex][colIndex].push(rowIndexToKey[i]);
                                 }
                                 for (let j = colIndex; j < colIndex + mergedColSpan; ++j) {
-                                    if (i === rowIndex && j === colIndex)
+                                    if (i === displayedRowIndex && j === colIndex) {
                                         continue;
+                                    }
                                     if (!(i in cordToPass)) {
                                         cordToPass[i] = [j];
                                     }
@@ -471,7 +487,7 @@ export default defineComponent({
                         }
                         const hoverKey = isCrossRowTd ? this.hoverKey : null;
                         const { cellProps } = column;
-                        const resolvedCellProps = cellProps === null || cellProps === void 0 ? void 0 : cellProps(rowData, rowIndex);
+                        const resolvedCellProps = cellProps === null || cellProps === void 0 ? void 0 : cellProps(rowData, actualRowIndex);
                         return (h("td", Object.assign({}, resolvedCellProps, { key: colKey, style: [
                                 {
                                     textAlign: column.align || undefined,
@@ -486,7 +502,7 @@ export default defineComponent({
                                 isSummary &&
                                     `${mergedClsPrefix}-data-table-td--summary`,
                                 ((hoverKey !== null &&
-                                    cordKey[rowIndex][colIndex].includes(hoverKey)) ||
+                                    cordKey[displayedRowIndex][colIndex].includes(hoverKey)) ||
                                     isColumnSorting(column, mergedSortState)) &&
                                     `${mergedClsPrefix}-data-table-td--hover`,
                                 column.fixed &&
@@ -508,8 +524,8 @@ export default defineComponent({
                                         } }))
                                 ]
                                 : null,
-                            column.type === 'selection' ? (!isSummary ? (h(RenderSafeCheckbox, { key: currentPage, rowKey: rowKey, disabled: rowInfo.tmNode.disabled, onUpdateChecked: (checked, e) => handleCheckboxUpdateChecked(rowInfo.tmNode, checked, e.shiftKey) })) : null) : column.type === 'expand' ? (!isSummary ? (!column.expandable ||
-                                ((_e = column.expandable) === null || _e === void 0 ? void 0 : _e.call(column, rowData)) ? (h(ExpandTrigger, { clsPrefix: mergedClsPrefix, expanded: expanded, onClick: () => handleUpdateExpanded(rowKey, null) })) : null) : null) : (h(Cell, { clsPrefix: mergedClsPrefix, index: rowIndex, row: rowData, column: column, isSummary: isSummary, mergedTheme: mergedTheme, renderCell: this.renderCell }))));
+                            column.type === 'selection' ? (!isSummary ? (column.multiple === false ? (h(RenderSafeRadio, { key: currentPage, rowKey: rowKey, disabled: rowInfo.tmNode.disabled, onUpdateChecked: () => handleRadioUpdateChecked(rowInfo.tmNode) })) : (h(RenderSafeCheckbox, { key: currentPage, rowKey: rowKey, disabled: rowInfo.tmNode.disabled, onUpdateChecked: (checked, e) => handleCheckboxUpdateChecked(rowInfo.tmNode, checked, e.shiftKey) }))) : null) : column.type === 'expand' ? (!isSummary ? (!column.expandable ||
+                                ((_e = column.expandable) === null || _e === void 0 ? void 0 : _e.call(column, rowData)) ? (h(ExpandTrigger, { clsPrefix: mergedClsPrefix, expanded: expanded, onClick: () => handleUpdateExpanded(rowKey, null) })) : null) : null) : (h(Cell, { clsPrefix: mergedClsPrefix, index: actualRowIndex, row: rowData, column: column, isSummary: isSummary, mergedTheme: mergedTheme, renderCell: this.renderCell }))));
                     })));
                     return row;
                 };
@@ -519,8 +535,8 @@ export default defineComponent({
                         } },
                         h("colgroup", null, cols.map((col) => (h("col", { key: col.key, style: col.style })))),
                         this.showHeader ? h(TableHeader, { discrete: false }) : null,
-                        !this.empty ? (h("tbody", { "data-n-id": componentId, class: `${mergedClsPrefix}-data-table-tbody` }, displayedData.map((rowInfo, rowIndex) => {
-                            return renderRow(rowInfo, rowIndex, false);
+                        !this.empty ? (h("tbody", { "data-n-id": componentId, class: `${mergedClsPrefix}-data-table-tbody` }, displayedData.map((rowInfo, displayedRowIndex) => {
+                            return renderRow(rowInfo, displayedRowIndex, false);
                         }))) : null));
                 }
                 else {

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

@@ -0,0 +1,30 @@
+import { PropType } from 'vue';
+import { RowKey } from '../interface';
+declare const _default: import("vue").DefineComponent<{
+    rowKey: {
+        type: PropType<RowKey>;
+        required: true;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    onUpdateChecked: {
+        type: PropType<(checked: boolean) => void>;
+        required: true;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    rowKey: {
+        type: PropType<RowKey>;
+        required: true;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    onUpdateChecked: {
+        type: PropType<(checked: boolean) => void>;
+        required: true;
+    };
+}>>, {}>;
+export default _default;