@etsoo/materialui 1.1.37 → 1.1.39
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/lib/ComboBox.d.ts +1 -1
- package/lib/OptionGroup.js +12 -7
- package/package.json +14 -14
- package/src/ComboBox.tsx +3 -3
- package/src/OptionGroup.tsx +12 -8
package/lib/ComboBox.d.ts
CHANGED
|
@@ -4,7 +4,7 @@ import { AutocompleteExtendedProps } from "./AutocompleteExtendedProps";
|
|
|
4
4
|
/**
|
|
5
5
|
* ComboBox props
|
|
6
6
|
*/
|
|
7
|
-
export type ComboBoxProps<T extends object, D extends DataTypes.Keys<T>, L extends DataTypes.Keys<T, string>> = AutocompleteExtendedProps<T, D> & {
|
|
7
|
+
export type ComboBoxProps<T extends object = ListType, D extends DataTypes.Keys<T> = IdDefaultType<T>, L extends DataTypes.Keys<T, string> = LabelDefaultType<T>> = AutocompleteExtendedProps<T, D> & {
|
|
8
8
|
/**
|
|
9
9
|
* Auto add blank item
|
|
10
10
|
*/
|
package/lib/OptionGroup.js
CHANGED
|
@@ -10,9 +10,18 @@ import React from "react";
|
|
|
10
10
|
export function OptionGroup(props) {
|
|
11
11
|
var _a;
|
|
12
12
|
// Destruct
|
|
13
|
-
const { getOptionLabel, defaultValue, idField = "id", label, labelField = "label", multiple = false, mRef, name, onValueChange, options, readOnly, row, itemSize, itemHeight = row ? 56 : 42, helperText, variant, required, fullWidth, ...rest } = props;
|
|
13
|
+
const { getOptionLabel, defaultValue, idField = "id", label, labelField = "label", multiple = false, mRef, name, onValueChange, options, readOnly, row, itemSize, itemHeight = row ? 56 : 42, helperText, variant, required, fullWidth, sx = {}, ...rest } = props;
|
|
14
14
|
// Outlined
|
|
15
15
|
const outlined = variant === "outlined";
|
|
16
|
+
if (sx) {
|
|
17
|
+
Object.assign(sx, {
|
|
18
|
+
height: outlined
|
|
19
|
+
? row
|
|
20
|
+
? `${itemHeight}px`
|
|
21
|
+
: `${options.length * itemHeight + 14}px`
|
|
22
|
+
: undefined
|
|
23
|
+
});
|
|
24
|
+
}
|
|
16
25
|
// Get option value
|
|
17
26
|
// D type should be the source id type
|
|
18
27
|
const getOptionValue = (option) => {
|
|
@@ -92,7 +101,7 @@ export function OptionGroup(props) {
|
|
|
92
101
|
} }, list));
|
|
93
102
|
// Layout
|
|
94
103
|
return (React.createElement(React.Fragment, null,
|
|
95
|
-
React.createElement(FormControl, { component: "fieldset", fullWidth: fullWidth, ...rest },
|
|
104
|
+
React.createElement(FormControl, { component: "fieldset", fullWidth: fullWidth, sx: sx, ...rest },
|
|
96
105
|
label && (React.createElement(InputLabel, { required: required, variant: variant, shrink: true }, label)),
|
|
97
106
|
outlined && (React.createElement(NotchedOutline, { label: label && required ? label + " *" : label, notched: true, sx: {
|
|
98
107
|
cursor: "default",
|
|
@@ -102,10 +111,6 @@ export function OptionGroup(props) {
|
|
|
102
111
|
visibility: "hidden"
|
|
103
112
|
}
|
|
104
113
|
} })),
|
|
105
|
-
React.createElement(Box, { paddingLeft: 2, paddingY: "7px", position: outlined ? "absolute" : undefined,
|
|
106
|
-
? row
|
|
107
|
-
? `${itemHeight}px`
|
|
108
|
-
: `${options.length * itemHeight + 14}px`
|
|
109
|
-
: undefined }, group)),
|
|
114
|
+
React.createElement(Box, { paddingLeft: 2, paddingY: "7px", position: outlined ? "absolute" : undefined }, group)),
|
|
110
115
|
helperText && React.createElement(FormHelperText, null, helperText)));
|
|
111
116
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@etsoo/materialui",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.39",
|
|
4
4
|
"description": "TypeScript Material-UI Implementation",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"types": "lib/index.d.ts",
|
|
@@ -45,17 +45,17 @@
|
|
|
45
45
|
},
|
|
46
46
|
"homepage": "https://github.com/ETSOO/ReactMU#readme",
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@dnd-kit/core": "^6.0.
|
|
48
|
+
"@dnd-kit/core": "^6.0.8",
|
|
49
49
|
"@dnd-kit/sortable": "^7.0.2",
|
|
50
50
|
"@emotion/css": "^11.10.6",
|
|
51
51
|
"@emotion/react": "^11.10.6",
|
|
52
52
|
"@emotion/styled": "^11.10.6",
|
|
53
|
-
"@etsoo/appscript": "^1.3.
|
|
54
|
-
"@etsoo/notificationbase": "^1.1.
|
|
55
|
-
"@etsoo/react": "^1.6.
|
|
56
|
-
"@etsoo/shared": "^1.1.
|
|
53
|
+
"@etsoo/appscript": "^1.3.67",
|
|
54
|
+
"@etsoo/notificationbase": "^1.1.24",
|
|
55
|
+
"@etsoo/react": "^1.6.49",
|
|
56
|
+
"@etsoo/shared": "^1.1.89",
|
|
57
57
|
"@mui/icons-material": "^5.11.9",
|
|
58
|
-
"@mui/material": "^5.11.
|
|
58
|
+
"@mui/material": "^5.11.10",
|
|
59
59
|
"@types/pica": "^9.0.1",
|
|
60
60
|
"@types/pulltorefreshjs": "^0.1.5",
|
|
61
61
|
"@types/react": "^18.0.28",
|
|
@@ -74,18 +74,18 @@
|
|
|
74
74
|
"react-window": "^1.8.8"
|
|
75
75
|
},
|
|
76
76
|
"devDependencies": {
|
|
77
|
-
"@babel/cli": "^7.
|
|
78
|
-
"@babel/core": "^7.
|
|
79
|
-
"@babel/plugin-transform-runtime": "^7.
|
|
77
|
+
"@babel/cli": "^7.21.0",
|
|
78
|
+
"@babel/core": "^7.21.0",
|
|
79
|
+
"@babel/plugin-transform-runtime": "^7.21.0",
|
|
80
80
|
"@babel/preset-env": "^7.20.2",
|
|
81
81
|
"@babel/preset-react": "^7.18.6",
|
|
82
|
-
"@babel/preset-typescript": "^7.
|
|
83
|
-
"@babel/runtime-corejs3": "^7.
|
|
82
|
+
"@babel/preset-typescript": "^7.21.0",
|
|
83
|
+
"@babel/runtime-corejs3": "^7.21.0",
|
|
84
84
|
"@testing-library/jest-dom": "^5.16.5",
|
|
85
85
|
"@testing-library/react": "^14.0.0",
|
|
86
86
|
"@types/jest": "^29.4.0",
|
|
87
|
-
"@typescript-eslint/eslint-plugin": "^5.
|
|
88
|
-
"@typescript-eslint/parser": "^5.
|
|
87
|
+
"@typescript-eslint/eslint-plugin": "^5.53.0",
|
|
88
|
+
"@typescript-eslint/parser": "^5.53.0",
|
|
89
89
|
"jest": "^29.4.3",
|
|
90
90
|
"jest-environment-jsdom": "^29.4.3",
|
|
91
91
|
"typescript": "^4.9.5"
|
package/src/ComboBox.tsx
CHANGED
|
@@ -28,9 +28,9 @@ const checkedIcon = <CheckBoxIcon fontSize="small" />;
|
|
|
28
28
|
* ComboBox props
|
|
29
29
|
*/
|
|
30
30
|
export type ComboBoxProps<
|
|
31
|
-
T extends object,
|
|
32
|
-
D extends DataTypes.Keys<T>,
|
|
33
|
-
L extends DataTypes.Keys<T, string>
|
|
31
|
+
T extends object = ListType,
|
|
32
|
+
D extends DataTypes.Keys<T> = IdDefaultType<T>,
|
|
33
|
+
L extends DataTypes.Keys<T, string> = LabelDefaultType<T>
|
|
34
34
|
> = AutocompleteExtendedProps<T, D> & {
|
|
35
35
|
/**
|
|
36
36
|
* Auto add blank item
|
package/src/OptionGroup.tsx
CHANGED
|
@@ -145,12 +145,23 @@ export function OptionGroup<
|
|
|
145
145
|
variant,
|
|
146
146
|
required,
|
|
147
147
|
fullWidth,
|
|
148
|
+
sx = {},
|
|
148
149
|
...rest
|
|
149
150
|
} = props;
|
|
150
151
|
|
|
151
152
|
// Outlined
|
|
152
153
|
const outlined = variant === "outlined";
|
|
153
154
|
|
|
155
|
+
if (sx) {
|
|
156
|
+
Object.assign(sx, {
|
|
157
|
+
height: outlined
|
|
158
|
+
? row
|
|
159
|
+
? `${itemHeight}px`
|
|
160
|
+
: `${options.length * itemHeight + 14}px`
|
|
161
|
+
: undefined
|
|
162
|
+
});
|
|
163
|
+
}
|
|
164
|
+
|
|
154
165
|
// Get option value
|
|
155
166
|
// D type should be the source id type
|
|
156
167
|
const getOptionValue = (option: T): T[D] | null => {
|
|
@@ -281,7 +292,7 @@ export function OptionGroup<
|
|
|
281
292
|
// Layout
|
|
282
293
|
return (
|
|
283
294
|
<React.Fragment>
|
|
284
|
-
<FormControl component="fieldset" fullWidth={fullWidth} {...rest}>
|
|
295
|
+
<FormControl component="fieldset" fullWidth={fullWidth} sx={sx} {...rest}>
|
|
285
296
|
{label && (
|
|
286
297
|
<InputLabel required={required} variant={variant} shrink>
|
|
287
298
|
{label}
|
|
@@ -305,13 +316,6 @@ export function OptionGroup<
|
|
|
305
316
|
paddingLeft={2}
|
|
306
317
|
paddingY="7px"
|
|
307
318
|
position={outlined ? "absolute" : undefined}
|
|
308
|
-
height={
|
|
309
|
-
outlined
|
|
310
|
-
? row
|
|
311
|
-
? `${itemHeight}px`
|
|
312
|
-
: `${options.length * itemHeight + 14}px`
|
|
313
|
-
: undefined
|
|
314
|
-
}
|
|
315
319
|
>
|
|
316
320
|
{group}
|
|
317
321
|
</Box>
|