react-table-edit 1.4.11 → 1.4.13

package/dist/index.js

@@ -41736,7 +41736,7 @@ var css_248z$1 = ".react-resizable {\n  position: relative;\n}\n.react-resizable
 styleInject(css_248z$1);
 
 const HeaderTableCol = (props) => {
-    const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objWidthFix, totalCount, selectedRows, column, setColumn, isMulti } = props;
+    const { selectEnable, dataSource, setSelectedRows, col, indexCol, indexParent, objWidthFixLeft, objWidthFixRight, totalCount, selectedRows, column, setColumn, isMulti } = props;
     const { t } = reactI18next.useTranslation();
     const handleResize = (e, { size }) => {
         // Update the column width here
@@ -41755,8 +41755,8 @@ const HeaderTableCol = (props) => {
     };
     return (jsxRuntime.jsx(React$5.Fragment, { children: col.visible !== false && (jsxRuntime.jsx(Resizable, { className: "r-resize", width: typeof col.width === 'number' ? col.width : Number((col.width ?? "").replaceAll(new RegExp(`[^0-9]`, "g"), '')), height: 0, onResize: handleResize, draggableOpts: { enableUserSelectHack: false }, children: jsxRuntime.jsx("th", { rowSpan: col.rowspan !== 1 ? col.rowspan : undefined, colSpan: col.columns?.filter(x => x.visible !== false)?.length ?? 1, className: classnames(`r-headercell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }), style: {
                     top: `${indexParent * 42}px`,
-                    left: col.fixedType === 'left' ? objWidthFix[col.index ?? 0] : undefined,
-                    right: col.fixedType === 'right' ? objWidthFix[col.index ?? 0] : undefined,
+                    left: col.fixedType === 'left' ? objWidthFixLeft[col.index ?? 0] : undefined,
+                    right: col.fixedType === 'right' ? objWidthFixRight[col.index ?? 0] : undefined,
                     width: col.width ? typeof col.width === 'number' ? col.width : col.width?.includes('px') || col.width?.includes('%') ? col.width : `${col.width}px` : 'auto',
                     minWidth: col.fixedType ? col.width : col.minWidth ? typeof col.minWidth === 'number' ? col.minWidth : col.minWidth?.includes('px') || col.minWidth?.includes('%') ? col.minWidth : `${col.minWidth}px` : 'auto',
                     maxWidth: col.fixedType ? col.width : col.maxWidth ? typeof col.maxWidth === 'number' ? col.maxWidth : col.maxWidth?.includes('px') || col.maxWidth?.includes('%') ? col.maxWidth : `${col.maxWidth}px` : 'auto'
@@ -42264,7 +42264,7 @@ const ToolbarBottom = ({ handleAdd, handleDuplicate, handleInsertBefore, handleI
                         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('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classnames('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("div", { className: classnames('r-toolbar-item me-25', { 'd-none': headerColumns.length > 1 }), "aria-disabled": "false", children: jsxRuntime.jsx(SvgSettings, { className: "text-primary cursor-pointer", onClick: () => setOpenPopupSetupColumn(true) }) }), jsxRuntime.jsx("div", { className: classnames('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 + Shift + \u2193 \u0111\u1EC3 sao ch\u00E9p d\u1EEF li\u1EC7u \u00F4 cho c\u00E1c d\u00F2ng d\u01B0\u1EDBi" })] }) })] }) })] })] }) }));
 };
 
 const handleArrowRight = (e, params) => {
@@ -42316,17 +42316,38 @@ const handleArrowUp = (e, params) => {
     }
 };
 const handleArrowDown = (e, params) => {
-    const { idElement, indexCol, indexRow, totalCount, pagingClient, pagingSetting, setIndexFocus, focusNewElement } = params;
-    const element = document.getElementById(idElement);
-    if (!isSelectMenuOpen(element) && indexRow < totalCount) {
-        if (pagingClient && (indexRow % (pagingSetting?.pageSize ?? 0)) === 0 && pagingSetting?.setCurrentPage) {
-            pagingSetting?.setCurrentPage((pagingSetting?.currentPage ?? 1) + 1);
+    const { idElement, indexCol, indexRow, totalCount, pagingClient, pagingSetting, setIndexFocus, focusNewElement, rowChange, changeDataSource, dataSource, contentColumns, row } = params;
+    if ((e.ctrlKey || e.metaKey) && e.shiftKey) {
+        if (indexRow < totalCount) {
+            const column = contentColumns[indexCol - 1];
+            for (let index = indexRow; index < totalCount; index++) {
+                const element = dataSource[index];
+                element[column.field ?? ''] = row[column.field ?? ''];
+                if (column.callback && column.callbackValue) {
+                    const value = column.callbackValue(row);
+                    column.callback(value, index, element);
+                }
+                if (rowChange) {
+                    rowChange(element, indexRow, column.field);
+                }
+            }
+            changeDataSource(dataSource);
         }
-        setIndexFocus(indexRow);
-        focusNewElement(indexCol, indexRow + 1, true);
         e.preventDefault();
         return e.code;
     }
+    else {
+        const element = document.getElementById(idElement);
+        if (!isSelectMenuOpen(element) && indexRow < totalCount) {
+            if (pagingClient && (indexRow % (pagingSetting?.pageSize ?? 0)) === 0 && pagingSetting?.setCurrentPage) {
+                pagingSetting?.setCurrentPage((pagingSetting?.currentPage ?? 1) + 1);
+            }
+            setIndexFocus(indexRow);
+            focusNewElement(indexCol, indexRow + 1, true);
+            e.preventDefault();
+            return e.code;
+        }
+    }
 };
 const handleTab = (e, params) => {
     const { indexCol, columnLastEdit, indexRow, totalCount, moveIndexRowToNewPage, pagingClient, pagingSetting, setIndexFocus, focusNewElement } = params;
@@ -42515,7 +42536,10 @@ const TableEdit = React$5.forwardRef((props, ref) => {
     const [levelCol, setLevelCol] = React$5.useState(0);
     const [columnFistEdit, setColumnFistEdit] = React$5.useState(0);
     const [columnLastEdit, setColumnlastEdit] = React$5.useState(0);
-    const [objWidthFix, setObjWidthFix] = React$5.useState({});
+    const [objWidthFixRight, setObjWidthFixRight] = React$5.useState({});
+    const [objWidthFixLeft, setObjWidthFixLeft] = React$5.useState({});
+    const [lastObjWidthFixLeft, setLastObjWidthFixLeft] = React$5.useState(0);
+    const [fisrtObjWidthFixRight, setFisrtObjWidthFixRight] = React$5.useState(0);
     const [openPopupSetupColumn, setOpenPopupSetupColumn] = React$5.useState(false);
     const [searchTerm, setSearchTerm] = React$5.useState('');
     const tableElement = React$5.useRef(null);
@@ -42542,12 +42566,14 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                 headerColumns[0][index].fixedType = item.fixedType;
             }
             if (item.fixedType === 'left' && item.visible !== false) {
-                objWidthFix[index] = letfWidthFix;
+                setLastObjWidthFixLeft(index);
+                objWidthFixLeft[index] = letfWidthFix;
                 letfWidthFix += Number(item.width ?? 40);
             }
             const lasColumn = contentColumns[contentColumns.length - 1 - index];
             if (lasColumn.fixedType === 'right' && lasColumn.visible !== false) {
-                objWidthFix[contentColumns.length - 1 - index] = rightWidthFix;
+                setFisrtObjWidthFixRight(contentColumns.length - 1 - index);
+                objWidthFixRight[contentColumns.length - 1 - index] = rightWidthFix;
                 rightWidthFix += Number(lasColumn.width ?? 40);
             }
             if (item.editEnable && (item.visible !== false) && (!item.disabledCondition)) {
@@ -42560,7 +42586,8 @@ const TableEdit = React$5.forwardRef((props, ref) => {
         if (levelCol === 1) {
             setHeaderColumns([...headerColumns]);
         }
-        setObjWidthFix(objWidthFix);
+        setObjWidthFixLeft(objWidthFixLeft);
+        setObjWidthFixRight(objWidthFixRight);
         setColumnFistEdit(indexFirst + 1);
         setColumnlastEdit(indexlast + 1);
     }, [contentColumns]);
@@ -42698,9 +42725,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                         }
                         handleDataChange(row, col, indexRow);
                     }, dateFormat: "dd/MM/yyyy HH:mm", onKeyDown: (e) => {
-                        if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) {
-                            return true;
-                        }
+                        checkKeyDown(e, row, col, indexRow + 1, indexCol + 1);
                     } }));
             case 'select':
                 let valueSelect;
@@ -42746,7 +42771,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                         }
                         handleDataChange(row, col, indexRow);
                     }, fieldValue: col.selectSettings?.fieldValue, fieldLabel: col.selectSettings?.fieldLabel, component: gridRef, columns: col.selectSettings?.columns, isClearable: col.selectSettings?.isClearable ?? false, formatSetting: formatSetting, placeholder: t('Select'), loadOptions: col.selectSettings?.loadOptions, handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : undefined, isMulti: col.selectSettings?.isMulti, noHeader: col.selectSettings?.noHeader, showFooter: col.selectSettings?.showFooter, formatOptionLabel: col.selectSettings?.formatOptionLabel, footerComponent: col.selectSettings?.footerComponent, invalid: (col.validate && !isNullOrUndefined$1(col.validate(row[col.field], row))), maxHeight: col.selectSettings?.heightPopup ? Number(col.selectSettings?.heightPopup) : undefined, menuWidth: col.selectSettings?.widthPopup ? Number(col.selectSettings?.widthPopup) : undefined, textAlign: col.textAlign ?? 'left', allowCreate: col.selectSettings?.allowCreate, onKeyDown: (e) => {
-                        if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) ;
+                        return checkKeyDown(e, row, col, indexRow + 1, indexCol + 1);
                     }, onOpenMenu: () => {
                         if (col.selectSettings?.onOpenMenu) {
                             col.selectSettings?.onOpenMenu(row, col, indexRow);
@@ -42802,7 +42827,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                             col.selectSettings?.onOpenMenu(row, col, indexRow);
                         }
                     }, loadOptions: col.selectSettings?.loadOptions, handleAdd: col.selectSettings?.handAddNew ? (e) => col.selectSettings?.handAddNew(e, indexRow, row) : undefined, fieldChildren: col.selectSettings?.fieldChild ?? 'children', selectChilds: col.selectSettings?.selectChilds, showFooter: col.selectSettings?.showFooter, formatOptionLabel: col.selectSettings?.formatOptionLabel, footerComponent: col.selectSettings?.footerComponent, width: col.selectSettings?.widthPopup ? Number(col.selectSettings?.widthPopup) : undefined, isMulti: col.selectSettings?.isMulti, noHeader: col.selectSettings?.noHeader, invalid: col.validate && col.validate(row[col.field], row), maxHeight: col.selectSettings?.heightPopup ? Number(col.selectSettings?.heightPopup) : undefined, menuWidth: col.selectSettings?.widthPopup ? Number(col.selectSettings?.widthPopup) : undefined, textAlign: col.textAlign ?? 'left', onKeyDown: (e) => {
-                        if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) ;
+                        checkKeyDown(e, row, col, indexRow + 1, indexCol + 1);
                     }, onPaste: (e) => {
                         if (toolbarSetting?.showBottomToolbar && !editDisable && !addDisable && !col.disablePaste) {
                             pasteDataFromExcel(indexRow, indexCol, e);
@@ -42817,7 +42842,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                         }
                         handleDataChange(row, col, indexRow);
                     }, onKeyDown: (e) => {
-                        if (checkKeyDown(e, row, col, indexRow + 1, indexCol + 1)) ;
+                        checkKeyDown(e, row, col, indexRow + 1, indexCol + 1);
                     } }));
             case 'numeric':
                 const numericFormatProps = {
@@ -42967,6 +42992,8 @@ const TableEdit = React$5.forwardRef((props, ref) => {
             addDisable,
             editDisable,
             focusNewElement,
+            changeDataSource,
+            rowChange,
             handleDuplicate: () => handleDuplicate(dataSource, indexFocus, fieldKey, defaultValue, fieldUniKey, changeDataSource, tableElement, totalCount, toolbarSetting, buttonSetting, editDisable, addDisable, onDuplicate),
             idElement,
             indexCol,
@@ -43236,16 +43263,16 @@ const TableEdit = React$5.forwardRef((props, ref) => {
     }, [selectedItem]);
     const renderContentCol = (col, row, indexRow, indexCol, isSelected) => {
         if (col.field === 'command') {
-            return (col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
-                    left: col.fixedType === 'left' ? objWidthFix[indexCol] : undefined,
-                    right: col.fixedType === 'right' ? objWidthFix[indexCol] : undefined,
+            return (col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'cell-fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
+                    left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
+                    right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
                     textAlign: col.textAlign ? col.textAlign : 'left',
                 }, children: jsxRuntime.jsx("div", { className: "r-rowcell-div command", children: jsxRuntime.jsx(CommandElement, { commandItems: col.commandItems ?? [], handleCommandClick: handleCommandClick, indexRow: indexRow, rowData: row, setIndexFocus: setIndexFocus, indexFocus: indexFocus }) }) }, `col-${indexRow}-${indexCol}`));
         }
         else if (col.field === '#') {
-            return (col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 cursor-pointer fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), tabIndex: Number(`${indexRow}${indexCol}`), style: {
-                    left: col.fixedType === 'left' ? objWidthFix[indexCol] : undefined,
-                    right: col.fixedType === 'right' ? objWidthFix[indexCol] : undefined,
+            return (col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 cursor-pointer fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'cell-fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), tabIndex: Number(`${indexRow}${indexCol}`), style: {
+                    left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
+                    right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
                     textAlign: 'center',
                 }, onCopy: (e) => {
                     if (!editDisable && (e.target.nodeName === 'DIV' || e.target.nodeName === 'TD')) {
@@ -43281,9 +43308,9 @@ const TableEdit = React$5.forwardRef((props, ref) => {
                 }, children: jsxRuntime.jsx("div", { className: "r-rowcell-div", children: indexRow + 1 }) }, `col-${indexRow}-${indexCol}`));
         }
         else if (col.field === 'checkbox') {
-            return (jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
-                    left: col.fixedType === 'left' ? objWidthFix[indexCol] : undefined,
-                    right: col.fixedType === 'right' ? objWidthFix[indexCol] : undefined
+            return (jsxRuntime.jsx("td", { className: classnames(`r-rowcell p-0 fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'cell-fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
+                    left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
+                    right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
                 }, children: jsxRuntime.jsx("div", { className: "r-rowcell-div cursor-pointer", style: { alignItems: 'center' }, onClick: (e) => {
                         if (selectEnable) {
                             const index = selectedRows?.findIndex((x) => x[fieldKey] === row[fieldKey]);
@@ -43321,9 +43348,9 @@ const TableEdit = React$5.forwardRef((props, ref) => {
             }
             const typeDis = !editDisable && (indexFocus === indexRow || col.editType === 'checkbox') && (!col.disabledCondition || !col.disabledCondition(row)) ? (col.editEnable ? 1 : (col.template ? 2 : 3)) : (col.template ? 2 : 3);
             const errorMessage = typeDis === 1 || col.field === '' || !col.validate ? '' : col.validate(row[col.field], row);
-            return (jsxRuntime.jsx(React$5.Fragment, { children: col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
-                        left: col.fixedType === 'left' ? objWidthFix[indexCol] : undefined,
-                        right: col.fixedType === 'right' ? objWidthFix[indexCol] : undefined
+            return (jsxRuntime.jsx(React$5.Fragment, { children: col.visible !== false && jsxRuntime.jsx("td", { className: classnames(`r-rowcell fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }, { 'cell-fixed-last': (col.fixedType === 'left' && indexCol === lastObjWidthFixLeft) || (col.fixedType === 'right' && indexCol === fisrtObjWidthFixRight) }, { 'r-active': (isSelected && editDisable) || indexFocus === indexRow }), style: {
+                        left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
+                        right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
                     }, onClick: (e) => {
                         if (e.target.nodeName === 'DIV' || e.target.nodeName === 'TD') {
                             if (!editDisable && indexRow != indexFocus) {
@@ -43372,8 +43399,8 @@ const TableEdit = React$5.forwardRef((props, ref) => {
     const renderFooterCol = (col, indexCol) => {
         const sumValue = (col.haveSum === true && col.editType === "numeric") ? dataSource.reduce(function (accumulator, currentValue) { return (Number(accumulator ?? 0) + Number(currentValue[col.field] ?? 0)); }, 0) : 0;
         return (jsxRuntime.jsx(React$5.Fragment, { children: (col.visible !== false) && jsxRuntime.jsx("td", { className: classnames(`p-0 px-50 r-footer fix-${col.fixedType}`, { 'cell-fixed': col.fixedType }), style: {
-                    left: col.fixedType === 'left' ? objWidthFix[indexCol] : undefined,
-                    right: col.fixedType === 'right' ? objWidthFix[indexCol] : undefined,
+                    left: col.fixedType === 'left' ? objWidthFixLeft[indexCol] : undefined,
+                    right: col.fixedType === 'right' ? objWidthFixRight[indexCol] : undefined,
                     textAlign: col.textAlign ? col.textAlign : 'left'
                 }, children: jsxRuntime.jsxs("div", { className: "r-footer-div", children: [col.haveSum === true && col.editType === "numeric" && (Number(sumValue) >= 0) && jsxRuntime.jsx(jsxRuntime.Fragment, { children: formartNumberic(sumValue, formatSetting?.decimalSeparator ?? ',', formatSetting?.thousandSeparator ?? '.', col.numericSettings?.fraction, true, false) }), col.haveSum === true && col.editType === "numeric" && (Number(sumValue) < 0) && jsxRuntime.jsxs("div", { style: { color: formatSetting?.colorNegative ?? 'red' }, children: [" ", `${formatSetting?.prefixNegative ?? '-'}${formartNumberic(sumValue, formatSetting?.decimalSeparator ?? ',', formatSetting?.thousandSeparator ?? '.', col.numericSettings?.fraction, true, false)}${formatSetting?.suffixNegative ?? ''}`] })] }) }) }, `summarycell-${indexCol}`));
     };
@@ -43406,7 +43433,7 @@ const TableEdit = React$5.forwardRef((props, ref) => {
     }, [searchTerm, searchSetting?.searchTerm]);
     return (jsxRuntime.jsxs(React$5.Fragment, { children: [jsxRuntime.jsxs("div", { className: "react-table-edit", children: [jsxRuntime.jsxs("div", { className: 'r-grid', ref: gridRef, children: [toolbarSetting?.showTopToolbar && jsxRuntime.jsx(RenderToolbarTop, { toolbarTopOption: toolbarTopOption }), jsxRuntime.jsx("div", { ref: tableElement, className: "r-gridtable", style: { height: `${height ? `${height}px` : 'auto'}`, minHeight: `${minHeight ? `${minHeight}px` : ''}`, maxHeight: `${maxHeight ? `${maxHeight}px` : '400px'}` }, children: jsxRuntime.jsxs("table", { style: { width: '100%' }, children: [jsxRuntime.jsx("thead", { className: 'r-gridheader', children: headerColumns.map((element, indexParent) => {
                                                 return (jsxRuntime.jsx("tr", { className: "r-row", role: "row", children: element?.map((col, index) => {
-                                                        return (jsxRuntime.jsx(HeaderTableCol, { col: col, dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objWidthFix: objWidthFix, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, column: contentColumns, setColumn: setContentColumns, totalCount: totalCount }, `header-${indexParent}-${index}`));
+                                                        return (jsxRuntime.jsx(HeaderTableCol, { col: col, dataSource: dataSource, indexCol: index, indexParent: indexParent, isMulti: isMulti ?? false, objWidthFixLeft: objWidthFixLeft, objWidthFixRight: objWidthFixRight, selectEnable: selectEnable ?? false, selectedRows: selectedRows, setSelectedRows: setSelectedRows, column: contentColumns, setColumn: setContentColumns, totalCount: totalCount }, `header-${indexParent}-${index}`));
                                                     }) }, `header-${-indexParent}`));
                                             }) }), jsxRuntime.jsx("tbody", { className: 'r-gridcontent', children: renderData() }), jsxRuntime.jsx("tfoot", { className: "r-gridfoot", children: haveSum == true ? jsxRuntime.jsx("tr", { className: 'r-row', children: contentColumns.map((col, index) => {
                                                     return (renderFooterCol(col, index));