@tap-payments/os-micro-frontend-shared 0.0.259-test.2 → 0.0.260
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/LICENSE +21 -21
- package/README.md +12 -12
- package/build/components/AccountDropdown/style.d.ts +3 -1
- package/build/components/AppServices/style.d.ts +3 -1
- package/build/components/DockButton/style.d.ts +3 -1
- package/build/components/FileUpload/style.d.ts +6 -2
- package/build/components/FileUploader/style.d.ts +3 -1
- package/build/components/Icon/type.d.ts +2 -1
- package/build/components/MultiSelectWithSearch/style.d.ts +9 -3
- package/build/components/NestedDropdown/styles.d.ts +3 -1
- package/build/components/RFH/Inputs/SelectWithAccordion/style.d.ts +9 -3
- package/build/components/RangeCalender/RangeCalender.d.ts +1 -1
- package/build/components/SelectDropdown/style.d.ts +3 -1
- package/build/components/SelectWithSearch/style.d.ts +9 -3
- package/build/components/StatusLabel/style.d.ts +3 -1
- package/build/components/TableHeader/style.d.ts +3 -1
- package/build/components/Text/Text.d.ts +3 -4
- package/build/components/Timepicker/style.d.ts +6 -2
- package/build/components/VirtualTable/SheetView/SheetViewVirtualTable.js +22 -4
- package/build/components/VirtualTable/SheetView/components/SheetViewTableLoading.d.ts +12 -0
- package/build/components/VirtualTable/SheetView/components/SheetViewTableLoading.js +20 -0
- package/build/components/VirtualTable/SheetView/components/SheetViewTableNoData.d.ts +18 -0
- package/build/components/VirtualTable/SheetView/components/SheetViewTableNoData.js +32 -0
- package/build/components/VirtualTable/SheetView/components/SheetViewTableRowLoading.d.ts +12 -0
- package/build/components/VirtualTable/SheetView/components/SheetViewTableRowLoading.js +44 -0
- package/build/components/VirtualTable/SheetView/components/index.d.ts +3 -0
- package/build/components/VirtualTable/SheetView/components/index.js +3 -0
- package/build/components/VirtualTable/components/TableFooter/style.d.ts +6 -2
- package/build/components/Widget/style.d.ts +3 -1
- package/build/components/WindowAppIcon/style.d.ts +3 -1
- package/package.json +134 -143
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
export declare const Wrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
3
3
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
4
4
|
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
5
|
-
export declare const Button: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
5
|
+
export declare const Button: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
6
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
7
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
6
8
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
7
9
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
8
10
|
open: boolean;
|
|
@@ -10,7 +12,9 @@ export declare const Button: import("@emotion/styled").StyledComponent<import("@
|
|
|
10
12
|
export declare const Arrow: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
11
13
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
12
14
|
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
13
|
-
export declare const Period: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
15
|
+
export declare const Period: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
16
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
17
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
14
18
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
15
19
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
|
|
16
20
|
selected: boolean;
|
|
@@ -18,6 +18,7 @@ import { isHeightNotFullyFilledByRows, isNotFoundError, isTimeoutError, hasError
|
|
|
18
18
|
import TableFooter from '../components/TableFooter/TableFooter';
|
|
19
19
|
import TableLastItem from '../components/TableLastItem';
|
|
20
20
|
import TableNoData from '../components/TableNoData';
|
|
21
|
+
import { SheetViewTableNoData } from './components';
|
|
21
22
|
import ListItemWrapper from '../components/virtualScroll/ListItemWrapper';
|
|
22
23
|
import { StyledBox, StyledTableBox, StyledVirtualList, TableContainer, TableWrapper } from '../style';
|
|
23
24
|
import { SheetViewVirtualTableWrapper, PinnedStartColumnWrapper, PinnedEndColumnWrapper, MainTableWrapper, UnpinnedTableHeaderWrapper } from './style';
|
|
@@ -113,9 +114,12 @@ function SheetViewVirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, sho
|
|
|
113
114
|
handleScroll,
|
|
114
115
|
scrollToIndex,
|
|
115
116
|
areTotalRowsNotFillingHeight,
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
117
|
+
clearBackdropVisibilityTimeout,
|
|
118
|
+
lastItemIndex,
|
|
119
|
+
pinnedEndVirtualListRef,
|
|
120
|
+
pinnedStartVirtualListRef,
|
|
121
|
+
scrollableVirtualListRef,
|
|
122
|
+
theme.palette.background.default,
|
|
119
123
|
]);
|
|
120
124
|
const showNoDataView = tableLoading || tableError || tableEmpty || hasTimeoutError;
|
|
121
125
|
const pinnedStartColumnsWidth = useMemo(() => pinnedStartColumnsData.reduce((acc, col) => {
|
|
@@ -137,7 +141,21 @@ function SheetViewVirtualTable({ columns, rows, threshold = TABLE_THRESHOLD, sho
|
|
|
137
141
|
overflowX: 'hidden',
|
|
138
142
|
} }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_PinnedStyledBox", hidePadding: true, className: "list-wrapper" }, { children: createVirtualTableContainer(columnsData, containerKey, true, columnsWidth) })) }))] })) }));
|
|
139
143
|
};
|
|
140
|
-
return (_jsxs(_Fragment, { children: [_jsxs(TableContainer, { children: [showNoDataView ? (
|
|
144
|
+
return (_jsxs(_Fragment, { children: [_jsxs(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-show-background-color": !!showBackgroundColor, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showBackgroundColor: showBackgroundColor, showNoDataView: showNoDataView, scrollable: true, sx: {
|
|
145
|
+
marginLeft: '28px',
|
|
146
|
+
maxHeight: 'calc(100vh - 300px)',
|
|
147
|
+
overflow: 'auto',
|
|
148
|
+
} }, { 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: {
|
|
149
|
+
width: '100%',
|
|
150
|
+
minWidth: 'fit-content',
|
|
151
|
+
height: 'auto',
|
|
152
|
+
display: 'flex',
|
|
153
|
+
flexDirection: 'column',
|
|
154
|
+
} }, { children: _jsx(StyledBox, Object.assign({ "data-testid": "SheetViewVirtualTable_LoadingStyledBox", hidePadding: true, className: "list-wrapper", sx: {
|
|
155
|
+
height: 'auto',
|
|
156
|
+
display: 'flex',
|
|
157
|
+
flexDirection: 'column',
|
|
158
|
+
} }, { 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-show-background-color": !!showBackgroundColor, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showBackgroundColor: showBackgroundColor, showNoDataView: showNoDataView }, { children: _jsx(TableWrapper, Object.assign({ isSheetView: true, "data-testid": "SheetViewVirtualTable_TableWrapper", showNoDataView: showNoDataView, sx: tableBodyStyles }, { children: _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-show-background-color": !!showBackgroundColor, "data-table-mode": tableMode, height: "100%", dir: theme.direction, showBackgroundColor: showBackgroundColor, 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 }) })), _jsx(TableWrapper, Object.assign({ "data-testid": "VirtualTable_TableWrapper", sx: {
|
|
141
159
|
width: '100%',
|
|
142
160
|
minWidth: 'fit-content',
|
|
143
161
|
} }, { 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])] })), !showNoDataView && areTotalRowsNotFillingHeight && !isFetchingNextPage && (_jsx(TableLastItem, { height: (itemsCount + 1) * TABLE_ROW_HEIGHT, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode, "data-testid": "SheetViewVirtualTable_TableLastItem" }))] }), _jsx(TableFooter, Object.assign({ "data-testid": "SheetViewVirtualTable_TableFooter", showSeparator: true, showBackDrop: showBackDrop, onPointerDown: onPointerDown }, footerProps))] }));
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { AnimationType, IColumnProps } from '../../../../types/index.js';
|
|
3
|
+
interface ISheetViewTableLoadingProps {
|
|
4
|
+
columns: IColumnProps[];
|
|
5
|
+
isLoaded?: boolean;
|
|
6
|
+
animationType?: AnimationType;
|
|
7
|
+
isLoading?: boolean;
|
|
8
|
+
rowsCount?: number;
|
|
9
|
+
}
|
|
10
|
+
declare function SheetViewTableLoading({ columns, isLoaded, animationType, isLoading, rowsCount }: ISheetViewTableLoadingProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare const _default: import("react").MemoExoticComponent<typeof SheetViewTableLoading>;
|
|
12
|
+
export default _default;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
import { styled } from '@mui/material/styles';
|
|
4
|
+
import uniqueId from 'lodash/uniqueId';
|
|
5
|
+
import { calculateMaxAllowedRows } from '../../../../utils/index.js';
|
|
6
|
+
import SheetViewTableRowLoading from './SheetViewTableRowLoading';
|
|
7
|
+
const Wrapper = styled('section')(({ isLoaded = false }) => ({
|
|
8
|
+
overflow: 'hidden',
|
|
9
|
+
paddingInline: isLoaded ? '32px' : '0px',
|
|
10
|
+
backgroundColor: isLoaded ? 'rgba(255, 255, 255, 0.60)' : 'none',
|
|
11
|
+
filter: isLoaded ? 'blur(8px)' : 'none',
|
|
12
|
+
marginTop: isLoaded ? '1rem' : '0',
|
|
13
|
+
height: 'auto',
|
|
14
|
+
}));
|
|
15
|
+
function SheetViewTableLoading({ columns, isLoaded = false, animationType, isLoading = false, rowsCount }) {
|
|
16
|
+
let maxAllowedRows = rowsCount || calculateMaxAllowedRows(isLoaded, isLoading);
|
|
17
|
+
maxAllowedRows = rowsCount || Math.max(maxAllowedRows, 25);
|
|
18
|
+
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_')}`))) })));
|
|
19
|
+
}
|
|
20
|
+
export default memo(SheetViewTableLoading);
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import type { IColumnProps, IVirtualTable } from '../../../../types/index.js';
|
|
3
|
+
interface SheetViewTableNoDataProps {
|
|
4
|
+
tableEmpty: boolean;
|
|
5
|
+
tableLoading: boolean;
|
|
6
|
+
isTimeoutError: boolean;
|
|
7
|
+
error: Error | null;
|
|
8
|
+
tableError: boolean;
|
|
9
|
+
orderedColumns: IColumnProps[];
|
|
10
|
+
triggerDataRefetch: () => Promise<unknown>;
|
|
11
|
+
footerProps: IVirtualTable['footerProps'];
|
|
12
|
+
}
|
|
13
|
+
declare function SheetViewTableNoData({ error, tableEmpty, isTimeoutError, tableError, tableLoading, orderedColumns, triggerDataRefetch, footerProps, }: SheetViewTableNoDataProps): JSX.Element;
|
|
14
|
+
declare namespace SheetViewTableNoData {
|
|
15
|
+
var displayName: string;
|
|
16
|
+
}
|
|
17
|
+
declare const _default: import("react").MemoExoticComponent<typeof SheetViewTableNoData>;
|
|
18
|
+
export default _default;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
import { backendErrorHandler } from '../../../../utils/index.js';
|
|
4
|
+
import EmptyList from '../../components/EmptyList/EmptyList';
|
|
5
|
+
import ErrorList from '../../components/ErrorList/ErrorList';
|
|
6
|
+
import SheetViewTableLoading from './SheetViewTableLoading';
|
|
7
|
+
import { StyledSolidBackground } from '../../style';
|
|
8
|
+
function SheetViewTableNoData({ error, tableEmpty, isTimeoutError, tableError, tableLoading, orderedColumns, triggerDataRefetch, footerProps, }) {
|
|
9
|
+
let content;
|
|
10
|
+
if (tableLoading) {
|
|
11
|
+
content = (_jsx(StyledSolidBackground, Object.assign({ "data-testid": "SheetViewVirtualTable_SolidBackground" }, { children: _jsx(SheetViewTableLoading, { "data-testid": "SheetViewVirtualTable_TableLoading", columns: orderedColumns, isLoading: true }) })));
|
|
12
|
+
}
|
|
13
|
+
else if (isTimeoutError) {
|
|
14
|
+
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 }));
|
|
15
|
+
}
|
|
16
|
+
else if (tableError) {
|
|
17
|
+
const axiosErr = error;
|
|
18
|
+
const { formatted } = backendErrorHandler({ error: axiosErr, fallbackMessage: 'connectionErrorMsg' });
|
|
19
|
+
content = (_jsx(ErrorList, { "data-testid": "SheetViewVirtualTable_ErrorList_tableError", heading: "somethingWentWrong", message: formatted, triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));
|
|
20
|
+
}
|
|
21
|
+
else if (tableEmpty) {
|
|
22
|
+
const axiosErr = error;
|
|
23
|
+
const { formatted } = backendErrorHandler({ error: axiosErr, fallbackMessage: 'tryAdjustingTheDateOrFilters' });
|
|
24
|
+
content = _jsx(EmptyList, { sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode, heading: "nothingFound", message: formatted });
|
|
25
|
+
}
|
|
26
|
+
else {
|
|
27
|
+
content = (_jsx(ErrorList, { "data-testid": "SheetViewVirtualTable_ErrorList_tableError", heading: "somethingWentWrong", message: "connectionErrorMsg", triggerDataRefetch: triggerDataRefetch, sandboxMode: footerProps === null || footerProps === void 0 ? void 0 : footerProps.sandboxMode }));
|
|
28
|
+
}
|
|
29
|
+
return content;
|
|
30
|
+
}
|
|
31
|
+
SheetViewTableNoData.displayName = 'SheetViewTableNoData';
|
|
32
|
+
export default memo(SheetViewTableNoData);
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { CSSProperties } from 'react';
|
|
2
|
+
import type { AnimationType, IColumnProps } from '../../../../types/index.js';
|
|
3
|
+
interface ISheetViewTableRowLoadingProps {
|
|
4
|
+
columns: IColumnProps[];
|
|
5
|
+
index?: number;
|
|
6
|
+
animationType?: AnimationType;
|
|
7
|
+
style?: CSSProperties;
|
|
8
|
+
rowIndex?: number;
|
|
9
|
+
}
|
|
10
|
+
declare function SheetViewTableRowLoading({ columns, style, index, animationType, rowIndex }: ISheetViewTableRowLoadingProps): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare const _default: import("react").MemoExoticComponent<typeof SheetViewTableRowLoading>;
|
|
12
|
+
export default _default;
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
import Skeleton from '@mui/material/Skeleton';
|
|
4
|
+
import { styled } from '@mui/material/styles';
|
|
5
|
+
import TableCell from '@mui/material/TableCell';
|
|
6
|
+
import MUITableRow from '@mui/material/TableRow';
|
|
7
|
+
import { areEqual } from 'react-window';
|
|
8
|
+
const StyledSkeleton = styled(Skeleton)(() => ({
|
|
9
|
+
backgroundColor: '#F4F4F4',
|
|
10
|
+
borderRadius: '64px',
|
|
11
|
+
width: '100%',
|
|
12
|
+
minWidth: '20px',
|
|
13
|
+
}));
|
|
14
|
+
function SheetViewTableRowLoading({ columns, style, index, animationType, rowIndex = 0 }) {
|
|
15
|
+
return (_jsx(MUITableRow, Object.assign({ sx: Object.assign(Object.assign({}, style), { display: 'flex', borderBottom: '1px solid #F2F2F2', minHeight: '28px', height: '28px', alignItems: 'center', '&:hover': {
|
|
16
|
+
backgroundColor: 'transparent !important',
|
|
17
|
+
} }), component: "div", hover: true }, { children: columns.map((column, colIndex) => {
|
|
18
|
+
var _a;
|
|
19
|
+
const isLastColumn = colIndex === columns.length - 1;
|
|
20
|
+
const isFirstColumn = colIndex === 0;
|
|
21
|
+
const shouldShowActualData = isFirstColumn && column.render;
|
|
22
|
+
return (_jsx(TableCell, Object.assign({ sx: {
|
|
23
|
+
width: column.width || `${100 / columns.length}%` || '20%',
|
|
24
|
+
paddingBlock: '0',
|
|
25
|
+
paddingInline: '8px !important',
|
|
26
|
+
paddingLeft: isFirstColumn ? '8px !important' : '8px !important',
|
|
27
|
+
paddingRight: isLastColumn ? '8px !important' : '8px !important',
|
|
28
|
+
borderRight: isLastColumn ? 'none' : '1px solid #F2F2F2',
|
|
29
|
+
borderLeft: isFirstColumn ? '1px solid #F2F2F2' : 'none',
|
|
30
|
+
height: '100%',
|
|
31
|
+
display: 'flex',
|
|
32
|
+
alignItems: 'center',
|
|
33
|
+
boxSizing: 'border-box',
|
|
34
|
+
whiteSpace: 'nowrap',
|
|
35
|
+
overflow: 'hidden',
|
|
36
|
+
}, component: "div" }, { children: shouldShowActualData ? ((_a = column.render) === null || _a === void 0 ? void 0 : _a.call(column, {
|
|
37
|
+
index: rowIndex,
|
|
38
|
+
row: {},
|
|
39
|
+
column,
|
|
40
|
+
value: rowIndex + 1,
|
|
41
|
+
})) : (_jsx(StyledSkeleton, { variant: "rectangular", animation: animationType, height: 16 })) }), `${column.id}-${colIndex}`));
|
|
42
|
+
}) }), index));
|
|
43
|
+
}
|
|
44
|
+
export default memo(SheetViewTableRowLoading, areEqual);
|
|
@@ -13,10 +13,14 @@ export declare const EngravingLine: import("@emotion/styled").StyledComponent<im
|
|
|
13
13
|
export declare const Label: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
14
14
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
15
15
|
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
16
|
-
export declare const Title: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
16
|
+
export declare const Title: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
17
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
18
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
17
19
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
18
20
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
19
|
-
export declare const ValueWrapper: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
21
|
+
export declare const ValueWrapper: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
22
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
23
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
20
24
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
21
25
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
22
26
|
export declare const Value: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
@@ -11,7 +11,9 @@ export declare const Header: import("@emotion/styled").StyledComponent<import("@
|
|
|
11
11
|
export declare const ListItemStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
12
12
|
ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
|
|
13
13
|
}, keyof import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
14
|
-
export declare const ItemText: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
14
|
+
export declare const ItemText: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
15
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
16
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
15
17
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
16
18
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
17
19
|
export declare const ItemTextWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material/styles").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
export declare const TitleStyled: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<
|
|
2
|
+
export declare const TitleStyled: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
|
|
3
|
+
ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
|
|
4
|
+
}, "width" | "minHeight" | "height" | "bottom" | "left" | "right" | "top" | "textAlign" | "className" | "style" | "classes" | "border" | "borderTop" | "borderRight" | "borderBottom" | "borderLeft" | "borderColor" | "borderRadius" | "display" | "displayPrint" | "overflow" | "textOverflow" | "visibility" | "whiteSpace" | "flexBasis" | "flexDirection" | "flexWrap" | "justifyContent" | "alignItems" | "alignContent" | "order" | "flex" | "flexGrow" | "flexShrink" | "alignSelf" | "justifyItems" | "justifySelf" | "gap" | "columnGap" | "rowGap" | "gridColumn" | "gridRow" | "gridAutoFlow" | "gridAutoColumns" | "gridAutoRows" | "gridTemplateColumns" | "gridTemplateRows" | "gridTemplateAreas" | "gridArea" | "bgcolor" | "color" | "zIndex" | "position" | "boxShadow" | "maxWidth" | "minWidth" | "maxHeight" | "boxSizing" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "my" | "p" | "pt" | "pr" | "pb" | "pl" | "px" | "py" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginX" | "marginY" | "marginInline" | "marginInlineStart" | "marginInlineEnd" | "marginBlock" | "marginBlockStart" | "marginBlockEnd" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingX" | "paddingY" | "paddingInline" | "paddingInlineStart" | "paddingInlineEnd" | "paddingBlock" | "paddingBlockStart" | "paddingBlockEnd" | "typography" | "fontFamily" | "fontSize" | "fontStyle" | "fontWeight" | "letterSpacing" | "lineHeight" | "textTransform" | "children" | "sx" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & {
|
|
3
5
|
component?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
|
|
4
6
|
} & import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, {}, {}>;
|
|
5
7
|
export declare const StyledWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
|