@onesy/ui-react 1.0.57 → 1.0.59
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.
@@ -42,6 +42,7 @@ export type IAutoComplete = Omit<ITextField, 'onChange'> & {
|
|
42
42
|
clearOnEscape?: boolean;
|
43
43
|
groupBy?: (value: TAutoCompleteOption) => string;
|
44
44
|
limit?: number;
|
45
|
+
openOnInputUpdate?: boolean;
|
45
46
|
filterOutSelectedOptions?: boolean;
|
46
47
|
selectOnFocus?: boolean;
|
47
48
|
clearOnBlur?: boolean;
|
@@ -113,7 +113,7 @@ const AutoComplete = react_1.default.forwardRef((props_, ref) => {
|
|
113
113
|
const IconButton = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.IconButton) || IconButton_1.default; }, [theme]);
|
114
114
|
const RoundProgress = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.RoundProgress) || RoundProgress_1.default; }, [theme]);
|
115
115
|
const ListSubheader = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.ListSubheader) || ListSubheader_1.default; }, [theme]);
|
116
|
-
const { tonal = true, color = 'primary', size = 'regular', version = 'filled', valueInput: valueInput_, valueInputDefault, onChangeInput: onChangeInput_, value: value_, valueDefault, onChange: onChange_, options: options_ = [], label, multiple, prefix, sufix, start, end, autoWidth = true, readOnly, getLabel: getLabel_, renderValues: renderValues_, renderChip, renderOption, equal, equalInput, filter, clear = true, loading, autoSelectOnBlur, blurOnSelect = false, noOptions, noOptionsObject, startOptionsObject, noOptionsElement, startOptionsElement, endOptionsElement, endOptionsObject, openOnFocus = true, closeOnSelect, clearOnEscape, groupBy, limit, filterOutSelectedOptions, selectOnFocus, clearOnBlur, clearInputOnSelect, chip, fullWidth, noInputValue, disabled, IconClear = IconMaterialCloseW100_1.default, IconDropdown = IconMaterialArrowDropDownW100_1.default, WrapperProps, ChipProps, ListProps, MenuProps, IconButtonProps, InputProps, IconProps, className, style, children: children_ } = props, other = __rest(props, ["tonal", "color", "size", "version", "valueInput", "valueInputDefault", "onChangeInput", "value", "valueDefault", "onChange", "options", "label", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "readOnly", "getLabel", "renderValues", "renderChip", "renderOption", "equal", "equalInput", "filter", "clear", "loading", "autoSelectOnBlur", "blurOnSelect", "noOptions", "noOptionsObject", "startOptionsObject", "noOptionsElement", "startOptionsElement", "endOptionsElement", "endOptionsObject", "openOnFocus", "closeOnSelect", "clearOnEscape", "groupBy", "limit", "filterOutSelectedOptions", "selectOnFocus", "clearOnBlur", "clearInputOnSelect", "chip", "fullWidth", "noInputValue", "disabled", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ListProps", "MenuProps", "IconButtonProps", "InputProps", "IconProps", "className", "style", "children"]);
|
116
|
+
const { tonal = true, color = 'primary', size = 'regular', version = 'filled', valueInput: valueInput_, valueInputDefault, onChangeInput: onChangeInput_, value: value_, valueDefault, onChange: onChange_, options: options_ = [], label, multiple, prefix, sufix, start, end, autoWidth = true, readOnly, getLabel: getLabel_, renderValues: renderValues_, renderChip, renderOption, equal, equalInput, filter, clear = true, loading, autoSelectOnBlur, blurOnSelect = false, noOptions, noOptionsObject, startOptionsObject, noOptionsElement, startOptionsElement, endOptionsElement, endOptionsObject, openOnFocus = true, closeOnSelect, clearOnEscape, groupBy, limit, openOnInputUpdate, filterOutSelectedOptions, selectOnFocus, clearOnBlur, clearInputOnSelect, chip, fullWidth, noInputValue, disabled, IconClear = IconMaterialCloseW100_1.default, IconDropdown = IconMaterialArrowDropDownW100_1.default, WrapperProps, ChipProps, ListProps, MenuProps, IconButtonProps, InputProps, IconProps, className, style, children: children_ } = props, other = __rest(props, ["tonal", "color", "size", "version", "valueInput", "valueInputDefault", "onChangeInput", "value", "valueDefault", "onChange", "options", "label", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "readOnly", "getLabel", "renderValues", "renderChip", "renderOption", "equal", "equalInput", "filter", "clear", "loading", "autoSelectOnBlur", "blurOnSelect", "noOptions", "noOptionsObject", "startOptionsObject", "noOptionsElement", "startOptionsElement", "endOptionsElement", "endOptionsObject", "openOnFocus", "closeOnSelect", "clearOnEscape", "groupBy", "limit", "openOnInputUpdate", "filterOutSelectedOptions", "selectOnFocus", "clearOnBlur", "clearInputOnSelect", "chip", "fullWidth", "noInputValue", "disabled", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ListProps", "MenuProps", "IconButtonProps", "InputProps", "IconProps", "className", "style", "children"]);
|
117
117
|
const children = react_1.default.Children.toArray(children_);
|
118
118
|
const [init, setInit] = react_1.default.useState(false);
|
119
119
|
const [valueInput, setValueInput] = react_1.default.useState(valueInputDefault !== undefined ? valueInputDefault : valueInput_);
|
@@ -167,9 +167,9 @@ const AutoComplete = react_1.default.forwardRef((props_, ref) => {
|
|
167
167
|
}, []);
|
168
168
|
react_1.default.useEffect(() => {
|
169
169
|
const option = (refs.optionsProps.current || []).find(item_ => isEqualToInput(refs.valueInput.current, item_));
|
170
|
-
if (!!(valueInput === null || valueInput === void 0 ? void 0 : valueInput.length) && !open && !option && !disabled && !readOnly)
|
170
|
+
if (!!(valueInput === null || valueInput === void 0 ? void 0 : valueInput.length) && openOnInputUpdate && !open && !option && !disabled && !readOnly)
|
171
171
|
setOpen(!free);
|
172
|
-
}, [valueInput, free]);
|
172
|
+
}, [valueInput, openOnInputUpdate, free]);
|
173
173
|
react_1.default.useEffect(() => {
|
174
174
|
if (value_ !== undefined && value_ !== value)
|
175
175
|
setValue(value_);
|
package/Select/Select.js
CHANGED
@@ -120,7 +120,7 @@ const Select = react_1.default.forwardRef((props_, ref) => {
|
|
120
120
|
const Chips = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.Chips) || Chips_1.default; }, [theme]);
|
121
121
|
const TextField = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.TextField) || TextField_1.default; }, [theme]);
|
122
122
|
const IconButton = react_1.default.useMemo(() => { var _a; return ((_a = theme === null || theme === void 0 ? void 0 : theme.elements) === null || _a === void 0 ? void 0 : _a.IconButton) || IconButton_1.default; }, [theme]);
|
123
|
-
const { tonal = true, color = 'primary', size = 'regular', version = 'filled', value: value_, valueDefault, onChange: onChange_, options, name, multiple, prefix, sufix, start, end, autoWidth = true, getLabel: getLabel_, fullWidth, chip, clear, readOnly, noSelectText, disabled, renderValues: renderValues_, renderChip, IconClear = IconMaterialCloseW100_1.default, IconDropdown = IconMaterialArrowDropDownW100_1.default, WrapperProps, ChipProps, ChiProps, ListProps = {
|
123
|
+
const { tonal = true, color = 'primary', size = 'regular', version = 'filled', value: value_, valueDefault, onChange: onChange_, options, name, multiple, prefix, sufix, start, end, autoWidth = true, getLabel: getLabel_, fullWidth, chip, clear, readOnly, noSelectText, disabled, renderValues: renderValues_, renderChip, IconClear = IconMaterialCloseW100_1.default, IconDropdown = IconMaterialArrowDropDownW100_1.default, inputProps, InputWrapperProps, WrapperProps, ChipProps, ChiProps, ListProps = {
|
124
124
|
style: {
|
125
125
|
maxHeight: 250,
|
126
126
|
overflowY: 'auto',
|
@@ -128,7 +128,7 @@ const Select = react_1.default.forwardRef((props_, ref) => {
|
|
128
128
|
}
|
129
129
|
}, MenuProps = {
|
130
130
|
portal: true
|
131
|
-
}, IconButtonProps, IconProps, className, style, children: children_ } = props, other = __rest(props, ["tonal", "color", "size", "version", "value", "valueDefault", "onChange", "options", "name", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "getLabel", "fullWidth", "chip", "clear", "readOnly", "noSelectText", "disabled", "renderValues", "renderChip", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ChiProps", "ListProps", "MenuProps", "IconButtonProps", "IconProps", "className", "style", "children"]);
|
131
|
+
}, IconButtonProps, IconProps, className, style, children: children_ } = props, other = __rest(props, ["tonal", "color", "size", "version", "value", "valueDefault", "onChange", "options", "name", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "getLabel", "fullWidth", "chip", "clear", "readOnly", "noSelectText", "disabled", "renderValues", "renderChip", "IconClear", "IconDropdown", "inputProps", "InputWrapperProps", "WrapperProps", "ChipProps", "ChiProps", "ListProps", "MenuProps", "IconButtonProps", "IconProps", "className", "style", "children"]);
|
132
132
|
const children = react_1.default.Children.toArray(children_);
|
133
133
|
const [value, setValue] = react_1.default.useState(() => {
|
134
134
|
const values = valueDefault !== undefined ? valueDefault : value_;
|
@@ -342,11 +342,13 @@ const Select = react_1.default.forwardRef((props_, ref) => {
|
|
342
342
|
classes.root,
|
343
343
|
open && classes.open,
|
344
344
|
disabled && classes.disabled
|
345
|
-
]), tonal: tonal, color: color, size: size, version: version, name: name, prefix: prefix, sufix: sufix, start: start, end: endIcons, readOnly: readOnly, endVerticalAlign: 'center', role: 'combobox', "aria-multiselectable": multiple, "aria-controls": refs.ids.list, "aria-expanded": open, "aria-haspopup": 'listbox', "aria-labelledby": name, "aria-disabled": disabled, fullWidth: fullWidth, disabled: disabled, InputWrapperProps: {
|
346
|
-
|
345
|
+
]), tonal: tonal, color: color, size: size, version: version, name: name, prefix: prefix, sufix: sufix, start: start, end: endIcons, readOnly: readOnly, endVerticalAlign: 'center', role: 'combobox', "aria-multiselectable": multiple, "aria-controls": refs.ids.list, "aria-expanded": open, "aria-haspopup": 'listbox', "aria-labelledby": name, "aria-disabled": disabled, fullWidth: fullWidth, disabled: disabled, InputWrapperProps: Object.assign(Object.assign({ onMouseDown,
|
346
|
+
onMouseUp,
|
347
|
+
onClick, onKeyDown: onEnterKeyDown }, InputWrapperProps), { className: (0, style_react_1.classNames)([
|
347
348
|
(0, utils_2.staticClassName)('Select', theme) && [
|
348
349
|
'onesy-Select-input-wrapper'
|
349
350
|
],
|
351
|
+
InputWrapperProps === null || InputWrapperProps === void 0 ? void 0 : InputWrapperProps.className,
|
350
352
|
classes.inputWrapper,
|
351
353
|
chip && [
|
352
354
|
classes.chip,
|
@@ -354,15 +356,7 @@ const Select = react_1.default.forwardRef((props_, ref) => {
|
|
354
356
|
],
|
355
357
|
open && classes.open,
|
356
358
|
readOnly && classes.readOnly
|
357
|
-
]),
|
358
|
-
onMouseDown,
|
359
|
-
onMouseUp,
|
360
|
-
onClick,
|
361
|
-
onKeyDown: onEnterKeyDown
|
362
|
-
}, inputProps: {
|
363
|
-
disabled: true,
|
364
|
-
readOnly: true
|
365
|
-
}, style: Object.assign(Object.assign({}, style), styles.root) }, other, { children: (0, jsx_runtime_1.jsx)(Line, Object.assign({ gap: 0, direction: 'row', className: (0, style_react_1.classNames)([
|
359
|
+
]) }), inputProps: Object.assign({ disabled: true, readOnly: true }, inputProps), style: Object.assign(Object.assign({}, style), styles.root) }, other, { children: (0, jsx_runtime_1.jsx)(Line, Object.assign({ gap: 0, direction: 'row', className: (0, style_react_1.classNames)([
|
366
360
|
(0, utils_2.staticClassName)('Select', theme) && [
|
367
361
|
'onesy-Select-input'
|
368
362
|
],
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
4
|
-
const _excluded = ["tonal", "color", "size", "version", "valueInput", "valueInputDefault", "onChangeInput", "value", "valueDefault", "onChange", "options", "label", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "readOnly", "getLabel", "renderValues", "renderChip", "renderOption", "equal", "equalInput", "filter", "clear", "loading", "autoSelectOnBlur", "blurOnSelect", "noOptions", "noOptionsObject", "startOptionsObject", "noOptionsElement", "startOptionsElement", "endOptionsElement", "endOptionsObject", "openOnFocus", "closeOnSelect", "clearOnEscape", "groupBy", "limit", "filterOutSelectedOptions", "selectOnFocus", "clearOnBlur", "clearInputOnSelect", "chip", "fullWidth", "noInputValue", "disabled", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ListProps", "MenuProps", "IconButtonProps", "InputProps", "IconProps", "className", "style", "children"];
|
4
|
+
const _excluded = ["tonal", "color", "size", "version", "valueInput", "valueInputDefault", "onChangeInput", "value", "valueDefault", "onChange", "options", "label", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "readOnly", "getLabel", "renderValues", "renderChip", "renderOption", "equal", "equalInput", "filter", "clear", "loading", "autoSelectOnBlur", "blurOnSelect", "noOptions", "noOptionsObject", "startOptionsObject", "noOptionsElement", "startOptionsElement", "endOptionsElement", "endOptionsObject", "openOnFocus", "closeOnSelect", "clearOnEscape", "groupBy", "limit", "openOnInputUpdate", "filterOutSelectedOptions", "selectOnFocus", "clearOnBlur", "clearInputOnSelect", "chip", "fullWidth", "noInputValue", "disabled", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ListProps", "MenuProps", "IconButtonProps", "InputProps", "IconProps", "className", "style", "children"];
|
5
5
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
6
6
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
7
7
|
import React from 'react';
|
@@ -156,6 +156,7 @@ const AutoComplete = /*#__PURE__*/React.forwardRef((props_, ref) => {
|
|
156
156
|
clearOnEscape,
|
157
157
|
groupBy,
|
158
158
|
limit,
|
159
|
+
openOnInputUpdate,
|
159
160
|
filterOutSelectedOptions,
|
160
161
|
selectOnFocus,
|
161
162
|
clearOnBlur,
|
@@ -231,8 +232,8 @@ const AutoComplete = /*#__PURE__*/React.forwardRef((props_, ref) => {
|
|
231
232
|
}, []);
|
232
233
|
React.useEffect(() => {
|
233
234
|
const option = (refs.optionsProps.current || []).find(item_ => isEqualToInput(refs.valueInput.current, item_));
|
234
|
-
if (!!valueInput?.length && !open && !option && !disabled && !readOnly) setOpen(!free);
|
235
|
-
}, [valueInput, free]);
|
235
|
+
if (!!valueInput?.length && openOnInputUpdate && !open && !option && !disabled && !readOnly) setOpen(!free);
|
236
|
+
}, [valueInput, openOnInputUpdate, free]);
|
236
237
|
React.useEffect(() => {
|
237
238
|
if (value_ !== undefined && value_ !== value) setValue(value_);
|
238
239
|
}, [value_]);
|
package/esm/Select/Select.js
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
4
|
-
const _excluded = ["tonal", "color", "size", "version", "value", "valueDefault", "onChange", "options", "name", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "getLabel", "fullWidth", "chip", "clear", "readOnly", "noSelectText", "disabled", "renderValues", "renderChip", "IconClear", "IconDropdown", "WrapperProps", "ChipProps", "ChiProps", "ListProps", "MenuProps", "IconButtonProps", "IconProps", "className", "style", "children"];
|
4
|
+
const _excluded = ["tonal", "color", "size", "version", "value", "valueDefault", "onChange", "options", "name", "multiple", "prefix", "sufix", "start", "end", "autoWidth", "getLabel", "fullWidth", "chip", "clear", "readOnly", "noSelectText", "disabled", "renderValues", "renderChip", "IconClear", "IconDropdown", "inputProps", "InputWrapperProps", "WrapperProps", "ChipProps", "ChiProps", "ListProps", "MenuProps", "IconButtonProps", "IconProps", "className", "style", "children"];
|
5
5
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
6
6
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
7
7
|
import React from 'react';
|
@@ -151,6 +151,8 @@ const Select = /*#__PURE__*/React.forwardRef((props_, ref) => {
|
|
151
151
|
renderChip,
|
152
152
|
IconClear = IconMaterialClose,
|
153
153
|
IconDropdown = IconMaterialArrowDropDown,
|
154
|
+
inputProps,
|
155
|
+
InputWrapperProps,
|
154
156
|
WrapperProps,
|
155
157
|
ChipProps,
|
156
158
|
ChiProps,
|
@@ -389,17 +391,18 @@ const Select = /*#__PURE__*/React.forwardRef((props_, ref) => {
|
|
389
391
|
"aria-disabled": disabled,
|
390
392
|
fullWidth: fullWidth,
|
391
393
|
disabled: disabled,
|
392
|
-
InputWrapperProps: {
|
393
|
-
className: classNames([staticClassName('Select', theme) && ['onesy-Select-input-wrapper'], classes.inputWrapper, chip && [classes.chip, classes[`inputWrapper_chip_size_${size}`]], open && classes.open, readOnly && classes.readOnly]),
|
394
|
+
InputWrapperProps: _objectSpread(_objectSpread({
|
394
395
|
onMouseDown,
|
395
396
|
onMouseUp,
|
396
397
|
onClick,
|
397
398
|
onKeyDown: onEnterKeyDown
|
398
|
-
},
|
399
|
-
|
399
|
+
}, InputWrapperProps), {}, {
|
400
|
+
className: classNames([staticClassName('Select', theme) && ['onesy-Select-input-wrapper'], InputWrapperProps?.className, classes.inputWrapper, chip && [classes.chip, classes[`inputWrapper_chip_size_${size}`]], open && classes.open, readOnly && classes.readOnly])
|
401
|
+
}),
|
402
|
+
inputProps: _objectSpread({
|
400
403
|
disabled: true,
|
401
404
|
readOnly: true
|
402
|
-
},
|
405
|
+
}, inputProps),
|
403
406
|
style: _objectSpread(_objectSpread({}, style), styles.root)
|
404
407
|
}, other), /*#__PURE__*/React.createElement(Line, {
|
405
408
|
gap: 0,
|
package/esm/index.js
CHANGED