react-table-edit 1.5.33 → 1.5.34

package/dist/component/table/header.d.ts

@@ -3,7 +3,7 @@ import 'react-resizable/css/styles.css';
 import { IFFilterTable, IFOrderTable, IFTableEditFormat, IHeaderColumnTable } from '../type';
 type IFDataProps = {
     idTable: string;
-    selectEnable: boolean;
+    selectEnable?: boolean;
     dataSource: any[];
     setSelectedRows: Dispatch<SetStateAction<any[]>>;
     col: IHeaderColumnTable;

package/dist/component/table-view/content.d.ts

@@ -12,11 +12,12 @@ type IContentColProps = {
     objWidthFixRight: any;
     lastObjWidthFixLeft: number;
     fisrtObjWidthFixRight: number;
-    selectEnable?: boolean;
     isMulti?: boolean;
     fieldKey: string;
     zeroVisiable?: boolean;
     setSelectedRows: (value: any[]) => void;
+    handleCloseContext: () => void;
+    handleDoubleClick?: (row: any, col: IColumnTable) => void;
 };
 export declare const RenderContentCol: (props: IContentColProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/component/table-view/index.d.ts

@@ -5,8 +5,6 @@ type TableViewProps = {
     dataSource: any[];
     height?: number;
     columns: IColumnTable[];
-    selectEnable?: boolean;
-    isMutil?: boolean;
     isLoading?: boolean;
     formatSetting?: IFTableEditFormat;
     pagingSetting?: IFTableEditPaging;
@@ -39,7 +37,7 @@ type TableViewProps = {
     resetDefaultColumns?: () => void;
     saveSettingColumn?: (data: IFSettingColumns[]) => void;
     setSelectedItem?: Dispatch<SetStateAction<any>>;
-    handleDoubleClick?: (args: any) => void;
+    handleDoubleClick?: (row: any, col: IColumnTable) => void;
     contextMenuItems?: IContextItem[];
     handleContextMenuClick?: (context: IContextItem, data: any) => void;
     isMulti?: boolean;

package/dist/component/type/index.d.ts

@@ -224,6 +224,8 @@ export type IColumnTable = {
     onPaste?: (dataRow: any, dataPaste: any) => void;
     /** Xác thực dữ liệu được paste */
     onPasteValidate?: (dataPaste: string, dataRow: any, rowIndex: number) => Promise<any>;
+    /** Chỉ dùng cho bảng view */
+    onClick?: (dataRow: any, rowIndex: number) => void;
     /**Không có tác dụng */
     rowspan?: number;
 };
@@ -267,6 +269,8 @@ export type IFTableEditToolbar = {
     toolbarBottomOptions?: IFToolbarOptions[];
     /** Hiển thị thanh công cụ dưới */
     showBottomToolbar?: boolean;
+    /** Hiển thị nút cài đặt cột */
+    hiddenSetting?: boolean;
 };
 /** Cấu hình tìm kiếm trong bảng */
 export type IFTableEditSearchSetting = {

package/dist/index.d.ts

@@ -228,6 +228,8 @@ type IColumnTable = {
     onPaste?: (dataRow: any, dataPaste: any) => void;
     /** Xác thực dữ liệu được paste */
     onPasteValidate?: (dataPaste: string, dataRow: any, rowIndex: number) => Promise<any>;
+    /** Chỉ dùng cho bảng view */
+    onClick?: (dataRow: any, rowIndex: number) => void;
     /**Không có tác dụng */
     rowspan?: number;
 };
@@ -271,6 +273,8 @@ type IFTableEditToolbar = {
     toolbarBottomOptions?: IFToolbarOptions[];
     /** Hiển thị thanh công cụ dưới */
     showBottomToolbar?: boolean;
+    /** Hiển thị nút cài đặt cột */
+    hiddenSetting?: boolean;
 };
 /** Cấu hình tìm kiếm trong bảng */
 type IFTableEditSearchSetting = {
@@ -703,8 +707,6 @@ type TableViewProps = {
     dataSource: any[];
     height?: number;
     columns: IColumnTable[];
-    selectEnable?: boolean;
-    isMutil?: boolean;
     isLoading?: boolean;
     formatSetting?: IFTableEditFormat;
     pagingSetting?: IFTableEditPaging;
@@ -737,7 +739,7 @@ type TableViewProps = {
     resetDefaultColumns?: () => void;
     saveSettingColumn?: (data: IFSettingColumns[]) => void;
     setSelectedItem?: Dispatch<SetStateAction<any>>;
-    handleDoubleClick?: (args: any) => void;
+    handleDoubleClick?: (row: any, col: IColumnTable) => void;
     contextMenuItems?: IContextItem[];
     handleContextMenuClick?: (context: IContextItem, data: any) => void;
     isMulti?: boolean;

package/dist/index.js

@@ -19838,7 +19838,7 @@ const generateUUID = () => {
  * @param isDone đã nhập xong
  * @returns
  */
-const formartNumberic = (str, decimalSeparator, thousandSeparator, fraction = 10, isDone, haveNegative = true) => {
+const formartNumberic = (str, decimalSeparator, thousandSeparator, fraction = 2, isDone, haveNegative = true) => {
     if (isDone) {
         str = roundNumber(Number(str), fraction);
     }
@@ -20128,7 +20128,7 @@ const getMaxExpandedLevel = (items, fieldChildren = 'children', level = 0) => {
     });
     return max;
 };
-const findItemInTree = (items, filter, keyFilter = "value", keyChildren = "children") => {
+const findItemInTree = (items, filter, keyFilter = 'value', keyChildren = 'children') => {
     for (let index = 0; index < items.length; index++) {
         const item = items[index];
         if (item[keyFilter] === filter) {
@@ -39042,7 +39042,7 @@ const HeaderTableCol = (props) => {
                     left: col.fixedType === 'left' ? objHeaderWidthFixLeft[`${indexParent}-${indexCol ?? 0}`] : undefined,
                     right: col.fixedType === 'right' ? objHeaderWidthFixRight[`${indexParent}-${indexCol ?? 0}`] : undefined
                 }, children: jsxRuntime.jsxs("div", { style: { justifyContent: col.textAlign === 'center' ? 'center' : 'space-between' }, onClick: () => {
-                        if (!allowSorting || col.columns?.length) {
+                        if (!allowSorting || col.columns?.length || col.field === 'checkbox') {
                             return;
                         }
                         if (order) {
@@ -39840,12 +39840,12 @@ const ToolbarBottom = ({ handleAdd, handleDuplicate, handleInsertBefore, handleI
     return (jsxRuntime.jsx("div", { id: "table_custom_bottom_toolbar", className: "r-toolbar r-toolbar-bottom", role: "toolbar", "aria-disabled": "false", "aria-haspopup": "false", "aria-orientation": "horizontal", children: jsxRuntime.jsxs("div", { className: "r-toolbar-items", children: [jsxRuntime.jsxs("div", { className: "r-toolbar-left", children: [jsxRuntime.jsxs("div", { className: classNames$1('r-toolbar-item d-flex', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: [jsxRuntime.jsx(Button$1$1, { color: "success", outline: true, onClick: () => handleAdd(1), className: "d-flex", children: t('Add item') }), !!buttonSetting?.disableAddMulti && (jsxRuntime.jsxs(UncontrolledDropdown, { className: "nav-item", children: [jsxRuntime.jsx(DropdownToggle$1, { tag: "div", className: "me-0 d-flex", children: jsxRuntime.jsx(Button$1$1, { type: "button", color: "success", outline: true, style: { marginLeft: -1 }, className: "px-25", children: jsxRuntime.jsx("svg", { fill: "#28c76f", height: "15", width: "20", viewBox: "0 0 20 20", children: jsxRuntime.jsx("path", { d: "M4.516 7.548c0.436-0.446 1.043-0.481 1.576 0l3.908 3.747 3.908-3.747c0.533-0.481 1.141-0.446 1.574 0 0.436 0.445 0.408 1.197 0 1.615-0.406 0.418-4.695 4.502-4.695 4.502-0.217 0.223-0.502 0.335-0.787 0.335s-0.57-0.112-0.789-0.335c0 0-4.287-4.084-4.695-4.502s-0.436-1.17 0-1.615z" }) }) }) }), jsxRuntime.jsxs(DropdownMenu$1, { className: "formula-dropdown icon-dropdown p-0", children: [jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(10), children: "10 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(20), children: "20 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(30), children: "30 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(40), children: "40 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(50), children: "50 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(100), children: "100 h\u00E0ng" }), jsxRuntime.jsx(DropdownItem$1, { className: "py-25", tag: "div", onClick: () => handleAdd(1000), children: "1000 h\u00E0ng" })] })] }))] }), (focusRow ?? -1) > -1 ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.duplicateDisable }), "aria-disabled": "false", children: jsxRuntime.jsx(Button$1$1, { color: "success", outline: true, onClick: () => {
                                             handleDuplicate();
                                         }, className: "d-flex", children: t('Duplicate') }) }), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.insertBeforeDisable }), "aria-disabled": "false", children: jsxRuntime.jsx(Button$1$1, { color: "success", outline: true, onClick: handleInsertBefore, className: "d-flex", children: t('Insert item before') }) }), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || addDisable || buttonSetting?.insertAfterDisable }), "aria-disabled": "false", children: jsxRuntime.jsx(Button$1$1, { color: "success", outline: true, onClick: handleInsertAfter, className: "d-flex", children: t('Insert item after') }) })] })) : (jsxRuntime.jsx(jsxRuntime.Fragment, { children: " " })), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item', { 'd-none': editDisable || buttonSetting?.deleteAllDisable }), "aria-disabled": "false", children: jsxRuntime.jsx(Button$1$1, { color: "primary", outline: true, onClick: handleDeleteAll, className: "d-flex", children: t('Delete all item') }) }), toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
-                            return item.align === 'left' ? (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-left-${index}`)) : ('');
+                            return (item.align === 'left' && (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-left-${index}`)));
                         })] }), jsxRuntime.jsx("div", { className: "r-toolbar-center", children: toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
-                        return item.align === 'center' ? (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-center-${index}`)) : ('');
+                        return (item.align === 'center' && (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-center-${index}`)));
                     }) }), jsxRuntime.jsxs("div", { className: "r-toolbar-right", children: [toolbarSetting?.toolbarBottomOptions?.map((item, index) => {
-                            return item.align === 'right' ? (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-right-${index}`)) : ('');
-                        }), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item me-25'), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxRuntime.jsxs(UncontrolledDropdown, { className: "dropdown-user nav-item", children: [jsxRuntime.jsx(DropdownToggle$1, { tag: "div", color: "primary", onClick: (e) => e.preventDefault(), children: jsxRuntime.jsx(SvgInfo, { className: "cursor-pointer text-primary" }) }), jsxRuntime.jsx(DropdownMenu$1, { className: "formula-dropdown icon-dropdown", children: jsxRuntime.jsxs("ul", { className: "mb-0 pe-50", children: [jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + D \u0111\u1EC3 nh\u00E2n b\u1EA3n" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Ch\u1ECDn \u00F4 v\u00E0 Ctrl + V \u0111\u1EC3 d\u00E1n th\u00F4ng tin t\u1EEB excel" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + C \u0111\u1EC3 sao ch\u00E9p h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + V \u0111\u1EC3 d\u00E1n h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2191 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng tr\u00EAn" })] }) })] }) })] })] }) }));
+                            return (item.align === 'right' && (jsxRuntime.jsx("div", { className: "r-toolbar-item", "aria-disabled": "false", children: item.template() }, `toolbar-bottom-right-${index}`)));
+                        }), !toolbarSetting?.hiddenSetting && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item me-25'), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classNames$1('r-toolbar-item me-25', { 'd-none': editDisable || addDisable }), "aria-disabled": "false", children: jsxRuntime.jsxs(UncontrolledDropdown, { className: "dropdown-user nav-item", children: [jsxRuntime.jsx(DropdownToggle$1, { tag: "div", color: "primary", onClick: (e) => e.preventDefault(), children: jsxRuntime.jsx(SvgInfo, { className: "cursor-pointer text-primary" }) }), jsxRuntime.jsx(DropdownMenu$1, { className: "formula-dropdown icon-dropdown", children: jsxRuntime.jsxs("ul", { className: "mb-0 pe-50", children: [jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + D \u0111\u1EC3 nh\u00E2n b\u1EA3n" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Ch\u1ECDn \u00F4 v\u00E0 Ctrl + V \u0111\u1EC3 d\u00E1n th\u00F4ng tin t\u1EEB excel" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + C \u0111\u1EC3 sao ch\u00E9p h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n v\u00E0o c\u1ED9t STT \u0111\u1EC3 ch\u1ECDn h\u00E0ng v\u00E0 nh\u1EA5n Ctrl + V \u0111\u1EC3 d\u00E1n h\u00E0ng" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" }), jsxRuntime.jsx("li", { style: { fontSize: 13 }, children: "Nh\u1EA5n Ctrl ho\u1EB7c Alt + Shift + \u2191 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng tr\u00EAn" })] }) })] }) })] }))] })] }) }));
 };
 
 const RenderToolbarTop = ({ toolbarTopOption }) => {
@@ -68731,7 +68731,7 @@ const UnExpandAllIcon = ({ className, color = '#7F7F7F', size = 24, onClick, sty
 };
 
 const RenderContentCol = (props) => {
-    const { col, indexCol, indexRow, isSelected, row, zeroVisiable, formatSetting, idTable, fisrtObjWidthFixRight, lastObjWidthFixLeft, objWidthFixLeft, objWidthFixRight, selectedRows, selectEnable, setSelectedRows, fieldKey, isMulti } = props;
+    const { col, indexCol, indexRow, isSelected, row, zeroVisiable, formatSetting, idTable, fisrtObjWidthFixRight, lastObjWidthFixLeft, objWidthFixLeft, objWidthFixRight, selectedRows, setSelectedRows, handleCloseContext, handleDoubleClick, fieldKey, isMulti } = props;
     const cellId = `content-${idTable}-row${indexRow}col-${indexCol}`;
     const checkOverflow = () => {
         const element = document.getElementById(cellId);
@@ -68739,31 +68739,27 @@ const RenderContentCol = (props) => {
     };
     const RenderElement = () => {
         if (col.type === 'checkbox' || col.field === 'checkbox') {
-            return (jsxRuntime.jsx("div", { className: "r-rowcell-div cursor-pointer", style: { display: 'flex', justifyContent: col.textAlign === 'center' ? 'center' : col.textAlign === 'right' ? 'flex-end' : 'flex-start', alignItems: 'center' }, onClick: (e) => {
-                    console.log(isMulti);
-                    console.log(selectEnable);
-                    if (selectEnable) {
-                        const index = selectedRows?.findIndex((x) => x[fieldKey] === row[fieldKey]);
-                        if (index > -1) {
-                            if (isMulti) {
-                                selectedRows?.splice(index, 1);
-                                setSelectedRows([...selectedRows]);
-                            }
-                            else {
-                                setSelectedRows([]);
-                            }
+            return (jsxRuntime.jsx("div", { className: classNames$1('r-rowcell-div cursor-pointer', { 'r-active-cell': isSelected }), style: { display: 'flex', justifyContent: col.textAlign === 'center' ? 'center' : col.textAlign === 'right' ? 'flex-end' : 'flex-start', alignItems: 'center' }, onClick: (e) => {
+                    const index = selectedRows?.findIndex((x) => x[fieldKey] === row[fieldKey]);
+                    if (index > -1) {
+                        if (isMulti) {
+                            selectedRows?.splice(index, 1);
+                            setSelectedRows([...selectedRows]);
                         }
                         else {
-                            if (isMulti) {
-                                setSelectedRows([...selectedRows, row]);
-                            }
-                            else {
-                                setSelectedRows([row]);
-                            }
+                            setSelectedRows([]);
+                        }
+                    }
+                    else {
+                        if (isMulti) {
+                            setSelectedRows([...selectedRows, row]);
+                        }
+                        else {
+                            setSelectedRows([row]);
                         }
-                        e.stopPropagation();
                     }
-                }, children: jsxRuntime.jsx(Input$1, { checked: isSelected, type: "checkbox", className: "cursor-pointer", style: { textAlign: col.textAlign ?? 'center' } }) }));
+                    e.stopPropagation();
+                }, children: jsxRuntime.jsx(Input$1, { defaultChecked: isSelected, type: "checkbox", className: "cursor-pointer", style: { textAlign: col.textAlign ?? 'center' } }) }));
         }
         else {
             let value = row[col.field];
@@ -68788,9 +68784,13 @@ const RenderContentCol = (props) => {
             const prefix = isNegative ? formatSetting?.prefixNegative ?? '-' : '';
             const suffix = isNegative ? formatSetting?.suffixNegative ?? '' : '';
             const displayText = isNegative ? `${prefix}${value}${suffix}` : value ?? '';
-            return (jsxRuntime.jsxs("div", { className: classNames$1('r-rowcell-div'), style: {
+            return (jsxRuntime.jsxs("div", { className: classNames$1('r-rowcell-div cursor-pointer', { 'r-active-cell': isSelected }), style: {
                     fontWeight: row.sortOrder < 0 || row.sortOrder > 100000 || row.haveBoldType ? 600 : 400,
                     fontStyle: row.haveItalicType ? 'italic' : 'normal'
+                }, onDoubleClick: (e) => {
+                    e.preventDefault();
+                    handleCloseContext();
+                    handleDoubleClick?.(row, col);
                 }, children: [jsxRuntime.jsx("div", { className: "r-cell-text", style: {
                             display: 'flex',
                             justifyContent: col.textAlign === 'center' ? 'center' : col.textAlign === 'right' ? 'flex-end' : 'flex-start',
@@ -68809,24 +68809,22 @@ const RenderContentCol = (props) => {
                 right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined
             }, onClick: (e) => {
                 if (e.target.nodeName === 'DIV' || e.target.nodeName === 'TD') {
-                    if (selectEnable) {
-                        const index = selectedRows?.findIndex((x) => x[fieldKey] === row[fieldKey]);
-                        if (index > -1) {
-                            if (isMulti) {
-                                selectedRows?.splice(index, 1);
-                                setSelectedRows([...selectedRows]);
-                            }
-                            else {
-                                setSelectedRows([]);
-                            }
+                    const index = selectedRows?.findIndex((x) => x[fieldKey] === row[fieldKey]);
+                    if (index > -1) {
+                        if (isMulti) {
+                            selectedRows?.splice(index, 1);
+                            setSelectedRows([...selectedRows]);
                         }
                         else {
-                            if (isMulti) {
-                                setSelectedRows([...selectedRows, row]);
-                            }
-                            else {
-                                setSelectedRows([row]);
-                            }
+                            setSelectedRows([]);
+                        }
+                    }
+                    else {
+                        if (isMulti) {
+                            setSelectedRows([...selectedRows, row]);
+                        }
+                        else {
+                            setSelectedRows([row]);
                         }
                     }
                     e.stopPropagation();
@@ -68834,7 +68832,7 @@ const RenderContentCol = (props) => {
             }, children: RenderElement() }, `col-${indexRow}-${indexCol}`)) }));
 };
 
-const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false, isLoading, selectEnable, formatSetting, querySetting, pagingSetting, searchSetting, columnsAggregate, toolbarSetting, selectedItem, setSelectedItem, handleSelect, saveSettingColumn, resetDefaultColumns, settingColumns, headerComponent, groupSetting, zeroVisiable, isMulti, handleDoubleClick, contextMenuItems, handleContextMenuClick }) => {
+const TableView = ({ idTable, dataSource, height = 400, columns, isLoading, formatSetting, querySetting, pagingSetting, searchSetting, columnsAggregate, toolbarSetting, selectedItem, setSelectedItem, handleSelect, saveSettingColumn, resetDefaultColumns, settingColumns, headerComponent, groupSetting, zeroVisiable, isMulti, handleDoubleClick, contextMenuItems, handleContextMenuClick }) => {
     const { t } = reactI18next.useTranslation();
     const gridRef = React$5.useRef(null);
     const [openPopupSetupColumn, setOpenPopupSetupColumn] = React$5.useState(false);
@@ -69045,8 +69043,10 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
         }
     };
     React$5.useEffect(() => {
+        console.log(selectedRows);
+        console.log(isMulti);
         if (setSelectedItem) {
-            if (isMutil) {
+            if (isMulti) {
                 if (dataSource && selectedRows && selectedRows?.length !== selectedItem?.length) {
                     setSelectedItem([...selectedRows]);
                     if (handleSelect) {
@@ -69073,7 +69073,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
         }
     }, [selectedRows]);
     React$5.useEffect(() => {
-        if (!isMutil) {
+        if (!isMulti) {
             if (dataSource && selectedItem && selectedItem[fieldKey]) {
                 if (selectedRows?.length === 0 || selectedItem[fieldKey] !== selectedRows[0][fieldKey]) {
                     setSelectedRows([selectedItem]);
@@ -69139,14 +69139,10 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
                 }
                 else {
                     const isSelected = selectedRows?.some((x) => x[fieldKey] === row[fieldKey]);
-                    return (jsxRuntime.jsx("tr", { id: `row-content-${indexRow}`, "aria-rowindex": indexRow + 1, role: "row", className: classNames$1('r-row', { 'r-last-row': level === 0 && indexRow === viewData.length - 1 }), onDoubleClick: (e) => {
-                            e.preventDefault();
-                            handleCloseContext();
-                            handleDoubleClick?.(row);
-                        }, onContextMenu: (e) => {
+                    return (jsxRuntime.jsx("tr", { id: `row-content-${indexRow}`, "aria-rowindex": indexRow + 1, role: "row", className: classNames$1('r-row', { 'r-last-row': level === 0 && indexRow === viewData.length - 1 }), onContextMenu: (e) => {
                             e.preventDefault();
                             handleContextMenu(e, row);
-                        }, children: contentColumns.map((column, indexCol) => (jsxRuntime.jsx(RenderContentCol, { idTable: idTable, col: column, fieldKey: fieldKey, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, isMulti: isMutil ?? false, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, formatSetting: formatSetting, indexCol: indexCol, indexRow: indexRow, isSelected: isSelected, row: row, zeroVisiable: zeroVisiable }, indexCol))) }, `row-content-${indexRow}`));
+                        }, children: contentColumns.map((column, indexCol) => (jsxRuntime.jsx(RenderContentCol, { idTable: idTable, col: column, fieldKey: fieldKey, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, fisrtObjWidthFixRight: fisrtObjWidthFixRight, lastObjWidthFixLeft: lastObjWidthFixLeft, isMulti: isMulti, selectedRows: selectedRows, setSelectedRows: setSelectedRows, formatSetting: formatSetting, indexCol: indexCol, indexRow: indexRow, isSelected: isSelected, row: row, zeroVisiable: zeroVisiable, handleCloseContext: handleCloseContext, handleDoubleClick: handleDoubleClick }, indexCol))) }, `row-content-${indexRow}`));
                 }
             }) }));
     };
@@ -69174,7 +69170,7 @@ const TableView = ({ idTable, dataSource, height = 400, columns, isMutil = false
         }
     }, [context]);
     return (jsxRuntime.jsxs("div", { className: "r-table-edit r-virtualized-table", children: [jsxRuntime.jsxs("div", { className: "r-grid", children: [toolbarSetting?.showTopToolbar && jsxRuntime.jsx(RenderToolbarTop, { toolbarTopOption: toolbarTopOption }), headerComponent && headerComponent(), jsxRuntime.jsxs("div", { ref: gridRef, className: "r-gridtable", style: { height: `${height ? `${height}px` : 'auto'}`, position: 'relative' }, children: [jsxRuntime.jsxs("table", { role: "presentation", style: { width: '100%' }, children: [jsxRuntime.jsx(RenderColGroup, { contentColumns: contentColumns }), jsxRuntime.jsx("thead", { className: "r-gridheader", role: "rowgroup", children: headerColumns.map((rowColumn, indexParent) => {
-                                            return (jsxRuntime.jsx("tr", { className: "r-row", role: "row", children: rowColumn.map((col, index) => (jsxRuntime.jsx(HeaderTableCol, { col: col, idTable: idTable ?? '', dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objHeaderWidthFixLeft: objHeaderWidthFixLeft, objHeaderWidthFixRight: objHeaderWidthFixRight, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, container: gridRef, filterBy: filterBy, orderBy: orderBy, optionsFilter: querySetting?.optionsFilter, allowFiltering: querySetting?.allowFiltering, allowSorting: querySetting?.allowSorting, formatSetting: formatSetting, changeFilter: (val) => {
+                                            return (jsxRuntime.jsx("tr", { className: "r-row", role: "row", children: rowColumn.map((col, index) => (jsxRuntime.jsx(HeaderTableCol, { col: col, idTable: idTable ?? '', dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objHeaderWidthFixLeft: objHeaderWidthFixLeft, objHeaderWidthFixRight: objHeaderWidthFixRight, selectEnable: true, selectedRows: selectedRows, setSelectedRows: setSelectedRows, container: gridRef, filterBy: filterBy, orderBy: orderBy, optionsFilter: querySetting?.optionsFilter, allowFiltering: querySetting?.allowFiltering, allowSorting: querySetting?.allowSorting, formatSetting: formatSetting, changeFilter: (val) => {
                                                         setFilterBy([...val]);
                                                         if (querySetting?.changeFilter) {
                                                             querySetting.changeFilter(val);