@tap-payments/os-micro-frontend-shared 0.1.440 → 0.1.441

package/build/components/VirtualTables/components/TableHeader/constant.js

@@ -1,6 +0,0 @@
-import { disputeIcon, flagIcon, refundInitiatedIcon } from '../../../../constants/index.js';
-export const actionsIcons = {
-    flag: flagIcon,
-    dispute: disputeIcon,
-    refund: refundInitiatedIcon,
-};

package/build/components/VirtualTables/components/TableHeader/index.js

@@ -1,3 +0,0 @@
-import TableHeader from './TableHeader';
-export * from './type';
-export default TableHeader;

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

@@ -1,23 +0,0 @@
-import { styled } from '@mui/material/styles';
-import TableHead from '@mui/material/TableHead';
-import MUITableRow from '@mui/material/TableRow';
-export const StyledHeader = styled(TableHead, {
-    shouldForwardProp: (prop) => prop !== 'showBackDrop',
-})(({ showBackDrop, theme }) => ({
-    flex: '0 0 auto',
-    boxShadow: showBackDrop ? theme.shadows[23] : 'none',
-    backgroundColor: theme.palette.background.default,
-    zIndex: 1,
-    width: '100%',
-    minWidth: 'auto',
-    overflowX: 'scroll',
-}));
-export const StyledMUITableRow = styled(MUITableRow, {
-    shouldForwardProp: (prop) => prop !== 'isSheetView',
-})(({ theme, isSheetView }) => (Object.assign({ display: 'flex', justifyContent: 'flex-start', width: '100%', minWidth: 'fit-content', paddingInline: '32px', paddingBlock: '16px' }, (isSheetView && {
-    height: '28px',
-    borderBottom: `1px solid ${theme.palette.divider}`,
-    backgroundColor: theme.palette.primary.light,
-    paddingInline: 0,
-    paddingBlock: 0,
-}))));

package/build/components/VirtualTables/components/TableHeader/type.js

@@ -1 +0,0 @@
-export {};

package/build/components/VirtualTables/components/TableLastItem.js

@@ -1,39 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import Box from '@mui/material/Box';
-import { alpha, styled } from '@mui/material/styles';
-import { useTranslation } from 'react-i18next';
-const Container = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'sandboxMode' && prop !== 'height',
-})(({ theme, sandboxMode, height }) => ({
-    display: 'flex',
-    flexDirection: 'column',
-    justifyContent: 'center',
-    alignItems: 'center',
-    height: `calc(100% - ${height}px)`,
-    background: sandboxMode ? theme.palette.common.lightOrange : theme.palette.grey[300],
-    backdropFilter: 'blur(32px)',
-    margin: 0,
-    minHeight: '55px',
-}));
-export const StyledParagraph = styled('p')(({ theme }) => ({
-    fontSize: '0.75rem',
-    fontWeight: 600,
-    color: alpha(theme.palette.common.black, 0.2),
-}));
-function TableLastItem(_a) {
-    var { height, sandboxMode } = _a, props = __rest(_a, ["height", "sandboxMode"]);
-    const { t } = useTranslation();
-    return (_jsx(Container, Object.assign({ component: "section", "data-testid": "TableLastItem" }, props, { height: height, sandboxMode: sandboxMode }, { children: _jsx(StyledParagraph, { children: t('allRecordsHaveBeenSuccessfullyLoaded') }) })));
-}
-export default TableLastItem;

package/build/components/VirtualTables/components/TableLoading.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import { styled } from '@mui/material/styles';
-import uniqueId from 'lodash/uniqueId';
-import { calculateMaxAllowedRows } from '../../../utils/index.js';
-import TableRowLoading from './TableRowLoading';
-const Wrapper = styled('section')(({ isLoaded = false }) => ({
-    overflow: 'hidden',
-    paddingInline: '32px',
-    backgroundColor: isLoaded ? 'rgba(255, 255, 255, 0.60)' : 'none',
-    filter: isLoaded ? 'blur(8px)' : 'none',
-    marginTop: isLoaded ? '1rem' : '0.2rem',
-}));
-function TableLoading({ columns, isLoaded = false, animationType, isLoading = false, rowsCount }) {
-    let maxAllowedRows = rowsCount || calculateMaxAllowedRows(isLoaded, isLoading);
-    maxAllowedRows = maxAllowedRows > 0 ? maxAllowedRows : 5;
-    return (_jsx(Wrapper, Object.assign({ isLoaded: isLoaded, "data-testid": "TableLoading" }, { children: [...Array(maxAllowedRows)].map(() => (_jsx(TableRowLoading, { columns: columns, animationType: animationType }, `i-${uniqueId('TableLoadingRow_')}`))) })));
-}
-export default memo(TableLoading);

package/build/components/VirtualTables/components/TableLoadingWithCard.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import { styled } from '@mui/material/styles';
-import uniqueId from 'lodash/uniqueId';
-import { calculateMaxAllowedRows } from '../../../utils/index.js';
-import TableRowLoadingWithCard from './TableRowLoadingWithCard';
-const Wrapper = styled('section')(({ isLoaded = false }) => ({
-    overflow: 'hidden',
-    paddingInline: '32px',
-    backgroundColor: isLoaded ? 'rgba(255, 255, 255, 0.60)' : 'none',
-    filter: isLoaded ? 'blur(8px)' : 'none',
-    marginTop: isLoaded ? '1rem' : '0.2rem',
-}));
-function TableLoadingWithCard({ isLoaded = false, isLoading = false, rowsCount, cardLoadingComponent }) {
-    let maxAllowedRows = rowsCount || calculateMaxAllowedRows(isLoaded, isLoading);
-    maxAllowedRows = maxAllowedRows > 0 ? maxAllowedRows : 5;
-    return (_jsx(Wrapper, Object.assign({ isLoaded: isLoaded, "data-testid": "TableLoadingWithCard" }, { children: [...Array(maxAllowedRows)].map(() => (_jsx(TableRowLoadingWithCard, { cardLoadingComponent: cardLoadingComponent }, `i-${uniqueId('TableLoadingRow_')}`))) })));
-}
-export default memo(TableLoadingWithCard);

package/build/components/VirtualTables/components/TableNoData.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import TableLoading from './TableLoading';
-import { StyledSolidBackground } from './style';
-import TableError from './TableError';
-function TableNoData({ error, tableEmpty, isTimeoutError, tableError, tableLoading, orderedColumns, triggerDataRefetch, footerProps, }) {
-    if (tableLoading) {
-        return (_jsx(StyledSolidBackground, Object.assign({ "data-testid": "VirtualTable_SolidBackground" }, { children: _jsx(TableLoading, { "data-testid": "VirtualTable_TableLoading", columns: orderedColumns, isLoading: true }) })));
-    }
-    return (_jsx(TableError, { isTimeoutError: isTimeoutError, tableEmpty: tableEmpty, tableError: tableError, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode, error: error, triggerDataRefetch: triggerDataRefetch }));
-}
-TableNoData.displayName = 'TableNoData';
-export default memo(TableNoData);

package/build/components/VirtualTables/components/TableNoDataWithCard.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import { backendErrorHandler } from '../../../utils/index.js';
-import ErrorList from './ErrorList/ErrorList';
-import TableLoadingWithCard from './TableLoadingWithCard';
-import { StyledSolidBackground } from './style';
-function TableNoDataWithCard({ error, tableEmpty, isTimeoutError, tableError, tableLoading, triggerDataRefetch, footerProps, cardLoadingComponent, noDataComponent: NoDataComponent, }) {
-    let content;
-    if (tableLoading) {
-        content = (_jsx(StyledSolidBackground, Object.assign({ "data-testid": "VirtualTable_SolidBackground" }, { children: _jsx(TableLoadingWithCard, { "data-testid": "VirtualTable_TableLoading", isLoading: true, cardLoadingComponent: cardLoadingComponent }) })));
-    }
-    else if (isTimeoutError) {
-        content = (_jsx(ErrorList, { "data-testid": "VirtualTable_ErrorList_timeoutError", shouldMinimizeWidth: true, heading: "timeOut", message: "yourRequestOutPleaseTryAgain", triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));
-    }
-    else if (tableError) {
-        const axiosErr = error;
-        const { formatted } = backendErrorHandler({ error: axiosErr, fallbackMessage: 'connectionErrorMsg' });
-        content = (_jsx(ErrorList, { "data-testid": "VirtualTable_ErrorList_tableError", heading: "somethingWentWrong", message: formatted, triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));
-    }
-    else if (tableEmpty) {
-        content = NoDataComponent;
-    }
-    else {
-        content = (_jsx(ErrorList, { "data-testid": "VirtualTable_ErrorList_tableError", heading: "somethingWentWrong", message: "connectionErrorMsg", triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));
-    }
-    return content;
-}
-TableNoDataWithCard.displayName = 'TableNoDataWithCard';
-export default memo(TableNoDataWithCard);

package/build/components/VirtualTables/components/TableRow.js

@@ -1,93 +0,0 @@
-import { createElement as _createElement } from "react";
-import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import React, { memo, useMemo } from 'react';
-import { Box } from '@mui/material';
-import { areEqual } from 'react-window';
-import { StyledCell, StyledTableRow } from './style';
-import { getSelectionStyles, getRowSelectionBorderStyles } from '../../../utils/index.js';
-function TableRow({ row, columns, index, rowProps, isSheetView, selectedCell = null, selectedColumn = null, selectedRow = null, selectedChip = null, onCellClick, isLastRow = false, onChipClick, }) {
-    // Memoize chip click handler to prevent recreation on every render
-    const handleChipClick = React.useCallback((colIndex, pinned) => (event, chipIndex) => {
-        onChipClick === null || onChipClick === void 0 ? void 0 : onChipClick(index, colIndex, event, chipIndex, pinned);
-    }, [onChipClick, index]);
-    // Memoize cell renderer to prevent recreation
-    const renderCell = React.useCallback((column, rowIndex, colIndex) => {
-        const { render, format, selector } = column;
-        if (!(column === null || column === void 0 ? void 0 : column.id) || !row)
-            return null;
-        const value = selector ? selector({ row, index, value: row[column === null || column === void 0 ? void 0 : column.id] }) : row[column === null || column === void 0 ? void 0 : column.id];
-        const formattedValue = format ? format({ value, row, index }) : value;
-        return render ? (render({
-            row,
-            column,
-            index,
-            value: row[column === null || column === void 0 ? void 0 : column.id],
-            selectionProps: { onClick: handleChipClick(colIndex, column.pinned), rowIndex, colIndex, selectedId: selectedChip },
-        })) : (_jsx(_Fragment, { children: formattedValue }));
-    }, [row, index, selectedChip, handleChipClick]);
-    // Pre-compute if any selection is active
-    const hasActiveSelection = selectedCell !== null || selectedColumn !== null || selectedRow !== null;
-    // Memoize cell click handler
-    const handleCellClick = React.useCallback((colIndex, pinned) => (event) => {
-        onCellClick === null || onCellClick === void 0 ? void 0 : onCellClick(index, colIndex, event, pinned);
-    }, [onCellClick, index]);
-    const content = useMemo(() => {
-        var _a, _b;
-        const firstColumnId = (_a = columns[0]) === null || _a === void 0 ? void 0 : _a.id;
-        const lastColumnId = (_b = columns[columns.length - 1]) === null || _b === void 0 ? void 0 : _b.id;
-        const isRowSelected = selectedRow === index;
-        return (_jsx(_Fragment, { children: columns.map((column, colIndex) => {
-                var _a, _b;
-                // Early exit for invalid columns
-                if (!(column === null || column === void 0 ? void 0 : column.id))
-                    return null;
-                // Cache cell identifiers
-                const cellKey = `${(_a = column.pinned) !== null && _a !== void 0 ? _a : 'default'}-${index}-${colIndex}`;
-                const columnKey = `${(_b = column.pinned) !== null && _b !== void 0 ? _b : 'default'}-${colIndex}`;
-                // Calculate selection states only if there's an active selection
-                const isCellSelected = hasActiveSelection && selectedCell === cellKey;
-                const isColumnSelected = hasActiveSelection && selectedColumn === columnKey;
-                const isSelected = hasActiveSelection && (isCellSelected || isColumnSelected || isRowSelected);
-                // getSelectionStyles already handles the empty return if !isSelected
-                const selectionStyles = getSelectionStyles({
-                    isSelected,
-                    isCellSelected,
-                    isColumnSelected,
-                    isRowSelected,
-                    isLastRow,
-                });
-                // Determine if this cell should be treated as first/last for border radius
-                const isFirstColumn = column.id === firstColumnId;
-                const isLastColumn = column.id === lastColumnId;
-                // For scrollable table, adjust first/last based on pinned tables
-                const effectiveFirst = !column.pinned ? isFirstColumn && column.pinned !== 'start' : isFirstColumn;
-                const effectiveLast = !column.pinned ? isLastColumn && column.pinned !== 'end' : isLastColumn;
-                // Handle border styling for row selection only when needed
-                const rowSelectionBorderStyles = isRowSelected && hasActiveSelection
-                    ? getRowSelectionBorderStyles({
-                        effectiveFirst,
-                        isPinnedStart: column.pinned === 'start',
-                        isPinnedEnd: column.pinned === 'end',
-                    })
-                    : {};
-                const isIndexColumn = column.pinned === 'start' && effectiveFirst;
-                return (_jsx(StyledCell, Object.assign({ component: "div", "data-testid": "TableRow_TableCell", "data-column-id": column.id, "data-column-width": column.width, "data-column-width-used": column.width, "data-column-align": column.align, "data-column-order": column.order, "data-column-header": typeof column.header === 'string' ? column.header : 'component', "data-column-sortable": !!column.sortable, "data-column-filterable": !!column.filter, isFirst: effectiveFirst, isLast: effectiveLast, onClick: handleCellClick(colIndex, column.pinned), sx: Object.assign(Object.assign(Object.assign({ width: column.width, minWidth: column.width, textAlign: column.align, justifyContent: isIndexColumn ? 'center' : column.align === 'right' ? 'flex-end' : 'flex-start', cursor: onCellClick ? 'pointer' : 'default' }, selectionStyles), rowSelectionBorderStyles), column.cellStyle), isSheetView: isSheetView, isSelected: isCellSelected }, { children: isSheetView ? (_jsx(Box, Object.assign({ sx: { position: 'relative', zIndex: 1, width: '100%' } }, { children: renderCell(column, index, colIndex) }))) : (_jsx(_Fragment, { children: renderCell(column, index, colIndex) })) }), `${column.id}-${colIndex}`));
-            }) }));
-    }, [
-        columns,
-        row,
-        index,
-        selectedCell,
-        selectedColumn,
-        selectedRow,
-        hasActiveSelection,
-        onCellClick,
-        isLastRow,
-        selectedChip,
-        isSheetView,
-        renderCell,
-        handleCellClick,
-    ]);
-    return (_createElement(StyledTableRow, Object.assign({ "data-testid": "TableRow", onClick: rowProps === null || rowProps === void 0 ? void 0 : rowProps.onRowClick, showShadowHighlight: rowProps === null || rowProps === void 0 ? void 0 : rowProps.showShadowHighlight, showLoadedStyle: rowProps === null || rowProps === void 0 ? void 0 : rowProps.showLoadedStyle, component: "article" }, rowProps, { key: index, isSheetView: isSheetView }), content));
-}
-export default memo(TableRow, areEqual);

package/build/components/VirtualTables/components/TableRowLoading.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import Skeleton from '@mui/material/Skeleton';
-import { styled } from '@mui/material/styles';
-import TableCell from '@mui/material/TableCell';
-import MUITableRow from '@mui/material/TableRow';
-import { areEqual } from 'react-window';
-const StyledSkeleton = styled(Skeleton)(({ theme }) => ({
-    backgroundColor: theme.palette.grey[100],
-    borderRadius: '64px',
-    minWidth: '20px',
-}));
-function TableRowLoading({ columns, style, index, animationType }) {
-    return (_jsx(MUITableRow, Object.assign({ sx: Object.assign(Object.assign({}, style), { display: 'flex', borderBottom: '1px solid #e3e8ee', '&:hover': {
-                backgroundColor: 'transparent !important',
-            } }), component: "div", hover: true }, { children: columns.map((column, colIndex) => (_jsx(TableCell, Object.assign({ sx: {
-                width: column.width || `${100 / columns.length}%` || '20%',
-                paddingInline: '0.6875rem',
-            }, component: "div" }, { children: _jsx(StyledSkeleton, { variant: "rectangular", animation: animationType }) }), `${column.id}-${colIndex}`))) }), index));
-}
-export default memo(TableRowLoading, areEqual);

package/build/components/VirtualTables/components/TableRowLoadingWithCard.js

@@ -1,14 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { memo } from 'react';
-import TableCell from '@mui/material/TableCell';
-import MUITableRow from '@mui/material/TableRow';
-import { areEqual } from 'react-window';
-function TableRowLoadingWithCard({ style, index, cardLoadingComponent: CardLoadingComponent }) {
-    return (_jsx(MUITableRow, Object.assign({ sx: Object.assign(Object.assign({}, style), { display: 'flex', padding: 0, '&:hover': {
-                backgroundColor: 'transparent !important',
-            } }), component: "div" }, { children: _jsx(TableCell, Object.assign({ sx: {
-                padding: 0,
-                flex: 1,
-            }, component: "div" }, { children: CardLoadingComponent })) }), index));
-}
-export default memo(TableRowLoadingWithCard, areEqual);

package/build/components/VirtualTables/components/TableRowWithCard.js

@@ -1,9 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createElement as _createElement } from "react";
-import { memo } from 'react';
-import { areEqual } from 'react-window';
-import { StyledTableRow } from './style';
-function TableRowWithCard({ row, index, rowProps, renderCardComponent: RenderCardComponent }) {
-    return (_createElement(StyledTableRow, Object.assign({ "data-testid": "TableRow", onClick: rowProps === null || rowProps === void 0 ? void 0 : rowProps.onRowClick, showShadowHighlight: rowProps === null || rowProps === void 0 ? void 0 : rowProps.showShadowHighlight, showLoadedStyle: rowProps === null || rowProps === void 0 ? void 0 : rowProps.showLoadedStyle, component: "article" }, rowProps, { key: index }), RenderCardComponent && _jsx(RenderCardComponent, Object.assign({}, row))));
-}
-export default memo(TableRowWithCard, areEqual);

package/build/components/VirtualTables/components/index.js

@@ -1,18 +0,0 @@
-export { default as ColumnFilter, Inputs, List } from './ColumnFilter';
-export * from './EmptyList';
-export * from './ErrorList';
-export * from './TableFooter';
-export { default as TableFooter } from './TableFooter';
-export { default as TableError } from './TableError';
-export * from './virtualScroll';
-export * from './RowErrorState';
-export { default as TableHeader } from './TableHeader';
-export { default as TableLastItem } from './TableLastItem';
-export { default as TableLoading } from './TableLoading';
-export { default as TableLoadingWithCard } from './TableLoadingWithCard';
-export { default as TableNoData } from './TableNoData';
-export { default as TableNoDataWithCard } from './TableNoDataWithCard';
-export { default as TableRow } from './TableRow';
-export { default as TableRowLoading } from './TableRowLoading';
-export { default as TableRowLoadingWithCard } from './TableRowLoadingWithCard';
-export { default as TableRowWithCard } from './TableRowWithCard';

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

@@ -1,180 +0,0 @@
-import { TableCell } from '@mui/material';
-import Box from '@mui/material/Box';
-import { styled } from '@mui/material/styles';
-import MUITableRow from '@mui/material/TableRow';
-import { motion } from 'framer-motion';
-import { TABLE_FOOTER_HEIGHT } from './TableFooter/style';
-import VirtualScrollList from './virtualScroll/VirtualScrollList';
-export const TableWrapper = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'showNoDataView',
-})(({ showNoDataView }) => ({
-    display: 'flex',
-    flexDirection: 'column',
-    height: '100%',
-    width: '100%',
-    minWidth: showNoDataView ? 'unset' : 'fit-content',
-    overflow: 'hidden',
-    overflowX: showNoDataView ? 'hidden' : 'scroll',
-    margin: '0px',
-}));
-export const StyledBox = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'hidePadding',
-})(({ theme, hidePadding }) => ({
-    flex: '1 1 auto',
-    backgroundColor: theme.palette.grey[300],
-    paddingBottom: hidePadding ? 0 : TABLE_FOOTER_HEIGHT,
-}));
-export const StyledSolidBackground = styled(Box)(({ theme }) => ({
-    backgroundColor: theme.palette.background.default,
-}));
-export const StyledCell = styled(TableCell, {
-    shouldForwardProp: (prop) => !['isLast', 'isFirst', 'isSheetView', 'isSelected'].includes(prop),
-})(({ theme, isLast, isFirst, isSheetView }) => {
-    return Object.assign({ paddingBlock: '0', paddingInline: '0.3875rem !important', paddingLeft: isFirst ? '0 !important' : '0.3875rem !important', paddingRight: isLast ? '0 !important' : '0.3875rem !important', color: isSheetView ? theme.palette.text.primary : theme.palette.grey[700], fontSize: isSheetView ? theme.typography.subtitle1.fontSize : theme.typography.caption.fontSize, height: '100%', fontWeight: isSheetView ? 400 : theme.typography.fontWeightRegular, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis', display: 'flex', alignItems: 'center', cursor: 'pointer' }, (isSheetView && {
-        borderRight: isLast ? '1px solid transparent' : `1px solid ${theme.palette.divider}`,
-        paddingInline: '8px !important',
-        paddingLeft: '8px !important',
-        paddingRight: '8px !important',
-        position: 'relative',
-        borderTop: '1px solid transparent',
-        borderLeft: '1px solid transparent',
-        overflow: 'hidden !important',
-        '&:before': {
-            content: '""',
-            borderRight: isLast ? 'none' : '1px solid transparent',
-            position: 'absolute',
-            top: 0,
-            right: 0,
-            left: 0,
-            bottom: 0,
-            pointerEvents: 'none',
-        },
-    }));
-});
-export const TableHeaderInner = styled('button')(({ theme }) => ({
-    zIndex: 1,
-    display: 'flex',
-    gap: theme.spacing(0.5),
-    alignItems: 'center',
-    overflow: 'hidden',
-    maxWidth: '100%',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'nowrap',
-    backgroundColor: 'transparent',
-    border: 'none',
-    cursor: 'pointer',
-    padding: 0,
-    margin: 0,
-    color: 'inherit',
-    fontSize: 'inherit',
-    fontWeight: 'inherit',
-    boxSizing: 'border-box',
-    ':disabled': {
-        cursor: 'not-allowed',
-    },
-}));
-export const StyledVirtualList = styled(VirtualScrollList, {
-    shouldForwardProp: (prop) => !['areTotalRowsNotFillingHeight', 'isSheetView'].includes(prop),
-})(({ theme, areTotalRowsNotFillingHeight, isSheetView }) => (Object.assign({ backgroundColor: areTotalRowsNotFillingHeight ? 'transparent' : theme.palette.background.default }, (isSheetView && {
-    backgroundColor: theme.palette.common.white,
-}))));
-export const StyledTableRow = styled(MUITableRow, {
-    shouldForwardProp: (props) => !['showShadowHighlight', 'showLoadedStyle', 'isSheetView', 'isSelected'].includes(props),
-})(({ theme, showShadowHighlight, showLoadedStyle, isSheetView }) => (Object.assign({ display: 'flex', borderBottom: `1px solid ${theme === null || theme === void 0 ? void 0 : theme.palette.divider}`, position: 'relative', height: '100%', width: '100%' }, (!isSheetView && Object.assign(Object.assign({ paddingInline: '32px', '&:hover': {
-        boxShadow: theme.shadows[12],
-        zIndex: 1,
-        '.payment-sources-container': {
-            backgroundColor: theme === null || theme === void 0 ? void 0 : theme.palette.common.white,
-        },
-        '.geography-box': {
-            visibility: 'visible',
-        },
-        '.payout-status': {
-            visibility: 'visible !important',
-        },
-        '&:hover:after': {
-            opacity: 1,
-        },
-    }, '&::after': {
-        content: "''",
-        opacity: 0,
-        minHeight: '100%',
-        background: theme.palette.info.dark,
-        width: '3px',
-        position: 'absolute',
-        left: 0,
-    } }, (showLoadedStyle && {
-    backgroundColor: `${theme.palette.info.dark}08 !important`,
-})), (showShadowHighlight && {
-    boxShadow: theme.shadows[12],
-    zIndex: 1,
-    '&::after': {
-        content: "''",
-        opacity: 1,
-        minHeight: '100%',
-        background: theme.palette.info.dark,
-        width: '3px',
-        position: 'absolute',
-        left: 0,
-    },
-}))))));
-export const StyledTableBox = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'showNoDataView' && prop !== 'scrollable',
-})(({ theme, showNoDataView, scrollable }) => ({
-    position: 'relative',
-    backgroundColor: theme.palette.background.default,
-    height: '100%',
-    overflowX: showNoDataView ? 'hidden' : 'scroll',
-    display: 'flex',
-    flexDirection: 'column',
-    '&:hover': {
-        scrollbarWidth: scrollable ? 'auto' : 'none',
-    },
-    '&::-webkit-scrollbar': {
-        display: 'block',
-        height: '13px',
-    },
-    '&::-webkit-scrollbar-track': {
-        background: 'white',
-        border: '1px solid #F2F2F2',
-    },
-    '&::-webkit-scrollbar-thumb': {
-        backgroundColor: '#DADCDF',
-        borderRadius: '32px',
-        border: '3px solid transparent',
-        backgroundClip: 'content-box',
-        minHeight: '20px',
-    },
-}));
-export const ActionIcon = styled(motion.img)(() => ({
-    width: '24px',
-    height: '24px',
-    position: 'relative',
-    zIndex: 2,
-}));
-export const TableContainer = styled(Box)(() => ({
-    position: 'relative',
-    display: 'flex',
-    flexDirection: 'column',
-    height: '100%',
-}));
-export const SheetViewTableContainer = styled(Box)(() => ({
-    position: 'relative',
-    display: 'flex',
-    flexDirection: 'column',
-    height: '100%',
-    paddingInline: '28px',
-    borderRadius: '8px',
-    marginBottom: '16px !important',
-    overflowY: 'hidden',
-}));
-export const StyledCardsBox = styled(Box, {
-    shouldForwardProp: (prop) => prop !== 'showNoDataView',
-})(({ showNoDataView }) => ({
-    position: 'relative',
-    height: '100%',
-    overflowX: showNoDataView ? 'hidden' : 'scroll',
-    paddingBottom: 0,
-    display: 'flex',
-    flexDirection: 'column',
-}));

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

@@ -1,112 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import React from 'react';
-import { Box } from '@mui/material';
-import { styled } from '@mui/material/styles';
-import { useTranslation } from 'react-i18next';
-import { blueCircleLoaderIcon, tableBackgroundLoader, TABLE_ROW_HEIGHT, SHEET_VIEW_TABLE_ROW_HEIGHT } from '../../../../constants/index.js';
-import { ActionIcon } from '../style';
-import { RowErrorState } from '../RowErrorState';
-import { StyledParagraph } from '../TableLastItem';
-import TableRow from '../TableRow';
-import SheetViewTableRowLoading from '../../SheetViewVirtualTable/components/SheetViewTableRowLoading';
-export const LastRowContent = React.memo(({ isLoadingRow, isSheetView, columns, currentRowCount, }) => {
-    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, useTableBackground: true }, `loading-row-${i}`))) }));
-        }
-        return (_jsxs(Box, Object.assign({ "data-testid": "ListItemWrapper_lastRowContent_isLoadingRow", sx: {
-                height: isSheetView ? '100%' : '24px',
-                width: '24px',
-                borderRadius: '50%',
-                background: 'transparent',
-                position: 'relative',
-                display: 'flex',
-                justifyContent: 'center',
-                alignItems: 'center',
-            } }, { children: [_jsx(ActionIcon, { sx: { position: 'absolute' }, src: tableBackgroundLoader }), _jsx(ActionIcon, { sx: { position: 'absolute', padding: '3px' }, src: blueCircleLoaderIcon, alt: "tableLoadingSpinnerIcon", className: "spinner-loader", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 } })] })));
-    }
-    return _jsx(StyledParagraph, Object.assign({ "data-testid": "ListItemWrapper_lastRowContent" }, { children: t('allRecordsHaveBeenSuccessfullyLoaded') }));
-});
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const createRowClickHandler = (row, onRowClick) => (e) => {
-    var _a;
-    (_a = e === null || e === void 0 ? void 0 : e.stopPropagation) === null || _a === void 0 ? void 0 : _a.call(e);
-    onRowClick === null || onRowClick === void 0 ? void 0 : onRowClick(row);
-};
-export const StyledItemWrapper = styled('div', {
-    shouldForwardProp: (props) => props !== 'showShadowHighlight' && props !== 'isSheetView',
-})(({ theme, isSheetView }) => ({
-    height: isSheetView ? SHEET_VIEW_TABLE_ROW_HEIGHT : '100%',
-    backgroundColor: theme.palette.background.default,
-}));
-function ListItemWrapper(_a) {
-    var _b;
-    var { index, style } = _a, _c = _a.data, { renderedScrollTopRef, rows, rowProps, columns, isLoading, scrollToIndex, newLoadedRowsEndIndex, isError, areAllRowsLoaded, isSheetView, isPinned = false, isLoadMoreLoading = false } = _c, restData = __rest(_c, ["renderedScrollTopRef", "rows", "rowProps", "columns", "isLoading", "scrollToIndex", "newLoadedRowsEndIndex", "isError", "areAllRowsLoaded", "isSheetView", "isPinned", "isLoadMoreLoading"]);
-    const lastItemIndex = rows.length - 1;
-    const row = rows[index];
-    const isLoadingRow = isLoading && index === lastItemIndex + 1;
-    const isLoadedRow = index <= newLoadedRowsEndIndex;
-    const rowClickHandler = React.useCallback(() => createRowClickHandler(row, rowProps === null || rowProps === void 0 ? void 0 : rowProps.onRowClick), [row, rowProps === null || rowProps === void 0 ? void 0 : rowProps.onRowClick]);
-    // Memoize the row props object
-    const memoizedRowProps = React.useMemo(() => (Object.assign(Object.assign({ showShadowHighlight: scrollToIndex === index, showLoadedStyle: isLoadedRow }, rowProps), { onClick: rowClickHandler })), [scrollToIndex, index, isLoadedRow, rowProps, rowClickHandler]);
-    const renderSheetViewLoadingRow = React.useCallback((lastRowContent) => {
-        return (_jsx(Box, Object.assign({ sx: {
-                minHeight: SHEET_VIEW_TABLE_ROW_HEIGHT,
-                height: '100%',
-                width: '100%',
-            } }, { children: isError ? _jsx(RowErrorState, {}) : lastRowContent })));
-    }, [isError]);
-    const memoizedListItemComponent = React.useMemo(() => {
-        const lastRowContent = _jsx(LastRowContent, { isSheetView: isSheetView, isLoadingRow: isLoadingRow, columns: columns, currentRowCount: rows.length });
-        const isLastRow = isLoadingRow || (areAllRowsLoaded && index === lastItemIndex + 1);
-        if (isPinned && isLastRow) {
-            if (isSheetView && isLoadingRow && columns && columns.length > 0) {
-                return renderSheetViewLoadingRow(lastRowContent);
-            }
-            return (_jsx(Box, { sx: Object.assign(Object.assign({}, (isSheetView ? { minHeight: SHEET_VIEW_TABLE_ROW_HEIGHT, height: '100%' } : { height: TABLE_ROW_HEIGHT })), { backgroundColor: '#F6F8FACC' }) }));
-        }
-        if (isLastRow) {
-            if (isSheetView && isLoadingRow && columns && columns.length > 0) {
-                return renderSheetViewLoadingRow(lastRowContent);
-            }
-            return (_jsx(Box, Object.assign({ sx: Object.assign(Object.assign({}, (isSheetView ? { minHeight: SHEET_VIEW_TABLE_ROW_HEIGHT, height: '100%' } : { height: TABLE_ROW_HEIGHT })), { display: 'flex', justifyContent: 'center', alignItems: 'center' }) }, { children: _jsx(Box, Object.assign({ sx: {
-                        backgroundColor: '#F6F8FACC',
-                        display: 'flex',
-                        justifyContent: 'center',
-                        alignItems: 'center',
-                        width: '100%',
-                        height: '100%',
-                    } }, { children: isError ? _jsx(RowErrorState, {}) : lastRowContent })) })));
-        }
-        return (_jsx(TableRow, Object.assign({ index: index, row: row, columns: columns, rowProps: memoizedRowProps, isSheetView: isSheetView, isLastRow: index === rows.length - 1, isFirstRow: index === 0, isLoading: isLoading, isLoadMoreLoading: isLoadMoreLoading }, restData), `row-${index}`));
-    }, [
-        restData,
-        index,
-        row,
-        columns,
-        memoizedRowProps,
-        isSheetView,
-        isLoadingRow,
-        isError,
-        areAllRowsLoaded,
-        lastItemIndex,
-        isPinned,
-        rows.length,
-        renderSheetViewLoadingRow,
-        isLoadMoreLoading,
-    ]);
-    return (_jsx("div", Object.assign({ "data-testid": "ListItemWrapper", style: Object.assign(Object.assign({}, style), { top: Number(style.top) - ((_b = renderedScrollTopRef === null || renderedScrollTopRef === void 0 ? void 0 : renderedScrollTopRef.current) !== null && _b !== void 0 ? _b : 0), willChange: 'top' }) }, { children: _jsx(StyledItemWrapper, Object.assign({ "data-testid": "ListItemWrapper_StyledItemWrapper", isSheetView: isSheetView }, { children: memoizedListItemComponent })) })));
-}
-export default ListItemWrapper;