@tap-payments/os-micro-frontend-shared 0.0.69-sheetview-container-v2 → 0.0.69-sheetview-container-v4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -83,9 +83,9 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
83
83
  itemsCount,
84
84
  ]);
85
85
  const showNoDataView = tableLoading || tableError || tableEmpty || hasTimeoutError;
86
- return (_jsxs(_Fragment, { children: [_jsxs(TableContainer, Object.assign({ isSheetView: isSheetView }, { 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-show-background-color": !!showBackgroundColor, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showBackgroundColor: showBackgroundColor, 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 })), 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: {
86
+ 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-show-background-color": !!showBackgroundColor, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showBackgroundColor: showBackgroundColor, showNoDataView: showNoDataView }, { children: _jsxs(TableWrapper, Object.assign({ isSheetView: isSheetView, "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 })), 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: {
87
87
  width: '100%',
88
88
  minWidth: 'fit-content',
89
- } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "VirtualTable_StyledBox", hidePadding: true, className: "list-wrapper" }, { children: renderTableContainer })) })))] })) })), !showNoDataView && areTotalRowsNotFillingHeight && !isFetchingNextPage && (_jsx(TableLastItem, { height: (itemsCount + 1) * TABLE_ROW_HEIGHT, 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))] }));
89
+ } }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "VirtualTable_StyledBox", hidePadding: true, className: "list-wrapper" }, { children: renderTableContainer })) })))] })) })), !showNoDataView && areTotalRowsNotFillingHeight && !isFetchingNextPage && (_jsx(TableLastItem, { height: (itemsCount + 1) * TABLE_ROW_HEIGHT, 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))] }));
90
90
  }
91
91
  export default memo(VirtualTable);
@@ -1,6 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  interface TableWrapperProps {
3
3
  showNoDataView?: boolean;
4
+ isSheetView?: boolean;
4
5
  }
5
6
  export declare const TableWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
7
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
@@ -312,9 +313,7 @@ export declare const ActionIcon: import("@emotion/styled").StyledComponent<{
312
313
  } & import("framer-motion").MotionProps & import("react").RefAttributes<HTMLImageElement> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
313
314
  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"> & {
314
315
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
315
- }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
316
- isSheetView?: boolean | undefined;
317
- }, {}, {}>;
316
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
318
317
  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"> & {
319
318
  ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
320
319
  }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
@@ -6,8 +6,8 @@ import { motion } from 'framer-motion';
6
6
  import { TABLE_FOOTER_HEIGHT } from './components/TableFooter/style';
7
7
  import VirtualScrollList from './components/virtualScroll/VirtualScrollList';
8
8
  export const TableWrapper = styled(Box, {
9
- shouldForwardProp: (prop) => prop !== 'showNoDataView',
10
- })(({ showNoDataView }) => ({
9
+ shouldForwardProp: (prop) => prop !== 'showNoDataView' && prop !== 'isSheetView',
10
+ })(({ showNoDataView, isSheetView }) => ({
11
11
  display: 'flex',
12
12
  flexDirection: 'column',
13
13
  height: '100%',
@@ -15,6 +15,8 @@ export const TableWrapper = styled(Box, {
15
15
  minWidth: showNoDataView ? 'unset' : 'fit-content',
16
16
  overflow: 'hidden',
17
17
  overflowX: showNoDataView ? 'hidden' : 'scroll',
18
+ padding: isSheetView ? '0 32px' : '0',
19
+ border: isSheetView ? '1px solid #F2F2F2' : 'none',
18
20
  }));
19
21
  export const StyledBox = styled(Box, {
20
22
  shouldForwardProp: (prop) => prop !== 'hidePadding',
@@ -105,15 +107,11 @@ export const ActionIcon = styled(motion.img)(() => ({
105
107
  position: 'relative',
106
108
  zIndex: 2,
107
109
  }));
108
- export const TableContainer = styled(Box, {
109
- shouldForwardProp: (prop) => prop !== 'isSheetView',
110
- })(({ isSheetView }) => ({
110
+ export const TableContainer = styled(Box)(() => ({
111
111
  position: 'relative',
112
112
  display: 'flex',
113
113
  flexDirection: 'column',
114
114
  height: '100%',
115
- border: isSheetView ? '1px solid #F2F2F2' : 'none',
116
- marginX: isSheetView ? '32px' : '0',
117
115
  }));
118
116
  export const StyledCardsBox = styled(Box, {
119
117
  shouldForwardProp: (prop) => prop !== 'showNoDataView',
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tap-payments/os-micro-frontend-shared",
3
3
  "description": "Shared components and utilities for Tap Payments micro frontends",
4
- "version": "0.0.69-sheetview-container-v2",
4
+ "version": "0.0.69-sheetview-container-v4",
5
5
  "type": "module",
6
6
  "main": "build/index.js",
7
7
  "module": "build/index.js",