@tap-payments/os-micro-frontend-shared 0.1.39 → 0.1.40-9.fix.1

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/useTableState.d.ts

@@ -2,11 +2,13 @@
 export interface TableState {
     selectedCell: string | null;
     selectedColumn: string | null;
+    selectedRow: number | null;
     showBackDrop: boolean;
 }
 export declare const useTableState: () => {
     selectedCell: string | null;
     selectedColumn: string | null;
+    selectedRow: number | null;
     showBackDrop: boolean;
     selectedChip: string | null;
     setShowBackdrop: import("react").Dispatch<import("react").SetStateAction<boolean>>;

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/useTableState.js

@@ -3,6 +3,7 @@ export const useTableState = () => {
     const [selectedCell, setSelectedCell] = useState(null);
     const [selectedColumn, setSelectedColumn] = useState(null);
     const [selectedChip, setSelectedChip] = useState(null);
+    const [selectedRow, setSelectedRow] = useState(null);
     const [showBackDrop, setShowBackdrop] = useState(false);
     const handleChipClick = useCallback((rowIndex, columnIndex, event, chipIndex, pinnedType) => {
         event.stopPropagation();
@@ -16,29 +17,43 @@ export const useTableState = () => {
         }
         setSelectedChip(chipKey);
         setSelectedCell(cellKey);
-    }, [selectedChip, setSelectedChip, setSelectedCell]);
+        setSelectedRow(null);
+    }, [selectedChip, setSelectedChip, setSelectedCell, setSelectedRow]);
     const handleCellClick = useCallback((rowIndex, columnIndex, event, pinnedType) => {
         event.stopPropagation();
+        // If clicking on any cell in the pinned start section, select the entire row
+        if (pinnedType === 'start' && columnIndex === 0) {
+            setSelectedRow((prev) => (prev === rowIndex ? null : rowIndex));
+            setSelectedCell(null);
+            setSelectedColumn(null);
+            setSelectedChip(null);
+            return;
+        }
+        // Otherwise, handle normal cell selection
         const cellKey = `${pinnedType !== null && pinnedType !== void 0 ? pinnedType : 'default'}-${rowIndex}-${columnIndex}`;
         setSelectedCell((prev) => (prev === cellKey ? null : cellKey));
         setSelectedColumn(null);
         setSelectedChip(null);
-    }, []);
+        setSelectedRow(null);
+    }, [selectedRow]);
     const handleColumnClick = useCallback((columnIndex, event, pinnedType) => {
         event.stopPropagation();
         const columnKey = `${pinnedType !== null && pinnedType !== void 0 ? pinnedType : 'default'}-${columnIndex}`;
         setSelectedColumn((prev) => (prev === columnKey ? null : columnKey));
         setSelectedCell(null);
         setSelectedChip(null);
+        setSelectedRow(null);
     }, []);
     const resetSelection = useCallback(() => {
         setSelectedCell(null);
         setSelectedColumn(null);
         setSelectedChip(null);
+        setSelectedRow(null);
     }, []);
     return {
         selectedCell,
         selectedColumn,
+        selectedRow,
         showBackDrop,
         selectedChip,
         setShowBackdrop,

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/useVirtualTableContainer.d.ts

@@ -16,11 +16,12 @@ interface UseVirtualTableContainerProps<T = unknown> extends TableChipProps {
     isError: boolean;
     selectedCell: string | null;
     selectedColumn: string | null;
+    selectedRow: number | null;
     selectedChip: string | null;
     handleCellClick: (rowIndex: number, columnIndex: number, event: React.MouseEvent, pinnedType?: 'start' | 'end') => void;
     handleChipClick: (rowIndex: number, columnIndex: number, event: React.MouseEvent, chipIndex: number, pinnedType?: 'start' | 'end') => void;
 }
-export declare const useVirtualTableContainer: <T = unknown>({ rowHeight, areAllRowsLoaded, rows, isDelayedFetchingNextPage, rowProps, scrollToIndex, footerProps, isError, selectedCell, selectedColumn, selectedChip, handleCellClick, handleChipClick, }: UseVirtualTableContainerProps<T>) => {
+export declare const useVirtualTableContainer: <T = unknown>({ rowHeight, areAllRowsLoaded, rows, isDelayedFetchingNextPage, rowProps, scrollToIndex, footerProps, isError, selectedCell, selectedColumn, selectedRow, selectedChip, handleCellClick, handleChipClick, }: UseVirtualTableContainerProps<T>) => {
     getItemSize: (index: number, height: number) => number;
     getItemDataForContainer: (columnsData: IColumnProps[], isPinnedColumn: boolean, height: number) => {
         columns: any;
@@ -38,6 +39,7 @@ export declare const useVirtualTableContainer: <T = unknown>({ rowHeight, areAll
         isPinned: any;
         selectedCell: any;
         selectedColumn: any;
+        selectedRow: any;
         selectedChip: any;
         onCellClick: any;
         onChipClick: any;

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/useVirtualTableContainer.js

@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from 'react';
 import memoize from 'memoize-one';
-const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToIndex, lastItemIndex, totalCount, isError, areAllRowsLoaded, isPinned, selectedCell, selectedColumn, selectedChip, onCellClick, onChipClick, containerHeight, rowHeight) => ({
+const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToIndex, lastItemIndex, totalCount, isError, areAllRowsLoaded, isPinned, selectedCell, selectedColumn, selectedRow, selectedChip, onCellClick, onChipClick, containerHeight, rowHeight) => ({
     columns,
     isLoading,
     rows,
@@ -16,20 +16,22 @@ const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToInde
     isPinned,
     selectedCell,
     selectedColumn,
+    selectedRow,
     selectedChip,
     onCellClick,
     onChipClick,
     containerHeight,
     rowHeight,
 }));
-export const useVirtualTableContainer = ({ rowHeight, areAllRowsLoaded, rows, isDelayedFetchingNextPage, rowProps, scrollToIndex, footerProps, isError, selectedCell, selectedColumn, selectedChip, handleCellClick, handleChipClick, }) => {
+export const useVirtualTableContainer = ({ rowHeight, areAllRowsLoaded, rows, isDelayedFetchingNextPage, rowProps, scrollToIndex, footerProps, isError, selectedCell, selectedColumn, selectedRow, selectedChip, handleCellClick, handleChipClick, }) => {
     const getItemSize = useCallback((index, height) => {
         const isLastRow = areAllRowsLoaded && index === rows.length;
         if (isLastRow) {
+            // Calculate remaining height: total height - (number of data rows * row height)
             const usedHeight = rows.length * rowHeight;
             const remainingHeight = height - usedHeight;
-            const minimumLastRowHeight = rowHeight * 2;
-            return Math.max(remainingHeight, minimumLastRowHeight);
+            const minimumLastRowHeight = rowHeight * 2; // Minimum height is 2x rowHeight
+            return Math.max(remainingHeight, minimumLastRowHeight); // Ensure minimum 2x row height
         }
         return rowHeight;
     }, [areAllRowsLoaded, rows.length, rowHeight]);
@@ -46,7 +48,7 @@ export const useVirtualTableContainer = ({ rowHeight, areAllRowsLoaded, rows, is
             areAllRowsLoaded,
         ];
     }, [isDelayedFetchingNextPage, rows, rowProps, scrollToIndex, footerProps === null || footerProps === void 0 ? void 0 : footerProps.totalCount, isError, areAllRowsLoaded]);
-    const commonItemDataSuffix = useMemo(() => [selectedCell, selectedColumn, selectedChip, handleCellClick, handleChipClick], [selectedCell, selectedColumn, selectedChip, handleCellClick, handleChipClick]);
+    const commonItemDataSuffix = useMemo(() => [selectedCell, selectedColumn, selectedRow, selectedChip, handleCellClick, handleChipClick], [selectedCell, selectedColumn, selectedRow, selectedChip, handleCellClick, handleChipClick]);
     const getItemDataForContainer = useCallback((columnsData, isPinnedColumn, height) => createItemData(columnsData, ...commonItemDataParams, isPinnedColumn, ...commonItemDataSuffix, height, rowHeight), [commonItemDataParams, commonItemDataSuffix, rowHeight]);
     return {
         getItemSize,

package/build/components/VirtualTables/SheetViewVirtualTable/style.d.ts

@@ -5,12 +5,12 @@ export declare const HeaderText: import("@emotion/styled").StyledComponent<impor
 export declare const PinIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StyledHeader: import("@emotion/styled").StyledComponent<import("@mui/material/TableHead").TableHeadOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, "ref"> & {
     ref?: ((instance: HTMLTableSectionElement | null) => void) | import("react").RefObject<HTMLTableSectionElement> | null | undefined;
-}, "style" | "className" | "classes" | "children" | "sx"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+}, "classes" | "className" | "style" | "children" | "sx"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     showBackDrop: boolean;
 }, {}, {}>;
 export declare const StyledMUITableRow: import("@emotion/styled").StyledComponent<import("@mui/material/TableRow").TableRowOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & {
     ref?: ((instance: HTMLTableRowElement | null) => void) | import("react").RefObject<HTMLTableRowElement> | null | undefined;
-}, "style" | "selected" | "className" | "classes" | "children" | "sx" | "hover"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
+}, "classes" | "className" | "style" | "children" | "selected" | "sx" | "hover"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
     component: string;
 }, {}, {}>;
 export declare const SheetViewVirtualTableWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/build/components/VirtualTables/SheetViewVirtualTable/style.js

@@ -48,7 +48,6 @@ export const StyledMUITableRow = styled(MUITableRow)(({ theme }) => ({
     width: '100%',
     minWidth: 'fit-content',
     height: '28px',
-    borderBottom: `1px solid ${theme.palette.divider}`,
     backgroundColor: theme.palette.primary.light,
 }));
 export const SheetViewVirtualTableWrapper = styled('div')({
@@ -56,6 +55,7 @@ export const SheetViewVirtualTableWrapper = styled('div')({
     width: '100%',
     height: '100%',
     overflow: 'hidden',
+    borderRadius: '12px',
 });
 const PinnedColumnBase = styled('div')(({ theme }) => ({
     width: 'auto',
@@ -68,7 +68,7 @@ const PinnedColumnBase = styled('div')(({ theme }) => ({
     backgroundColor: theme.palette.primary.light,
     borderTop: '1px solid #F2F2F2',
     borderBottom: '1px solid #F2F2F2',
-    overflow: 'hidden',
+    overflow: 'hidden', // Ensure border radius is applied properly
 }));
 export const PinnedStartColumnWrapper = styled(PinnedColumnBase)({
     boxShadow: '4px 0px 24px 0px #00000014',

package/build/components/VirtualTables/SheetViewVirtualTable/types.d.ts

@@ -5,6 +5,9 @@ export interface ISheetViewVirtualTable extends Omit<IVirtualTable, 'isSheetView
     onColumnPin?: (columnId: string, isPinned: boolean) => void;
     isPinnable?: boolean;
     clearBackdropVisibilityTimeout?: number;
+    overscanCount?: number;
+    windowId?: string;
+    serviceCode?: string;
 }
 export interface SheetViewTableHeaderProps {
     columns: IColumnProps[];
@@ -21,6 +24,10 @@ export interface SheetViewTableHeaderProps {
     tablePosition?: TablePosition;
     hasPinnedStart?: boolean;
     hasPinnedEnd?: boolean;
+    onStartResize?: (e: React.MouseEvent, columnId: string) => void;
+    isResizing?: boolean;
+    resizingColumn?: string | null;
+    totalCount?: number;
 }
 export interface VirtualTableContainerProps {
     columnsData: IColumnProps[];
@@ -49,6 +56,9 @@ export interface CommonTableProps {
     tableMode?: string;
     showNoDataView: boolean;
     tableBodyStyles?: CSSProperties;
+    onStartResize?: (e: React.MouseEvent, columnId: string) => void;
+    isResizing?: boolean;
+    resizingColumn?: string | null;
 }
 export interface PinnedColumnProps extends CommonTableProps {
     position: 'start' | 'end';
@@ -78,6 +88,7 @@ export interface NoDataViewProps extends CommonTableProps {
     error?: Error | null;
     triggerDataRefetch?: () => Promise<unknown>;
     footerProps?: TableFooterProps;
+    customNoDataComponent?: React.ReactNode;
 }
 export interface LoadingMainTableProps extends CommonTableProps {
     hasPinnedStart: boolean;

package/build/components/VirtualTables/VirtualTable/VirtualTable.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import type { IVirtualTable } from '../../../types/index.js';
-declare function VirtualTable({ columns, rows, threshold, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView, }: Readonly<IVirtualTable>): import("react/jsx-runtime").JSX.Element;
+declare function VirtualTable({ columns, rows, threshold, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, onStartDrag, isSheetView, isMinimized, footerComponent, customNoDataComponent, }: Readonly<IVirtualTable>): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof VirtualTable>;
 export default _default;

package/build/components/VirtualTables/VirtualTable/VirtualTable.js

@@ -34,17 +34,24 @@ const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToInde
     areAllRowsLoaded,
     isSheetView,
 }));
-function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView = false, }) {
-    var _a;
+function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, onStartDrag, isSheetView = false, isMinimized, footerComponent, customNoDataComponent, }) {
+    var _a, _b;
     const theme = useTheme();
     const onPointerDown = (e) => {
-        dragControls === null || dragControls === void 0 ? void 0 : dragControls.start(e);
+        onStartDrag === null || onStartDrag === void 0 ? void 0 : onStartDrag(e);
     };
     const isDelayedFetchingNextPage = useDelayToSetValue({
         value: isFetchingNextPage,
         delay: 1000,
     });
     const [showBackDrop, setShowBackdrop] = useState(false);
+    // Dynamic AutoSizer key that updates asynchronously when layout-affecting props change
+    const [autoSizerKey, setAutoSizerKey] = useState('INITIAL_KEY');
+    useEffect(() => {
+        const depsKey = `${footerProps === null || footerProps === void 0 ? void 0 : footerProps.maximized}-${isMinimized}`;
+        const frame = requestAnimationFrame(() => setAutoSizerKey(depsKey));
+        return () => cancelAnimationFrame(frame);
+    }, [footerProps === null || footerProps === void 0 ? void 0 : footerProps.maximized, isMinimized]);
     const isError = hasError(error);
     const tableLoading = isLoading !== null && isLoading !== void 0 ? isLoading : true;
     const tableError = !isLoading && rows.length === 0 && isError && !isNotFoundError(error);
@@ -58,6 +65,7 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
     const itemData = createItemData(orderedColumns, isDelayedFetchingNextPage, rows, rowProps, scrollToIndex, lastItemIndex, (_a = footerProps === null || footerProps === void 0 ? void 0 : footerProps.totalCount) !== null && _a !== void 0 ? _a : 0, isError, areAllRowsLoaded && !areTotalRowsNotFillingHeight, isSheetView);
     const tableRowHeight = isSheetView ? SHEET_VIEW_TABLE_ROW_HEIGHT : TABLE_ROW_HEIGHT;
     const listRef = useRef(null);
+    // Reset row heights when isSheetView or tableRowHeight changes
     useEffect(() => {
         if (listRef.current && typeof listRef.current.resetAfterIndex === 'function') {
             listRef.current.resetAfterIndex(0, true);
@@ -68,11 +76,16 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
             setShowBackdrop(isVisible);
         };
         const handleOnLoadMoreItems = () => __awaiter(this, void 0, void 0, function* () {
+            // TODO: start index and stop index are not working as expected
+            // console.log('startIndex', startIndex, 'stopIndex', stopIndex,
+            // 'rows.length', rows.length)
             if (areAllRowsLoaded)
                 return;
             yield (loadMoreItems === null || loadMoreItems === void 0 ? void 0 : loadMoreItems());
         });
-        return (_jsx(InfiniteLoader, Object.assign({ "data-testid": "VirtualTable_InfiniteLoader", isItemLoaded: (index) => index !== lastItemIndex, itemCount: itemsCount, loadMoreItems: handleOnLoadMoreItems, threshold: threshold }, { children: ({ onItemsRendered, ref }) => (_jsx(AutoSizer, Object.assign({ ref: ref, "data-testid": "VirtualTable_AutoSizer" }, { children: ({ height, width }) => (_jsx(StyledVirtualList, Object.assign({ "data-testid": "VirtualTable_VirtualList", useIsScrolling: true, className: "list", itemData: itemData, height: height || 0, width: width || 0, itemCount: itemsCount, itemSize: () => tableRowHeight, onItemsRendered: onItemsRendered, setBackdropVisibility: setBackdropVisibility, areTotalRowsNotFillingHeight: areTotalRowsNotFillingHeight, scrollToIndex: scrollToIndex, overscanCount: TABLE_LIST_OVER_SCAN, isSheetView: isSheetView, listRef: listRef }, { children: ListItemWrapper }))) }))) })));
+        return (
+        // @ts-ignore
+        _jsx(InfiniteLoader, Object.assign({ "data-testid": "VirtualTable_InfiniteLoader", isItemLoaded: (index) => index !== lastItemIndex, itemCount: itemsCount, loadMoreItems: handleOnLoadMoreItems, threshold: threshold }, { children: ({ onItemsRendered, ref }) => (_jsx(AutoSizer, Object.assign({ ref: ref, "data-testid": "VirtualTable_AutoSizer" }, { children: ({ height, width }) => (_jsx(StyledVirtualList, Object.assign({ "data-testid": "VirtualTable_VirtualList", useIsScrolling: true, className: "list", itemData: itemData, height: height || 0, width: width || 0, itemCount: itemsCount, itemSize: () => tableRowHeight, onItemsRendered: onItemsRendered, setBackdropVisibility: setBackdropVisibility, areTotalRowsNotFillingHeight: areTotalRowsNotFillingHeight, scrollToIndex: scrollToIndex, overscanCount: TABLE_LIST_OVER_SCAN, isSheetView: isSheetView, listRef: listRef }, { children: ListItemWrapper }))) }), autoSizerKey)) })));
     }, [
         lastItemIndex,
         loadMoreItems,
@@ -84,11 +97,16 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
         isSheetView,
         itemData,
         scrollToIndex,
+        autoSizerKey,
     ]);
     const showNoDataView = tableLoading || tableError || tableEmpty || hasTimeoutError;
-    return (_jsxs(_Fragment, { children: [_jsxs(TableContainer, { children: [_jsx(StyledTableBox, Object.assign({ as: "main", id: "table-box-container", "aria-labelledby": "table-box-container", "data-testid": "VirtualTable_StyledTableBox", "data-title": tableTitle, "data-direction": theme.direction, "data-are-all-rows-loaded": !!areAllRowsLoaded, "data-is-fetching-next-page": !!isFetchingNextPage, "data-scroll-to-index": scrollToIndex, "data-is-loading": !!isLoading, "data-is-error": !!isError, "data-is-error-timeout": !!hasTimeoutError, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showNoDataView: showNoDataView }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: Object.assign({}, tableBodyStyles) }, { children: [showHeader && (_jsx(TableHeader, { "data-testid": "VirtualTable_TableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: orderedColumns, headerProps: headerProps, showBackDrop: showBackDrop, isSheetView: isSheetView })), showNoDataView ? (_jsx(TableNoData, { error: error, tableEmpty: tableEmpty, isTimeoutError: hasTimeoutError, tableError: tableError, tableLoading: tableLoading, orderedColumns: orderedColumns, triggerDataRefetch: triggerDataRefetch, footerProps: footerProps })) : (_jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", sx: {
+    return (_jsxs(_Fragment, { children: [_jsxs(TableContainer, { children: [_jsx(StyledTableBox, Object.assign({ as: "main", id: "table-box-container", "aria-labelledby": "table-box-container", "data-testid": "VirtualTable_StyledTableBox", "data-title": tableTitle, "data-direction": theme.direction, "data-are-all-rows-loaded": !!areAllRowsLoaded, "data-is-fetching-next-page": !!isFetchingNextPage, "data-scroll-to-index": scrollToIndex, "data-is-loading": !!isLoading, "data-is-error": !!isError, "data-is-error-timeout": !!hasTimeoutError, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showNoDataView: showNoDataView }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: Object.assign({}, tableBodyStyles) }, { children: [showHeader && (_jsx(TableHeader, { "data-testid": "VirtualTable_TableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: orderedColumns, headerProps: headerProps, showBackDrop: showBackDrop, isSheetView: isSheetView, totalCount: (_b = footerProps === null || footerProps === void 0 ? void 0 : footerProps.totalCount) !== null && _b !== void 0 ? _b : 0 })), showNoDataView ? (customNoDataComponent ? (customNoDataComponent) : (_jsx(TableNoData, { error: error, tableEmpty: tableEmpty, isTimeoutError: hasTimeoutError, tableError: tableError, tableLoading: tableLoading, orderedColumns: orderedColumns, triggerDataRefetch: triggerDataRefetch, footerProps: footerProps }))) : (_jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", sx: {
                                         width: '100%',
                                         minWidth: 'fit-content',
-                                    } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "VirtualTable_StyledBox", hidePadding: true, className: "list-wrapper" }, { children: renderTableContainer })) })))] })) })), !showNoDataView && areTotalRowsNotFillingHeight && !isFetchingNextPage && (_jsx(TableLastItem, { height: (itemsCount + 1) * tableRowHeight, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode, "data-testid": "VirtualTable_TableLastItem" }))] }), _jsx(TableFooter, Object.assign({ "data-testid": "VirtualTable_TableFooter", showSeparator: true, showBackDrop: showBackDrop, onPointerDown: onPointerDown }, footerProps))] }));
+                                    } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "VirtualTable_StyledBox", hidePadding: true, className: "list-wrapper" }, { children: renderTableContainer })) })))] })) })), !showNoDataView && areTotalRowsNotFillingHeight && !isFetchingNextPage && (_jsx(TableLastItem
+                    // rows height + header height
+                    , { 
+                        // rows height + header height
+                        height: (itemsCount + 1) * tableRowHeight, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode, "data-testid": "VirtualTable_TableLastItem" }))] }), footerProps && (_jsx(TableFooter, Object.assign({ "data-testid": "VirtualTable_TableFooter", showSeparator: true, showBackDrop: showBackDrop, onPointerDown: onPointerDown }, footerProps))), footerComponent] }));
 }
 export default memo(VirtualTable);

package/build/components/VirtualTables/VirtualTableWithCard/VirtualTableWithCard.d.ts

@@ -8,6 +8,6 @@ export interface VirtualTableWithCardProps extends Omit<IVirtualTable, 'showHead
     tableHeight: number;
     tableHeaderHeight?: number;
 }
-declare function VirtualTableWithCard({ rows, threshold, rowProps, footerProps, rowHeight, isLoading, error, tableHeader, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, renderCardComponent, cardLoadingComponent, tableHeight, tableHeaderHeight, noDataComponent, dragControls, }: VirtualTableWithCardProps): import("react/jsx-runtime").JSX.Element;
+declare function VirtualTableWithCard({ rows, threshold, rowProps, footerProps, rowHeight, isLoading, error, tableHeader, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, renderCardComponent, cardLoadingComponent, tableHeight, tableHeaderHeight, noDataComponent, onStartDrag, }: Readonly<VirtualTableWithCardProps>): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof VirtualTableWithCard>;
 export default _default;

package/build/components/VirtualTables/VirtualTableWithCard/VirtualTableWithCard.js

@@ -32,11 +32,11 @@ const createItemData = memoize((isLoading, rows, rowProps, scrollToIndex, lastIt
     areAllRowsLoaded,
     renderCardComponent,
 }));
-function VirtualTableWithCard({ rows, threshold = TABLE_THRESHOLD, rowProps, footerProps, rowHeight = TABLE_ROW_HEIGHT, isLoading, error, tableHeader, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, renderCardComponent, cardLoadingComponent, tableHeight, tableHeaderHeight, noDataComponent, dragControls, }) {
+function VirtualTableWithCard({ rows, threshold = TABLE_THRESHOLD, rowProps, footerProps, rowHeight = TABLE_ROW_HEIGHT, isLoading, error, tableHeader, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, renderCardComponent, cardLoadingComponent, tableHeight, tableHeaderHeight, noDataComponent, onStartDrag, }) {
     var _a;
     const theme = useTheme();
     const onPointerDown = (e) => {
-        dragControls === null || dragControls === void 0 ? void 0 : dragControls.start(e);
+        onStartDrag === null || onStartDrag === void 0 ? void 0 : onStartDrag(e);
     };
     const isDelayedFetchingNextPage = useDelayToSetValue({
         value: isFetchingNextPage,
@@ -57,11 +57,16 @@ function VirtualTableWithCard({ rows, threshold = TABLE_THRESHOLD, rowProps, foo
             setShowBackdrop(isVisible);
         };
         const handleOnLoadMoreItems = () => __awaiter(this, void 0, void 0, function* () {
+            // TODO: start index and stop index are not working as expected
+            // console.log('startIndex', startIndex, 'stopIndex', stopIndex,
+            // 'rows.length', rows.length)
             if (areAllRowsLoaded)
                 return;
             yield (loadMoreItems === null || loadMoreItems === void 0 ? void 0 : loadMoreItems());
         });
-        return (_jsx(InfiniteLoader, Object.assign({ "data-testid": "VirtualTable_InfiniteLoader", isItemLoaded: (index) => index !== lastItemIndex, itemCount: itemsCount, loadMoreItems: handleOnLoadMoreItems, threshold: threshold }, { children: ({ onItemsRendered, ref }) => (_jsx(Box, Object.assign({ sx: { height: `${tableHeight - (tableHeaderHeight !== null && tableHeaderHeight !== void 0 ? tableHeaderHeight : 0)}px` }, id: "auto-sizer-wrapper" }, { children: _jsx(AutoSizer, Object.assign({ ref: ref, "data-testid": "VirtualTable_AutoSizer" }, { children: ({ height: h, width: w }) => (_jsx(StyledVirtualList, Object.assign({ "data-testid": "VirtualTable_VirtualList", useIsScrolling: true, className: "list", itemData: itemData, height: h || 0, width: w || 0, itemCount: itemsCount, itemSize: () => rowHeight, onItemsRendered: onItemsRendered, setBackdropVisibility: setBackdropVisibility, areTotalRowsNotFillingHeight: areTotalRowsNotFillingHeight, scrollToIndex: scrollToIndex, overscanCount: TABLE_LIST_OVER_SCAN }, { children: ListItemWrapperWithCard }))) })) }))) })));
+        return (
+        // @ts-ignore
+        _jsx(InfiniteLoader, Object.assign({ "data-testid": "VirtualTable_InfiniteLoader", isItemLoaded: (index) => index !== lastItemIndex, itemCount: itemsCount, loadMoreItems: handleOnLoadMoreItems, threshold: threshold }, { children: ({ onItemsRendered, ref }) => (_jsx(Box, Object.assign({ sx: { height: `${tableHeight - (tableHeaderHeight !== null && tableHeaderHeight !== void 0 ? tableHeaderHeight : 0)}px` }, id: "auto-sizer-wrapper" }, { children: _jsx(AutoSizer, Object.assign({ ref: ref, "data-testid": "VirtualTable_AutoSizer" }, { children: ({ height: h, width: w }) => (_jsx(StyledVirtualList, Object.assign({ "data-testid": "VirtualTable_VirtualList", useIsScrolling: true, className: "list", itemData: itemData, height: h || 0, width: w || 0, itemCount: itemsCount, itemSize: () => rowHeight, onItemsRendered: onItemsRendered, setBackdropVisibility: setBackdropVisibility, areTotalRowsNotFillingHeight: areTotalRowsNotFillingHeight, scrollToIndex: scrollToIndex, overscanCount: TABLE_LIST_OVER_SCAN }, { children: ListItemWrapperWithCard }))) })) }))) })));
     }, [
         error,
         isLoading,

package/build/components/VirtualTables/components/ColumnFilter/ColumnFilter.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
 import { ColumnFilterProps } from './type';
-declare function ColumnFilter(filter: ColumnFilterProps): import("react/jsx-runtime").JSX.Element;
+declare function ColumnFilter(props: ColumnFilterProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof ColumnFilter>;
 export default _default;

package/build/components/VirtualTables/components/ColumnFilter/ColumnFilter.js

@@ -1,58 +1,46 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { memo, useMemo } from 'react';
-import Box from '@mui/material/Box';
 import Popper from '@mui/material/Popper';
+import Box from '@mui/material/Box';
+import CustomBackdrop from '../../../CustomBackdrop';
 import { closeIcon, columnIcon, whiteFilterIcon } from '../../../../constants/index.js';
 import Inputs from './Inputs';
 import List from './List';
 import { FilterWrapper } from './style';
-import CustomBackdrop from '../../../CustomBackdrop';
-function ColumnFilter(filter) {
-    const { anchorEl, setAnchorEl, onClose } = filter;
+function ColumnFilter(props) {
+    const { anchorEl, setAnchorEl, onClose, isFilterApplied, disabled } = props;
     const onCloseDropdown = (event) => {
         event.stopPropagation();
         setAnchorEl(null);
         onClose === null || onClose === void 0 ? void 0 : onClose(event);
     };
-    const filterData = useMemo(() => { var _a; return ((_a = filter === null || filter === void 0 ? void 0 : filter.options) === null || _a === void 0 ? void 0 : _a.reduce((acc, { apiKey }) => { var _a; return (Object.assign(Object.assign({}, acc), { [apiKey]: (_a = filter === null || filter === void 0 ? void 0 : filter.data) === null || _a === void 0 ? void 0 : _a[apiKey] })); }, {})) || {}; }, [filter]);
-    const listFilterData = useMemo(() => {
-        var _a;
-        const listFilter = filter;
-        const rawData = (_a = listFilter === null || listFilter === void 0 ? void 0 : listFilter.data) === null || _a === void 0 ? void 0 : _a[listFilter.apiKey];
-        return Array.isArray(rawData) ? rawData : [];
-    }, [filter]);
-    const showClearIcon = useMemo(() => Object.values(filterData || {}).some((value) => {
-        if (typeof value === 'string' || Array.isArray(value))
-            return value.length > 0;
-        return Boolean(value);
-    }) || listFilterData.length > 0, [filterData, listFilterData]);
     const open = Boolean(anchorEl);
     const filterApiKeys = useMemo(() => {
         var _a;
-        if (filter.type === 'list') {
-            return [filter.apiKey];
+        if (props.type === 'list') {
+            return [props.apiKey];
         }
-        return (_a = ((filter === null || filter === void 0 ? void 0 : filter.options) || [])) === null || _a === void 0 ? void 0 : _a.map(({ apiKey }) => apiKey);
-    }, [filter]);
+        return (_a = ((props === null || props === void 0 ? void 0 : props.options) || [])) === null || _a === void 0 ? void 0 : _a.map(({ apiKey }) => apiKey);
+    }, [props]);
     const renderFilter = useMemo(() => {
-        if (filter.type === 'list')
-            return _jsx(List, { onCloseDropdown: onCloseDropdown, filter: filter });
-        if (filter.type === 'inputs')
-            return _jsx(Inputs, { onCloseDropdown: onCloseDropdown, filter: filter });
-        if (filter.type === 'custom') {
+        if (props.type === 'list')
+            return _jsx(List, { onCloseDropdown: onCloseDropdown, filter: props });
+        if (props.type === 'inputs')
+            return _jsx(Inputs, { onCloseDropdown: onCloseDropdown, filter: props });
+        if (props.type === 'custom') {
             const componentSharedProps = {
                 anchorEl,
                 setAnchorEl,
                 onCloseDropdown,
             };
-            return filter.render(componentSharedProps);
+            return props.render(componentSharedProps);
         }
         return null;
-    }, [open, filter, onCloseDropdown]);
-    return (_jsxs(_Fragment, { children: [showClearIcon ? (_jsxs(FilterWrapper, { children: [_jsx(Box, { component: "img", "data-testid": "ColumnFilter_whiteFilterIcon", src: whiteFilterIcon, alt: "filter-icon", sx: { marginInlineEnd: '2px', height: 6 } }), _jsx(Box, { component: "img", "data-testid": "ColumnFilter_closeIcon", src: closeIcon, alt: "close-icon", onClick: (e) => {
+    }, [open, props, onCloseDropdown]);
+    return (_jsxs(_Fragment, { children: [isFilterApplied ? (_jsxs(FilterWrapper, { children: [_jsx(Box, { component: "img", "data-testid": "ColumnFilter_whiteFilterIcon", src: whiteFilterIcon, alt: "filter-icon", sx: { marginInlineEnd: '2px', height: 6 } }), _jsx(Box, { component: "img", "data-testid": "ColumnFilter_closeIcon", src: closeIcon, alt: "close-icon", onClick: (e) => {
                             e.stopPropagation();
                             setAnchorEl(null);
-                            filter.onClear(filterApiKeys);
-                        } })] })) : (_jsx(Box, { component: "img", "data-testid": "ColumnFilter_columnIcon", src: columnIcon, alt: "column-icon", sx: { cursor: 'pointer', marginTop: '2px', userSelect: 'none' } })), open && _jsx(CustomBackdrop, { onClick: onCloseDropdown }), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: renderFilter }))] }));
+                            props.onClear(filterApiKeys);
+                        } })] })) : (_jsx(Box, { component: "img", "data-testid": "ColumnFilter_columnIcon", src: columnIcon, alt: "column-icon", sx: { marginTop: '2px', userSelect: 'none', opacity: disabled ? 0.5 : 1 } })), open && _jsx(CustomBackdrop, { onClick: onCloseDropdown }), _jsx(Popper, Object.assign({ open: open, anchorEl: anchorEl, placement: "bottom-start" }, { children: renderFilter }))] }));
 }
 export default memo(ColumnFilter);

package/build/components/VirtualTables/components/ColumnFilter/Inputs/Inputs.js

@@ -8,6 +8,7 @@ import { grayCloseIcon, searchIcon } from '../../../../../constants/index.js';
 import { Wrapper, Text, InputStyled, InputsWrapper, ClearButton, ClearWrapper } from './style';
 import { CancelButton, Footer, OkayButton } from '../style';
 function Inputs({ onCloseDropdown, filter: { options = [], onConfirm, data, isOnlyOneFilter, onClearFilterFields, wrapperSx } }) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const [values, setValues] = useState({});
     useEffect(() => {
         setValues((options || []).reduce((acc, { apiKey }) => { var _a; return (Object.assign(Object.assign({}, acc), { [apiKey]: (_a = data === null || data === void 0 ? void 0 : data[apiKey]) !== null && _a !== void 0 ? _a : '' })); }, {}));
@@ -43,6 +44,8 @@ function Inputs({ onCloseDropdown, filter: { options = [], onConfirm, data, isOn
                             setValues(Object.assign(Object.assign({}, values), { [apiKey]: e.target.value }));
                         }, disabled: isDisabled || isInputDisabled(apiKey, filterGroup), value: getInputValue(apiKey), inputProps: { autoComplete: 'off', 'data-testid': 'ColumnFilterInputs_input' }, endAdornment: _jsx(Box, { component: "img", "data-testid": "ColumnFilterInputs_icon", "data-icon": isInputHasValue(apiKey) ? 'close' : 'search', src: isInputHasValue(apiKey) ? grayCloseIcon : searchIcon, alt: "search", className: "icon", sx: { cursor: isInputHasValue(apiKey) ? 'pointer' : 'default' }, onClick: () => {
                                 onClickResetInput(apiKey);
-                            } }) })) }, apiKey))) })), _jsx(Collapse, Object.assign({ in: showClearButton, component: "section", "data-testid": "ColumnFilterInputs_Collapse" }, { children: _jsx(ClearWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_ClearWrapper" }, { children: _jsx(ClearButton, Object.assign({ type: "button", onClick: onClickClear, "data-testid": "ColumnFilterInputs_ClearButton" }, { children: t('clear') })) })) })), _jsxs(Footer, Object.assign({ component: "footer", "data-testid": "ColumnFilterInputs_footer" }, { children: [_jsx(CancelButton, Object.assign({ type: "button", onClick: onClickCancel, "data-testid": "ColumnFilterInputs_CancelButton" }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ type: "button", onClick: onClickOkay, "data-testid": "ColumnFilterInputs_OkayButton" }, { children: t('okay') }))] }))] })));
+                            } }) })) }, apiKey))) })), _jsx(Collapse, Object.assign({ in: showClearButton, component: "section", "data-testid": "ColumnFilterInputs_Collapse", sx: {
+                    borderTop: '0',
+                } }, { children: _jsx(ClearWrapper, Object.assign({ "data-testid": "ColumnFilterInputs_ClearWrapper" }, { children: _jsx(ClearButton, Object.assign({ type: "button", onClick: onClickClear, "data-testid": "ColumnFilterInputs_ClearButton" }, { children: t('clear') })) })) })), _jsxs(Footer, Object.assign({ component: "footer", "data-testid": "ColumnFilterInputs_footer" }, { children: [_jsx(CancelButton, Object.assign({ type: "button", onClick: onClickCancel, "data-testid": "ColumnFilterInputs_CancelButton" }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ type: "button", onClick: onClickOkay, "data-testid": "ColumnFilterInputs_OkayButton" }, { children: t('okay') }))] }))] })));
 }
 export default Inputs;

package/build/components/VirtualTables/components/ColumnFilter/Inputs/style.d.ts

@@ -13,7 +13,7 @@ export declare const InputsWrapper: import("@emotion/styled").StyledComponent<im
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
 export declare const ClearButton: import("@emotion/styled").StyledComponent<import("@mui/material/Button").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "disabled" | "style" | "color" | "className" | "classes" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
 export declare const ClearWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/VirtualTables/components/ColumnFilter/List/List.js

@@ -56,6 +56,6 @@ function List({ onCloseDropdown, filter, styles }) {
                 bottom: 0,
                 backgroundColor: 'white',
                 zIndex: 99999,
-            } }, { children: [_jsx(CancelButton, Object.assign({ onClick: onClickCancel }, { children: t('cancel') })), _jsx(OkayButton, Object.assign({ onClick: onClickOkay }, { children: t('okay') }))] })) }));
+            } }, { children: [_jsx(CancelButton, Object.assign({ onClick: onClickCancel }, { children: t('cancel') }), "nested-dropdown-cancel"), _jsx(OkayButton, Object.assign({ onClick: onClickOkay }, { children: t('okay') }), "nested-dropdown-ok")] })) }));
 }
 export default memo(List);

package/build/components/VirtualTables/components/ColumnFilter/style.d.ts

@@ -7,7 +7,7 @@ export declare const Footer: import("@emotion/styled").StyledComponent<import("@
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
 export declare const OkayButton: import("@emotion/styled").StyledComponent<import("@mui/material/Button").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "disabled" | "style" | "color" | "className" | "classes" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
 export declare const CancelButton: import("@emotion/styled").StyledComponent<import("@mui/material/Button").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "disabled" | "style" | "color" | "className" | "classes" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;

package/build/components/VirtualTables/components/ColumnFilter/type.d.ts

@@ -4,6 +4,8 @@ export type ColumnFilterProps = IColumnFilter & {
     anchorEl: HTMLElement | null;
     setAnchorEl: (el: HTMLElement | null) => void;
     onClose?: (e: MouseEvent<HTMLElement>) => void;
+    isFilterApplied: boolean;
+    disabled?: boolean;
 };
 export interface CustomColumnFilterProps extends Pick<ColumnFilterProps, 'anchorEl' | 'setAnchorEl'> {
     onCloseDropdown: (e: MouseEvent<HTMLElement>) => void;

package/build/components/VirtualTables/components/ErrorList/styles.d.ts

@@ -15,6 +15,6 @@ export declare const ErrorMessage: import("@emotion/styled").StyledComponent<imp
 export declare const StyledImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
 export declare const StyledButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "disabled" | "style" | "color" | "className" | "classes" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const StyledButtonText: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {}>;
 export {};

package/build/components/VirtualTables/components/TableFooter/TableFooter.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { TableFooterProps } from '../../../../types/index.js';
-declare function TableFooter({ totalCount, showBackDrop, showSeparator, sandboxMode, maximized, children, ...other }: Readonly<TableFooterProps>): import("react/jsx-runtime").JSX.Element;
+declare function TableFooter({ totalCount, showBackDrop, showSeparator, sandboxMode, maximized, ...other }: Readonly<TableFooterProps>): import("react/jsx-runtime").JSX.Element;
 declare const _default: React.MemoExoticComponent<typeof TableFooter>;
 export default _default;

package/build/components/VirtualTables/components/TableFooter/TableFooter.js

@@ -15,8 +15,8 @@ import { useTranslation } from 'react-i18next';
 import { formatNumber } from '../../../../utils/index.js';
 import { StyledFooter, Label, Title, ValueWrapper, EngravingLine } from './style';
 function TableFooter(_a) {
-    var { totalCount, showBackDrop = false, showSeparator, sandboxMode, maximized, children } = _a, other = __rest(_a, ["totalCount", "showBackDrop", "showSeparator", "sandboxMode", "maximized", "children"]);
+    var { totalCount, showBackDrop = false, showSeparator, sandboxMode, maximized } = _a, other = __rest(_a, ["totalCount", "showBackDrop", "showSeparator", "sandboxMode", "maximized"]);
     const { t } = useTranslation();
-    return (_jsxs(StyledFooter, Object.assign({ component: "footer", "data-testid": "TableFooter", maximized: maximized !== null && maximized !== void 0 ? maximized : false, sandboxMode: sandboxMode, showBackDrop: showBackDrop, areTotalRowsNotFillingHeight: !!showSeparator }, other, { children: [showSeparator && _jsx(EngravingLine, {}), totalCount || totalCount === 0 ? (_jsxs(Label, Object.assign({ sx: { gap: '6px', cursor: 'text' } }, { children: [_jsx(Title, { children: t('count') }), _jsx(ValueWrapper, { children: formatNumber(totalCount || 0) })] }))) : null, children] })));
+    return (_jsxs(StyledFooter, Object.assign({ component: "footer", "data-testid": "TableFooter", maximized: maximized !== null && maximized !== void 0 ? maximized : false, sandboxMode: sandboxMode, showBackDrop: showBackDrop, areTotalRowsNotFillingHeight: !!showSeparator }, other, { children: [showSeparator && _jsx(EngravingLine, {}), totalCount || totalCount === 0 ? (_jsxs(Label, Object.assign({ sx: { gap: '6px', cursor: 'text' } }, { children: [_jsx(Title, { children: t('count') }), _jsx(ValueWrapper, { children: formatNumber(totalCount || 0) })] }))) : null] })));
 }
 export default React.memo(TableFooter);