pixel-react 1.20.73 → 1.20.75

package/lib/components/Table/components/SortableRow.js

@@ -1,96 +1,87 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useRef, memo, useCallback } from 'react';
+import { useEffect, useRef, memo, useCallback, } from 'react';
+import { useSortable } from '@dnd-kit/sortable';
+import { CSS } from '@dnd-kit/utilities';
 import classNames from 'classnames';
+import { prepareData } from '../utils/TableCell';
+import { getColumnLeftPosition } from '../utils/virtualization';
+import Checkbox from '../../Checkbox';
 import Typography from '../../Typography';
 import Icon from '../../Icon';
-import Checkbox from '../../Checkbox';
-import { prepareData } from '../../../utils/TableCell/TableCell';
-import { getColumnLeftPosition } from '../utils/virtualization';
-import { useSortable } from '@dnd-kit/sortable';
-import { CSS } from '@dnd-kit/utilities';
-// OPTIMIZATION: Memoize to prevent re-rendering when parent Table updates
-const SortableRow = memo(({ row, index, serialNumber, columns, tableBodyRowClass, handleOnclick, tableDataTextColor, withCheckbox, onSelectClick, draggable, isRowCheckBoxDisable, isRowDisabled, freezeColumns, updateRowHeight, editMode, isAccordionOpen, accordionContent, selectedNode, }) => {
+const SortableRow = memo(({ row, index, serialNumber, columns, tableBodyRowClass, handleOnclick, tableDataTextColor, withCheckbox, onSelectClick, draggable, isRowCheckBoxDisable, isRowDisabled, freezeColumns, updateRowHeight, editMode, selectedNode, sortableId, }) => {
     const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
-        id: row?._id || row?.id,
-        disabled: row.disabled || !!editMode,
+        id: sortableId,
+        disabled: !draggable || row.disabled || !!editMode,
     });
+    // Only measure the row itself
     const rowRef = useRef(null);
-    const accordionRef = useRef(null);
     const updateHeight = useCallback(() => {
         if (!updateRowHeight)
             return;
         const mainRowHeight = rowRef.current?.getBoundingClientRect().height || 0;
-        const accordionHeight = accordionRef.current?.getBoundingClientRect().height || 0;
-        const totalHeight = mainRowHeight + accordionHeight;
-        if (totalHeight > 0) {
-            updateRowHeight(index, totalHeight);
+        if (mainRowHeight > 0) {
+            updateRowHeight(index, mainRowHeight);
         }
     }, [index, updateRowHeight]);
     useEffect(() => {
         const mainElement = rowRef.current;
-        const accordionElement = accordionRef.current;
-        if (!updateRowHeight)
+        if (!updateRowHeight || !mainElement)
             return;
-        // OPTIMIZATION: ResizeObserver
-        // We do NOT call getBoundingClientRect() here anymore.
-        // Calling it manually forces the browser to calculate layout immediately (Reflow).
-        // The observer will deliver the height asynchronously without freezing the thread.
-        const observer = new ResizeObserver(() => {
-            updateHeight();
-        });
-        if (mainElement)
-            observer.observe(mainElement);
-        if (accordionElement)
-            observer.observe(accordionElement);
-        return () => {
-            observer.disconnect();
-        };
-    }, [updateHeight, isAccordionOpen]);
-    const key = row?.[selectedNode?.key] || row._id || row.id;
-    const selectedRow = key === selectedNode.selected;
+        const observer = new ResizeObserver(() => updateHeight());
+        observer.observe(mainElement);
+        return () => observer.disconnect();
+    }, [updateHeight]);
+    const key = row?.[selectedNode?.key] ?? row._id ?? row.id ?? sortableId;
+    const selectedRow = key === selectedNode?.selected;
     const style = {
         transform: CSS.Transform.toString(transform),
         transition,
     };
-    return (_jsxs(_Fragment, { children: [_jsx("tr", { ref: (node) => {
-                    if (rowRef.current !== node) {
-                        rowRef.current = node;
-                    }
-                    setNodeRef(node);
-                }, className: classNames('ff-table-data-row ', tableBodyRowClass, {
-                    'ff-table-disabled': row.disabled && isRowDisabled,
-                    'ff-table-selected-node': selectedRow,
-                }), id: key, style: style, children: columns.map((column, columnIndex) => {
-                    const isFrozen = freezeColumns && columnIndex < freezeColumns;
-                    return (_jsx("td", { onClick: () => handleOnclick(column, row), style: {
-                            position: isFrozen ? 'sticky' : 'static',
-                            left: isFrozen
-                                ? getColumnLeftPosition(columnIndex, columns, freezeColumns)
-                                : 'auto',
-                            zIndex: isFrozen ? 100 : 'auto',
-                            backgroundColor: isFrozen
-                                ? 'var(--input-label-bg-color)'
-                                : 'transparent',
-                            width: column.width ? `${column.width}px` : 'auto',
-                            padding: '7px 8px',
-                            boxSizing: 'border-box',
-                            paddingRight: isFrozen ? 0 : '8px',
-                        }, className: classNames('ff-table-data-cell ff-table-icon-container', column.className, {
-                            'ff-table-clickable-cell': column.onClick,
-                            'ff-table-sticky-column': isFrozen,
-                        }), children: _jsxs(Typography, { as: "div", color: tableDataTextColor, className: "ff-table-data-container", children: [columnIndex === 0 && withCheckbox && (_jsx("span", { className: "ff-table-checkbox-table", children: _jsx(Checkbox, { onChange: (e) => onSelectClick(e, row), checked: row.checked, disabled: isRowCheckBoxDisable === undefined
-                                            ? !!row.disabled
-                                            : isRowCheckBoxDisable }) })), columnIndex === 0 && draggable && (_jsxs(_Fragment, { children: [_jsx("span", { className: row.disabled ? 'ff-table-drag' : 'ff-table-drag-icon', ...listeners, ...attributes, children: _jsx(Icon, { name: "drag", className: "ff-table-drag-active" }) }), _jsx(Typography, { color: "var(--brand-color)", children: serialNumber && `${serialNumber}.` })] })), prepareData(row, column)] }) }, column.accessor + columnIndex));
-                }) }, key), isAccordionOpen && (_jsx("tr", { ref: accordionRef, children: _jsx("td", { className: "ff-table-data-cell", colSpan: columns.length, children: _jsx("div", { style: { maxHeight: 'none', overflow: 'visible' }, children: accordionContent }) }) }))] }));
-}, 
-// OPTIMIZATION: Custom Memo Comparison
-// Returns true if props are equal (prevents re-render)
-(prev, next) => {
+    return (_jsx("div", { ref: setNodeRef, style: { ...style }, className: "ff-table-row-wrapper", children: _jsx("div", { ref: rowRef, className: classNames('ff-table-data-row', tableBodyRowClass, {
+                'ff-table-disabled': row.disabled && isRowDisabled,
+                'ff-table-selected-node': selectedRow,
+            }), id: key, children: columns.map((column, columnIndex) => {
+                const isFrozen = freezeColumns && columnIndex < freezeColumns;
+                const isClickable = Boolean(column.onClick);
+                const frozenColumnLeft = isFrozen
+                    ? getColumnLeftPosition(columnIndex, columns, freezeColumns)
+                    : 'auto';
+                return (_jsx("div", { onClick: () => handleOnclick(column, row), ...(isClickable
+                        ? {
+                            role: 'button',
+                            tabIndex: 0,
+                            onKeyDown: (e) => {
+                                if (e.key === 'Enter') {
+                                    e.preventDefault();
+                                    handleOnclick(column, row);
+                                }
+                            },
+                        }
+                        : {}), style: {
+                        '--frozen-column-left': frozenColumnLeft,
+                    }, "data-frozen": isFrozen ? 'true' : undefined, className: classNames('ff-table-data-cell ff-table-icon-container', column.className, {
+                        'ff-table-clickable-cell': column.onClick,
+                        'ff-table-sticky-column': isFrozen,
+                        'ff-table-data-cell-sticky': isFrozen,
+                        'ff-table-data-cell-relative': !isFrozen,
+                    }), children: _jsxs(Typography, { as: "div", color: tableDataTextColor, className: "ff-table-data-container ff-table-data-container-wrapper", children: [columnIndex === 0 && withCheckbox && (_jsx("span", { className: "ff-table-checkbox-table", children: _jsx(Checkbox, { onChange: (e) => onSelectClick(e, row), checked: row.checked, disabled: isRowCheckBoxDisable === undefined
+                                        ? !!row.disabled
+                                        : isRowCheckBoxDisable }) })), columnIndex === 0 && draggable && (_jsxs(_Fragment, { children: [_jsx("span", { className: row.disabled ? 'ff-table-drag' : 'ff-table-drag-icon', ...listeners, ...attributes, children: _jsx(Icon, { name: "drag", className: "ff-table-drag-active" }) }), _jsx(Typography, { color: "var(--brand-color)", children: serialNumber && `${serialNumber}.` })] })), prepareData(row, column)] }) }, column.accessor + columnIndex));
+            }) }, key) }));
+}, (prev, next) => {
     return (prev.row === next.row &&
         prev.index === next.index &&
         prev.serialNumber === next.serialNumber &&
+        prev.sortableId === next.sortableId &&
         prev.updateRowHeight === next.updateRowHeight &&
-        prev.columns === next.columns);
+        prev.columns === next.columns &&
+        prev.draggable === next.draggable &&
+        prev.withCheckbox === next.withCheckbox &&
+        prev.tableDataTextColor === next.tableDataTextColor &&
+        prev.tableBodyRowClass === next.tableBodyRowClass &&
+        prev.selectedNode?.key === next.selectedNode?.key &&
+        prev.selectedNode?.selected === next.selectedNode?.selected);
 });
+SortableRow.displayName = 'SortableRow';
 export default SortableRow;
 //# sourceMappingURL=SortableRow.js.map

package/lib/components/Table/components/SortableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortableRow.js","sourceRoot":"","sources":["../../../../src/components/Table/components/SortableRow.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,UAAU,MAAM,kBAAkB,CAAC;AAC1C,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,QAAQ,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAEzC,0EAA0E;AAC1E,MAAM,WAAW,GAAG,IAAI,CACtB,CAAC,EACC,GAAG,EACH,KAAK,EACL,YAAY,EACZ,OAAO,EACP,iBAAiB,EACjB,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,aAAa,EACb,SAAS,EACT,oBAAoB,EACpB,aAAa,EACb,aAAa,EACb,eAAe,EACf,QAAQ,EACR,eAAe,EACf,gBAAgB,EAChB,YAAY,GACR,EAAE,EAAE;IACR,MAAM,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,GAChE,WAAW,CAAC;QACV,EAAE,EAAE,GAAG,EAAE,GAAG,IAAI,GAAG,EAAE,EAAE;QACvB,QAAQ,EAAE,GAAG,CAAC,QAAQ,IAAI,CAAC,CAAC,QAAQ;KACrC,CAAC,CAAC;IACL,MAAM,MAAM,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,MAAM,CAAsB,IAAI,CAAC,CAAC;IAEvD,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QACpC,IAAI,CAAC,eAAe;YAAE,OAAO;QAE7B,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,EAAE,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC;QAC1E,MAAM,eAAe,GACnB,YAAY,CAAC,OAAO,EAAE,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC,CAAC;QAC5D,MAAM,WAAW,GAAG,aAAa,GAAG,eAAe,CAAC;QAEpD,IAAI,WAAW,GAAG,CAAC,EAAE,CAAC;YACpB,eAAe,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;QACtC,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC;IAE7B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,CAAC;QACnC,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,CAAC;QAC9C,IAAI,CAAC,eAAe;YAAE,OAAO;QAE7B,+BAA+B;QAC/B,uDAAuD;QACvD,mFAAmF;QACnF,mFAAmF;QACnF,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,GAAG,EAAE;YACvC,YAAY,EAAE,CAAC;QACjB,CAAC,CAAC,CAAC;QAEH,IAAI,WAAW;YAAE,QAAQ,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;QAC/C,IAAI,gBAAgB;YAAE,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;QAEzD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,UAAU,EAAE,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;IAEpC,MAAM,GAAG,GAAG,GAAG,EAAE,CAAC,YAAY,EAAE,GAAG,CAAC,IAAI,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,EAAE,CAAC;IAC1D,MAAM,WAAW,GAAG,GAAG,KAAK,YAAY,CAAC,QAAQ,CAAC;IAElD,MAAM,KAAK,GAAG;QACZ,SAAS,EAAE,GAAG,CAAC,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC;QAC5C,UAAU;KACX,CAAC;IACF,OAAO,CACL,8BACE,aAEE,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;oBACZ,IAAI,MAAM,CAAC,OAAO,KAAK,IAAI,EAAE,CAAC;wBAC3B,MAAc,CAAC,OAAO,GAAG,IAAI,CAAC;oBACjC,CAAC;oBACD,UAAU,CAAC,IAAI,CAAC,CAAC;gBACnB,CAAC,EACD,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,iBAAiB,EAAE;oBAC7D,mBAAmB,EAAE,GAAG,CAAC,QAAQ,IAAI,aAAa;oBAClD,wBAAwB,EAAE,WAAW;iBACtC,CAAC,EACF,EAAE,EAAE,GAAG,EACP,KAAK,EAAE,KAAK,YAEX,OAAO,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,WAAmB,EAAE,EAAE;oBAChD,MAAM,QAAQ,GAAG,aAAa,IAAI,WAAW,GAAG,aAAa,CAAC;oBAE9D,OAAO,CACL,aAEE,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,GAAG,CAAC,EACzC,KAAK,EAAE;4BACL,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,QAAQ;4BACxC,IAAI,EAAE,QAAQ;gCACZ,CAAC,CAAC,qBAAqB,CAAC,WAAW,EAAE,OAAO,EAAE,aAAa,CAAC;gCAC5D,CAAC,CAAC,MAAM;4BACV,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM;4BAC/B,eAAe,EAAE,QAAQ;gCACvB,CAAC,CAAC,6BAA6B;gCAC/B,CAAC,CAAC,aAAa;4BACjB,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM;4BAClD,OAAO,EAAE,SAAS;4BAClB,SAAS,EAAE,YAAY;4BACvB,YAAY,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK;yBACnC,EACD,SAAS,EAAE,UAAU,CACnB,4CAA4C,EAC5C,MAAM,CAAC,SAAS,EAChB;4BACE,yBAAyB,EAAE,MAAM,CAAC,OAAO;4BACzC,wBAAwB,EAAE,QAAQ;yBACnC,CACF,YAED,MAAC,UAAU,IACT,EAAE,EAAC,KAAK,EACR,KAAK,EAAE,kBAAkB,EACzB,SAAS,EAAC,yBAAyB,aAElC,WAAW,KAAK,CAAC,IAAI,YAAY,IAAI,CACpC,eAAM,SAAS,EAAC,yBAAyB,YACvC,KAAC,QAAQ,IACP,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,aAAa,CAAC,CAAC,EAAE,GAAG,CAAC,EACtC,OAAO,EAAE,GAAG,CAAC,OAAO,EACpB,QAAQ,EACN,oBAAoB,KAAK,SAAS;4CAChC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,QAAQ;4CAChB,CAAC,CAAC,oBAAoB,GAE1B,GACG,CACR,EAEA,WAAW,KAAK,CAAC,IAAI,SAAS,IAAI,CACjC,8BACE,eACE,SAAS,EACP,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,oBAAoB,KAEnD,SAAS,KACT,UAAU,YAEd,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,sBAAsB,GAAG,GAChD,EACP,KAAC,UAAU,IAAC,KAAK,EAAC,oBAAoB,YACnC,YAAY,IAAI,GAAG,YAAY,GAAG,GACxB,IACZ,CACJ,EAEA,WAAW,CAAC,GAAG,EAAE,MAAM,CAAC,IACd,IA9DR,MAAM,CAAC,QAAQ,GAAG,WAAW,CA+D/B,CACN,CAAC;gBACJ,CAAC,CAAC,IApFG,GAAG,CAqFL,EACJ,eAAe,IAAI,CAClB,aAAI,GAAG,EAAE,YAAY,YACnB,aAAI,SAAS,EAAC,oBAAoB,EAAC,OAAO,EAAE,OAAO,CAAC,MAAM,YACxD,cAAK,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,YACnD,gBAAgB,GACb,GACH,GACF,CACN,IACA,CACJ,CAAC;AACJ,CAAC;AACD,uCAAuC;AACvC,uDAAuD;AACvD,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE;IACb,OAAO,CACL,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,GAAG;QACrB,IAAI,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK;QACzB,IAAI,CAAC,YAAY,KAAK,IAAI,CAAC,YAAY;QACvC,IAAI,CAAC,eAAe,KAAK,IAAI,CAAC,eAAe;QAC7C,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAC9B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"SortableRow.js","sourceRoot":"","sources":["../../../../src/components/Table/components/SortableRow.tsx"],"names":[],"mappings":"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"}

package/lib/components/Table/components/TableHeader.js

@@ -7,23 +7,28 @@ import Icon from '../../Icon';
 import Typography from '../../Typography';
 import Checkbox from '../../Checkbox';
 const TableHeader = memo((props) => {
-    const { columns, freezeColumns, headerType, tableHeadClass, headerTextColor, headerCheckboxDisabled, withCheckbox, allSelected, partialSelected, headerIconName = '', headerIconOnClick, headerIconTooltipTitle, tableHeaderZindex, onSelectClick, withFixedHeader, } = props;
-    return (_jsx("thead", { className: classNames('ff-table-header', { 'ff-table-fixed-header': withFixedHeader }, tableHeadClass), style: { zIndex: tableHeaderZindex }, children: _jsx("tr", { children: columns.map((column, index) => {
-                const isFrozen = freezeColumns && index < freezeColumns;
-                return (_jsxs("th", { className: classNames('ff-table-header-cell', headerType !== 'default' ? `ff-table-${headerType}-bg` : '', headerTextColor && `ff-table-${headerTextColor}-color`), style: {
-                        position: isFrozen ? 'sticky' : 'static',
-                        left: isFrozen
-                            ? getColumnLeftPosition(index, columns, freezeColumns)
-                            : 'auto',
-                        zIndex: isFrozen ? 999 : 'auto',
-                        width: column.width ? `${column.width}px` : 'auto',
-                        padding: '8px 8px',
-                        boxSizing: 'border-box',
-                        paddingRight: isFrozen ? 0 : '8px',
-                    }, children: [_jsx("div", { className: "ff-table-icon", children: _jsx(Tooltip, { title: headerIconTooltipTitle || '', placement: "bottom", children: _jsx(Icon, { height: 14, width: 14, name: headerIconName, onClick: headerIconOnClick, cursorType: "pointer" }) }) }), _jsxs(Typography, { style: column.width ? { width: column.width } : undefined, as: "div", fontWeight: "semi-bold", className: "ff-table-label-checkbox-container", children: [index === 0 && withCheckbox && (_jsx("span", { className: "ff-table-checkbox-table", children: _jsx(Checkbox, { onChange: (e) => onSelectClick(e, {
+    const { columns, freezeColumns, headerType, tableHeadClass, headerTextColor, headerCheckboxDisabled, withCheckbox, allSelected, partialSelected, headerIconName = '', headerIconOnClick, headerIconTooltipTitle, tableHeaderZindex, onSelectClick, } = props;
+    const headerZIndex = tableHeaderZindex ?? 99;
+    return (_jsx("div", { className: classNames('ff-table-header', tableHeadClass), style: {
+            '--table-header-z-index': headerZIndex,
+        }, children: _jsx("div", { className: "ff-table-header-row", children: columns.map((column, index) => {
+                const isFrozen = Boolean(freezeColumns && index < freezeColumns);
+                const showHeaderIcon = Boolean(headerIconName) && index === columns.length - 1;
+                const frozenColumnLeft = isFrozen
+                    ? getColumnLeftPosition(index, columns, freezeColumns)
+                    : 'auto';
+                return (_jsxs("div", { className: classNames('ff-table-header-cell', headerType && headerType !== 'default'
+                        ? `ff-table-${headerType}-bg`
+                        : '', headerTextColor && `ff-table-${headerTextColor}-color`, {
+                        'ff-table-header-cell-sticky': isFrozen,
+                        'ff-table-header-cell-relative': !isFrozen,
+                    }), style: {
+                        '--frozen-column-left': frozenColumnLeft,
+                    }, "data-frozen": isFrozen ? 'true' : undefined, children: [showHeaderIcon && (_jsx("div", { className: "ff-table-icon", children: _jsx(Tooltip, { title: headerIconTooltipTitle || '', placement: "bottom", children: _jsx(Icon, { height: 14, width: 14, name: headerIconName, onClick: headerIconOnClick, cursorType: "pointer" }) }) })), _jsxs(Typography, { as: "div", fontWeight: "semi-bold", className: "ff-table-label-checkbox-container", children: [index === 0 && withCheckbox && (_jsx("span", { className: "ff-table-checkbox-table", children: _jsx(Checkbox, { onChange: (e) => onSelectClick(e, {
                                             allSelected: e.target.checked,
-                                        }), checked: allSelected || false, partial: !!partialSelected, disabled: headerCheckboxDisabled }) })), column.header] })] }, column.header));
+                                        }), checked: allSelected || false, partial: !!partialSelected, disabled: headerCheckboxDisabled }) })), column.header] })] }, `${column.accessor || column.header}-${index}`));
             }) }) }));
 });
+TableHeader.displayName = 'TableHeader';
 export default TableHeader;
 //# sourceMappingURL=TableHeader.js.map

package/lib/components/Table/components/TableHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeader.js","sourceRoot":"","sources":["../../../../src/components/Table/components/TableHeader.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"TableHeader.js","sourceRoot":"","sources":["../../../../src/components/Table/components/TableHeader.tsx"],"names":[],"mappings":"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"}

package/lib/components/Table/components/VirtualizedRows.d.ts

@@ -1,3 +1,3 @@
 import { VirtualizedRowsProps } from '../Types';
-declare const VirtualizedRows: import("react").MemoExoticComponent<({ paddingTop, paddingBottom, columnsLength, visibleRows, startIndex, columns, freezeColumns, frozenWidth, handleOnclick, isRowCheckBoxDisable, isRowDisabled, onSelectClick, tableBodyRowClass, tableDataTextColor, updateRowHeight, withCheckbox, draggable, editMode, editComponent, accordionContent, getAccordionStatus, selectedNode, uniqueRowIdForAccordion, }: VirtualizedRowsProps) => import("react/jsx-runtime").JSX.Element>;
+declare const VirtualizedRows: import("react").MemoExoticComponent<({ paddingTop, paddingBottom, visibleRows, startIndex, columns, freezeColumns, frozenWidth, handleOnclick, isRowCheckBoxDisable, isRowDisabled, onSelectClick, tableBodyRowClass, tableDataTextColor, updateRowHeight, withCheckbox, draggable, editMode, editComponent, selectedNode, openAccordionIndex, accordionHeight, }: VirtualizedRowsProps) => import("react/jsx-runtime").JSX.Element>;
 export default VirtualizedRows;

package/lib/components/Table/components/VirtualizedRows.js

@@ -1,24 +1,39 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { cloneElement, Fragment, isValidElement, memo, } from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { cloneElement, Fragment, isValidElement, memo, useCallback, useEffect, useRef, } from 'react';
 import SortableRow from './SortableRow';
-const VirtualizedRows = memo(({ paddingTop, paddingBottom, columnsLength, visibleRows, startIndex, columns, freezeColumns, frozenWidth, handleOnclick, isRowCheckBoxDisable, isRowDisabled, onSelectClick, tableBodyRowClass, tableDataTextColor, updateRowHeight, withCheckbox, draggable, editMode, editComponent, accordionContent, getAccordionStatus = () => { }, selectedNode, uniqueRowIdForAccordion, }) => {
-    return (_jsxs(_Fragment, { children: [paddingTop > 0 && (_jsx("tr", { children: _jsx("td", { style: { height: paddingTop, padding: 0 }, colSpan: columnsLength }) })), visibleRows.map((row, i) => {
+const MeasuredEditRow = memo(({ editComponent, row, rowIndex, updateRowHeight, }) => {
+    const editRowRef = useRef(null);
+    const updateHeight = useCallback(() => {
+        const height = editRowRef.current?.getBoundingClientRect().height || 0;
+        if (height > 0)
+            updateRowHeight?.(rowIndex, height);
+    }, [rowIndex, updateRowHeight]);
+    useEffect(() => {
+        const element = editRowRef.current;
+        if (!element)
+            return;
+        updateHeight();
+        const observer = new ResizeObserver(() => updateHeight());
+        observer.observe(element);
+        return () => observer.disconnect();
+    }, [updateHeight]);
+    return (_jsx("div", { ref: editRowRef, className: "ff-table-data-row ff-table-edit-row ff-table-edit-row-grid", children: _jsx("div", { className: "ff-table-edit-cell", children: isValidElement(editComponent) &&
+                cloneElement(editComponent, {
+                    rowData: row,
+                    rowIndex: rowIndex + 1,
+                }) }) }));
+});
+MeasuredEditRow.displayName = 'MeasuredEditRow';
+const VirtualizedRows = memo(({ paddingTop, paddingBottom, visibleRows, startIndex, columns, freezeColumns, frozenWidth, handleOnclick, isRowCheckBoxDisable, isRowDisabled, onSelectClick, tableBodyRowClass, tableDataTextColor, updateRowHeight, withCheckbox, draggable, editMode, editComponent, selectedNode, openAccordionIndex, accordionHeight, }) => {
+    return (_jsxs(_Fragment, { children: [paddingTop > 0 && (_jsx("div", { className: "ff-table-padding-div", style: { height: paddingTop } })), visibleRows.map((row, i) => {
                 const absoluteIndex = startIndex + i;
-                const rowId = row._id ?? row.id;
+                const rowId = row._id ?? row.id ?? absoluteIndex;
                 if (editMode === rowId) {
-                    return (_jsx("tr", { className: "edit-row", children: _jsx("td", { colSpan: columns.length, style: { padding: '0px' }, children: isValidElement(editComponent) &&
-                                cloneElement(editComponent, {
-                                    rowData: row,
-                                    rowIndex: absoluteIndex + 1,
-                                }) }) }, `edit-${rowId}`));
+                    return (_jsx(MeasuredEditRow, { editComponent: editComponent, row: row, rowIndex: absoluteIndex, updateRowHeight: updateRowHeight }, `edit-${rowId}`));
                 }
-                const isOpen = getAccordionStatus(row?.id ||
-                    row?._id ||
-                    (uniqueRowIdForAccordion
-                        ? row?.[uniqueRowIdForAccordion]
-                        : undefined));
-                return (_jsx(Fragment, { children: _jsx(SortableRow, { row: row, index: absoluteIndex, serialNumber: absoluteIndex + 1, columns: columns, tableBodyRowClass: tableBodyRowClass, handleOnclick: handleOnclick, tableDataTextColor: tableDataTextColor, withCheckbox: withCheckbox, onSelectClick: onSelectClick, isRowCheckBoxDisable: isRowCheckBoxDisable, isRowDisabled: isRowDisabled, freezeColumns: freezeColumns, frozenWidth: frozenWidth, updateRowHeight: updateRowHeight, draggable: draggable, editMode: editMode, isAccordionOpen: isOpen, accordionContent: accordionContent, selectedNode: selectedNode }, rowId) }, row._id || absoluteIndex));
-            }), paddingBottom > 0 && (_jsx("tr", { children: _jsx("td", { style: { height: paddingBottom, padding: 0 }, colSpan: columnsLength }) }))] }));
+                return (_jsxs(Fragment, { children: [_jsx(SortableRow, { row: row, sortableId: rowId, index: absoluteIndex, serialNumber: absoluteIndex + 1, columns: columns, tableBodyRowClass: tableBodyRowClass, handleOnclick: handleOnclick, tableDataTextColor: tableDataTextColor, withCheckbox: withCheckbox, onSelectClick: onSelectClick, isRowCheckBoxDisable: isRowCheckBoxDisable, isRowDisabled: isRowDisabled, freezeColumns: freezeColumns, frozenWidth: frozenWidth, updateRowHeight: updateRowHeight, draggable: draggable, editMode: editMode, selectedNode: selectedNode }, rowId), absoluteIndex === openAccordionIndex && accordionHeight > 0 && (_jsx("div", { className: "ff-table-padding-div", style: { height: accordionHeight } }))] }, row._id ?? row.id ?? absoluteIndex));
+            }), paddingBottom > 0 && (_jsx("div", { className: "ff-table-padding-div", style: { height: paddingBottom } }))] }));
 });
+VirtualizedRows.displayName = 'VirtualizedRows';
 export default VirtualizedRows;
 //# sourceMappingURL=VirtualizedRows.js.map

package/lib/components/Table/components/VirtualizedRows.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedRows.js","sourceRoot":"","sources":["../../../../src/components/Table/components/VirtualizedRows.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,YAAY,EACZ,QAAQ,EACR,cAAc,EACd,IAAI,GAEL,MAAM,OAAO,CAAC;AAEf,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,MAAM,eAAe,GAAG,IAAI,CAC1B,CAAC,EACC,UAAU,EACV,aAAa,EACb,aAAa,EACb,WAAW,EACX,UAAU,EACV,OAAO,EACP,aAAa,EACb,WAAW,EACX,aAAa,EACb,oBAAoB,EACpB,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,kBAAkB,EAClB,eAAe,EACf,YAAY,EACZ,SAAS,EACT,QAAQ,EACR,aAAa,EACb,gBAAgB,EAChB,kBAAkB,GAAG,GAAG,EAAE,GAAE,CAAC,EAC7B,YAAY,EACZ,uBAAuB,GACF,EAAE,EAAE;IACzB,OAAO,CACL,8BAEG,UAAU,GAAG,CAAC,IAAI,CACjB,uBACE,aACE,KAAK,EAAE,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,CAAC,EAAE,EACzC,OAAO,EAAE,aAAa,GACtB,GACC,CACN,EAGA,WAAW,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE;gBAC1B,MAAM,aAAa,GAAG,UAAU,GAAG,CAAC,CAAC;gBACrC,MAAM,KAAK,GAAG,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,EAAE,CAAC;gBAEhC,IAAI,QAAQ,KAAK,KAAK,EAAE,CAAC;oBACvB,OAAO,CACL,aAA0B,SAAS,EAAC,UAAU,YAC5C,aAAI,OAAO,EAAE,OAAO,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,YACnD,cAAc,CAAC,aAAa,CAAC;gCAC5B,YAAY,CACV,aAGE,EACF;oCACE,OAAO,EAAE,GAAG;oCACZ,QAAQ,EAAE,aAAa,GAAG,CAAC;iCAC5B,CACF,GACA,IAbE,QAAQ,KAAK,EAAE,CAcnB,CACN,CAAC;gBACJ,CAAC;gBACD,MAAM,MAAM,GAAG,kBAAkB,CAC/B,GAAG,EAAE,EAAE;oBACL,GAAG,EAAE,GAAG;oBACR,CAAC,uBAAuB;wBACtB,CAAC,CAAC,GAAG,EAAE,CAAC,uBAAuB,CAAC;wBAChC,CAAC,CAAC,SAAS,CAAC,CACjB,CAAC;gBACF,OAAO,CACL,KAAC,QAAQ,cACP,KAAC,WAAW,IAEV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,aAAa,EACpB,YAAY,EAAE,aAAa,GAAG,CAAC,EAC/B,OAAO,EAAE,OAAO,EAChB,iBAAiB,EAAE,iBAAiB,EACpC,aAAa,EAAE,aAAa,EAC5B,kBAAkB,EAAE,kBAAkB,EACtC,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAC5B,oBAAoB,EAAE,oBAAoB,EAC1C,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,WAAW,EACxB,eAAe,EAAE,eAAe,EAChC,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,eAAe,EAAE,MAAM,EACvB,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,YAAY,IAnBrB,KAAK,CAoBV,IAtBW,GAAG,CAAC,GAAG,IAAI,aAAa,CAuB5B,CACZ,CAAC;YACJ,CAAC,CAAC,EAGD,aAAa,GAAG,CAAC,IAAI,CACpB,uBACE,aACE,KAAK,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,OAAO,EAAE,CAAC,EAAE,EAC5C,OAAO,EAAE,aAAa,GACtB,GACC,CACN,IACA,CACJ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"VirtualizedRows.js","sourceRoot":"","sources":["../../../../src/components/Table/components/VirtualizedRows.tsx"],"names":[],"mappings":"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"}

package/lib/components/Table/utils/TableCell.d.ts

@@ -0,0 +1,2 @@
+export declare const prepareData: (dataObj: any, columnObj: any, index?: number, tableType?: string) => any;
+export declare const isFunction: (functionToCheck: any) => any;

package/lib/components/Table/utils/TableCell.js

@@ -0,0 +1,27 @@
+export const prepareData = (dataObj, columnObj, index, tableType) => {
+    const cellData = dataObj[columnObj.accessor];
+    if (columnObj.cell) {
+        const refId = dataObj._id || dataObj.id;
+        return columnObj.cell({
+            value: cellData,
+            row: dataObj,
+            column: columnObj.accessor,
+            index: index,
+            tableType: tableType,
+            ...(refId && { refId }),
+        });
+    }
+    else if (columnObj.accessor) {
+        return cellData;
+    }
+    else if (cellData && typeof cellData !== 'object') {
+        return cellData;
+    }
+    else {
+        return '--';
+    }
+};
+export const isFunction = (functionToCheck) => {
+    return (functionToCheck && {}.toString.call(functionToCheck) === '[object Function]');
+};
+//# sourceMappingURL=TableCell.js.map

package/lib/components/Table/utils/TableCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCell.js","sourceRoot":"","sources":["../../../../src/components/Table/utils/TableCell.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,WAAW,GAAG,CACzB,OAAY,EACZ,SAAc,EACd,KAAc,EACd,SAAkB,EAClB,EAAE;IACF,MAAM,QAAQ,GAAG,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC7C,IAAI,SAAS,CAAC,IAAI,EAAE,CAAC;QACnB,MAAM,KAAK,GAAG,OAAO,CAAC,GAAG,IAAI,OAAO,CAAC,EAAE,CAAC;QAExC,OAAO,SAAS,CAAC,IAAI,CAAC;YACpB,KAAK,EAAE,QAAQ;YACf,GAAG,EAAE,OAAO;YACZ,MAAM,EAAE,SAAS,CAAC,QAAQ;YAC1B,KAAK,EAAE,KAAK;YACZ,SAAS,EAAE,SAAS;YACpB,GAAG,CAAC,KAAK,IAAI,EAAE,KAAK,EAAE,CAAC;SACxB,CAAC,CAAC;IACL,CAAC;SAAM,IAAI,SAAS,CAAC,QAAQ,EAAE,CAAC;QAC9B,OAAO,QAAQ,CAAC;IAClB,CAAC;SAAM,IAAI,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,EAAE,CAAC;QACpD,OAAO,QAAQ,CAAC;IAClB,CAAC;SAAM,CAAC;QACN,OAAO,IAAI,CAAC;IACd,CAAC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,eAAoB,EAAE,EAAE;IACjD,OAAO,CACL,eAAe,IAAI,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,mBAAmB,CAC7E,CAAC;AACJ,CAAC,CAAC"}

package/lib/components/Table/utils/virtualization.d.ts

@@ -1,7 +1,14 @@
-export declare const getColumnLeftPosition: (index: number, columns: {
-    width?: number;
+type ColumnWidth = number | string;
+export declare const getCssSize: (width?: ColumnWidth) => string | undefined;
+export declare const getColumnPixelWidth: (width?: ColumnWidth) => number;
+export declare const getTableGridTemplate: (columns?: {
+    width?: ColumnWidth;
 }[], freezeColumns?: number) => string;
+export declare const getColumnLeftPosition: (index: number, columns: {
+    width?: ColumnWidth;
+}[], _freezeColumns?: number) => string;
 export declare const calculateFrozenWidth: (columnData: {
-    width?: number;
+    width?: ColumnWidth;
 }[], freezeColumns: number) => number;
 export declare const binarySearch: (arr: number[], target: number) => number;
+export {};

package/lib/components/Table/utils/virtualization.js

@@ -1,25 +1,52 @@
-import { CELL_PADDING, DEFAULT_COLUMN_WIDTH } from "./constants";
-export const getColumnLeftPosition = (index, columns, freezeColumns) => {
+import { DEFAULT_COLUMN_WIDTH } from './constants';
+export const getCssSize = (width) => {
+    if (width === undefined || width === null || width === '')
+        return undefined;
+    return typeof width === 'number' ? `${width}px` : width;
+};
+export const getColumnPixelWidth = (width) => {
+    if (typeof width === 'number')
+        return width;
+    if (typeof width === 'string') {
+        const trimmedWidth = width.trim();
+        const numericValue = parseFloat(trimmedWidth);
+        if (!Number.isNaN(numericValue)) {
+            if (trimmedWidth.endsWith('px') || /^\d+(\.\d+)?$/.test(trimmedWidth)) {
+                return numericValue;
+            }
+        }
+    }
+    return DEFAULT_COLUMN_WIDTH;
+};
+export const getTableGridTemplate = (columns = [], freezeColumns) => {
+    if (!columns.length)
+        return '1fr';
+    return columns
+        .map((column, index) => {
+        const columnWidth = getCssSize(column.width);
+        if (columnWidth)
+            return columnWidth;
+        return freezeColumns && index < freezeColumns
+            ? `${DEFAULT_COLUMN_WIDTH}px`
+            : 'minmax(0, 1fr)';
+    })
+        .join(' ');
+};
+export const getColumnLeftPosition = (index, columns, _freezeColumns) => {
     if (index === 0)
         return '0px';
     let leftPosition = 0;
     for (let i = 0; i < index; i++) {
-        const width = columns[i]?.width;
-        leftPosition += width ? parseInt(width.toString(), 10) : DEFAULT_COLUMN_WIDTH;
-        if (freezeColumns && i < freezeColumns - 1) {
-            leftPosition += CELL_PADDING;
-        }
+        leftPosition += getColumnPixelWidth(columns[i]?.width);
     }
     return `${leftPosition}px`;
 };
 export const calculateFrozenWidth = (columnData, freezeColumns) => {
-    return (columnData
+    return columnData
         .slice(0, freezeColumns)
-        .reduce((acc, col) => acc +
-        parseInt(col.width?.toString() || `${DEFAULT_COLUMN_WIDTH}`, 10), 1) +
-        CELL_PADDING * (freezeColumns - 0.17));
+        .reduce((acc, col) => acc + getColumnPixelWidth(col.width), 0);
 };
-// Utility: Simple binary search to find the index where cumulativeHeights[i] > target
+// Utility: binary search to find the index where cumulativeHeights[i] > target
 // Returns the index of the first element greater than or equal to the target.
 export const binarySearch = (arr, target) => {
     let low = 0;
@@ -27,7 +54,7 @@ export const binarySearch = (arr, target) => {
     let result = arr.length; // Default to size if target is greater than all elements
     while (low <= high) {
         const mid = Math.floor((low + high) / 2);
-        // FIX: Use the non-null assertion operator '!'
+        // Use the non-null assertion operator '!'
         if (arr[mid] >= target) {
             result = mid;
             high = mid - 1;

package/lib/components/Table/utils/virtualization.js.map

@@ -1 +1 @@
-{"version":3,"file":"virtualization.js","sourceRoot":"","sources":["../../../../src/components/Table/utils/virtualization.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAEjE,MAAM,CAAC,MAAM,qBAAqB,GAAG,CACnC,KAAa,EACb,OAA6B,EAC7B,aAAsB,EACtB,EAAE;IACF,IAAI,KAAK,KAAK,CAAC;QAAE,OAAO,KAAK,CAAC;IAE9B,IAAI,YAAY,GAAG,CAAC,CAAC;IAErB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE,CAAC;QAC/B,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC;QAChC,YAAY,IAAI,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,oBAAoB,CAAC;QAE9E,IAAI,aAAa,IAAI,CAAC,GAAG,aAAa,GAAG,CAAC,EAAE,CAAC;YAC3C,YAAY,IAAI,YAAY,CAAC;QAC/B,CAAC;IACH,CAAC;IAED,OAAO,GAAG,YAAY,IAAI,CAAC;AAC7B,CAAC,CAAC;AAGF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAClC,UAAgC,EAChC,aAAqB,EACrB,EAAE;IACF,OAAO,CACL,UAAU;SACP,KAAK,CAAC,CAAC,EAAE,aAAa,CAAC;SACvB,MAAM,CACL,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CACX,GAAG;QACH,QAAQ,CAAC,GAAG,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,oBAAoB,EAAE,EAAE,EAAE,CAAC,EAClE,CAAC,CACF;QACH,YAAY,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,CACtC,CAAC;AACJ,CAAC,CAAC;AAEF,sFAAsF;AACtF,8EAA8E;AAC9E,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,GAAa,EAAE,MAAc,EAAE,EAAE;IAC5D,IAAI,GAAG,GAAG,CAAC,CAAC;IACZ,IAAI,IAAI,GAAG,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC;IAC1B,IAAI,MAAM,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC,yDAAyD;IAElF,OAAO,GAAG,IAAI,IAAI,EAAE,CAAC;QACnB,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;QAEzC,+CAA+C;QAC/C,IAAI,GAAG,CAAC,GAAG,CAAE,IAAI,MAAM,EAAE,CAAC;YACxB,MAAM,GAAG,GAAG,CAAC;YACb,IAAI,GAAG,GAAG,GAAG,CAAC,CAAC;QACjB,CAAC;aAAM,CAAC;YACN,GAAG,GAAG,GAAG,GAAG,CAAC,CAAC;QAChB,CAAC;IACH,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC,CAAC"}
+{"version":3,"file":"virtualization.js","sourceRoot":"","sources":["../../../../src/components/Table/utils/virtualization.ts"],"names":[],"mappings":"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"}

package/lib/components/TableTreeFn/Components/TableBody.d.ts

@@ -1,3 +1,3 @@
 import type { TableBodyProps } from '../types';
-declare const TableBody: ({ flattenedTreeData, columnsData, columnMeta, rowHeight, startIndex, totalHeight, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, onAddConfirm, onAddCancel, handleEditFieldError, expanding, selectedNode, hideOnDisable, scriptLengthTruncate, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element;
+declare const TableBody: ({ flattenedTreeData, columnsData, columnMeta, rowHeight, startIndex, totalHeight, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, onAddConfirm, onAddCancel, handleEditFieldError, expanding, selectedNode, hideOnDisable, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }: TableBodyProps) => import("react/jsx-runtime").JSX.Element;
 export default TableBody;

package/lib/components/TableTreeFn/Components/TableBody.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import TableRow from './TableRow';
-const TableBody = ({ flattenedTreeData, columnsData, columnMeta, rowHeight = 32, startIndex = 0, totalHeight = 0, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, onAddConfirm, onAddCancel, handleEditFieldError, expanding, selectedNode, hideOnDisable, scriptLengthTruncate, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }) => {
+const TableBody = ({ flattenedTreeData, columnsData, columnMeta, rowHeight = 32, startIndex = 0, totalHeight = 0, selected, select, onRowClick, onToggleExpand, onCheckBoxChange, onAddConfirm, onAddCancel, handleEditFieldError, expanding, selectedNode, hideOnDisable, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }) => {
     return (_jsx("div", { className: "ff-table-tree-fn-body", style: {
             height: `${totalHeight}px`,
             position: 'relative',
-        }, children: flattenedTreeData?.map((node, index) => (_jsx(TableRow, { node: node, columnsData: columnsData, columnMeta: columnMeta, selected: selected, select: select, onRowClick: onRowClick, onToggleExpand: onToggleExpand, onCheckBoxChange: onCheckBoxChange, onAddConfirm: onAddConfirm, onAddCancel: onAddCancel, handleEditFieldError: handleEditFieldError, isExpanding: node.key === expanding, index: startIndex + index, selectedNode: selectedNode, hideOnDisable: hideOnDisable, scriptLengthTruncate: scriptLengthTruncate, addModuleInputWidth: addModuleInputWidth, addModuleSelectWidth: addModuleSelectWidth, disableEditLabelConfirmIcon: disableEditLabelConfirmIcon, isEditable: isEditable, setIsEditable: setIsEditable, style: {
+        }, children: flattenedTreeData?.map((node, index) => (_jsx(TableRow, { node: node, columnsData: columnsData, columnMeta: columnMeta, selected: selected, select: select, onRowClick: onRowClick, onToggleExpand: onToggleExpand, onCheckBoxChange: onCheckBoxChange, onAddConfirm: onAddConfirm, onAddCancel: onAddCancel, handleEditFieldError: handleEditFieldError, isExpanding: node.key === expanding, index: startIndex + index, selectedNode: selectedNode, hideOnDisable: hideOnDisable, addModuleInputWidth: addModuleInputWidth, addModuleSelectWidth: addModuleSelectWidth, disableEditLabelConfirmIcon: disableEditLabelConfirmIcon, isEditable: isEditable, setIsEditable: setIsEditable, style: {
                 transform: `translateY(${(startIndex + index) * rowHeight}px)`,
                 height: `${rowHeight}px`,
                 position: 'absolute',

package/lib/components/TableTreeFn/Components/TableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../../src/components/TableTreeFn/Components/TableBody.tsx"],"names":[],"mappings":";AACA,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,SAAS,GAAG,CAAC,EACjB,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,CAAC,EACd,WAAW,GAAG,CAAC,EACf,QAAQ,EACR,MAAM,EACN,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,aAAa,EACb,oBAAoB,EACpB,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,UAAU,EACV,aAAa,GACE,EAAE,EAAE;IACnB,OAAO,CACL,cACE,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,GAAG,WAAW,IAAI;YAC1B,QAAQ,EAAE,UAAU;SACrB,YAEA,iBAAiB,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACvC,KAAC,QAAQ,IAEP,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,EAC1C,WAAW,EAAE,IAAI,CAAC,GAAG,KAAK,SAAS,EACnC,KAAK,EAAE,UAAU,GAAG,KAAK,EACzB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAC5B,oBAAoB,EAAE,oBAAoB,EAC1C,mBAAmB,EAAE,mBAAmB,EACxC,oBAAoB,EAAE,oBAAoB,EAC1C,2BAA2B,EAAE,2BAA2B,EACxD,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE;gBACL,SAAS,EAAE,cAAc,CAAC,UAAU,GAAG,KAAK,CAAC,GAAG,SAAS,KAAK;gBAC9D,MAAM,EAAE,GAAG,SAAS,IAAI;gBACxB,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,CAAC;aACT,IA7BI,IAAI,CAAC,GAAG,CA8Bb,CACH,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"TableBody.js","sourceRoot":"","sources":["../../../../src/components/TableTreeFn/Components/TableBody.tsx"],"names":[],"mappings":";AACA,OAAO,QAAQ,MAAM,YAAY,CAAC;AAElC,MAAM,SAAS,GAAG,CAAC,EACjB,iBAAiB,EACjB,WAAW,EACX,UAAU,EACV,SAAS,GAAG,EAAE,EACd,UAAU,GAAG,CAAC,EACd,WAAW,GAAG,CAAC,EACf,QAAQ,EACR,MAAM,EACN,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,oBAAoB,EACpB,SAAS,EACT,YAAY,EACZ,aAAa,EACb,mBAAmB,EACnB,oBAAoB,EACpB,2BAA2B,EAC3B,UAAU,EACV,aAAa,GACE,EAAE,EAAE;IACnB,OAAO,CACL,cACE,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE;YACL,MAAM,EAAE,GAAG,WAAW,IAAI;YAC1B,QAAQ,EAAE,UAAU;SACrB,YAEA,iBAAiB,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACvC,KAAC,QAAQ,IAEP,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,EAC9B,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,YAAY,EAC1B,WAAW,EAAE,WAAW,EACxB,oBAAoB,EAAE,oBAAoB,EAC1C,WAAW,EAAE,IAAI,CAAC,GAAG,KAAK,SAAS,EACnC,KAAK,EAAE,UAAU,GAAG,KAAK,EACzB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,aAAa,EAC5B,mBAAmB,EAAE,mBAAmB,EACxC,oBAAoB,EAAE,oBAAoB,EAC1C,2BAA2B,EAAE,2BAA2B,EACxD,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE;gBACL,SAAS,EAAE,cAAc,CAAC,UAAU,GAAG,KAAK,CAAC,GAAG,SAAS,KAAK;gBAC9D,MAAM,EAAE,GAAG,SAAS,IAAI;gBACxB,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;gBACP,KAAK,EAAE,CAAC;aACT,IA5BI,IAAI,CAAC,GAAG,CA6Bb,CACH,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/components/TableTreeFn/Components/TableCell.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { TableCellProps } from '../types';
-declare const TableCell: React.MemoExoticComponent<({ treeRowRef, col, colIndex, columnMeta, node, selected, select, onCheckBoxChange, onToggleExpand, onAddConfirm, onAddCancel, handleEditFieldError, isExpanding, columnTextColor, hideOnDisable, scriptLengthTruncate, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }: TableCellProps) => import("react/jsx-runtime").JSX.Element>;
+declare const TableCell: React.MemoExoticComponent<({ treeRowRef, col, colIndex, columnMeta, node, selected, select, onCheckBoxChange, onToggleExpand, onAddConfirm, onAddCancel, handleEditFieldError, isExpanding, columnTextColor, hideOnDisable, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }: TableCellProps) => import("react/jsx-runtime").JSX.Element>;
 export default TableCell;

package/lib/components/TableTreeFn/Components/TableCell.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from 'react';
-import { formatCellData } from '../Utils/formatDataCell';
 import { prepareData } from '../Utils/TableCell';
 import { checkEmpty } from '../../../utils/checkEmpty/checkEmpty';
 import Tooltip from '../../Tooltip';
@@ -19,7 +18,7 @@ const renderSpaces = (level, parentSiblings = [], isLast, nextSibling, isContain
     }
     return (_jsx("div", { className: "tree-table-fn-space-container", children: siblingsArray?.map((line, i) => (_jsx("span", { className: `tree-table-fn-space-block tree-table-fn-space-block-${i} ${!line ? 'no-lines' : ''} ${isLastNode && i === level - 1 ? 'last-node' : ''} ${isContainer ? 'folder' : ''}` }, i))) }));
 };
-const TableCell = React.memo(({ treeRowRef, col, colIndex, columnMeta, node, selected, select, onCheckBoxChange, onToggleExpand, onAddConfirm, onAddCancel, handleEditFieldError, isExpanding, columnTextColor, hideOnDisable, scriptLengthTruncate, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }) => {
+const TableCell = React.memo(({ treeRowRef, col, colIndex, columnMeta, node, selected, select, onCheckBoxChange, onToggleExpand, onAddConfirm, onAddCancel, handleEditFieldError, isExpanding, columnTextColor, hideOnDisable, addModuleInputWidth, addModuleSelectWidth, disableEditLabelConfirmIcon, isEditable, setIsEditable, }) => {
     //Todo uncomment the following code when we are highlighting the tree table nodes on hover
     // useEffect(() => {
     //   const handleHover = (event: MouseEvent, isHovering: boolean) => {
@@ -82,9 +81,7 @@ const TableCell = React.memo(({ treeRowRef, col, colIndex, columnMeta, node, sel
                                         select === 'radio' &&
                                         !(hideOnDisable && node.unselectable) && (_jsx("span", { className: "tree-table-fn-td-content-select", children: _jsx(RadioButton, { name: node.key, checked: selected.includes(node.key), value: node.key, onChange: (e) => onCheckBoxChange(e, node), disabled: node.unselectable ||
                                                 node.state === 'REVIEW' ||
-                                                node?.isDisable === true }) }))] })), node.isNewNode && col.isTree ? (_jsx(AddModule, { onCancel: onAddCancel, onConfirm: onAddConfirm, value: node.value, label: node?.label, optionsList: node.options, selectedOption: node.selectedOption, withDropdown: node.type === 'inputWithDropdown', handleCustomError: handleEditFieldError, inputFieldWidth: addModuleInputWidth, selectFieldWidth: addModuleSelectWidth, confirmIconTooltip: node.confirmIconTooltip, cancelIconTooltip: node.cancelIconTooltip, isEditable: isEditable, setIsEditable: setIsEditable, isOnBlurTrue: false, isDisable: { confirm: disableEditLabelConfirmIcon }, isTableTree: true })) : (_jsx("span", { className: "tree-table-fn-td-content-text", children: formatCellData(prepareData(node, col), scriptLengthTruncate) }))] })] }), col.actions && !node?.isNewNode && (_jsx("div", { className: `table-tree-fn-row-action`, children: (() => {
-                    return col.actions(node, treeRowRef);
-                })() }))] }));
+                                                node?.isDisable === true }) }))] })), _jsx("div", { className: "tree-table-cell-flex", children: node.isNewNode && col.isTree ? (_jsx(AddModule, { onCancel: onAddCancel, onConfirm: onAddConfirm, value: node.value, label: node?.label, optionsList: node.options, selectedOption: node.selectedOption, withDropdown: node.type === 'inputWithDropdown', handleCustomError: handleEditFieldError, inputFieldWidth: addModuleInputWidth, selectFieldWidth: addModuleSelectWidth, confirmIconTooltip: node.confirmIconTooltip, cancelIconTooltip: node.cancelIconTooltip, isEditable: isEditable, setIsEditable: setIsEditable, isOnBlurTrue: false, isDisable: { confirm: disableEditLabelConfirmIcon }, isTableTree: true })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "tree-table-fn-td-content-text", children: prepareData(node, col) }), col.actions && !node?.isNewNode && (_jsx("div", { className: "table-tree-fn-row-action", children: col.actions(node, treeRowRef) }))] })) })] })] })] }));
 });
 TableCell.displayName = 'TableCell';
 export default TableCell;