@etsoo/materialui 1.5.95 → 1.5.97

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 (19) hide show
  1. package/lib/cjs/ComboBox.js +1 -1
  2. package/lib/cjs/ComboBoxMultiple.js +1 -1
  3. package/lib/cjs/ListMultipler.js +1 -1
  4. package/lib/cjs/SearchBar.js +6 -0
  5. package/lib/cjs/Tiplist.js +1 -1
  6. package/lib/cjs/TiplistPro.js +1 -1
  7. package/lib/mjs/ComboBox.js +1 -1
  8. package/lib/mjs/ComboBoxMultiple.js +1 -1
  9. package/lib/mjs/ListMultipler.js +1 -1
  10. package/lib/mjs/SearchBar.js +6 -0
  11. package/lib/mjs/Tiplist.js +1 -1
  12. package/lib/mjs/TiplistPro.js +1 -1
  13. package/package.json +1 -1
  14. package/src/ComboBox.tsx +1 -1
  15. package/src/ComboBoxMultiple.tsx +1 -1
  16. package/src/ListMultipler.tsx +1 -1
  17. package/src/SearchBar.tsx +10 -0
  18. package/src/Tiplist.tsx +1 -1
  19. package/src/TiplistPro.tsx +1 -1
package/lib/cjs/ComboBox.js CHANGED
@@ -124,7 +124,7 @@ function ComboBox(props) {
124
124
  };
125
125
  }, []);
126
126
  // Layout
127
- return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsxs)(Stack_1.default, { gap: 0.5, direction: "row", width: "100%", children: [(0, jsx_runtime_1.jsx)(Autocomplete_1.default, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
127
+ return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsxs)(Stack_1.default, { gap: 0.5, direction: "row", width: "100%", children: [(0, jsx_runtime_1.jsx)(Autocomplete_1.default, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
128
128
  // Set value
129
129
  setInputValue(value);
130
130
  // Custom
package/lib/cjs/ComboBoxMultiple.js CHANGED
@@ -121,7 +121,7 @@ function ComboBoxMultiple(props) {
121
121
  };
122
122
  }, []);
123
123
  // Layout
124
- return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { value: stateValue == null
124
+ return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none", width: 1 }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { value: stateValue == null
125
125
  ? []
126
126
  : Array.isArray(stateValue)
127
127
  ? stateValue
package/lib/cjs/ListMultipler.js CHANGED
@@ -57,5 +57,5 @@ function ListMultipler(props) {
57
57
  }
58
58
  const inputType = typeof ids[0] === "string" ? "text" : "number";
59
59
  // Layout
60
- return ((0, jsx_runtime_1.jsxs)(List_1.default, { ...rest, children: [name && ((0, jsx_runtime_1.jsx)("input", { type: inputType, style: { display: "none" }, name: name, value: ids.join(","), readOnly: true })), data.map((u) => ((0, jsx_runtime_1.jsx)(ListItem_1.default, { ...listItemProps, children: (0, jsx_runtime_1.jsxs)(ListItemButton_1.default, { dense: true, onClick: () => handleToggle(u[idField]), children: [(0, jsx_runtime_1.jsx)(ListItemIcon_1.default, { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { edge: "start", disableRipple: true, checked: ids.includes(u[idField]) }) }), (0, jsx_runtime_1.jsx)(ListItemText_1.default, { primary: GetListItemLabel(u, primaryLabel), secondary: GetListItemLabel(u, secondaryLabel), ...listItemTextProps })] }) }, `${u[idField]}`)))] }));
60
+ return ((0, jsx_runtime_1.jsxs)(List_1.default, { ...rest, children: [name && ((0, jsx_runtime_1.jsx)("input", { type: inputType, style: { display: "none", width: 1 }, name: name, value: ids.join(","), readOnly: true })), data.map((u) => ((0, jsx_runtime_1.jsx)(ListItem_1.default, { ...listItemProps, children: (0, jsx_runtime_1.jsxs)(ListItemButton_1.default, { dense: true, onClick: () => handleToggle(u[idField]), children: [(0, jsx_runtime_1.jsx)(ListItemIcon_1.default, { children: (0, jsx_runtime_1.jsx)(Checkbox_1.default, { edge: "start", disableRipple: true, checked: ids.includes(u[idField]) }) }), (0, jsx_runtime_1.jsx)(ListItemText_1.default, { primary: GetListItemLabel(u, primaryLabel), secondary: GetListItemLabel(u, secondaryLabel), ...listItemTextProps })] }) }, `${u[idField]}`)))] }));
61
61
  }
package/lib/cjs/SearchBar.js CHANGED
@@ -152,6 +152,12 @@ function SearchBar(props) {
152
152
  let newIndex = others;
153
153
  for (let c = 0; c < others; c++) {
154
154
  const child = children[c];
155
+ // Ignore it when it's input and hidden or display none
156
+ if (child instanceof HTMLInputElement &&
157
+ (child.type === "hidden" ||
158
+ (child.parentElement == null && child.readOnly))) {
159
+ continue;
160
+ }
155
161
  const cachedWidth = child.getAttribute(cachedWidthName);
156
162
  let childWidth;
157
163
  if (cachedWidth) {
package/lib/cjs/Tiplist.js CHANGED
@@ -172,7 +172,7 @@ function Tiplist(props) {
172
172
  };
173
173
  }, []);
174
174
  // Layout
175
- return ((0, jsx_runtime_1.jsxs)(react_2.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: `${inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")}`, readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { filterOptions: (options, _state) => options, value: states.value, options: states.options, onChange: (event, value, reason, details) => {
175
+ return ((0, jsx_runtime_1.jsxs)(react_2.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: `${inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")}`, readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { filterOptions: (options, _state) => options, value: states.value, options: states.options, onChange: (event, value, reason, details) => {
176
176
  // Set value
177
177
  setInputValue(value);
178
178
  // Custom
package/lib/cjs/TiplistPro.js CHANGED
@@ -158,7 +158,7 @@ function TiplistPro(props) {
158
158
  };
159
159
  }, []);
160
160
  // Layout
161
- return ((0, jsx_runtime_1.jsxs)(react_2.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: inputValue ?? (state.current.idSet ? "" : localIdValue ?? ""), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { filterOptions: (options, _state) => options, value: states.value, options: states.options, freeSolo: true, clearOnBlur: false, onChange: (event, value, reason, details) => {
161
+ return ((0, jsx_runtime_1.jsxs)(react_2.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: inputValue ?? (state.current.idSet ? "" : localIdValue ?? ""), readOnly: true, onChange: inputOnChange }), (0, jsx_runtime_1.jsx)(Autocomplete_1.default, { filterOptions: (options, _state) => options, value: states.value, options: states.options, freeSolo: true, clearOnBlur: false, onChange: (event, value, reason, details) => {
162
162
  if (typeof value === "object") {
163
163
  // Set value
164
164
  setInputValue(value);
package/lib/mjs/ComboBox.js CHANGED
@@ -118,7 +118,7 @@ export function ComboBox(props) {
118
118
  };
119
119
  }, []);
120
120
  // Layout
121
- return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsxs(Stack, { gap: 0.5, direction: "row", width: "100%", children: [_jsx(Autocomplete, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
121
+ return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsxs(Stack, { gap: 0.5, direction: "row", width: "100%", children: [_jsx(Autocomplete, { value: stateValue, disableCloseOnSelect: disableCloseOnSelect, getOptionLabel: getOptionLabel, isOptionEqualToValue: (option, value) => option[idField] === value[idField], onChange: (event, value, reason, details) => {
122
122
  // Set value
123
123
  setInputValue(value);
124
124
  // Custom
package/lib/mjs/ComboBoxMultiple.js CHANGED
@@ -115,7 +115,7 @@ export function ComboBoxMultiple(props) {
115
115
  };
116
116
  }, []);
117
117
  // Layout
118
- return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none" }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { value: stateValue == null
118
+ return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: "text", style: { display: "none", width: 1 }, name: name, value: getValue(stateValue), readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { value: stateValue == null
119
119
  ? []
120
120
  : Array.isArray(stateValue)
121
121
  ? stateValue
package/lib/mjs/ListMultipler.js CHANGED
@@ -51,5 +51,5 @@ export function ListMultipler(props) {
51
51
  }
52
52
  const inputType = typeof ids[0] === "string" ? "text" : "number";
53
53
  // Layout
54
- return (_jsxs(List, { ...rest, children: [name && (_jsx("input", { type: inputType, style: { display: "none" }, name: name, value: ids.join(","), readOnly: true })), data.map((u) => (_jsx(ListItem, { ...listItemProps, children: _jsxs(ListItemButton, { dense: true, onClick: () => handleToggle(u[idField]), children: [_jsx(ListItemIcon, { children: _jsx(Checkbox, { edge: "start", disableRipple: true, checked: ids.includes(u[idField]) }) }), _jsx(ListItemText, { primary: GetListItemLabel(u, primaryLabel), secondary: GetListItemLabel(u, secondaryLabel), ...listItemTextProps })] }) }, `${u[idField]}`)))] }));
54
+ return (_jsxs(List, { ...rest, children: [name && (_jsx("input", { type: inputType, style: { display: "none", width: 1 }, name: name, value: ids.join(","), readOnly: true })), data.map((u) => (_jsx(ListItem, { ...listItemProps, children: _jsxs(ListItemButton, { dense: true, onClick: () => handleToggle(u[idField]), children: [_jsx(ListItemIcon, { children: _jsx(Checkbox, { edge: "start", disableRipple: true, checked: ids.includes(u[idField]) }) }), _jsx(ListItemText, { primary: GetListItemLabel(u, primaryLabel), secondary: GetListItemLabel(u, secondaryLabel), ...listItemTextProps })] }) }, `${u[idField]}`)))] }));
55
55
  }
package/lib/mjs/SearchBar.js CHANGED
@@ -146,6 +146,12 @@ export function SearchBar(props) {
146
146
  let newIndex = others;
147
147
  for (let c = 0; c < others; c++) {
148
148
  const child = children[c];
149
+ // Ignore it when it's input and hidden or display none
150
+ if (child instanceof HTMLInputElement &&
151
+ (child.type === "hidden" ||
152
+ (child.parentElement == null && child.readOnly))) {
153
+ continue;
154
+ }
149
155
  const cachedWidth = child.getAttribute(cachedWidthName);
150
156
  let childWidth;
151
157
  if (cachedWidth) {
package/lib/mjs/Tiplist.js CHANGED
@@ -166,7 +166,7 @@ export function Tiplist(props) {
166
166
  };
167
167
  }, []);
168
168
  // Layout
169
- return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: `${inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")}`, readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { filterOptions: (options, _state) => options, value: states.value, options: states.options, onChange: (event, value, reason, details) => {
169
+ return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: `${inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")}`, readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { filterOptions: (options, _state) => options, value: states.value, options: states.options, onChange: (event, value, reason, details) => {
170
170
  // Set value
171
171
  setInputValue(value);
172
172
  // Custom
package/lib/mjs/TiplistPro.js CHANGED
@@ -152,7 +152,7 @@ export function TiplistPro(props) {
152
152
  };
153
153
  }, []);
154
154
  // Layout
155
- return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none" }, name: name, value: inputValue ?? (state.current.idSet ? "" : localIdValue ?? ""), readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { filterOptions: (options, _state) => options, value: states.value, options: states.options, freeSolo: true, clearOnBlur: false, onChange: (event, value, reason, details) => {
155
+ return (_jsxs(React.Fragment, { children: [_jsx("input", { ref: inputRef, "data-reset": inputReset ?? true, type: idIsString ? "text" : "number", style: { display: "none", width: 1 }, name: name, value: inputValue ?? (state.current.idSet ? "" : localIdValue ?? ""), readOnly: true, onChange: inputOnChange }), _jsx(Autocomplete, { filterOptions: (options, _state) => options, value: states.value, options: states.options, freeSolo: true, clearOnBlur: false, onChange: (event, value, reason, details) => {
156
156
  if (typeof value === "object") {
157
157
  // Set value
158
158
  setInputValue(value);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@etsoo/materialui",
3
- "version": "1.5.95",
3
+ "version": "1.5.97",
4
4
  "description": "TypeScript Material-UI Implementation",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/mjs/index.js",
package/src/ComboBox.tsx CHANGED
@@ -241,7 +241,7 @@ export function ComboBox<
241
241
  ref={inputRef}
242
242
  data-reset={inputReset ?? true}
243
243
  type={idIsString ? "text" : "number"}
244
- style={{ display: "none" }}
244
+ style={{ display: "none", width: 1 }}
245
245
  name={name}
246
246
  value={getValue(stateValue)}
247
247
  readOnly
package/src/ComboBoxMultiple.tsx CHANGED
@@ -244,7 +244,7 @@ export function ComboBoxMultiple<
244
244
  ref={inputRef}
245
245
  data-reset={inputReset ?? true}
246
246
  type="text"
247
- style={{ display: "none" }}
247
+ style={{ display: "none", width: 1 }}
248
248
  name={name}
249
249
  value={getValue(stateValue)}
250
250
  readOnly
package/src/ListMultipler.tsx CHANGED
@@ -124,7 +124,7 @@ export function ListMultipler<T extends object>(props: ListMultiplerProps<T>) {
124
124
  {name && (
125
125
  <input
126
126
  type={inputType}
127
- style={{ display: "none" }}
127
+ style={{ display: "none", width: 1 }}
128
128
  name={name}
129
129
  value={ids.join(",")}
130
130
  readOnly
package/src/SearchBar.tsx CHANGED
@@ -233,6 +233,16 @@ export function SearchBar(props: SearchBarProps) {
233
233
  let newIndex: number = others;
234
234
  for (let c: number = 0; c < others; c++) {
235
235
  const child = children[c];
236
+
237
+ // Ignore it when it's input and hidden or display none
238
+ if (
239
+ child instanceof HTMLInputElement &&
240
+ (child.type === "hidden" ||
241
+ (child.parentElement == null && child.readOnly))
242
+ ) {
243
+ continue;
244
+ }
245
+
236
246
  const cachedWidth = child.getAttribute(cachedWidthName);
237
247
  let childWidth: number;
238
248
  if (cachedWidth) {
package/src/Tiplist.tsx CHANGED
@@ -290,7 +290,7 @@ export function Tiplist<
290
290
  ref={inputRef}
291
291
  data-reset={inputReset ?? true}
292
292
  type={idIsString ? "text" : "number"}
293
- style={{ display: "none" }}
293
+ style={{ display: "none", width: 1 }}
294
294
  name={name}
295
295
  value={`${
296
296
  inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")
package/src/TiplistPro.tsx CHANGED
@@ -304,7 +304,7 @@ export function TiplistPro<T extends ListType2 = ListType2>(
304
304
  ref={inputRef}
305
305
  data-reset={inputReset ?? true}
306
306
  type={idIsString ? "text" : "number"}
307
- style={{ display: "none" }}
307
+ style={{ display: "none", width: 1 }}
308
308
  name={name}
309
309
  value={inputValue ?? (state.current.idSet ? "" : localIdValue ?? "")}
310
310
  readOnly