@tap-payments/os-micro-frontend-shared 0.1.11-test.2-test.3 → 0.1.11-test.2-test.3-test.4-test.5

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

@@ -18,13 +18,13 @@ import { useDelayToSetValue } from '../../../hooks/index.js';
 import { isHeightNotFullyFilledByRows, isNotFoundError, isTimeoutError, hasError } from '../../../utils/index.js';
 import TableFooter from '../components/TableFooter/TableFooter';
 import TableNoData from '../components/TableNoData';
-import { SheetViewTableNoData } from './components';
 import ListItemWrapper from '../components/virtualScroll/ListItemWrapper';
-import { StyledBox, StyledTableBox, StyledVirtualList, TableContainer, TableWrapper } from '../components/style';
+import { SheetViewTableContainer, StyledBox, StyledTableBox, StyledVirtualList, TableWrapper } from '../components/style';
 import { SheetViewVirtualTableWrapper, PinnedStartColumnWrapper, PinnedEndColumnWrapper, MainTableWrapper, UnpinnedTableHeaderWrapper } from './style';
 import SheetViewTableHeader from './components/SheetViewTableHeader';
 import { usePinnedColumns } from './hooks/usePinnedColumns';
 import { useSynchronizedScroll } from './hooks/useSynchronizedScroll';
+import SheetViewTableLoading from './components/SheetViewTableLoading';
 const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToIndex, lastItemIndex, totalCount, isError, areAllRowsLoaded, isPinned, selectedCell, selectedColumn, onCellClick, containerHeight, rowHeight) => ({
     columns,
     isLoading,
@@ -170,23 +170,16 @@ function SheetViewVirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, sho
                             width: '100%',
                             minWidth: 'fit-content',
                             overflowX: 'hidden',
-                        } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_PinnedStyledBox", hidePadding: true, className: "list-wrapper" }, { children: createVirtualTableContainer(columnsData, containerKey, true, columnsWidth) })) }))] })) }));
+                        } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_PinnedStyledBox", hidePadding: true, className: "list-wrapper" }, { children: tableLoading ? (_jsx(SheetViewTableLoading, { "data-testid": `SheetViewVirtualTable_PinnedTableLoading_${position}`, columns: columnsData, isLoading: true, isPinned: true })) : (createVirtualTableContainer(columnsData, containerKey, true, columnsWidth)) })) }))] })) }));
     };
-    return (_jsxs(_Fragment, { children: [_jsx(TableContainer, { children: showNoDataView ? (tableLoading ? (_jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_StyledTableBox_Loading", "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, scrollable: true, sx: {
-                        marginLeft: '28px',
-                        maxHeight: 'calc(100vh - 300px)',
-                        overflow: 'auto',
-                    } }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "SheetViewVirtualTable_LoadingTableWrapper", showNoDataView: showNoDataView, sx: Object.assign(Object.assign({}, tableBodyStyles), { display: 'flex', flexDirection: 'column', height: 'auto' }) }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_LoadingTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: orderedColumns, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [], onColumnPin: handleColumnPin, isPinnable: false, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick }) })), _jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_LoadingTableWrapper", sx: {
-                                    width: '100%',
-                                    minWidth: 'fit-content',
-                                    height: 'auto',
-                                    display: 'flex',
-                                    flexDirection: 'column',
-                                } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_LoadingStyledBox", hidePadding: true, className: "list-wrapper", sx: {
-                                        height: 'auto',
-                                        display: 'flex',
-                                        flexDirection: 'column',
-                                    } }, { children: _jsx(SheetViewTableNoData, { error: error, tableEmpty: tableEmpty, isTimeoutError: hasTimeoutError, tableError: tableError, tableLoading: tableLoading, orderedColumns: orderedColumns, triggerDataRefetch: triggerDataRefetch, footerProps: footerProps }) })) }))] })) }))) : (_jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_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": "SheetViewVirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: tableBodyStyles }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_LoadingTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: orderedColumns, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [], onColumnPin: handleColumnPin, isPinnable: false, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick }) })), _jsx(TableNoData, { error: error, tableEmpty: tableEmpty, isTimeoutError: hasTimeoutError, tableError: tableError, tableLoading: tableLoading, orderedColumns: orderedColumns, triggerDataRefetch: triggerDataRefetch, footerProps: footerProps })] })) })))) : (_jsxs(SheetViewVirtualTableWrapper, { children: [renderPinnedColumn('start', pinnedStartColumnsData, pinnedStartColumnsWidth, pinnedStartColumns), _jsx(MainTableWrapper, Object.assign({ hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }, { children: _jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_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, scrollable: true }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "SheetViewVirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: Object.assign(Object.assign({}, tableBodyStyles), { display: 'flex', flexDirection: 'column', height: '100%' }) }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_UnpinnedTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: unpinnedColumnsData, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [...pinnedStartColumns, ...pinnedEndColumns], onColumnPin: handleColumnPin, isPinnable: isPinnable, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick, tablePosition: "scrollable", hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }) })), _jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", sx: {
+    return (_jsxs(_Fragment, { children: [_jsx(SheetViewTableContainer, { children: showNoDataView ? (tableLoading ? (_jsxs(SheetViewVirtualTableWrapper, { children: [renderPinnedColumn('start', pinnedStartColumnsData, pinnedStartColumnsWidth, pinnedStartColumns), _jsx(MainTableWrapper, Object.assign({ hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }, { children: _jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_StyledTableBox_Loading", "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, scrollable: true }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "SheetViewVirtualTable_LoadingTableWrapper", showNoDataView: showNoDataView, sx: Object.assign(Object.assign({}, tableBodyStyles), { display: 'flex', flexDirection: 'column', height: '100%' }) }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_LoadingTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: unpinnedColumnsData, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [...pinnedStartColumns, ...pinnedEndColumns], onColumnPin: handleColumnPin, isPinnable: isPinnable, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick, tablePosition: "scrollable", hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }) })), _jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_LoadingTableWrapper", sx: {
+                                                width: '100%',
+                                                minWidth: 'fit-content',
+                                            } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_LoadingStyledBox", hidePadding: true, className: "list-wrapper", sx: {
+                                                    height: '100%',
+                                                    display: 'flex',
+                                                    flexDirection: 'column',
+                                                } }, { children: _jsx(SheetViewTableLoading, { "data-testid": "SheetViewVirtualTable_TableLoading", columns: unpinnedColumnsData, isLoading: true, isPinned: false }) })) }))] })) })) })), renderPinnedColumn('end', pinnedEndColumnsData, pinnedEndColumnsWidth, [...pinnedStartColumns, ...pinnedEndColumns])] })) : (_jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_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": "SheetViewVirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: tableBodyStyles }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_LoadingTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: orderedColumns, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [], onColumnPin: handleColumnPin, isPinnable: false, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick }) })), _jsx(TableNoData, { error: error, tableEmpty: tableEmpty, isTimeoutError: hasTimeoutError, tableError: tableError, tableLoading: tableLoading, orderedColumns: orderedColumns, triggerDataRefetch: triggerDataRefetch, footerProps: footerProps })] })) })))) : (_jsxs(SheetViewVirtualTableWrapper, { children: [renderPinnedColumn('start', pinnedStartColumnsData, pinnedStartColumnsWidth, pinnedStartColumns), _jsx(MainTableWrapper, Object.assign({ hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }, { children: _jsx(StyledTableBox, Object.assign({ as: "main", id: "sheet-table-box-container", "aria-labelledby": "sheet-table-box-container", "data-testid": "SheetViewVirtualTable_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, scrollable: true }, { children: _jsxs(TableWrapper, Object.assign({ "data-testid": "SheetViewVirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: Object.assign(Object.assign({}, tableBodyStyles), { display: 'flex', flexDirection: 'column', height: '100%' }) }, { children: [showHeader && (_jsx(UnpinnedTableHeaderWrapper, { children: _jsx(SheetViewTableHeader, { "data-testid": "SheetViewVirtualTable_UnpinnedTableHeader", columnsSorting: columnsSorting, onColumnSort: onColumnSort, columns: unpinnedColumnsData, headerProps: headerProps, showBackDrop: showBackDrop, pinnedColumns: [...pinnedStartColumns, ...pinnedEndColumns], onColumnPin: handleColumnPin, isPinnable: isPinnable, lastColumnId: lastColumnId, selectedColumn: selectedColumn, onColumnClick: handleColumnClick, tablePosition: "scrollable", hasPinnedStart: pinnedStartColumnsData.length > 0, hasPinnedEnd: pinnedEndColumnsData.length > 0 }) })), _jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", sx: {
                                                 width: '100%',
                                                 minWidth: 'fit-content',
                                             } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_ScrollableStyledBox", hidePadding: true, className: "list-wrapper" }, { children: createVirtualTableContainer(unpinnedColumnsData, 'scrollable', false) })) }))] })) })) })), renderPinnedColumn('end', pinnedEndColumnsData, pinnedEndColumnsWidth, [...pinnedStartColumns, ...pinnedEndColumns])] })) }), _jsx(TableFooter, Object.assign({ "data-testid": "SheetViewVirtualTable_TableFooter", showSeparator: true, showBackDrop: showBackDrop, onPointerDown: onPointerDown }, footerProps))] }));

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

@@ -17,6 +17,6 @@ interface SheetViewTableHeaderProps {
     hasPinnedStart?: boolean;
     hasPinnedEnd?: boolean;
 }
-declare function SheetViewTableHeader({ columns, headerProps, showBackDrop, onColumnSort, columnsSorting, pinnedColumns, onColumnPin, isPinnable, lastColumnId, selectedColumn, onColumnClick, tablePosition, hasPinnedStart, hasPinnedEnd, }: SheetViewTableHeaderProps): import("react/jsx-runtime").JSX.Element;
+declare function SheetViewTableHeader({ columns, headerProps, showBackDrop, onColumnSort, columnsSorting, pinnedColumns, onColumnPin, isPinnable, lastColumnId, selectedColumn, onColumnClick, }: SheetViewTableHeaderProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof SheetViewTableHeader>;
 export default _default;

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

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { memo } from 'react';
 import { StyledHeader, StyledMUITableRow } from '../../style';
 import TableCell from './TableCell';
-function SheetViewTableHeader({ columns, headerProps, showBackDrop, onColumnSort, columnsSorting, pinnedColumns = [], onColumnPin, isPinnable = false, lastColumnId, selectedColumn = null, onColumnClick, tablePosition = 'scrollable', hasPinnedStart = false, hasPinnedEnd = false, }) {
+function SheetViewTableHeader({ columns, headerProps, showBackDrop, onColumnSort, columnsSorting, pinnedColumns = [], onColumnPin, isPinnable = false, lastColumnId, selectedColumn = null, onColumnClick, }) {
     return (_jsx(StyledHeader, Object.assign({ component: "nav", "data-testid": "SheetViewVirtualTable_TableHeader_StyledHeader", showBackDrop: showBackDrop }, headerProps, { children: _jsx(StyledMUITableRow, Object.assign({ component: "section", "data-testid": "SheetViewVirtualTable_TableHeader_StyledMUITableRow" }, { children: columns.map((column, colIndex) => {
                 return (_jsx(TableCell, { column: column, isFirst: column.id === columns[0].id, isLast: column.id === columns[columns.length - 1].id, isDefaultPinned: !!column.isDefaultPinned, isSelected: selectedColumn === column.id, onColumnSort: onColumnSort, columnsSorting: columnsSorting, pinnedColumns: pinnedColumns, onColumnPin: onColumnPin, isPinnable: isPinnable, lastColumnId: lastColumnId, onColumnClick: onColumnClick }, `${column.id}-${colIndex}`));
             }) })) })));

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

@@ -6,7 +6,8 @@ interface ISheetViewTableLoadingProps {
     animationType?: AnimationType;
     isLoading?: boolean;
     rowsCount?: number;
+    isPinned?: boolean;
 }
-declare function SheetViewTableLoading({ columns, isLoaded, animationType, isLoading, rowsCount }: ISheetViewTableLoadingProps): import("react/jsx-runtime").JSX.Element;
+declare function SheetViewTableLoading({ columns, isLoaded, animationType, isLoading, rowsCount, isPinned, }: ISheetViewTableLoadingProps): import("react/jsx-runtime").JSX.Element;
 declare const _default: import("react").MemoExoticComponent<typeof SheetViewTableLoading>;
 export default _default;

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

@@ -4,17 +4,17 @@ import { styled } from '@mui/material/styles';
 import uniqueId from 'lodash/uniqueId';
 import { calculateMaxAllowedRows } from '../../../../utils/index.js';
 import SheetViewTableRowLoading from './SheetViewTableRowLoading';
-const Wrapper = styled('section')(({ isLoaded = false }) => ({
+const Wrapper = styled('section')(({ isLoaded = false, isPinned = false }) => ({
     overflow: 'hidden',
-    paddingInline: isLoaded ? '32px' : '0px',
-    backgroundColor: isLoaded ? 'rgba(255, 255, 255, 0.60)' : 'none',
-    filter: isLoaded ? 'blur(8px)' : 'none',
-    marginTop: isLoaded ? '1rem' : '0',
-    height: 'auto',
+    paddingInline: isLoaded && !isPinned ? '32px' : '0px',
+    backgroundColor: isLoaded && !isPinned ? 'rgba(255, 255, 255, 0.60)' : 'none',
+    filter: isLoaded && !isPinned ? 'blur(8px)' : 'none',
+    marginTop: isLoaded && !isPinned ? '1rem' : '0',
+    height: '100%',
 }));
-function SheetViewTableLoading({ columns, isLoaded = false, animationType, isLoading = false, rowsCount }) {
+function SheetViewTableLoading({ columns, isLoaded = false, animationType, isLoading = false, rowsCount, isPinned = false, }) {
     let maxAllowedRows = rowsCount || calculateMaxAllowedRows(isLoaded, isLoading);
     maxAllowedRows = rowsCount || Math.max(maxAllowedRows, 25);
-    return (_jsx(Wrapper, Object.assign({ isLoaded: isLoaded, "data-testid": "SheetViewTableLoading" }, { children: [...Array(maxAllowedRows)].map((_, index) => (_jsx(SheetViewTableRowLoading, { columns: columns, animationType: animationType, rowIndex: index }, `i-${uniqueId('SheetViewTableLoadingRow_')}`))) })));
+    return (_jsx(Wrapper, Object.assign({ isLoaded: isLoaded, isPinned: isPinned, "data-testid": "SheetViewTableLoading" }, { children: [...Array(maxAllowedRows)].map((_, index) => (_jsx(SheetViewTableRowLoading, { columns: columns, animationType: animationType, rowIndex: index, useTableBackground: !isPinned }, `i-${uniqueId('SheetViewTableLoadingRow_')}`))) })));
 }
 export default memo(SheetViewTableLoading);

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

@@ -8,7 +8,7 @@ import { StyledSolidBackground } from '../../components/style';
 function SheetViewTableNoData({ error, tableEmpty, isTimeoutError, tableError, tableLoading, orderedColumns, triggerDataRefetch, footerProps, }) {
     let content;
     if (tableLoading) {
-        content = (_jsx(StyledSolidBackground, Object.assign({ "data-testid": "SheetViewVirtualTable_SolidBackground" }, { children: _jsx(SheetViewTableLoading, { "data-testid": "SheetViewVirtualTable_TableLoading", columns: orderedColumns, isLoading: true }) })));
+        content = (_jsx(StyledSolidBackground, Object.assign({ "data-testid": "SheetViewVirtualTable_SolidBackground" }, { children: _jsx(SheetViewTableLoading, { "data-testid": "SheetViewVirtualTable_TableLoading", columns: orderedColumns, isLoading: true, isPinned: false }) })));
     }
     else if (isTimeoutError) {
         content = (_jsx(ErrorList, { "data-testid": "SheetViewVirtualTable_ErrorList_timeoutError", shouldMinimizeWidth: true, heading: "timeOut", message: "yourRequestOutPleaseTryAgain", triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));

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

@@ -106,4 +106,5 @@ export const MainTableWrapper = styled('div', {
 export const UnpinnedTableHeaderWrapper = styled('div')({
     flexShrink: 0,
     height: 'auto',
+    overflow: 'scroll',
 });

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

@@ -319,6 +319,9 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
 export declare const TableContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").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").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const SheetViewTableContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").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").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const StyledCardsBox: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").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").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {

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

@@ -133,9 +133,16 @@ export const TableContainer = styled(Box)(() => ({
     display: 'flex',
     flexDirection: 'column',
     height: '100%',
+}));
+export const SheetViewTableContainer = styled(Box)(() => ({
+    position: 'relative',
+    display: 'flex',
+    flexDirection: 'column',
+    height: '100%',
     paddingInline: '28px',
     borderRadius: '8px',
     marginBottom: '11px !important',
+    overflowY: 'hidden',
 }));
 export const StyledCardsBox = styled(Box, {
     shouldForwardProp: (prop) => prop !== 'showNoDataView',

package/build/components/VirtualTables/components/virtualScroll/ListItemWrapper.js

@@ -24,7 +24,7 @@ export const LastRowContent = React.memo(({ isLoadingRow, isSheetView, columns,
     const { t } = useTranslation();
     if (isLoadingRow) {
         if (isSheetView && (columns === null || columns === void 0 ? void 0 : columns.length)) {
-            return (_jsx(_Fragment, { children: Array.from({ length: 3 }, (_, i) => (_jsx(SheetViewTableRowLoading, { columns: columns, animationType: "wave", rowIndex: (currentRowCount || 0) + i + 1, useTableBackground: true }, `loading-row-${i}`))) }));
+            return (_jsx(_Fragment, { children: Array.from({ length: 3 }, (_, i) => (_jsx(SheetViewTableRowLoading, { columns: columns, animationType: "wave", rowIndex: (currentRowCount || 0) + i, useTableBackground: true }, `loading-row-${i}`))) }));
         }
         return (_jsxs(Box, Object.assign({ "data-testid": "ListItemWrapper_lastRowContent_isLoadingRow", sx: {
                 height: isSheetView ? '100%' : '24px',

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.11-test.2-test.3",
-  "testVersion": 3,
+  "version": "0.1.11-test.2-test.3-test.4-test.5",
+  "testVersion": 5,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",