@etsoo/materialui 1.5.85 → 1.5.86

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 (6) hide show
  1. package/lib/cjs/InputTipField.d.ts +25 -24
  2. package/lib/cjs/InputTipField.js +3 -3
  3. package/lib/mjs/InputTipField.d.ts +25 -24
  4. package/lib/mjs/InputTipField.js +3 -3
  5. package/package.json +3 -3
  6. package/src/InputTipField.tsx +43 -36
package/lib/cjs/InputTipField.d.ts CHANGED
@@ -17,36 +17,37 @@ type ComponentKey = keyof ComponentMap;
17
17
  /**
18
18
  * InputField with tips properties
19
19
  */
20
- export type InputTipFieldProps<T extends ItemType = ItemType, K extends ComponentKey = "input"> = {
20
+ export type InputTipFieldProps<T extends ItemType = ItemType, K extends ComponentKey = "input"> = Omit<React.ComponentProps<ComponentMap[K]>, "component"> & {
21
21
  /**
22
22
  * Component key
23
23
  */
24
24
  component?: K;
25
25
  /**
26
- * Component props
26
+ * Component properties
27
27
  */
28
- componentProps?: React.ComponentProps<ComponentMap[K]>;
29
- /**
30
- * Load data
31
- * @param value Duplicate test value
32
- */
33
- loadData(value: string): Promise<[T[]?, string?]>;
34
- /**
35
- * Label props
36
- */
37
- labelProps?: Omit<TypographyProps, "onClick">;
38
- /**
39
- * Custom item label
40
- * @param item List item data
41
- * @returns Result
42
- */
43
- itemLabel?: (item: T) => React.ReactNode;
44
- /**
45
- * Custom render item
46
- * @param item List item data
47
- * @returns Result
48
- */
49
- renderItem?: (item: T) => React.ReactNode;
28
+ componentProps: {
29
+ /**
30
+ * Load data
31
+ * @param value Duplicate test value
32
+ */
33
+ loadData(value: string): Promise<[T[]?, string?]>;
34
+ /**
35
+ * Label props
36
+ */
37
+ labelProps?: Omit<TypographyProps, "onClick">;
38
+ /**
39
+ * Custom item label
40
+ * @param item List item data
41
+ * @returns Result
42
+ */
43
+ itemLabel?: (item: T) => React.ReactNode;
44
+ /**
45
+ * Custom render item
46
+ * @param item List item data
47
+ * @returns Result
48
+ */
49
+ renderItem?: (item: T) => React.ReactNode;
50
+ };
50
51
  };
51
52
  /**
52
53
  * InputField with tips
package/lib/cjs/InputTipField.js CHANGED
@@ -35,11 +35,11 @@ function InputTipField(props) {
35
35
  const [anchorEl, setAnchorEl] = react_1.default.useState();
36
36
  const [data, setData] = react_1.default.useState();
37
37
  // Destruct
38
+ const { component = "input", componentProps, changeDelay = 480, onChangeDelay, fullWidth = true, slotProps = {}, ...rest } = props;
38
39
  const { labelProps = {
39
40
  title: app?.get("clickForDetails"),
40
41
  sx: { color: (theme) => theme.palette.error.main, cursor: "pointer" }
41
- }, loadData, itemLabel = (item) => item.label, renderItem = (item) => (0, jsx_runtime_1.jsx)(ListItem_1.default, { children: itemLabel(item) }, item.id), component = "input", componentProps = {}, ...rest } = props;
42
- const { changeDelay = 480, onChangeDelay, slotProps = {} } = componentProps;
42
+ }, loadData, itemLabel = (item) => item.label, renderItem = (item) => (0, jsx_runtime_1.jsx)(ListItem_1.default, { children: itemLabel(item) }, item.id) } = componentProps;
43
43
  const { input, ...slotRests } = slotProps;
44
44
  const Component = componentMap[component];
45
45
  const load = (value) => {
@@ -55,7 +55,7 @@ function InputTipField(props) {
55
55
  return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Popover_1.default, { open: anchorEl != null, anchorEl: anchorEl, onClose: () => setAnchorEl(undefined), anchorOrigin: {
56
56
  vertical: "bottom",
57
57
  horizontal: "left"
58
- }, children: data && (0, jsx_runtime_1.jsx)(List_1.default, { children: data.map((item) => renderItem(item)) }) }), (0, jsx_runtime_1.jsx)(Component, { changeDelay: changeDelay, onChangeDelay: (event) => {
58
+ }, children: data && (0, jsx_runtime_1.jsx)(List_1.default, { children: data.map((item) => renderItem(item)) }) }), (0, jsx_runtime_1.jsx)(Component, { changeDelay: changeDelay, fullWidth: fullWidth, onChangeDelay: (event) => {
59
59
  load(event.target.value);
60
60
  if (onChangeDelay)
61
61
  onChangeDelay(event);
package/lib/mjs/InputTipField.d.ts CHANGED
@@ -17,36 +17,37 @@ type ComponentKey = keyof ComponentMap;
17
17
  /**
18
18
  * InputField with tips properties
19
19
  */
20
- export type InputTipFieldProps<T extends ItemType = ItemType, K extends ComponentKey = "input"> = {
20
+ export type InputTipFieldProps<T extends ItemType = ItemType, K extends ComponentKey = "input"> = Omit<React.ComponentProps<ComponentMap[K]>, "component"> & {
21
21
  /**
22
22
  * Component key
23
23
  */
24
24
  component?: K;
25
25
  /**
26
- * Component props
26
+ * Component properties
27
27
  */
28
- componentProps?: React.ComponentProps<ComponentMap[K]>;
29
- /**
30
- * Load data
31
- * @param value Duplicate test value
32
- */
33
- loadData(value: string): Promise<[T[]?, string?]>;
34
- /**
35
- * Label props
36
- */
37
- labelProps?: Omit<TypographyProps, "onClick">;
38
- /**
39
- * Custom item label
40
- * @param item List item data
41
- * @returns Result
42
- */
43
- itemLabel?: (item: T) => React.ReactNode;
44
- /**
45
- * Custom render item
46
- * @param item List item data
47
- * @returns Result
48
- */
49
- renderItem?: (item: T) => React.ReactNode;
28
+ componentProps: {
29
+ /**
30
+ * Load data
31
+ * @param value Duplicate test value
32
+ */
33
+ loadData(value: string): Promise<[T[]?, string?]>;
34
+ /**
35
+ * Label props
36
+ */
37
+ labelProps?: Omit<TypographyProps, "onClick">;
38
+ /**
39
+ * Custom item label
40
+ * @param item List item data
41
+ * @returns Result
42
+ */
43
+ itemLabel?: (item: T) => React.ReactNode;
44
+ /**
45
+ * Custom render item
46
+ * @param item List item data
47
+ * @returns Result
48
+ */
49
+ renderItem?: (item: T) => React.ReactNode;
50
+ };
50
51
  };
51
52
  /**
52
53
  * InputField with tips
package/lib/mjs/InputTipField.js CHANGED
@@ -29,11 +29,11 @@ export function InputTipField(props) {
29
29
  const [anchorEl, setAnchorEl] = React.useState();
30
30
  const [data, setData] = React.useState();
31
31
  // Destruct
32
+ const { component = "input", componentProps, changeDelay = 480, onChangeDelay, fullWidth = true, slotProps = {}, ...rest } = props;
32
33
  const { labelProps = {
33
34
  title: app?.get("clickForDetails"),
34
35
  sx: { color: (theme) => theme.palette.error.main, cursor: "pointer" }
35
- }, loadData, itemLabel = (item) => item.label, renderItem = (item) => _jsx(ListItem, { children: itemLabel(item) }, item.id), component = "input", componentProps = {}, ...rest } = props;
36
- const { changeDelay = 480, onChangeDelay, slotProps = {} } = componentProps;
36
+ }, loadData, itemLabel = (item) => item.label, renderItem = (item) => _jsx(ListItem, { children: itemLabel(item) }, item.id) } = componentProps;
37
37
  const { input, ...slotRests } = slotProps;
38
38
  const Component = componentMap[component];
39
39
  const load = (value) => {
@@ -49,7 +49,7 @@ export function InputTipField(props) {
49
49
  return (_jsxs(React.Fragment, { children: [_jsx(Popover, { open: anchorEl != null, anchorEl: anchorEl, onClose: () => setAnchorEl(undefined), anchorOrigin: {
50
50
  vertical: "bottom",
51
51
  horizontal: "left"
52
- }, children: data && _jsx(List, { children: data.map((item) => renderItem(item)) }) }), _jsx(Component, { changeDelay: changeDelay, onChangeDelay: (event) => {
52
+ }, children: data && _jsx(List, { children: data.map((item) => renderItem(item)) }) }), _jsx(Component, { changeDelay: changeDelay, fullWidth: fullWidth, onChangeDelay: (event) => {
53
53
  load(event.target.value);
54
54
  if (onChangeDelay)
55
55
  onChangeDelay(event);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/materialui",
3
- "version": "1.5.85",
3
+ "version": "1.5.86",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/mjs/index.js",
@@ -76,13 +76,13 @@
76
76
  "@testing-library/react": "^16.3.0",
77
77
  "@types/pica": "^9.0.5",
78
78
  "@types/pulltorefreshjs": "^0.1.7",
79
- "@types/react": "^19.2.4",
79
+ "@types/react": "^19.2.5",
80
80
  "@types/react-avatar-editor": "^13.0.4",
81
81
  "@types/react-dom": "^19.2.3",
82
82
  "@types/react-input-mask": "^3.0.6",
83
83
  "@vitejs/plugin-react": "^5.1.1",
84
84
  "jsdom": "^27.2.0",
85
85
  "typescript": "^5.9.3",
86
- "vitest": "^4.0.8"
86
+ "vitest": "^4.0.9"
87
87
  }
88
88
  }
package/src/InputTipField.tsx CHANGED
@@ -29,41 +29,41 @@ type ComponentKey = keyof ComponentMap;
29
29
  export type InputTipFieldProps<
30
30
  T extends ItemType = ItemType,
31
31
  K extends ComponentKey = "input"
32
- > = {
32
+ > = Omit<React.ComponentProps<ComponentMap[K]>, "component"> & {
33
33
  /**
34
34
  * Component key
35
35
  */
36
36
  component?: K;
37
37
 
38
38
  /**
39
- * Component props
39
+ * Component properties
40
40
  */
41
- componentProps?: React.ComponentProps<ComponentMap[K]>;
42
-
43
- /**
44
- * Load data
45
- * @param value Duplicate test value
46
- */
47
- loadData(value: string): Promise<[T[]?, string?]>;
48
-
49
- /**
50
- * Label props
51
- */
52
- labelProps?: Omit<TypographyProps, "onClick">;
53
-
54
- /**
55
- * Custom item label
56
- * @param item List item data
57
- * @returns Result
58
- */
59
- itemLabel?: (item: T) => React.ReactNode;
60
-
61
- /**
62
- * Custom render item
63
- * @param item List item data
64
- * @returns Result
65
- */
66
- renderItem?: (item: T) => React.ReactNode;
41
+ componentProps: {
42
+ /**
43
+ * Load data
44
+ * @param value Duplicate test value
45
+ */
46
+ loadData(value: string): Promise<[T[]?, string?]>;
47
+
48
+ /**
49
+ * Label props
50
+ */
51
+ labelProps?: Omit<TypographyProps, "onClick">;
52
+
53
+ /**
54
+ * Custom item label
55
+ * @param item List item data
56
+ * @returns Result
57
+ */
58
+ itemLabel?: (item: T) => React.ReactNode;
59
+
60
+ /**
61
+ * Custom render item
62
+ * @param item List item data
63
+ * @returns Result
64
+ */
65
+ renderItem?: (item: T) => React.ReactNode;
66
+ };
67
67
  };
68
68
 
69
69
  /**
@@ -84,6 +84,16 @@ export function InputTipField<
84
84
  const [data, setData] = React.useState<T[]>();
85
85
 
86
86
  // Destruct
87
+ const {
88
+ component = "input",
89
+ componentProps,
90
+ changeDelay = 480,
91
+ onChangeDelay,
92
+ fullWidth = true,
93
+ slotProps = {},
94
+ ...rest
95
+ } = props;
96
+
87
97
  const {
88
98
  labelProps = {
89
99
  title: app?.get("clickForDetails"),
@@ -91,16 +101,12 @@ export function InputTipField<
91
101
  },
92
102
  loadData,
93
103
  itemLabel = (item) => item.label,
94
- renderItem = (item) => <ListItem key={item.id}>{itemLabel(item)}</ListItem>,
95
- component = "input",
96
- componentProps = {} as React.ComponentProps<ComponentMap[K]>,
97
- ...rest
98
- } = props;
104
+ renderItem = (item) => <ListItem key={item.id}>{itemLabel(item)}</ListItem>
105
+ } = componentProps;
99
106
 
100
- const { changeDelay = 480, onChangeDelay, slotProps = {} } = componentProps;
101
107
  const { input, ...slotRests } = slotProps;
102
108
 
103
- const Component: typeof InputField = componentMap[component];
109
+ const Component = componentMap[component];
104
110
 
105
111
  const load = (value: string) => {
106
112
  if (value.length < 2) {
@@ -129,6 +135,7 @@ export function InputTipField<
129
135
  </Popover>
130
136
  <Component
131
137
  changeDelay={changeDelay}
138
+ fullWidth={fullWidth}
132
139
  onChangeDelay={(event) => {
133
140
  load(event.target.value);
134
141
  if (onChangeDelay) onChangeDelay(event);
@@ -151,7 +158,7 @@ export function InputTipField<
151
158
  },
152
159
  ...slotRests
153
160
  }}
154
- {...rest}
161
+ {...(rest as any)}
155
162
  />
156
163
  </React.Fragment>
157
164
  );