@tap-payments/os-micro-frontend-shared 0.0.70-sheet-view-table-row-v3 → 0.0.70
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.
- package/build/components/Chip/style.d.ts +1 -0
- package/build/components/CountBadge/style.d.ts +1 -0
- package/build/components/Dialog/style.d.ts +1 -0
- package/build/components/FlippingCard/style.d.ts +1 -0
- package/build/components/ImageWrapper/ImageWrapper.d.ts +1 -0
- package/build/components/JSONViewer/style.d.ts +1 -0
- package/build/components/SearchButton/styles.d.ts +1 -0
- package/build/components/StatusIcons/AuthIcons/style.d.ts +1 -0
- package/build/components/StatusIcons/AuthorizationAutoIcons/style.d.ts +1 -0
- package/build/components/StatusIcons/ChargeStatusIcon/style.d.ts +1 -0
- package/build/components/StatusIcons/SourceIcons/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/ActionCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/AuthenticationCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/AuthenticationStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/AuthenticationTypeCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/BalanceCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/ChannelsCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/CheckoutStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/DestinationStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/DueDateCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/IDButton/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/IntentsStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/InvoiceStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/PayoutStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/ProductsCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/ReferenceCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/RefundChargeCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/RefundStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/SegmentsCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/SourceCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/SourceMergedCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/StatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/TokenStatusCell/style.d.ts +1 -0
- package/build/components/TableCells/CustomCells/style.d.ts +1 -0
- package/build/components/VirtualTable/VirtualTable.d.ts +1 -1
- package/build/components/VirtualTable/VirtualTable.js +12 -12
- package/build/components/VirtualTable/components/virtualScroll/VirtualScrollList.d.ts +2 -4
- package/build/components/VirtualTable/components/virtualScroll/VirtualScrollList.js +4 -5
- package/build/components/VirtualTable/style.d.ts +1 -1
- package/package.json +1 -1
- package/build/playground/VTDemo.d.ts +0 -1
- package/build/playground/VTDemo.js +0 -58
- package/build/playground/index.d.ts +0 -1
- package/build/playground/index.js +0 -1
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
import { GetSourceAnimationFunction } from './type';
|
|
3
4
|
export declare const ChipStyled: import("@emotion/styled").StyledComponent<import("react").RefAttributes<unknown> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
|
|
4
5
|
variant?: import("./type").ChipVariant | undefined;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const ActionCellContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
|
|
3
4
|
export declare const ActionsIconContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
4
5
|
selected: boolean;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const AuthIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
3
4
|
export declare const AuthCellContainer: import("@emotion/styled").StyledComponent<{
|
|
4
5
|
hidden?: boolean | undefined;
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const ReferenceSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const ReferenceSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const StyledSourceCell: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
3
4
|
export declare const StyledSourceImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
|
|
4
5
|
export declare const PaymentSourcesContainer: import("@emotion/styled").StyledComponent<{
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
export declare const GeographyBox: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
|
|
3
4
|
variant?: "Local" | "Global" | "Regional" | undefined;
|
|
4
5
|
}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import type { IVirtualTable } from '../../types/index.js';
|
|
3
|
-
declare function VirtualTable({ columns, rows, threshold, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, showBackgroundColor, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView, }: Readonly<IVirtualTable>): import("react/jsx-runtime").JSX.Element;
|
|
3
|
+
declare function VirtualTable({ columns, rows, threshold, showHeader, headerProps, rowProps, footerProps, rowHeight, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, showBackgroundColor, areAllRowsLoaded, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView, }: Readonly<IVirtualTable>): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
declare const _default: import("react").MemoExoticComponent<typeof VirtualTable>;
|
|
5
5
|
export default _default;
|
|
@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
8
8
|
});
|
|
9
9
|
};
|
|
10
10
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
11
|
-
import { useMemo, memo, useState
|
|
11
|
+
import { useMemo, memo, useState } from 'react';
|
|
12
12
|
import { useTheme } from '@mui/material/styles';
|
|
13
13
|
import memoize from 'memoize-one';
|
|
14
14
|
import AutoSizer from 'react-virtualized-auto-sizer';
|
|
@@ -34,7 +34,7 @@ const createItemData = memoize((columns, isLoading, rows, rowProps, scrollToInde
|
|
|
34
34
|
areAllRowsLoaded,
|
|
35
35
|
isSheetView,
|
|
36
36
|
}));
|
|
37
|
-
function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader, headerProps, rowProps, footerProps, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, showBackgroundColor, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView = false, }) {
|
|
37
|
+
function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader, headerProps, rowProps, footerProps, rowHeight = TABLE_ROW_HEIGHT, isLoading, error, columnsSorting, onColumnSort, loadMoreItems, isFetchingNextPage, triggerDataRefetch, scrollToIndex, showBackgroundColor, areAllRowsLoaded = false, tableBodyStyles, tableMode, tableTitle, dragControls, isSheetView = false, }) {
|
|
38
38
|
var _a;
|
|
39
39
|
const theme = useTheme();
|
|
40
40
|
const onPointerDown = (e) => {
|
|
@@ -57,12 +57,6 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
|
|
|
57
57
|
const itemsCount = isDelayedFetchingNextPage || (areAllRowsLoaded && !areTotalRowsNotFillingHeight) ? rows.length + 1 : rows.length;
|
|
58
58
|
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);
|
|
59
59
|
const tableRowHeight = isSheetView ? SHEET_VIEW_TABLE_ROW_HEIGHT : TABLE_ROW_HEIGHT;
|
|
60
|
-
const listRef = useRef(null);
|
|
61
|
-
useEffect(() => {
|
|
62
|
-
if (listRef.current && typeof listRef.current.resetAfterIndex === 'function') {
|
|
63
|
-
listRef.current.resetAfterIndex(0, true);
|
|
64
|
-
}
|
|
65
|
-
}, [isSheetView, tableRowHeight]);
|
|
66
60
|
const renderTableContainer = useMemo(() => {
|
|
67
61
|
const setBackdropVisibility = (isVisible) => {
|
|
68
62
|
setShowBackdrop(isVisible);
|
|
@@ -72,18 +66,24 @@ function VirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, showHeader,
|
|
|
72
66
|
return;
|
|
73
67
|
yield (loadMoreItems === null || loadMoreItems === void 0 ? void 0 : loadMoreItems());
|
|
74
68
|
});
|
|
75
|
-
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
|
|
69
|
+
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 }, { children: ListItemWrapper }))) }))) })));
|
|
76
70
|
}, [
|
|
71
|
+
orderedColumns,
|
|
72
|
+
error,
|
|
73
|
+
isLoading,
|
|
77
74
|
lastItemIndex,
|
|
78
75
|
loadMoreItems,
|
|
76
|
+
rowHeight,
|
|
77
|
+
rows,
|
|
78
|
+
rowProps,
|
|
79
|
+
tableError,
|
|
80
|
+
tableLoading,
|
|
79
81
|
threshold,
|
|
82
|
+
isDelayedFetchingNextPage,
|
|
80
83
|
areAllRowsLoaded,
|
|
81
84
|
areTotalRowsNotFillingHeight,
|
|
82
85
|
itemsCount,
|
|
83
86
|
tableRowHeight,
|
|
84
|
-
isSheetView,
|
|
85
|
-
itemData,
|
|
86
|
-
scrollToIndex,
|
|
87
87
|
]);
|
|
88
88
|
const showNoDataView = tableLoading || tableError || tableEmpty || hasTimeoutError;
|
|
89
89
|
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, 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: {
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { VariableSizeList, VariableSizeListProps } from 'react-window';
|
|
1
|
+
import { VariableSizeListProps } from 'react-window';
|
|
3
2
|
type ExtendedVariableSizeListProps = VariableSizeListProps & {
|
|
4
3
|
setBackdropVisibility: (isVisible: boolean) => void;
|
|
5
4
|
scrollToIndex?: number;
|
|
6
|
-
listRef?: React.RefObject<VariableSizeList>;
|
|
7
5
|
};
|
|
8
|
-
declare function VirtualScrollList({ itemData, children, setBackdropVisibility, scrollToIndex,
|
|
6
|
+
declare function VirtualScrollList({ itemData, children, setBackdropVisibility, scrollToIndex, ...restProps }: ExtendedVariableSizeListProps): import("react/jsx-runtime").JSX.Element;
|
|
9
7
|
export default VirtualScrollList;
|
|
@@ -17,15 +17,14 @@ import VirtualScrollOuter from './VirtualScrollOuter';
|
|
|
17
17
|
import useScrollBackShadow from '../../hooks/useScrollBackShadow';
|
|
18
18
|
import { VirtualScrollOuterProvider } from '../../context';
|
|
19
19
|
function VirtualScrollList(_a) {
|
|
20
|
-
var { itemData, children, setBackdropVisibility, scrollToIndex
|
|
20
|
+
var { itemData, children, setBackdropVisibility, scrollToIndex } = _a, restProps = __rest(_a, ["itemData", "children", "setBackdropVisibility", "scrollToIndex"]);
|
|
21
21
|
const { handleBackDropVisibility, clearBackdropVisibility, clearTimer } = useScrollBackShadow({
|
|
22
22
|
setBackdropVisibility,
|
|
23
23
|
});
|
|
24
24
|
const renderedScrollTopRef = useRef(0);
|
|
25
25
|
const scrollTopRef = useRef(undefined);
|
|
26
26
|
const scrollLocked = useRef(false);
|
|
27
|
-
const
|
|
28
|
-
const listRef = externalListRef || internalListRef;
|
|
27
|
+
const listRef = useRef(null);
|
|
29
28
|
const scrollTo = useCallback(() => {
|
|
30
29
|
var _a, _b;
|
|
31
30
|
clearTimer();
|
|
@@ -39,7 +38,7 @@ function VirtualScrollList(_a) {
|
|
|
39
38
|
}
|
|
40
39
|
clearBackdropVisibility();
|
|
41
40
|
return false;
|
|
42
|
-
}, [
|
|
41
|
+
}, []);
|
|
43
42
|
const handleScroll = React.useCallback((event) => {
|
|
44
43
|
scrollTopRef.current = event.currentTarget.scrollTop;
|
|
45
44
|
if (!scrollLocked.current) {
|
|
@@ -52,7 +51,7 @@ function VirtualScrollList(_a) {
|
|
|
52
51
|
if ((scrollToIndex || 0) >= 0 && !Number.isNaN(scrollToIndex) && scrollToIndex !== undefined && ((_a = listRef.current) === null || _a === void 0 ? void 0 : _a.scrollTo)) {
|
|
53
52
|
(_b = listRef.current) === null || _b === void 0 ? void 0 : _b.scrollToItem(scrollToIndex, 'center');
|
|
54
53
|
}
|
|
55
|
-
}, [scrollToIndex
|
|
54
|
+
}, [scrollToIndex]);
|
|
56
55
|
const itemDataInternal = React.useMemo(() => (Object.assign(Object.assign({}, itemData), { renderedScrollTopRef })), [itemData]);
|
|
57
56
|
const handleOnScroll = React.useCallback(() => {
|
|
58
57
|
scrollLocked.current = scrollTo();
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
/// <reference types="react" />
|
|
2
3
|
interface TableWrapperProps {
|
|
3
4
|
showNoDataView?: boolean;
|
|
4
5
|
isSheetView?: boolean;
|
|
@@ -26,7 +27,6 @@ interface StyledVirtualListProps {
|
|
|
26
27
|
export declare const StyledVirtualList: import("@emotion/styled").StyledComponent<import("react-window").VariableSizeListProps<any> & {
|
|
27
28
|
setBackdropVisibility: (isVisible: boolean) => void;
|
|
28
29
|
scrollToIndex?: number | undefined;
|
|
29
|
-
listRef?: import("react").RefObject<import("react-window").VariableSizeList<any>> | undefined;
|
|
30
30
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & StyledVirtualListProps, {}, {}>;
|
|
31
31
|
export declare const StyledTableRow: import("@emotion/styled").StyledComponent<import("@mui/material").TableRowOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, "ref"> & {
|
|
32
32
|
ref?: ((instance: HTMLTableRowElement | null) => void) | import("react").RefObject<HTMLTableRowElement> | null | undefined;
|
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.70
|
|
4
|
+
"version": "0.0.70",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "build/index.js",
|
|
7
7
|
"module": "build/index.js",
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const VTDemo: () => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useState } from 'react';
|
|
3
|
-
import { Button, VirtualTable } from '../components/index.js';
|
|
4
|
-
import { Box } from '@mui/material';
|
|
5
|
-
export const VTDemo = () => {
|
|
6
|
-
const [isSheetView, setIsSheetView] = useState(false);
|
|
7
|
-
const toggleView = () => {
|
|
8
|
-
setIsSheetView((prev) => !prev);
|
|
9
|
-
};
|
|
10
|
-
return (_jsx(Box, Object.assign({ sx: {
|
|
11
|
-
width: '100%',
|
|
12
|
-
height: '100vh',
|
|
13
|
-
overflow: 'auto',
|
|
14
|
-
flexDirection: 'row',
|
|
15
|
-
display: 'flex',
|
|
16
|
-
justifyContent: 'center',
|
|
17
|
-
p: 3,
|
|
18
|
-
backgroundColor: 'gray',
|
|
19
|
-
} }, { children: _jsxs(Box, Object.assign({ "data-testid": "ChargesList", sx: {
|
|
20
|
-
position: 'relative',
|
|
21
|
-
display: 'flex',
|
|
22
|
-
flexDirection: 'column',
|
|
23
|
-
width: '80%',
|
|
24
|
-
height: '100%',
|
|
25
|
-
} }, { children: [_jsx(Button, Object.assign({ onClick: toggleView }, { children: "Toggle" })), _jsx(VirtualTable, { showHeader: true, showFooter: true, footerProps: {
|
|
26
|
-
totalCount: 4,
|
|
27
|
-
sandboxMode: false,
|
|
28
|
-
maximized: false,
|
|
29
|
-
}, loadMoreItems: () => Promise.resolve(), isLoading: false, isFetchingNextPage: false, rows: [
|
|
30
|
-
{ index: '1', date: 'date', order: 'order' },
|
|
31
|
-
{ index: '2', date: 'date', order: 'order' },
|
|
32
|
-
{ index: '3', date: 'date', order: 'order' },
|
|
33
|
-
], areAllRowsLoaded: true, columnsSorting: { id: 'asc' }, onColumnSort: () => { }, columns: [
|
|
34
|
-
{ id: 'index', header: '', width: '28px' },
|
|
35
|
-
{
|
|
36
|
-
id: 'date',
|
|
37
|
-
header: 'Date',
|
|
38
|
-
width: '170px',
|
|
39
|
-
},
|
|
40
|
-
{
|
|
41
|
-
id: 'order',
|
|
42
|
-
header: 'Order',
|
|
43
|
-
width: '170px',
|
|
44
|
-
filter: {
|
|
45
|
-
onConfirm: undefined,
|
|
46
|
-
onClear: () => { },
|
|
47
|
-
type: 'inputs',
|
|
48
|
-
options: [
|
|
49
|
-
{
|
|
50
|
-
placeholder: 'Order',
|
|
51
|
-
apiKey: 'orderID',
|
|
52
|
-
},
|
|
53
|
-
],
|
|
54
|
-
data: {},
|
|
55
|
-
},
|
|
56
|
-
},
|
|
57
|
-
], error: null, triggerDataRefetch: () => Promise.resolve(), showBackgroundColor: false, tableTitle: "Acceptance-Charges", tableMode: 'sheet', dragControls: undefined, isSheetView: isSheetView })] })) })));
|
|
58
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { VTDemo } from './VTDemo';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { VTDemo } from './VTDemo';
|