@etsoo/react 1.5.78 → 1.5.81
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/README.md +7 -2
- package/__tests__/ReactUtils.ts +6 -0
- package/lib/{mu → components}/DnDList.d.ts +1 -14
- package/lib/{mu → components}/DnDList.js +1 -24
- package/lib/components/GridMethodRef.d.ts +11 -0
- package/lib/{mu → components}/GridMethodRef.js +0 -0
- package/lib/components/ScrollerGrid.d.ts +6 -6
- package/lib/components/ScrollerList.d.ts +3 -3
- package/lib/index.d.ts +2 -74
- package/lib/index.js +2 -75
- package/lib/notifier/Notifier.d.ts +2 -3
- package/lib/uses/useWindowScroll.d.ts +10 -0
- package/lib/uses/useWindowScroll.js +46 -0
- package/lib/uses/useWindowSize.js +11 -5
- package/package.json +9 -21
- package/src/{mu → components}/DnDList.tsx +11 -34
- package/src/components/GridMethodRef.ts +12 -0
- package/src/components/ScrollerGrid.tsx +6 -6
- package/src/components/ScrollerList.tsx +5 -3
- package/src/index.ts +2 -78
- package/src/notifier/Notifier.ts +2 -3
- package/src/uses/useWindowScroll.ts +60 -0
- package/src/uses/useWindowSize.ts +14 -5
- package/__tests__/mu/MUGlobalTests.tsx +0 -58
- package/__tests__/mu/NotifierMUTests.tsx +0 -213
- package/lib/app/CommonApp.d.ts +0 -39
- package/lib/app/CommonApp.js +0 -149
- package/lib/app/IServiceAppSettings.d.ts +0 -11
- package/lib/app/IServiceAppSettings.js +0 -1
- package/lib/app/IServicePage.d.ts +0 -6
- package/lib/app/IServicePage.js +0 -1
- package/lib/app/IServiceUser.d.ts +0 -14
- package/lib/app/IServiceUser.js +0 -1
- package/lib/app/ISmartERPUser.d.ts +0 -14
- package/lib/app/ISmartERPUser.js +0 -1
- package/lib/app/Labels.d.ts +0 -65
- package/lib/app/Labels.js +0 -62
- package/lib/app/ReactApp.d.ts +0 -194
- package/lib/app/ReactApp.js +0 -298
- package/lib/app/ServiceApp.d.ts +0 -78
- package/lib/app/ServiceApp.js +0 -244
- package/lib/components/ShowDataComparison.d.ts +0 -20
- package/lib/components/ShowDataComparison.js +0 -60
- package/lib/mu/AuditDisplay.d.ts +0 -33
- package/lib/mu/AuditDisplay.js +0 -52
- package/lib/mu/AutocompleteExtendedProps.d.ts +0 -66
- package/lib/mu/AutocompleteExtendedProps.js +0 -1
- package/lib/mu/BackButton.d.ts +0 -13
- package/lib/mu/BackButton.js +0 -33
- package/lib/mu/BridgeCloseButton.d.ts +0 -23
- package/lib/mu/BridgeCloseButton.js +0 -32
- package/lib/mu/ButtonLink.d.ts +0 -17
- package/lib/mu/ButtonLink.js +0 -19
- package/lib/mu/ComboBox.d.ts +0 -40
- package/lib/mu/ComboBox.js +0 -108
- package/lib/mu/CountdownButton.d.ts +0 -23
- package/lib/mu/CountdownButton.js +0 -81
- package/lib/mu/CustomFabProps.d.ts +0 -27
- package/lib/mu/CustomFabProps.js +0 -1
- package/lib/mu/DataGridEx.d.ts +0 -96
- package/lib/mu/DataGridEx.js +0 -331
- package/lib/mu/DataGridRenderers.d.ts +0 -22
- package/lib/mu/DataGridRenderers.js +0 -99
- package/lib/mu/DialogButton.d.ts +0 -54
- package/lib/mu/DialogButton.js +0 -45
- package/lib/mu/DraggablePaperComponent.d.ts +0 -8
- package/lib/mu/DraggablePaperComponent.js +0 -12
- package/lib/mu/EmailInput.d.ts +0 -11
- package/lib/mu/EmailInput.js +0 -15
- package/lib/mu/FabBox.d.ts +0 -21
- package/lib/mu/FabBox.js +0 -31
- package/lib/mu/FlexBox.d.ts +0 -14
- package/lib/mu/FlexBox.js +0 -18
- package/lib/mu/GridDataFormat.d.ts +0 -10
- package/lib/mu/GridDataFormat.js +0 -43
- package/lib/mu/GridMethodRef.d.ts +0 -11
- package/lib/mu/IconButtonLink.d.ts +0 -17
- package/lib/mu/IconButtonLink.js +0 -16
- package/lib/mu/InputField.d.ts +0 -21
- package/lib/mu/InputField.js +0 -39
- package/lib/mu/ItemList.d.ts +0 -55
- package/lib/mu/ItemList.js +0 -77
- package/lib/mu/ListItemRightIcon.d.ts +0 -4
- package/lib/mu/ListItemRightIcon.js +0 -8
- package/lib/mu/ListMoreDisplay.d.ts +0 -35
- package/lib/mu/ListMoreDisplay.js +0 -99
- package/lib/mu/LoadingButton.d.ts +0 -16
- package/lib/mu/LoadingButton.js +0 -41
- package/lib/mu/MUGlobal.d.ts +0 -102
- package/lib/mu/MUGlobal.js +0 -184
- package/lib/mu/MaskInput.d.ts +0 -34
- package/lib/mu/MaskInput.js +0 -43
- package/lib/mu/MobileListItemRenderer.d.ts +0 -17
- package/lib/mu/MobileListItemRenderer.js +0 -35
- package/lib/mu/MoreFab.d.ts +0 -45
- package/lib/mu/MoreFab.js +0 -95
- package/lib/mu/NotifierMU.d.ts +0 -47
- package/lib/mu/NotifierMU.js +0 -387
- package/lib/mu/NotifierPromptProps.d.ts +0 -22
- package/lib/mu/NotifierPromptProps.js +0 -1
- package/lib/mu/OptionGroup.d.ts +0 -62
- package/lib/mu/OptionGroup.js +0 -81
- package/lib/mu/PList.d.ts +0 -15
- package/lib/mu/PList.js +0 -12
- package/lib/mu/ProgressCount.d.ts +0 -44
- package/lib/mu/ProgressCount.js +0 -79
- package/lib/mu/PullToRefreshUI.d.ts +0 -9
- package/lib/mu/PullToRefreshUI.js +0 -18
- package/lib/mu/RLink.d.ts +0 -14
- package/lib/mu/RLink.js +0 -37
- package/lib/mu/ResponsibleContainer.d.ts +0 -89
- package/lib/mu/ResponsibleContainer.js +0 -159
- package/lib/mu/ScrollTopFab.d.ts +0 -7
- package/lib/mu/ScrollTopFab.js +0 -25
- package/lib/mu/ScrollerListEx.d.ts +0 -81
- package/lib/mu/ScrollerListEx.js +0 -167
- package/lib/mu/SearchBar.d.ts +0 -29
- package/lib/mu/SearchBar.js +0 -262
- package/lib/mu/SearchField.d.ts +0 -21
- package/lib/mu/SearchField.js +0 -39
- package/lib/mu/SearchOptionGroup.d.ts +0 -9
- package/lib/mu/SearchOptionGroup.js +0 -14
- package/lib/mu/SelectBool.d.ts +0 -14
- package/lib/mu/SelectBool.js +0 -22
- package/lib/mu/SelectEx.d.ts +0 -54
- package/lib/mu/SelectEx.js +0 -156
- package/lib/mu/Switch.d.ts +0 -29
- package/lib/mu/Switch.js +0 -34
- package/lib/mu/SwitchAnt.d.ts +0 -25
- package/lib/mu/SwitchAnt.js +0 -40
- package/lib/mu/TabBox.d.ts +0 -54
- package/lib/mu/TabBox.js +0 -31
- package/lib/mu/TableEx.d.ts +0 -68
- package/lib/mu/TableEx.js +0 -271
- package/lib/mu/TextFieldEx.d.ts +0 -101
- package/lib/mu/TextFieldEx.js +0 -127
- package/lib/mu/Tiplist.d.ts +0 -18
- package/lib/mu/Tiplist.js +0 -158
- package/lib/mu/TooltipClick.d.ts +0 -15
- package/lib/mu/TooltipClick.js +0 -40
- package/lib/mu/UserAvatar.d.ts +0 -24
- package/lib/mu/UserAvatar.js +0 -25
- package/lib/mu/UserAvatarEditor.d.ts +0 -53
- package/lib/mu/UserAvatarEditor.js +0 -129
- package/lib/mu/pages/CommonPage.d.ts +0 -11
- package/lib/mu/pages/CommonPage.js +0 -60
- package/lib/mu/pages/CommonPageProps.d.ts +0 -60
- package/lib/mu/pages/CommonPageProps.js +0 -1
- package/lib/mu/pages/DataGridPage.d.ts +0 -9
- package/lib/mu/pages/DataGridPage.js +0 -81
- package/lib/mu/pages/DataGridPageProps.d.ts +0 -17
- package/lib/mu/pages/DataGridPageProps.js +0 -1
- package/lib/mu/pages/EditPage.d.ts +0 -33
- package/lib/mu/pages/EditPage.js +0 -29
- package/lib/mu/pages/FixedListPage.d.ts +0 -15
- package/lib/mu/pages/FixedListPage.js +0 -72
- package/lib/mu/pages/ListPage.d.ts +0 -9
- package/lib/mu/pages/ListPage.js +0 -51
- package/lib/mu/pages/ListPageProps.d.ts +0 -7
- package/lib/mu/pages/ListPageProps.js +0 -1
- package/lib/mu/pages/ResponsivePage.d.ts +0 -9
- package/lib/mu/pages/ResponsivePage.js +0 -45
- package/lib/mu/pages/ResponsivePageProps.d.ts +0 -39
- package/lib/mu/pages/ResponsivePageProps.js +0 -1
- package/lib/mu/pages/SearchPageProps.d.ts +0 -30
- package/lib/mu/pages/SearchPageProps.js +0 -1
- package/lib/mu/pages/TablePage.d.ts +0 -9
- package/lib/mu/pages/TablePage.js +0 -71
- package/lib/mu/pages/TablePageProps.d.ts +0 -7
- package/lib/mu/pages/TablePageProps.js +0 -1
- package/lib/mu/pages/ViewPage.d.ts +0 -66
- package/lib/mu/pages/ViewPage.js +0 -105
- package/lib/mu/texts/DateText.d.ts +0 -34
- package/lib/mu/texts/DateText.js +0 -25
- package/lib/mu/texts/MoneyText.d.ts +0 -21
- package/lib/mu/texts/MoneyText.js +0 -14
- package/lib/mu/texts/NumberText.d.ts +0 -25
- package/lib/mu/texts/NumberText.js +0 -14
- package/src/app/CommonApp.ts +0 -225
- package/src/app/IServiceAppSettings.ts +0 -13
- package/src/app/IServicePage.ts +0 -6
- package/src/app/IServiceUser.ts +0 -17
- package/src/app/ISmartERPUser.ts +0 -16
- package/src/app/Labels.ts +0 -77
- package/src/app/ReactApp.ts +0 -500
- package/src/app/ServiceApp.ts +0 -353
- package/src/components/ShowDataComparison.tsx +0 -108
- package/src/mu/AuditDisplay.tsx +0 -117
- package/src/mu/AutocompleteExtendedProps.ts +0 -84
- package/src/mu/BackButton.tsx +0 -55
- package/src/mu/BridgeCloseButton.tsx +0 -69
- package/src/mu/ButtonLink.tsx +0 -32
- package/src/mu/ComboBox.tsx +0 -244
- package/src/mu/CountdownButton.tsx +0 -119
- package/src/mu/CustomFabProps.ts +0 -32
- package/src/mu/DataGridEx.tsx +0 -712
- package/src/mu/DataGridRenderers.tsx +0 -140
- package/src/mu/DialogButton.tsx +0 -163
- package/src/mu/DraggablePaperComponent.tsx +0 -19
- package/src/mu/EmailInput.tsx +0 -24
- package/src/mu/FabBox.tsx +0 -51
- package/src/mu/FlexBox.tsx +0 -20
- package/src/mu/GridDataFormat.tsx +0 -77
- package/src/mu/GridMethodRef.ts +0 -12
- package/src/mu/IconButtonLink.tsx +0 -29
- package/src/mu/InputField.tsx +0 -82
- package/src/mu/ItemList.tsx +0 -201
- package/src/mu/ListItemRightIcon.tsx +0 -9
- package/src/mu/ListMoreDisplay.tsx +0 -205
- package/src/mu/LoadingButton.tsx +0 -75
- package/src/mu/MUGlobal.ts +0 -220
- package/src/mu/MaskInput.tsx +0 -107
- package/src/mu/MobileListItemRenderer.tsx +0 -79
- package/src/mu/MoreFab.tsx +0 -211
- package/src/mu/NotifierMU.tsx +0 -654
- package/src/mu/NotifierPromptProps.ts +0 -26
- package/src/mu/OptionGroup.tsx +0 -218
- package/src/mu/PList.tsx +0 -27
- package/src/mu/ProgressCount.tsx +0 -166
- package/src/mu/PullToRefreshUI.tsx +0 -21
- package/src/mu/RLink.tsx +0 -64
- package/src/mu/ResponsibleContainer.tsx +0 -394
- package/src/mu/ScrollTopFab.tsx +0 -34
- package/src/mu/ScrollerListEx.tsx +0 -387
- package/src/mu/SearchBar.tsx +0 -398
- package/src/mu/SearchField.tsx +0 -82
- package/src/mu/SearchOptionGroup.tsx +0 -25
- package/src/mu/SelectBool.tsx +0 -40
- package/src/mu/SelectEx.tsx +0 -285
- package/src/mu/Switch.tsx +0 -94
- package/src/mu/SwitchAnt.tsx +0 -95
- package/src/mu/TabBox.tsx +0 -118
- package/src/mu/TableEx.tsx +0 -561
- package/src/mu/TextFieldEx.tsx +0 -250
- package/src/mu/Tiplist.tsx +0 -304
- package/src/mu/TooltipClick.tsx +0 -84
- package/src/mu/UserAvatar.tsx +0 -64
- package/src/mu/UserAvatarEditor.tsx +0 -287
- package/src/mu/pages/CommonPage.tsx +0 -128
- package/src/mu/pages/CommonPageProps.ts +0 -71
- package/src/mu/pages/DataGridPage.tsx +0 -137
- package/src/mu/pages/DataGridPageProps.ts +0 -24
- package/src/mu/pages/EditPage.tsx +0 -114
- package/src/mu/pages/FixedListPage.tsx +0 -134
- package/src/mu/pages/ListPage.tsx +0 -86
- package/src/mu/pages/ListPageProps.ts +0 -11
- package/src/mu/pages/ResponsivePage.tsx +0 -68
- package/src/mu/pages/ResponsivePageProps.ts +0 -57
- package/src/mu/pages/SearchPageProps.ts +0 -39
- package/src/mu/pages/TablePage.tsx +0 -119
- package/src/mu/pages/TablePageProps.ts +0 -11
- package/src/mu/pages/ViewPage.tsx +0 -285
- package/src/mu/texts/DateText.tsx +0 -74
- package/src/mu/texts/MoneyText.tsx +0 -49
- package/src/mu/texts/NumberText.tsx +0 -40
package/lib/mu/DataGridEx.d.ts
DELETED
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
import { DataTypes } from '@etsoo/shared';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { GridColumn } from '../components/GridColumn';
|
|
4
|
-
import { GridLoaderStates } from '../components/GridLoader';
|
|
5
|
-
import { ScrollerGridProps } from '../components/ScrollerGrid';
|
|
6
|
-
import { MouseEventWithDataHandler } from './MUGlobal';
|
|
7
|
-
/**
|
|
8
|
-
* Footer item renderer props
|
|
9
|
-
*/
|
|
10
|
-
export declare type DataGridExFooterItemRendererProps<T extends object> = {
|
|
11
|
-
column: GridColumn<T>;
|
|
12
|
-
index: number;
|
|
13
|
-
states: GridLoaderStates<T>;
|
|
14
|
-
cellProps: any;
|
|
15
|
-
checkable: boolean;
|
|
16
|
-
};
|
|
17
|
-
/**
|
|
18
|
-
* Extended DataGrid with VariableSizeGrid props
|
|
19
|
-
*/
|
|
20
|
-
export declare type DataGridExProps<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>> = Omit<ScrollerGridProps<T, D>, 'itemRenderer' | 'columnCount' | 'columnWidth' | 'width'> & {
|
|
21
|
-
/**
|
|
22
|
-
* Alternating colors for odd/even rows
|
|
23
|
-
*/
|
|
24
|
-
alternatingColors?: [string?, string?];
|
|
25
|
-
/**
|
|
26
|
-
* Checkable to choose multiple items
|
|
27
|
-
* @default false
|
|
28
|
-
*/
|
|
29
|
-
checkable?: boolean;
|
|
30
|
-
/**
|
|
31
|
-
* Rows count to have the bottom border
|
|
32
|
-
*/
|
|
33
|
-
borderRowsCount?: number;
|
|
34
|
-
/**
|
|
35
|
-
* Bottom height
|
|
36
|
-
*/
|
|
37
|
-
bottomHeight?: number;
|
|
38
|
-
/**
|
|
39
|
-
* Columns
|
|
40
|
-
*/
|
|
41
|
-
columns: GridColumn<T>[];
|
|
42
|
-
/**
|
|
43
|
-
* Footer item renderer
|
|
44
|
-
*/
|
|
45
|
-
footerItemRenderer?: (rows: T[], props: DataGridExFooterItemRendererProps<T>) => React.ReactNode;
|
|
46
|
-
/**
|
|
47
|
-
* Header height
|
|
48
|
-
* @default 56
|
|
49
|
-
*/
|
|
50
|
-
headerHeight?: number;
|
|
51
|
-
/**
|
|
52
|
-
* Hide the footer
|
|
53
|
-
* @default false
|
|
54
|
-
*/
|
|
55
|
-
hideFooter?: boolean;
|
|
56
|
-
/**
|
|
57
|
-
* Hover color
|
|
58
|
-
*/
|
|
59
|
-
hoverColor?: string;
|
|
60
|
-
/**
|
|
61
|
-
* Double click handler
|
|
62
|
-
*/
|
|
63
|
-
onDoubleClick?: MouseEventWithDataHandler<T>;
|
|
64
|
-
/**
|
|
65
|
-
* Click handler
|
|
66
|
-
*/
|
|
67
|
-
onClick?: MouseEventWithDataHandler<T>;
|
|
68
|
-
/**
|
|
69
|
-
* Selectable to support hover over and out effect and row clickable
|
|
70
|
-
* @default true
|
|
71
|
-
*/
|
|
72
|
-
selectable?: boolean;
|
|
73
|
-
/**
|
|
74
|
-
* Selected color
|
|
75
|
-
*/
|
|
76
|
-
selectedColor?: string;
|
|
77
|
-
/**
|
|
78
|
-
* Width
|
|
79
|
-
*/
|
|
80
|
-
width?: number;
|
|
81
|
-
};
|
|
82
|
-
/**
|
|
83
|
-
* Extended datagrid columns calculation
|
|
84
|
-
* @param columns
|
|
85
|
-
* @returns Total width and unset items
|
|
86
|
-
*/
|
|
87
|
-
export declare function DataGridExCalColumns<T>(columns: GridColumn<T>[]): {
|
|
88
|
-
total: number;
|
|
89
|
-
unset: number;
|
|
90
|
-
};
|
|
91
|
-
/**
|
|
92
|
-
* Extended DataGrid with VariableSizeGrid
|
|
93
|
-
* @param props Props
|
|
94
|
-
* @returns Component
|
|
95
|
-
*/
|
|
96
|
-
export declare function DataGridEx<T extends object, D extends DataTypes.Keys<T> = DataTypes.Keys<T>>(props: DataGridExProps<T, D>): JSX.Element;
|
package/lib/mu/DataGridEx.js
DELETED
|
@@ -1,331 +0,0 @@
|
|
|
1
|
-
import { css } from '@emotion/css';
|
|
2
|
-
import { Utils } from '@etsoo/shared';
|
|
3
|
-
import { Box, Checkbox, Paper, TableSortLabel, useTheme } from '@mui/material';
|
|
4
|
-
import React from 'react';
|
|
5
|
-
import { GridAlignGet } from '../components/GridColumn';
|
|
6
|
-
import { ScrollerGrid } from '../components/ScrollerGrid';
|
|
7
|
-
import useCombinedRefs from '../uses/useCombinedRefs';
|
|
8
|
-
import { DataGridRenderers } from './DataGridRenderers';
|
|
9
|
-
// Borders
|
|
10
|
-
const boldBorder = '2px solid rgba(224, 224, 224, 1)';
|
|
11
|
-
const thinBorder = '1px solid rgba(224, 224, 224, 1)';
|
|
12
|
-
// Scroll bar size
|
|
13
|
-
const scrollbarSize = 16;
|
|
14
|
-
// Minimum width
|
|
15
|
-
const minWidth = 120;
|
|
16
|
-
const createGridStyle = (alternatingColors, selectedColor, hoverColor) => {
|
|
17
|
-
return css({
|
|
18
|
-
'.DataGridEx-Selected': {
|
|
19
|
-
backgroundColor: selectedColor
|
|
20
|
-
},
|
|
21
|
-
'.DataGridEx-Hover:not(.DataGridEx-Selected)': {
|
|
22
|
-
backgroundColor: hoverColor
|
|
23
|
-
},
|
|
24
|
-
'& .DataGridEx-Cell0:not(.DataGridEx-Hover):not(.DataGridEx-Selected)': {
|
|
25
|
-
backgroundColor: alternatingColors[0]
|
|
26
|
-
},
|
|
27
|
-
'& .DataGridEx-Cell1:not(.DataGridEx-Hover):not(.DataGridEx-Selected)': {
|
|
28
|
-
backgroundColor: alternatingColors[1]
|
|
29
|
-
},
|
|
30
|
-
'& .DataGridEx-Cell-Border': {
|
|
31
|
-
borderBottom: thinBorder
|
|
32
|
-
}
|
|
33
|
-
});
|
|
34
|
-
};
|
|
35
|
-
const rowItems = (div, callback) => {
|
|
36
|
-
const row = div.dataset['row'];
|
|
37
|
-
if (div.parentElement == null || row == null)
|
|
38
|
-
return;
|
|
39
|
-
doRowItems(div.parentElement, parseFloat(row), callback);
|
|
40
|
-
};
|
|
41
|
-
const doRowItems = (parent, rowIndex, callback) => {
|
|
42
|
-
if (parent == null || rowIndex == null)
|
|
43
|
-
return;
|
|
44
|
-
parent === null || parent === void 0 ? void 0 : parent.querySelectorAll(`div[data-row="${rowIndex}"]`).forEach((rowItem) => {
|
|
45
|
-
callback(rowItem);
|
|
46
|
-
});
|
|
47
|
-
};
|
|
48
|
-
/**
|
|
49
|
-
* Extended datagrid columns calculation
|
|
50
|
-
* @param columns
|
|
51
|
-
* @returns Total width and unset items
|
|
52
|
-
*/
|
|
53
|
-
export function DataGridExCalColumns(columns) {
|
|
54
|
-
return columns.reduce((previousValue, currentItem) => {
|
|
55
|
-
var _a, _b;
|
|
56
|
-
previousValue.total +=
|
|
57
|
-
(_b = (_a = currentItem.width) !== null && _a !== void 0 ? _a : currentItem.minWidth) !== null && _b !== void 0 ? _b : minWidth;
|
|
58
|
-
if (currentItem.width == null)
|
|
59
|
-
previousValue.unset++;
|
|
60
|
-
return previousValue;
|
|
61
|
-
}, {
|
|
62
|
-
total: 0,
|
|
63
|
-
unset: 0
|
|
64
|
-
});
|
|
65
|
-
}
|
|
66
|
-
/**
|
|
67
|
-
* Extended DataGrid with VariableSizeGrid
|
|
68
|
-
* @param props Props
|
|
69
|
-
* @returns Component
|
|
70
|
-
*/
|
|
71
|
-
export function DataGridEx(props) {
|
|
72
|
-
// Theme
|
|
73
|
-
const theme = useTheme();
|
|
74
|
-
const defaultHeaderRenderer = (states) => {
|
|
75
|
-
const { orderBy } = states;
|
|
76
|
-
return (React.createElement(Box, { className: "DataGridEx-Header", display: "flex", alignItems: "center", borderBottom: boldBorder, fontWeight: 500, minWidth: widthCalculator.total, height: headerHeight }, columns.map((column, index) => {
|
|
77
|
-
// Destruct
|
|
78
|
-
const { align, field, header, headerCellRenderer, sortable, sortAsc = true, type } = column;
|
|
79
|
-
// Header text
|
|
80
|
-
const headerText = header !== null && header !== void 0 ? header : field;
|
|
81
|
-
// Cell props
|
|
82
|
-
const cellProps = {};
|
|
83
|
-
// Sortable
|
|
84
|
-
let sortLabel;
|
|
85
|
-
if (headerCellRenderer) {
|
|
86
|
-
sortLabel = headerCellRenderer({
|
|
87
|
-
cellProps,
|
|
88
|
-
column,
|
|
89
|
-
columnIndex: checkable ? index - 1 : index,
|
|
90
|
-
states
|
|
91
|
-
});
|
|
92
|
-
}
|
|
93
|
-
else if (sortable && field != null) {
|
|
94
|
-
const active = orderBy === field;
|
|
95
|
-
sortLabel = (React.createElement(TableSortLabel, { active: active, direction: sortAsc ? 'asc' : 'desc', onClick: (_event) => {
|
|
96
|
-
if (active)
|
|
97
|
-
column.sortAsc = !sortAsc;
|
|
98
|
-
handleSort(field, column.sortAsc);
|
|
99
|
-
} }, headerText));
|
|
100
|
-
}
|
|
101
|
-
else {
|
|
102
|
-
sortLabel = headerText;
|
|
103
|
-
}
|
|
104
|
-
return (React.createElement(Box, { key: field !== null && field !== void 0 ? field : index.toString(), textAlign: GridAlignGet(align, type), width: columnWidth(index) },
|
|
105
|
-
React.createElement(Box, { className: "DataGridEx-Cell", onMouseEnter: handleMouseEnter, ...cellProps }, sortLabel)));
|
|
106
|
-
})));
|
|
107
|
-
};
|
|
108
|
-
function defaultFooterRenderer(rows, states) {
|
|
109
|
-
return (React.createElement(Box, { className: "DataGridEx-Footer", display: "flex", alignItems: "center", borderTop: thinBorder, marginTop: "1px", minWidth: widthCalculator.total, height: bottomHeight - 1 }, columns.map((column, index) => {
|
|
110
|
-
// Destruct
|
|
111
|
-
const { align, field, type } = column;
|
|
112
|
-
// Cell props
|
|
113
|
-
const cellProps = {};
|
|
114
|
-
// Cell
|
|
115
|
-
const cell = footerItemRenderer
|
|
116
|
-
? footerItemRenderer(rows, {
|
|
117
|
-
column,
|
|
118
|
-
index: checkable ? index - 1 : index,
|
|
119
|
-
states,
|
|
120
|
-
cellProps,
|
|
121
|
-
checkable
|
|
122
|
-
})
|
|
123
|
-
: undefined;
|
|
124
|
-
return (React.createElement(Box, { key: 'bottom-' + (field !== null && field !== void 0 ? field : index.toString()), textAlign: GridAlignGet(align, type), width: columnWidth(index) },
|
|
125
|
-
React.createElement(Box, { className: "DataGridEx-Cell", onMouseEnter: handleMouseEnter, ...cellProps }, cell)));
|
|
126
|
-
})));
|
|
127
|
-
}
|
|
128
|
-
// Destruct
|
|
129
|
-
const { alternatingColors = [theme.palette.grey[100], undefined], borderRowsCount, bottomHeight = 53, checkable = false, className, columns, defaultOrderBy, height, headerHeight = 56, headerRenderer = defaultHeaderRenderer, footerRenderer = defaultFooterRenderer, footerItemRenderer = DataGridRenderers.defaultFooterItemRenderer, hideFooter = false, hoverColor = '#f6f9fb', idField = 'id', mRef = React.createRef(), onClick, onDoubleClick, selectable = true, selectedColor = '#edf4fb', width, ...rest } = props;
|
|
130
|
-
if (checkable) {
|
|
131
|
-
const cbColumn = {
|
|
132
|
-
field: 'selected',
|
|
133
|
-
header: '',
|
|
134
|
-
sortable: false,
|
|
135
|
-
width: 50,
|
|
136
|
-
cellRenderer: ({ cellProps, data, selected }) => {
|
|
137
|
-
cellProps.sx = {
|
|
138
|
-
padding: '4px!important'
|
|
139
|
-
};
|
|
140
|
-
return (React.createElement(Checkbox, { color: "primary", checked: selected, onChange: (_event, checked) => {
|
|
141
|
-
var _a;
|
|
142
|
-
(_a = refs.current.ref) === null || _a === void 0 ? void 0 : _a.selectItem(data, checked);
|
|
143
|
-
} }));
|
|
144
|
-
},
|
|
145
|
-
headerCellRenderer: ({ cellProps, states }) => {
|
|
146
|
-
// 2 = border height
|
|
147
|
-
const hpad = (headerHeight - 42) / 2;
|
|
148
|
-
cellProps.sx = {
|
|
149
|
-
padding: `${hpad}px 4px ${hpad - 1}px 4px!important`
|
|
150
|
-
};
|
|
151
|
-
return (React.createElement(Checkbox, { color: "primary", indeterminate: states.selectedItems.length > 0 &&
|
|
152
|
-
states.selectedItems.length < states.loadedItems, checked: states.selectedItems.length > 0, onChange: (_event, checked) => { var _a; return (_a = refs.current.ref) === null || _a === void 0 ? void 0 : _a.selectAll(checked); } }));
|
|
153
|
-
}
|
|
154
|
-
};
|
|
155
|
-
// Update to the latest version
|
|
156
|
-
if (columns[0].field === 'selected') {
|
|
157
|
-
columns[0] = cbColumn;
|
|
158
|
-
}
|
|
159
|
-
else {
|
|
160
|
-
columns.unshift(cbColumn);
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
const refs = React.useRef({});
|
|
164
|
-
const mRefLocal = useCombinedRefs(mRef, (ref) => {
|
|
165
|
-
if (ref == null)
|
|
166
|
-
return;
|
|
167
|
-
refs.current.ref = ref;
|
|
168
|
-
});
|
|
169
|
-
// New sort
|
|
170
|
-
const handleSort = (field, asc) => {
|
|
171
|
-
reset({ orderBy: field, orderByAsc: asc });
|
|
172
|
-
};
|
|
173
|
-
// Reset
|
|
174
|
-
const reset = (add) => {
|
|
175
|
-
var _a;
|
|
176
|
-
(_a = refs.current.ref) === null || _a === void 0 ? void 0 : _a.reset(add);
|
|
177
|
-
};
|
|
178
|
-
// Show hover tooltip for trucated text
|
|
179
|
-
const handleMouseEnter = (event) => {
|
|
180
|
-
const div = event.currentTarget;
|
|
181
|
-
const { innerText, offsetWidth, scrollWidth } = div;
|
|
182
|
-
if (offsetWidth < scrollWidth) {
|
|
183
|
-
div.title = innerText;
|
|
184
|
-
}
|
|
185
|
-
else {
|
|
186
|
-
div.title = '';
|
|
187
|
-
}
|
|
188
|
-
};
|
|
189
|
-
// selectedRowIndex state
|
|
190
|
-
const selectedRowIndex = React.useRef(-1);
|
|
191
|
-
const handleMouseDown = (event) => {
|
|
192
|
-
const div = event.currentTarget;
|
|
193
|
-
const row = div.dataset['row'];
|
|
194
|
-
if (div.parentElement == null || row == null)
|
|
195
|
-
return;
|
|
196
|
-
const rowIndex = parseFloat(row);
|
|
197
|
-
// No change
|
|
198
|
-
if (isNaN(rowIndex) || rowIndex === selectedRowIndex.current)
|
|
199
|
-
return;
|
|
200
|
-
if (selectedRowIndex.current != -1) {
|
|
201
|
-
doRowItems(div.parentElement, selectedRowIndex.current, (preDiv) => {
|
|
202
|
-
preDiv.classList.remove('DataGridEx-Selected');
|
|
203
|
-
});
|
|
204
|
-
}
|
|
205
|
-
rowItems(div, (currentDiv) => {
|
|
206
|
-
currentDiv.classList.add('DataGridEx-Selected');
|
|
207
|
-
});
|
|
208
|
-
selectedRowIndex.current = rowIndex;
|
|
209
|
-
};
|
|
210
|
-
const handleMouseOver = (event) => {
|
|
211
|
-
rowItems(event.currentTarget, (div) => {
|
|
212
|
-
div.classList.add('DataGridEx-Hover');
|
|
213
|
-
});
|
|
214
|
-
};
|
|
215
|
-
const handleMouseOut = (event) => {
|
|
216
|
-
rowItems(event.currentTarget, (div) => {
|
|
217
|
-
div.classList.remove('DataGridEx-Hover');
|
|
218
|
-
});
|
|
219
|
-
};
|
|
220
|
-
/**
|
|
221
|
-
* Item renderer
|
|
222
|
-
*/
|
|
223
|
-
const itemRenderer = ({ columnIndex, rowIndex, style, data, selectedItems }) => {
|
|
224
|
-
// Column
|
|
225
|
-
const { align, cellRenderer = DataGridRenderers.defaultCellRenderer, field, type, valueFormatter, renderProps } = columns[columnIndex];
|
|
226
|
-
// Props
|
|
227
|
-
const formatProps = {
|
|
228
|
-
data,
|
|
229
|
-
field,
|
|
230
|
-
rowIndex,
|
|
231
|
-
columnIndex
|
|
232
|
-
};
|
|
233
|
-
let rowClass = `DataGridEx-Cell${rowIndex % 2}`;
|
|
234
|
-
if (borderRowsCount != null &&
|
|
235
|
-
borderRowsCount > 0 &&
|
|
236
|
-
(rowIndex + 1) % borderRowsCount === 0) {
|
|
237
|
-
rowClass += ` DataGridEx-Cell-Border`;
|
|
238
|
-
}
|
|
239
|
-
// Selected
|
|
240
|
-
const selected = data != null &&
|
|
241
|
-
(selectedRowIndex.current === rowIndex ||
|
|
242
|
-
selectedItems.some((selectedItem) => selectedItem != null &&
|
|
243
|
-
selectedItem[idField] === data[idField]));
|
|
244
|
-
if (selected) {
|
|
245
|
-
rowClass += ` DataGridEx-Selected`;
|
|
246
|
-
}
|
|
247
|
-
const cellProps = {
|
|
248
|
-
className: 'DataGridEx-Cell',
|
|
249
|
-
textAlign: GridAlignGet(align, type)
|
|
250
|
-
};
|
|
251
|
-
const child = cellRenderer({
|
|
252
|
-
data,
|
|
253
|
-
field,
|
|
254
|
-
formattedValue: valueFormatter
|
|
255
|
-
? valueFormatter(formatProps)
|
|
256
|
-
: undefined,
|
|
257
|
-
selected,
|
|
258
|
-
type,
|
|
259
|
-
rowIndex,
|
|
260
|
-
columnIndex,
|
|
261
|
-
cellProps,
|
|
262
|
-
renderProps
|
|
263
|
-
});
|
|
264
|
-
return (React.createElement("div", { className: rowClass, style: style, "data-row": rowIndex, "data-column": columnIndex, onMouseDown: selectable && !checkable ? handleMouseDown : undefined, onMouseOver: selectable ? handleMouseOver : undefined, onMouseOut: selectable ? handleMouseOut : undefined, onClick: (event) => onClick && data != null && onClick(event, data), onDoubleClick: (event) => onDoubleClick && data != null && onDoubleClick(event, data) },
|
|
265
|
-
React.createElement(Box, { ...cellProps, onMouseEnter: handleMouseEnter }, child)));
|
|
266
|
-
};
|
|
267
|
-
// Column width calculator
|
|
268
|
-
const widthCalculator = React.useMemo(() => DataGridExCalColumns(columns), [columns]);
|
|
269
|
-
// Column width
|
|
270
|
-
const columnWidth = React.useCallback((index) => {
|
|
271
|
-
// Ignore null case
|
|
272
|
-
if (width == null)
|
|
273
|
-
return 0;
|
|
274
|
-
// Column
|
|
275
|
-
const column = columns[index];
|
|
276
|
-
if (column.width != null)
|
|
277
|
-
return column.width;
|
|
278
|
-
// More space
|
|
279
|
-
const leftWidth = width -
|
|
280
|
-
widthCalculator.total -
|
|
281
|
-
(width < 800 ? 0 : scrollbarSize);
|
|
282
|
-
// Shared width
|
|
283
|
-
const sharedWidth = leftWidth > 0 ? leftWidth / widthCalculator.unset : 0;
|
|
284
|
-
return (column.minWidth || minWidth) + sharedWidth;
|
|
285
|
-
}, [columns, width]);
|
|
286
|
-
// Table
|
|
287
|
-
const table = React.useMemo(() => {
|
|
288
|
-
var _a;
|
|
289
|
-
const defaultOrderByAsc = defaultOrderBy
|
|
290
|
-
? (_a = columns.find((column) => column.field === defaultOrderBy)) === null || _a === void 0 ? void 0 : _a.sortAsc
|
|
291
|
-
: undefined;
|
|
292
|
-
return (React.createElement(ScrollerGrid, { className: Utils.mergeClasses('DataGridEx-Body', 'DataGridEx-CustomBar', className, createGridStyle(alternatingColors, selectedColor, hoverColor)), columnCount: columns.length, columnWidth: columnWidth, defaultOrderBy: defaultOrderBy, defaultOrderByAsc: defaultOrderByAsc, height: height -
|
|
293
|
-
headerHeight -
|
|
294
|
-
(hideFooter ? 0 : bottomHeight + 1) -
|
|
295
|
-
scrollbarSize, headerRenderer: headerRenderer, idField: idField, itemRenderer: itemRenderer, footerRenderer: hideFooter ? undefined : footerRenderer, width: Math.max(width !== null && width !== void 0 ? width : 0, widthCalculator.total), mRef: mRefLocal, ...rest }));
|
|
296
|
-
}, [width]);
|
|
297
|
-
return (React.createElement(Paper, { sx: {
|
|
298
|
-
fontSize: '0.875rem',
|
|
299
|
-
height,
|
|
300
|
-
'& .DataGridEx-Cell': {
|
|
301
|
-
padding: 2,
|
|
302
|
-
whiteSpace: 'nowrap',
|
|
303
|
-
overflow: 'hidden',
|
|
304
|
-
textOverflow: 'ellipsis'
|
|
305
|
-
},
|
|
306
|
-
'& .DataGridEx-CustomBar': {
|
|
307
|
-
'@media (min-width: 800px)': {
|
|
308
|
-
'::-webkit-scrollbar': {
|
|
309
|
-
width: scrollbarSize,
|
|
310
|
-
height: scrollbarSize,
|
|
311
|
-
backgroundColor: '#f6f6f6'
|
|
312
|
-
},
|
|
313
|
-
'::-webkit-scrollbar-thumb': {
|
|
314
|
-
backgroundColor: 'rgba(0,0,0,0.4)',
|
|
315
|
-
borderRadius: '2px'
|
|
316
|
-
},
|
|
317
|
-
'::-webkit-scrollbar-track-piece:start': {
|
|
318
|
-
background: 'transparent'
|
|
319
|
-
},
|
|
320
|
-
'::-webkit-scrollbar-track-piece:end': {
|
|
321
|
-
background: 'transparent'
|
|
322
|
-
}
|
|
323
|
-
}
|
|
324
|
-
}
|
|
325
|
-
} },
|
|
326
|
-
React.createElement("div", { className: "DataGridEx-CustomBar", style: {
|
|
327
|
-
width,
|
|
328
|
-
overflowX: 'auto',
|
|
329
|
-
overflowY: 'hidden'
|
|
330
|
-
} }, table)));
|
|
331
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { GridCellRendererProps } from '../components/GridColumn';
|
|
3
|
-
import { DataGridExFooterItemRendererProps } from './DataGridEx';
|
|
4
|
-
/**
|
|
5
|
-
* Data grid renderers
|
|
6
|
-
*/
|
|
7
|
-
export declare namespace DataGridRenderers {
|
|
8
|
-
/**
|
|
9
|
-
* Default cell renderer
|
|
10
|
-
* @param param Props
|
|
11
|
-
* @returns Component
|
|
12
|
-
*/
|
|
13
|
-
function defaultCellRenderer<T extends Record<string, any>>({ cellProps, data, field, formattedValue, columnIndex, type, renderProps }: GridCellRendererProps<T>): React.ReactNode;
|
|
14
|
-
/**
|
|
15
|
-
* Default footer item renderer
|
|
16
|
-
* @param rows Rows
|
|
17
|
-
* @param props Renderer props
|
|
18
|
-
* @param location Renderer location (column index)
|
|
19
|
-
* @returns Component
|
|
20
|
-
*/
|
|
21
|
-
function defaultFooterItemRenderer<T extends object>(_rows: T[], { index, states, checkable }: DataGridExFooterItemRendererProps<T>, location?: number): string | undefined;
|
|
22
|
-
}
|
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { CircularProgress } from '@mui/material';
|
|
3
|
-
import { GridDataType } from '../components/GridColumn';
|
|
4
|
-
import { DateUtils, NumberUtils } from '@etsoo/shared';
|
|
5
|
-
import CheckIcon from '@mui/icons-material/Check';
|
|
6
|
-
import ClearIcon from '@mui/icons-material/Clear';
|
|
7
|
-
import { DateText } from './texts/DateText';
|
|
8
|
-
/**
|
|
9
|
-
* Data grid renderers
|
|
10
|
-
*/
|
|
11
|
-
export var DataGridRenderers;
|
|
12
|
-
(function (DataGridRenderers) {
|
|
13
|
-
/**
|
|
14
|
-
* Default cell renderer
|
|
15
|
-
* @param param Props
|
|
16
|
-
* @returns Component
|
|
17
|
-
*/
|
|
18
|
-
function defaultCellRenderer({ cellProps, data, field, formattedValue, columnIndex, type, renderProps }) {
|
|
19
|
-
// Is loading
|
|
20
|
-
if (data == null) {
|
|
21
|
-
// First column, show loading indicator
|
|
22
|
-
if (columnIndex === 0)
|
|
23
|
-
return React.createElement(CircularProgress, { size: 15 });
|
|
24
|
-
// Others return undefined
|
|
25
|
-
return undefined;
|
|
26
|
-
}
|
|
27
|
-
// No formatted value and data field
|
|
28
|
-
if (formattedValue == null && field == null)
|
|
29
|
-
return undefined;
|
|
30
|
-
// Cell value
|
|
31
|
-
const value = formattedValue !== null && formattedValue !== void 0 ? formattedValue : data[field];
|
|
32
|
-
if (value == null)
|
|
33
|
-
return undefined;
|
|
34
|
-
// For date time
|
|
35
|
-
// Conversion if necessary
|
|
36
|
-
if (type === GridDataType.Date || type === GridDataType.DateTime) {
|
|
37
|
-
const dateValue = value instanceof Date ? value : new Date(value);
|
|
38
|
-
const option = type === GridDataType.DateTime ? 'ds' : 'd';
|
|
39
|
-
const nearDays = renderProps === null || renderProps === void 0 ? void 0 : renderProps.nearDays;
|
|
40
|
-
if (nearDays != null) {
|
|
41
|
-
return (React.createElement(DateText, { value: dateValue, locale: renderProps === null || renderProps === void 0 ? void 0 : renderProps.culture, timeZone: renderProps === null || renderProps === void 0 ? void 0 : renderProps.timeZone, options: option, nearDays: nearDays }));
|
|
42
|
-
}
|
|
43
|
-
return DateUtils.format(dateValue, renderProps === null || renderProps === void 0 ? void 0 : renderProps.culture, option, renderProps === null || renderProps === void 0 ? void 0 : renderProps.timeZone);
|
|
44
|
-
}
|
|
45
|
-
// For numbers
|
|
46
|
-
if (typeof value === 'number') {
|
|
47
|
-
if (type === GridDataType.Money || type === GridDataType.IntMoney)
|
|
48
|
-
return NumberUtils.formatMoney(value, renderProps === null || renderProps === void 0 ? void 0 : renderProps.currency, renderProps === null || renderProps === void 0 ? void 0 : renderProps.culture, type === GridDataType.IntMoney, renderProps === null || renderProps === void 0 ? void 0 : renderProps.numberFormatOptions);
|
|
49
|
-
else
|
|
50
|
-
return NumberUtils.format(value, renderProps === null || renderProps === void 0 ? void 0 : renderProps.culture, renderProps === null || renderProps === void 0 ? void 0 : renderProps.numberFormatOptions);
|
|
51
|
-
}
|
|
52
|
-
// For boolean
|
|
53
|
-
if (typeof value === 'boolean') {
|
|
54
|
-
// Add style
|
|
55
|
-
if ('align' in cellProps) {
|
|
56
|
-
cellProps.sx = {
|
|
57
|
-
paddingTop: '12px!important',
|
|
58
|
-
paddingBottom: '6px!important'
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
else {
|
|
62
|
-
cellProps.sx = {
|
|
63
|
-
paddingTop: '16px!important',
|
|
64
|
-
paddingBottom: '8px!important'
|
|
65
|
-
};
|
|
66
|
-
}
|
|
67
|
-
if (value)
|
|
68
|
-
return React.createElement(CheckIcon, { fontSize: "small" });
|
|
69
|
-
else
|
|
70
|
-
return React.createElement(ClearIcon, { fontSize: "small", color: "warning" });
|
|
71
|
-
}
|
|
72
|
-
// To string
|
|
73
|
-
return new String(value);
|
|
74
|
-
}
|
|
75
|
-
DataGridRenderers.defaultCellRenderer = defaultCellRenderer;
|
|
76
|
-
/**
|
|
77
|
-
* Default footer item renderer
|
|
78
|
-
* @param rows Rows
|
|
79
|
-
* @param props Renderer props
|
|
80
|
-
* @param location Renderer location (column index)
|
|
81
|
-
* @returns Component
|
|
82
|
-
*/
|
|
83
|
-
function defaultFooterItemRenderer(_rows, { index, states, checkable }, location = 0) {
|
|
84
|
-
const { selectedItems, loadedItems, hasNextPage } = states;
|
|
85
|
-
if (index === location) {
|
|
86
|
-
if (checkable) {
|
|
87
|
-
return [
|
|
88
|
-
selectedItems.length,
|
|
89
|
-
loadedItems.toLocaleString() + (hasNextPage ? '+' : '')
|
|
90
|
-
].join(' / ');
|
|
91
|
-
}
|
|
92
|
-
else {
|
|
93
|
-
return loadedItems.toLocaleString() + (hasNextPage ? '+' : '');
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
return undefined;
|
|
97
|
-
}
|
|
98
|
-
DataGridRenderers.defaultFooterItemRenderer = defaultFooterItemRenderer;
|
|
99
|
-
})(DataGridRenderers || (DataGridRenderers = {}));
|
package/lib/mu/DialogButton.d.ts
DELETED
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import { Breakpoint, ButtonProps } from '@mui/material';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
export interface DialogButtonProps extends ButtonProps {
|
|
4
|
-
/**
|
|
5
|
-
* Button label
|
|
6
|
-
*/
|
|
7
|
-
buttonLabel?: string;
|
|
8
|
-
/**
|
|
9
|
-
* Dialog content
|
|
10
|
-
*/
|
|
11
|
-
content: string;
|
|
12
|
-
/**
|
|
13
|
-
* Show content in pre component
|
|
14
|
-
*/
|
|
15
|
-
contentPre?: boolean;
|
|
16
|
-
/**
|
|
17
|
-
* Default is label
|
|
18
|
-
*/
|
|
19
|
-
dialogTitle?: string;
|
|
20
|
-
/**
|
|
21
|
-
* Disable the scroll lock behavior.
|
|
22
|
-
* @default false
|
|
23
|
-
*/
|
|
24
|
-
disableScrollLock?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* Show fullscreen dialog
|
|
27
|
-
*/
|
|
28
|
-
fullScreen?: boolean;
|
|
29
|
-
/**
|
|
30
|
-
* If `true`, the dialog stretches to `maxWidth`.
|
|
31
|
-
*
|
|
32
|
-
* Notice that the dialog width grow is limited by the default margin.
|
|
33
|
-
* @default false
|
|
34
|
-
*/
|
|
35
|
-
fullWidth?: boolean;
|
|
36
|
-
/**
|
|
37
|
-
* Other layouts
|
|
38
|
-
*/
|
|
39
|
-
inputs?: React.ReactNode;
|
|
40
|
-
/**
|
|
41
|
-
* Max width of the dialog
|
|
42
|
-
*/
|
|
43
|
-
maxWidth?: Breakpoint | false;
|
|
44
|
-
/**
|
|
45
|
-
* Icon button
|
|
46
|
-
*/
|
|
47
|
-
icon?: React.ReactNode;
|
|
48
|
-
}
|
|
49
|
-
/**
|
|
50
|
-
* Dialog button
|
|
51
|
-
* @param props Props
|
|
52
|
-
* @returns Component
|
|
53
|
-
*/
|
|
54
|
-
export declare function DialogButton(props: DialogButtonProps): JSX.Element;
|
package/lib/mu/DialogButton.js
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, IconButton } from '@mui/material';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { Labels } from '../app/Labels';
|
|
4
|
-
/**
|
|
5
|
-
* Dialog button
|
|
6
|
-
* @param props Props
|
|
7
|
-
* @returns Component
|
|
8
|
-
*/
|
|
9
|
-
export function DialogButton(props) {
|
|
10
|
-
var _a;
|
|
11
|
-
// Labels shared with NotificationMU
|
|
12
|
-
const labels = Labels.NotificationMU;
|
|
13
|
-
// Destruct
|
|
14
|
-
const { buttonLabel = labels.alertOK, children, content, contentPre, dialogTitle, disableScrollLock, fullScreen, fullWidth, icon, inputs, maxWidth, onClick, title, ...rest } = props;
|
|
15
|
-
// Open state
|
|
16
|
-
const [open, setOpen] = React.useState(false);
|
|
17
|
-
const handleClickOpen = () => {
|
|
18
|
-
setOpen(true);
|
|
19
|
-
};
|
|
20
|
-
// Onclick handler
|
|
21
|
-
const onClickLocal = (event) => {
|
|
22
|
-
// Stop propagation
|
|
23
|
-
event.stopPropagation();
|
|
24
|
-
event.preventDefault();
|
|
25
|
-
// Show dialog
|
|
26
|
-
handleClickOpen();
|
|
27
|
-
// Additional callback
|
|
28
|
-
if (onClick)
|
|
29
|
-
onClick(event);
|
|
30
|
-
};
|
|
31
|
-
// Layout
|
|
32
|
-
return (React.createElement(React.Fragment, null,
|
|
33
|
-
icon == null ? (React.createElement(Button, { ...rest, title: title, onClick: onClickLocal }, children)) : (React.createElement(IconButton, { ...rest, onClick: onClickLocal, title: title !== null && title !== void 0 ? title : children === null || children === void 0 ? void 0 : children.toString() }, icon)),
|
|
34
|
-
React.createElement(Dialog, { disableScrollLock: disableScrollLock, fullScreen: fullScreen, fullWidth: fullWidth, maxWidth: maxWidth, open: open, onClose: () => setOpen(false), onClick: (event) => {
|
|
35
|
-
// The dialog will be embeded and the click event will bubble up
|
|
36
|
-
// Stop propatation but will also cancel onClose and onBackdropClick event
|
|
37
|
-
event.stopPropagation();
|
|
38
|
-
} },
|
|
39
|
-
React.createElement(DialogTitle, null, (_a = dialogTitle !== null && dialogTitle !== void 0 ? dialogTitle : title) !== null && _a !== void 0 ? _a : children),
|
|
40
|
-
React.createElement(DialogContent, null,
|
|
41
|
-
React.createElement(DialogContentText, { component: contentPre ? 'pre' : 'span' }, content),
|
|
42
|
-
inputs),
|
|
43
|
-
React.createElement(DialogActions, null,
|
|
44
|
-
React.createElement(Button, { onClick: () => setOpen(false) }, buttonLabel)))));
|
|
45
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { Paper } from '@mui/material';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import Draggable from 'react-draggable';
|
|
4
|
-
/**
|
|
5
|
-
* Draggable paper component
|
|
6
|
-
* @param props Props
|
|
7
|
-
* @returns Component
|
|
8
|
-
*/
|
|
9
|
-
export function DraggablePaperComponent(props) {
|
|
10
|
-
return (React.createElement(Draggable, { handle: ".draggable-dialog-title", cancel: '[class*="MuiDialogContent-root"]' },
|
|
11
|
-
React.createElement(Paper, { ...props })));
|
|
12
|
-
}
|
package/lib/mu/EmailInput.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { TextFieldProps } from '@mui/material';
|
|
3
|
-
/**
|
|
4
|
-
* Email input props
|
|
5
|
-
*/
|
|
6
|
-
export declare type EmailInputProps = Omit<TextFieldProps, 'type'> & {};
|
|
7
|
-
/**
|
|
8
|
-
* Email input
|
|
9
|
-
* @param props Props
|
|
10
|
-
*/
|
|
11
|
-
export declare function EmailInput(props: EmailInputProps): JSX.Element;
|