@etsoo/materialui 1.4.22 → 1.4.23

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.
Files changed (92) hide show
  1. package/README.md +2 -1
  2. package/babel.config.json +12 -12
  3. package/lib/AddresSelector.d.ts +8 -2
  4. package/lib/AddresSelector.js +1 -1
  5. package/lib/AuditDisplay.d.ts +1 -1
  6. package/lib/BackButton.d.ts +1 -1
  7. package/lib/BackButton.js +5 -5
  8. package/lib/CountryList.d.ts +5 -4
  9. package/lib/CountryList.js +3 -3
  10. package/lib/CustomFabProps.d.ts +3 -3
  11. package/lib/DataGridEx.js +3 -6
  12. package/lib/DataGridRenderers.d.ts +3 -3
  13. package/lib/DataGridRenderers.js +17 -17
  14. package/lib/DataTable.d.ts +1 -7
  15. package/lib/DataTable.js +3 -13
  16. package/lib/DialogButton.d.ts +2 -2
  17. package/lib/DialogButton.js +4 -4
  18. package/lib/EmailInput.d.ts +2 -2
  19. package/lib/EmailInput.js +2 -2
  20. package/lib/FlexBox.d.ts +3 -3
  21. package/lib/FlexBox.js +1 -1
  22. package/lib/GridDataFormat.d.ts +2 -2
  23. package/lib/GridDataFormat.js +7 -7
  24. package/lib/GridUtils.js +2 -1
  25. package/lib/ListItemRightIcon.d.ts +1 -1
  26. package/lib/ListItemRightIcon.js +2 -2
  27. package/lib/LoadingButton.d.ts +1 -1
  28. package/lib/LoadingButton.js +2 -2
  29. package/lib/MUGlobal.d.ts +6 -6
  30. package/lib/MUGlobal.js +20 -22
  31. package/lib/MobileListItemRenderer.d.ts +3 -3
  32. package/lib/MobileListItemRenderer.js +8 -10
  33. package/lib/PList.js +1 -1
  34. package/lib/ProgressCount.js +12 -12
  35. package/lib/RegionsRQ.d.ts +22 -0
  36. package/lib/RegionsRQ.js +1 -0
  37. package/lib/SearchField.d.ts +1 -1
  38. package/lib/SearchField.js +4 -4
  39. package/lib/SearchOptionGroup.d.ts +2 -2
  40. package/lib/SearchOptionGroup.js +3 -3
  41. package/lib/Switch.d.ts +3 -3
  42. package/lib/Switch.js +5 -5
  43. package/lib/TabBox.d.ts +5 -5
  44. package/lib/TabBox.js +5 -5
  45. package/lib/TableEx.js +4 -7
  46. package/lib/TooltipClick.d.ts +3 -3
  47. package/lib/TooltipClick.js +3 -3
  48. package/lib/TwoFieldInput.d.ts +2 -2
  49. package/lib/TwoFieldInput.js +13 -13
  50. package/lib/app/IServicePage.d.ts +1 -1
  51. package/lib/app/Labels.d.ts +1 -1
  52. package/lib/app/Labels.js +31 -31
  53. package/lib/index.d.ts +1 -0
  54. package/lib/index.js +1 -0
  55. package/lib/texts/MoneyText.d.ts +1 -1
  56. package/lib/texts/MoneyText.js +3 -3
  57. package/lib/texts/NumberText.d.ts +1 -1
  58. package/lib/texts/NumberText.js +3 -3
  59. package/package.json +20 -20
  60. package/src/AddresSelector.tsx +31 -4
  61. package/src/AuditDisplay.tsx +1 -1
  62. package/src/BackButton.tsx +39 -39
  63. package/src/CountryList.tsx +49 -48
  64. package/src/CustomFabProps.ts +19 -19
  65. package/src/DataGridEx.tsx +2 -7
  66. package/src/DataGridRenderers.tsx +119 -119
  67. package/src/DataTable.tsx +2 -31
  68. package/src/DialogButton.tsx +149 -151
  69. package/src/EmailInput.tsx +9 -11
  70. package/src/FlexBox.tsx +6 -6
  71. package/src/GridDataFormat.tsx +58 -58
  72. package/src/GridUtils.ts +2 -1
  73. package/src/ListItemRightIcon.tsx +3 -3
  74. package/src/LoadingButton.tsx +53 -53
  75. package/src/MUGlobal.ts +196 -203
  76. package/src/MobileListItemRenderer.tsx +63 -65
  77. package/src/NotifierPromptProps.ts +16 -16
  78. package/src/PList.tsx +14 -14
  79. package/src/ProgressCount.tsx +144 -148
  80. package/src/RegionsRQ.ts +26 -0
  81. package/src/SearchField.tsx +59 -59
  82. package/src/SearchOptionGroup.tsx +20 -20
  83. package/src/Switch.tsx +72 -72
  84. package/src/TabBox.tsx +87 -89
  85. package/src/TableEx.tsx +5 -8
  86. package/src/TooltipClick.tsx +62 -64
  87. package/src/TwoFieldInput.tsx +104 -104
  88. package/src/app/IServicePage.ts +1 -1
  89. package/src/app/Labels.ts +67 -67
  90. package/src/index.ts +1 -0
  91. package/src/texts/MoneyText.tsx +29 -35
  92. package/src/texts/NumberText.tsx +23 -23
package/lib/MUGlobal.js CHANGED
@@ -1,5 +1,5 @@
1
- import { NumberUtils } from '@etsoo/shared';
2
- import { Link } from 'react-router-dom';
1
+ import { NumberUtils } from "@etsoo/shared";
2
+ import { Link } from "react-router-dom";
3
3
  /**
4
4
  * MUGlobal for global configurations
5
5
  */
@@ -16,11 +16,11 @@ export class MUGlobal {
16
16
  // Exact match, most common case
17
17
  selected = true;
18
18
  }
19
- else if (href.endsWith('*')) {
19
+ else if (href.endsWith("*")) {
20
20
  href = href.slice(0, -1);
21
21
  selected = path.startsWith(href);
22
22
  }
23
- else if (href.endsWith('/all')) {
23
+ else if (href.endsWith("/all")) {
24
24
  selected = path.startsWith(href.slice(0, -3));
25
25
  }
26
26
  return {
@@ -29,7 +29,7 @@ export class MUGlobal {
29
29
  to: href,
30
30
  sx: {
31
31
  ...(selected && {
32
- '.MuiListItemIcon-root': {
32
+ ".MuiListItemIcon-root": {
33
33
  color: (theme) => theme.palette.primary.main
34
34
  }
35
35
  })
@@ -44,7 +44,7 @@ export class MUGlobal {
44
44
  static half(input) {
45
45
  const newObj = { ...input };
46
46
  Object.entries(newObj).forEach(([key, value]) => {
47
- if (typeof value === 'number') {
47
+ if (typeof value === "number") {
48
48
  Reflect.set(newObj, key, value / 2.0);
49
49
  }
50
50
  });
@@ -58,7 +58,7 @@ export class MUGlobal {
58
58
  static reverse(input) {
59
59
  const newObj = { ...input };
60
60
  Object.entries(newObj).forEach(([key, value]) => {
61
- if (typeof value === 'number') {
61
+ if (typeof value === "number") {
62
62
  Reflect.set(newObj, key, -value);
63
63
  }
64
64
  });
@@ -74,12 +74,10 @@ export class MUGlobal {
74
74
  static increase(input, adjust, field) {
75
75
  const newObj = { ...input };
76
76
  Object.entries(newObj).forEach(([key, value]) => {
77
- if (typeof value === 'number') {
77
+ if (typeof value === "number") {
78
78
  if (field == null || field === key) {
79
- const adjustValue = typeof adjust === 'number'
80
- ? adjust
81
- : Reflect.get(adjust, key);
82
- if (adjustValue == null || typeof adjustValue !== 'number')
79
+ const adjustValue = typeof adjust === "number" ? adjust : Reflect.get(adjust, key);
80
+ if (adjustValue == null || typeof adjustValue !== "number")
83
81
  return;
84
82
  Reflect.set(newObj, key, value + adjustValue);
85
83
  }
@@ -97,7 +95,7 @@ export class MUGlobal {
97
95
  static adjustWithTheme(size, adjust, updateFunc) {
98
96
  const newObj = { ...adjust };
99
97
  Object.entries(newObj).forEach(([key, value]) => {
100
- if (typeof value === 'number') {
98
+ if (typeof value === "number") {
101
99
  const newValue = NumberUtils.parseWithUnit(updateFunc(value));
102
100
  if (newValue != null) {
103
101
  Reflect.set(newObj, key, `${size - newValue[0]}${newValue[1]}`);
@@ -120,9 +118,9 @@ export class MUGlobal {
120
118
  for (let i = start; i >= 0; i--) {
121
119
  const key = this.breakpoints[i];
122
120
  const value = Reflect.get(spaces, key);
123
- if (typeof value === 'number') {
121
+ if (typeof value === "number") {
124
122
  const mediaRaw = theme.breakpoints.up(key);
125
- const mediaQuery = mediaRaw.substring(mediaRaw.indexOf('('));
123
+ const mediaQuery = mediaRaw.substring(mediaRaw.indexOf("("));
126
124
  if (window.matchMedia(mediaQuery).matches) {
127
125
  return parseInt(theme.spacing(value), 10);
128
126
  }
@@ -139,7 +137,7 @@ export class MUGlobal {
139
137
  static updateWithTheme(input, updateFunc) {
140
138
  const newObj = { ...input };
141
139
  Object.entries(newObj).forEach(([key, value]) => {
142
- if (typeof value === 'number') {
140
+ if (typeof value === "number") {
143
141
  Reflect.set(newObj, key, updateFunc(value));
144
142
  }
145
143
  });
@@ -153,11 +151,11 @@ MUGlobal.searchFieldShrink = true;
153
151
  /**
154
152
  * Search field size
155
153
  */
156
- MUGlobal.searchFieldSize = 'small';
154
+ MUGlobal.searchFieldSize = "small";
157
155
  /**
158
156
  * Search field variant
159
157
  */
160
- MUGlobal.searchFieldVariant = 'outlined';
158
+ MUGlobal.searchFieldVariant = "outlined";
161
159
  /**
162
160
  * Input field shrink
163
161
  */
@@ -165,15 +163,15 @@ MUGlobal.inputFieldShrink = true;
165
163
  /**
166
164
  * Input field size
167
165
  */
168
- MUGlobal.inputFieldSize = 'medium';
166
+ MUGlobal.inputFieldSize = "medium";
169
167
  /**
170
168
  * Input field variant
171
169
  */
172
- MUGlobal.inputFieldVariant = 'outlined';
170
+ MUGlobal.inputFieldVariant = "outlined";
173
171
  /**
174
172
  * TextField variant
175
173
  */
176
- MUGlobal.textFieldVariant = 'filled';
174
+ MUGlobal.textFieldVariant = "filled";
177
175
  /**
178
176
  * Page default paddings
179
177
  */
@@ -181,4 +179,4 @@ MUGlobal.pagePaddings = { xs: 2, sm: 3 };
181
179
  /**
182
180
  * Break points defined
183
181
  */
184
- MUGlobal.breakpoints = ['xs', 'sm', 'md', 'lg', 'xl'];
182
+ MUGlobal.breakpoints = ["xs", "sm", "md", "lg", "xl"];
@@ -1,6 +1,6 @@
1
- import { ListItemReact } from '@etsoo/react';
2
- import React from 'react';
3
- import { ScrollerListExInnerItemRendererProps } from './ScrollerListEx';
1
+ import { ListItemReact } from "@etsoo/react";
2
+ import React from "react";
3
+ import { ScrollerListExInnerItemRendererProps } from "./ScrollerListEx";
4
4
  /**
5
5
  * Default mobile list item renderer
6
6
  * @param param0 List renderer props
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Card, CardContent, CardHeader, LinearProgress } from '@mui/material';
3
- import { MoreFab } from './MoreFab';
2
+ import { Card, CardContent, CardHeader, LinearProgress } from "@mui/material";
3
+ import { MoreFab } from "./MoreFab";
4
4
  /**
5
5
  * Default mobile list item renderer
6
6
  * @param param0 List renderer props
@@ -18,15 +18,13 @@ export function MobileListItemRenderer({ data, itemHeight, margins }, renderer)
18
18
  height: itemHeight,
19
19
  ...margins
20
20
  }, children: [_jsx(CardHeader, { sx: { paddingBottom: 0.5 }, action: Array.isArray(actions) ? (_jsx(MoreFab, { iconButton: true, size: "small", anchorOrigin: {
21
- vertical: 'bottom',
22
- horizontal: 'right'
21
+ vertical: "bottom",
22
+ horizontal: "right"
23
23
  }, transformOrigin: {
24
- vertical: 'top',
25
- horizontal: 'right'
26
- }, actions: actions })) : (actions), title: title, titleTypographyProps: { variant: 'body2' }, subheader: subheader, subheaderTypographyProps: { variant: 'caption' } }), _jsx(CardContent, { sx: {
24
+ vertical: "top",
25
+ horizontal: "right"
26
+ }, actions: actions })) : (actions), title: title, titleTypographyProps: { variant: "body2" }, subheader: subheader, subheaderTypographyProps: { variant: "caption" } }), _jsx(CardContent, { sx: {
27
27
  paddingTop: 0,
28
- paddingBottom: cardActions == null
29
- ? Reflect.get(margins, 'marginBottom')
30
- : 0
28
+ paddingBottom: cardActions == null ? Reflect.get(margins, "marginBottom") : 0
31
29
  }, children: children }), cardActions] }));
32
30
  }
package/lib/PList.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import React from 'react';
2
+ import React from "react";
3
3
  /**
4
4
  * Paragraph items list
5
5
  * @param items Items
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Box, CircularProgress, LinearProgress, Typography } from '@mui/material';
3
- import React from 'react';
2
+ import { Box, CircularProgress, LinearProgress, Typography } from "@mui/material";
3
+ import React from "react";
4
4
  /**
5
5
  * Progress count
6
6
  * @param props Props
@@ -8,11 +8,11 @@ import React from 'react';
8
8
  */
9
9
  export function ProgressCount(props) {
10
10
  // Destruct
11
- const { countdown = true, linear = true, minWidth = 36, onComplete, onProgress, seconds, valueUnit = '' } = props;
11
+ const { countdown = true, linear = true, minWidth = 36, onComplete, onProgress, seconds, valueUnit = "" } = props;
12
12
  // Progress value
13
13
  const [value, setValue] = React.useState(countdown ? seconds : 0);
14
14
  // Variant
15
- const [variant, setVariant] = React.useState('determinate');
15
+ const [variant, setVariant] = React.useState("determinate");
16
16
  // Progress value
17
17
  const progressValue = (100.0 * value) / seconds;
18
18
  React.useEffect(() => {
@@ -32,7 +32,7 @@ export function ProgressCount(props) {
32
32
  // Finish
33
33
  if (result === false) {
34
34
  clearInterval(timer);
35
- setVariant('indeterminate');
35
+ setVariant("indeterminate");
36
36
  }
37
37
  }
38
38
  }
@@ -44,7 +44,7 @@ export function ProgressCount(props) {
44
44
  // Finish
45
45
  if (result === false) {
46
46
  clearInterval(timer);
47
- setVariant('indeterminate');
47
+ setVariant("indeterminate");
48
48
  }
49
49
  }
50
50
  }
@@ -59,15 +59,15 @@ export function ProgressCount(props) {
59
59
  };
60
60
  }, []);
61
61
  if (linear)
62
- return (_jsxs(Box, { sx: { display: 'flex', alignItems: 'center', width: '100%' }, children: [_jsx(Box, { sx: { width: '100%', mr: 1 }, children: _jsx(LinearProgress, { variant: variant, value: progressValue }) }), _jsx(Box, { sx: { minWidth }, children: _jsx(Typography, { variant: "body2", color: "text.secondary", children: `${value}${valueUnit}` }) })] }));
63
- return (_jsxs(Box, { sx: { position: 'relative', display: 'inline-flex' }, children: [_jsx(CircularProgress, { variant: variant, value: progressValue }), _jsx(Box, { sx: {
62
+ return (_jsxs(Box, { sx: { display: "flex", alignItems: "center", width: "100%" }, children: [_jsx(Box, { sx: { width: "100%", mr: 1 }, children: _jsx(LinearProgress, { variant: variant, value: progressValue }) }), _jsx(Box, { sx: { minWidth }, children: _jsx(Typography, { variant: "body2", color: "text.secondary", children: `${value}${valueUnit}` }) })] }));
63
+ return (_jsxs(Box, { sx: { position: "relative", display: "inline-flex" }, children: [_jsx(CircularProgress, { variant: variant, value: progressValue }), _jsx(Box, { sx: {
64
64
  top: 0,
65
65
  left: 0,
66
66
  bottom: 0,
67
67
  right: 0,
68
- position: 'absolute',
69
- display: 'flex',
70
- alignItems: 'center',
71
- justifyContent: 'center'
68
+ position: "absolute",
69
+ display: "flex",
70
+ alignItems: "center",
71
+ justifyContent: "center"
72
72
  }, children: _jsx(Typography, { variant: "caption", component: "div", color: "text.secondary", children: `${value}${valueUnit}` }) })] }));
73
73
  }
@@ -0,0 +1,22 @@
1
+ export type RegionsRQ = {
2
+ /**
3
+ * Country id
4
+ */
5
+ id?: string;
6
+ /**
7
+ * Favored country ids from top to bottom
8
+ */
9
+ favoredIds?: string[];
10
+ /**
11
+ * Items count to query
12
+ */
13
+ items?: number;
14
+ /**
15
+ * Filter keyword
16
+ */
17
+ keyword?: string;
18
+ /**
19
+ * Cultrue
20
+ */
21
+ culture?: string;
22
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -1,4 +1,4 @@
1
- import { TextFieldProps } from '@mui/material';
1
+ import { TextFieldProps } from "@mui/material";
2
2
  /**
3
3
  * Search field props
4
4
  */
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useDelayedExecutor } from '@etsoo/react';
3
- import { TextField } from '@mui/material';
4
- import React from 'react';
5
- import { MUGlobal } from './MUGlobal';
2
+ import { useDelayedExecutor } from "@etsoo/react";
3
+ import { TextField } from "@mui/material";
4
+ import React from "react";
5
+ import { MUGlobal } from "./MUGlobal";
6
6
  /**
7
7
  * Search field
8
8
  * @param props Props
@@ -1,5 +1,5 @@
1
- import { DataTypes, IdDefaultType, LabelDefaultType, ListType } from '@etsoo/shared';
2
- import { OptionGroupProps } from './OptionGroup';
1
+ import { DataTypes, IdDefaultType, LabelDefaultType, ListType } from "@etsoo/shared";
2
+ import { OptionGroupProps } from "./OptionGroup";
3
3
  /**
4
4
  * Search OptionGroup
5
5
  * @param props Props
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { MUGlobal } from './MUGlobal';
3
- import { OptionGroup } from './OptionGroup';
2
+ import { MUGlobal } from "./MUGlobal";
3
+ import { OptionGroup } from "./OptionGroup";
4
4
  /**
5
5
  * Search OptionGroup
6
6
  * @param props Props
@@ -8,7 +8,7 @@ import { OptionGroup } from './OptionGroup';
8
8
  */
9
9
  export function SearchOptionGroup(props) {
10
10
  // Destruct
11
- const { row = true, size = MUGlobal.searchFieldSize, sx = { '& .MuiFormLabel-root': { fontSize: '0.75em' } }, ...rest } = props;
11
+ const { row = true, size = MUGlobal.searchFieldSize, sx = { "& .MuiFormLabel-root": { fontSize: "0.75em" } }, ...rest } = props;
12
12
  // Layout
13
13
  return _jsx(OptionGroup, { row: row, size: size, sx: sx, ...rest });
14
14
  }
package/lib/Switch.d.ts CHANGED
@@ -1,8 +1,8 @@
1
- import { FormControlLabelProps } from '@mui/material';
1
+ import { FormControlLabelProps } from "@mui/material";
2
2
  /**
3
3
  * Switch props
4
4
  */
5
- export interface SwitchProps extends Omit<FormControlLabelProps, 'control'> {
5
+ export interface SwitchProps extends Omit<FormControlLabelProps, "control"> {
6
6
  /**
7
7
  * Value, default 'on'
8
8
  */
@@ -14,7 +14,7 @@ export interface SwitchProps extends Omit<FormControlLabelProps, 'control'> {
14
14
  /**
15
15
  * Size
16
16
  */
17
- size?: 'small' | 'medium';
17
+ size?: "small" | "medium";
18
18
  /**
19
19
  * Display as Checkbox
20
20
  */
package/lib/Switch.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import React from 'react';
3
- import { FormControlLabel } from '@mui/material';
4
- import MuiCheckbox from '@mui/material/Checkbox';
5
- import MuiSwitch from '@mui/material/Switch';
2
+ import React from "react";
3
+ import { FormControlLabel } from "@mui/material";
4
+ import MuiCheckbox from "@mui/material/Checkbox";
5
+ import MuiSwitch from "@mui/material/Switch";
6
6
  /**
7
7
  * Switch
8
8
  * @param props Props
@@ -10,7 +10,7 @@ import MuiSwitch from '@mui/material/Switch';
10
10
  */
11
11
  export function Switch(props) {
12
12
  // Destruct
13
- const { checked, defaultChecked, defaultValue, onChange, readOnly, size, checkbox = false, value = 'true', ...rest } = props;
13
+ const { checked, defaultChecked, defaultValue, onChange, readOnly, size, checkbox = false, value = "true", ...rest } = props;
14
14
  // Checked state
15
15
  const [controlChecked, setControlChecked] = React.useState(checked ?? defaultChecked ?? defaultValue == value);
16
16
  React.useEffect(() => {
package/lib/TabBox.d.ts CHANGED
@@ -1,9 +1,9 @@
1
- import { BoxProps, TabProps, TabsProps } from '@mui/material';
2
- import React from 'react';
1
+ import { BoxProps, TabProps, TabsProps } from "@mui/material";
2
+ import React from "react";
3
3
  /**
4
4
  * Tab with box panel props
5
5
  */
6
- export interface TabBoxPanel extends Omit<TabProps, 'value' | 'children'> {
6
+ export interface TabBoxPanel extends Omit<TabProps, "value" | "children"> {
7
7
  /**
8
8
  * Children
9
9
  */
@@ -11,7 +11,7 @@ export interface TabBoxPanel extends Omit<TabProps, 'value' | 'children'> {
11
11
  /**
12
12
  * Panel box props
13
13
  */
14
- panel?: Omit<BoxProps, 'hidden'>;
14
+ panel?: Omit<BoxProps, "hidden">;
15
15
  /**
16
16
  * To URL
17
17
  */
@@ -24,7 +24,7 @@ export interface TabBoxPros extends BoxProps {
24
24
  /**
25
25
  * Container props
26
26
  */
27
- container?: Omit<TabsProps, 'value'>;
27
+ container?: Omit<TabsProps, "value">;
28
28
  /**
29
29
  * Default selected index
30
30
  */
package/lib/TabBox.js CHANGED
@@ -1,8 +1,8 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Utils } from '@etsoo/shared';
3
- import { Box, Tab, Tabs } from '@mui/material';
4
- import React from 'react';
5
- import { Link } from 'react-router-dom';
2
+ import { Utils } from "@etsoo/shared";
3
+ import { Box, Tab, Tabs } from "@mui/material";
4
+ import React from "react";
5
+ import { Link } from "react-router-dom";
6
6
  /**
7
7
  * Tabs with box
8
8
  * @param props Props
@@ -20,7 +20,7 @@ export function TabBox(props) {
20
20
  setValue(index);
21
21
  }, [index]);
22
22
  // Layout
23
- return (_jsxs(React.Fragment, { children: [inputName && (_jsx("input", { type: "hidden", name: inputName, value: value })), _jsx(Box, { ...root, children: _jsx(Tabs, { value: value, onChange: (event, newValue) => {
23
+ return (_jsxs(React.Fragment, { children: [inputName && _jsx("input", { type: "hidden", name: inputName, value: value }), _jsx(Box, { ...root, children: _jsx(Tabs, { value: value, onChange: (event, newValue) => {
24
24
  setValue(newValue);
25
25
  if (onChange)
26
26
  onChange(event, newValue);
package/lib/TableEx.js CHANGED
@@ -39,15 +39,11 @@ export function TableEx(props) {
39
39
  state.loadedItems = rows.length;
40
40
  updateRows(rows);
41
41
  };
42
- var orderByAsc = defaultOrderBy
43
- ? columns.find((column) => column.field === defaultOrderBy)?.sortAsc
44
- : undefined;
45
42
  // States
46
43
  const stateRefs = React.useRef({
47
44
  queryPaging: {
48
45
  currentPage: 0,
49
46
  orderBy: defaultOrderBy,
50
- orderByAsc,
51
47
  batchSize: rowsPerPageLocal
52
48
  },
53
49
  autoLoad,
@@ -175,7 +171,7 @@ export function TableEx(props) {
175
171
  };
176
172
  // New sort
177
173
  const handleSort = (field, asc) => {
178
- reset({ queryPaging: { orderBy: field, orderByAsc: asc } });
174
+ reset({ queryPaging: { orderBy: { [field]: asc ?? true } } });
179
175
  };
180
176
  // Set items for rerenderer
181
177
  const setItems = (callback) => {
@@ -186,7 +182,7 @@ export function TableEx(props) {
186
182
  };
187
183
  // Destruct states
188
184
  const { queryPaging, autoLoad: stateAutoLoad, hasNextPage, lastLoadedItems, selectedItems } = state;
189
- const currentPage = queryPaging.currentPage;
185
+ const currentPage = queryPaging.currentPage ?? 0;
190
186
  const batchSize = queryPaging.batchSize;
191
187
  // Current page selected items
192
188
  const pageSelectedItems = selectable
@@ -222,7 +218,8 @@ export function TableEx(props) {
222
218
  // Sortable
223
219
  let sortLabel;
224
220
  if (sortable && field != null) {
225
- const active = queryPaging.orderBy === field;
221
+ const active = queryPaging.orderBy != null &&
222
+ queryPaging.orderBy[field] != null;
226
223
  sortLabel = (_jsx(TableSortLabel, { active: active, direction: sortAsc ? "asc" : "desc", onClick: (_event) => {
227
224
  if (active)
228
225
  column.sortAsc = !sortAsc;
@@ -1,9 +1,9 @@
1
- import { TooltipProps } from '@mui/material';
2
- import React from 'react';
1
+ import { TooltipProps } from "@mui/material";
2
+ import React from "react";
3
3
  /**
4
4
  * Tooltip with click visibility props
5
5
  */
6
- export interface TooltipClickProps extends Omit<TooltipProps, 'children' | 'open' | 'disableFocusListener' | 'disableTouchListener'> {
6
+ export interface TooltipClickProps extends Omit<TooltipProps, "children" | "open" | "disableFocusListener" | "disableTouchListener"> {
7
7
  children: (openTooltip: (newTitle?: string) => void) => React.ReactElement<any, any>;
8
8
  disableHoverListener?: boolean;
9
9
  }
@@ -1,7 +1,7 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { useDelayedExecutor } from '@etsoo/react';
3
- import { ClickAwayListener, Tooltip } from '@mui/material';
4
- import React from 'react';
2
+ import { useDelayedExecutor } from "@etsoo/react";
3
+ import { ClickAwayListener, Tooltip } from "@mui/material";
4
+ import React from "react";
5
5
  /**
6
6
  * Tooltip with click visibility
7
7
  * @param props Props
@@ -1,9 +1,9 @@
1
- import { InputFieldProps } from './InputField';
1
+ import { InputFieldProps } from "./InputField";
2
2
  type ValueType = string | number | Date | null | undefined;
3
3
  /**
4
4
  * TwoField Input props
5
5
  */
6
- export type TwoFieldInputProps = Omit<InputFieldProps, 'InputProps' | 'value'> & {
6
+ export type TwoFieldInputProps = Omit<InputFieldProps, "InputProps" | "value"> & {
7
7
  /**
8
8
  * Values
9
9
  */
@@ -1,10 +1,10 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Input, InputAdornment } from '@mui/material';
3
- import ArrowRightAltIcon from '@mui/icons-material/ArrowRightAlt';
4
- import { useDimensions } from '@etsoo/react';
5
- import React from 'react';
6
- import { DateUtils, DomUtils } from '@etsoo/shared';
7
- import { InputField } from './InputField';
2
+ import { Input, InputAdornment } from "@mui/material";
3
+ import ArrowRightAltIcon from "@mui/icons-material/ArrowRightAlt";
4
+ import { useDimensions } from "@etsoo/react";
5
+ import React from "react";
6
+ import { DateUtils, DomUtils } from "@etsoo/shared";
7
+ import { InputField } from "./InputField";
8
8
  /**
9
9
  * TwoField Input
10
10
  * @param props Props
@@ -24,14 +24,14 @@ export function TwoFieldInput(props) {
24
24
  // Watch container
25
25
  const { dimensions } = useDimensions(1, (target, rect) => {
26
26
  const width = (rect.width - 64) / 2;
27
- const inputs = target.querySelectorAll('input');
27
+ const inputs = target.querySelectorAll("input");
28
28
  inputs[0].style.width = `${width}px`;
29
29
  inputs[1].parentElement.style.width = `${width}px`;
30
30
  }, 0);
31
31
  // Handle change
32
32
  const handleChange = (event) => {
33
33
  const value = DomUtils.getInputValue(event.target);
34
- const index = event.target.name.endsWith('-start') ? 0 : 1;
34
+ const index = event.target.name.endsWith("-start") ? 0 : 1;
35
35
  valueRef.current[index] = value;
36
36
  if (onValuesChange) {
37
37
  if (onValuesChange(valueRef.current) === false)
@@ -42,10 +42,10 @@ export function TwoFieldInput(props) {
42
42
  };
43
43
  const formatValue = (v, type) => {
44
44
  if (v == null)
45
- return '';
46
- if (typeof v === 'number')
45
+ return "";
46
+ if (typeof v === "number")
47
47
  return v;
48
- if (type === 'date' || type === 'datetime-local')
48
+ if (type === "date" || type === "datetime-local")
49
49
  return DateUtils.formatForInput(v, type);
50
50
  return v;
51
51
  };
@@ -55,8 +55,8 @@ export function TwoFieldInput(props) {
55
55
  // Layout
56
56
  return (_jsx(InputField, { name: `${name}-start`, type: type, value: formatValue(localValues[0], type), ref: dimensions[0][0], inputProps: inputProps, InputProps: {
57
57
  endAdornment: (_jsxs(InputAdornment, { position: "end", sx: {
58
- display: 'flex',
59
- alignItems: 'center',
58
+ display: "flex",
59
+ alignItems: "center",
60
60
  gap: 1
61
61
  }, children: [_jsx(ArrowRightAltIcon, {}), _jsx(Input, { type: type, name: `${name}-end`, value: formatValue(localValues[1], type), disableUnderline: true, onInput: onInput, onChange: handleChange, inputProps: inputProps })] }))
62
62
  }, onInput: onInput, onChange: handleChange, ...rest }));
@@ -1,4 +1,4 @@
1
- import { IPageData } from '@etsoo/react';
1
+ import { IPageData } from "@etsoo/react";
2
2
  /**
3
3
  * Service page data interface
4
4
  */
@@ -1,4 +1,4 @@
1
- import { DataTypes } from '@etsoo/shared';
1
+ import { DataTypes } from "@etsoo/shared";
2
2
  /**
3
3
  * Labels
4
4
  */