@ozen-ui/kit 0.60.0 → 0.61.0

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 (44) hide show
  1. package/__inner__/cjs/components/Autocomplete/helper.d.ts +7 -72
  2. package/__inner__/cjs/components/Autocomplete/types.d.ts +11 -17
  3. package/__inner__/cjs/components/AutocompleteNext/helpers.d.ts +7 -77
  4. package/__inner__/cjs/components/AutocompleteNext/types.d.ts +10 -16
  5. package/__inner__/cjs/components/DatePicker/DatePicker.d.ts +2 -36
  6. package/__inner__/cjs/components/DatePicker/types.d.ts +5 -14
  7. package/__inner__/cjs/components/Segment/Segment.js +1 -1
  8. package/__inner__/cjs/components/Segment/components/SegmentItem/SegmentItem.js +1 -1
  9. package/__inner__/cjs/components/Select/Select.css +6 -0
  10. package/__inner__/cjs/components/Select/Select.js +41 -59
  11. package/__inner__/cjs/components/Select/components/SelectInput/SelectInput.js +5 -6
  12. package/__inner__/cjs/components/Select/components/SelectInputContextConsumer/SelectInputContextConsumer.d.ts +5 -0
  13. package/__inner__/cjs/components/Select/components/{SelectConsumer/SelectInputConsumer.js → SelectInputContextConsumer/SelectInputContextConsumer.js} +3 -3
  14. package/__inner__/cjs/components/Select/components/SelectInputContextConsumer/index.d.ts +1 -0
  15. package/__inner__/cjs/components/Select/components/{SelectConsumer → SelectInputContextConsumer}/index.js +1 -1
  16. package/__inner__/cjs/components/Select/helpers/types.d.ts +5 -8
  17. package/__inner__/cjs/components/Select/helpers/types.js +5 -1
  18. package/__inner__/cjs/components/Select/types.d.ts +43 -41
  19. package/__inner__/cjs/components/Stack/types.d.ts +2 -2
  20. package/__inner__/esm/components/Autocomplete/helper.d.ts +7 -72
  21. package/__inner__/esm/components/Autocomplete/types.d.ts +11 -17
  22. package/__inner__/esm/components/AutocompleteNext/helpers.d.ts +7 -77
  23. package/__inner__/esm/components/AutocompleteNext/types.d.ts +10 -16
  24. package/__inner__/esm/components/DatePicker/DatePicker.d.ts +2 -36
  25. package/__inner__/esm/components/DatePicker/types.d.ts +5 -14
  26. package/__inner__/esm/components/Segment/Segment.js +1 -1
  27. package/__inner__/esm/components/Segment/components/SegmentItem/SegmentItem.js +1 -1
  28. package/__inner__/esm/components/Select/Select.css +6 -0
  29. package/__inner__/esm/components/Select/Select.js +42 -60
  30. package/__inner__/esm/components/Select/components/SelectInput/SelectInput.js +5 -6
  31. package/__inner__/esm/components/Select/components/SelectInputContextConsumer/SelectInputContextConsumer.d.ts +5 -0
  32. package/__inner__/esm/components/Select/components/{SelectConsumer/SelectInputConsumer.js → SelectInputContextConsumer/SelectInputContextConsumer.js} +1 -1
  33. package/__inner__/esm/components/Select/components/SelectInputContextConsumer/index.d.ts +1 -0
  34. package/__inner__/esm/components/Select/components/SelectInputContextConsumer/index.js +1 -0
  35. package/__inner__/esm/components/Select/helpers/types.d.ts +5 -8
  36. package/__inner__/esm/components/Select/helpers/types.js +2 -0
  37. package/__inner__/esm/components/Select/types.d.ts +43 -41
  38. package/__inner__/esm/components/Stack/types.d.ts +2 -2
  39. package/package.json +4 -4
  40. package/__inner__/cjs/components/Select/components/SelectConsumer/SelectInputConsumer.d.ts +0 -5
  41. package/__inner__/cjs/components/Select/components/SelectConsumer/index.d.ts +0 -1
  42. package/__inner__/esm/components/Select/components/SelectConsumer/SelectInputConsumer.d.ts +0 -5
  43. package/__inner__/esm/components/Select/components/SelectConsumer/index.d.ts +0 -1
  44. package/__inner__/esm/components/Select/components/SelectConsumer/index.js +0 -1
@@ -10,6 +10,7 @@ var useMultiRef_1 = require("../../hooks/useMultiRef");
10
10
  var useThemeProps_1 = require("../../hooks/useThemeProps");
11
11
  var classname_1 = require("../../utils/classname");
12
12
  var isKeys_1 = require("../../utils/isKeys");
13
+ var isString_1 = require("../../utils/isString");
13
14
  var DataList_1 = require("../DataList");
14
15
  var components_1 = require("./components");
15
16
  var constants_1 = require("./constants");
@@ -22,21 +23,20 @@ var SelectRender = function (inProps, ref) {
22
23
  });
23
24
  var _a = props.size, size = _a === void 0 ? constants_1.SELECT_DEFAULT_SIZE : _a, _b = props.autoFocus, autoFocus = _b === void 0 ? constants_1.SELECT_DEFAULT_AUTO_FOCUS : _b, _c = props.fullWidth, fullWidth = _c === void 0 ? constants_1.SELECT_DEFAULT_FULL_WIDTH : _c, _d = props.disabled, disabled = _d === void 0 ? constants_1.SELECT_DEFAULT_DISABLED : _d, _e = props.required, required = _e === void 0 ? constants_1.SELECT_DEFAULT_REQUIRED : _e, _f = props.multiline, multiline = _f === void 0 ? constants_1.SELECT_DEFAULT_MULTILINE : _f, _g = props.defaultOpen, defaultOpen = _g === void 0 ? constants_1.SELECT_DEFAULT_DEFAULT_OPEN : _g, valueProp = props.value, defaultValue = props.defaultValue, onChange = props.onChange, renderValueProp = props.renderValue, children = props.children, onClick = props.onClick, onKeyDown = props.onKeyDown, menuProps = props.menuProps, dataListPropsProp = props.dataListProps, bodyProps = props.bodyProps, bodeRefProp = props.bodyRef, onCloseProp = props.onClose, onOpenProp = props.onOpen, openProp = props.open, multiple = props.multiple, other = tslib_1.__rest(props, ["size", "autoFocus", "fullWidth", "disabled", "required", "multiline", "defaultOpen", "value", "defaultValue", "onChange", "renderValue", "children", "onClick", "onKeyDown", "menuProps", "dataListProps", "bodyProps", "bodyRef", "onClose", "onOpen", "open", "multiple"]);
24
25
  var bodyInnerRef = (0, react_1.useRef)(null);
25
- /** @deprecated props */
26
- var bodyRef = (bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.ref) || bodeRefProp;
26
+ var bodyRef = (0, useMultiRef_1.useMultiRef)([(bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.ref) || bodeRefProp, bodyInnerRef]);
27
27
  var dataListProps = dataListPropsProp || menuProps;
28
28
  var _h = tslib_1.__read((0, useControlled_1.useControlled)({
29
29
  value: valueProp,
30
30
  defaultValue: defaultValue,
31
31
  name: 'Select',
32
32
  state: 'value',
33
- }), 3), valueState = _h[0], setValueState = _h[1], isValueControlled = _h[2];
33
+ }), 2), valueState = _h[0], setValueState = _h[1];
34
34
  var _j = tslib_1.__read((0, useControlled_1.useControlled)({
35
35
  value: openProp,
36
36
  defaultValue: defaultOpen,
37
37
  name: 'Select',
38
38
  state: 'open',
39
- }), 3), open = _j[0], setOpen = _j[1], isOpenControlled = _j[2];
39
+ }), 2), open = _j[0], setOpen = _j[1];
40
40
  var currentLabel;
41
41
  var isNotSelectOption = function (child) { return !(0, react_1.isValidElement)(child) || child.type !== DataList_1.DataListOption; };
42
42
  var resolvedChildren = (0, react_is_1.isFragment)(children)
@@ -45,27 +45,23 @@ var SelectRender = function (inProps, ref) {
45
45
  react_1.Children.forEach(resolvedChildren, function (child) {
46
46
  var _a, _b;
47
47
  if (!isNotSelectOption(child)) {
48
- var label = typeof child.props.children === 'string'
48
+ var label = (0, isString_1.isString)(child.props.children)
49
49
  ? (_a = child.props.label) !== null && _a !== void 0 ? _a : child.props.children
50
50
  : child.props.label;
51
- var params = {
52
- multiple: multiple,
53
- label: currentLabel,
54
- value: valueState,
55
- };
56
- if ((0, helpers_1.isMultipleParams)(params)) {
51
+ var params = tslib_1.__assign(tslib_1.__assign({}, inProps), { multiple: multiple, value: valueState });
52
+ if ((0, helpers_1.isMultipleParams)(params) &&
53
+ (0, helpers_1.isMultipleLabel)(currentLabel, multiple)) {
57
54
  var selected = (_b = params.value) === null || _b === void 0 ? void 0 : _b.includes(child.props.value);
58
- if (selected) {
59
- currentLabel = tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read((params.label || [])), false), [
55
+ if (selected)
56
+ currentLabel = tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read((currentLabel || [])), false), [
60
57
  label,
61
58
  ], false);
62
- }
63
59
  }
64
- if ((0, helpers_1.isNotMultipleParams)(params)) {
60
+ if ((0, helpers_1.isNotMultipleParams)(params) &&
61
+ (0, helpers_1.isNotMultipleLabel)(currentLabel, multiple)) {
65
62
  var selected = params.value === child.props.value;
66
- if (selected) {
63
+ if (selected)
67
64
  currentLabel = label;
68
- }
69
65
  }
70
66
  }
71
67
  });
@@ -80,52 +76,40 @@ var SelectRender = function (inProps, ref) {
80
76
  var handleToggle = function () {
81
77
  if (disabled)
82
78
  return;
83
- if (open) {
79
+ if (open)
84
80
  handleClose();
85
- }
86
- else {
81
+ else
87
82
  handleOpen();
88
- }
89
83
  };
90
- var handleClick = function (event) {
91
- onClick === null || onClick === void 0 ? void 0 : onClick(event);
84
+ var handleClick = function (e) {
85
+ onClick === null || onClick === void 0 ? void 0 : onClick(e);
92
86
  handleToggle();
93
87
  };
94
88
  /** Управление элементом контроля через клавиатуру */
95
- var handleKeyDown = function (event) {
96
- if ((0, isKeys_1.isKeys)(event, ['Space', 'ArrowDown', 'ArrowUp']) && !open) {
97
- event.preventDefault();
89
+ var handleKeyDown = function (e) {
90
+ if ((0, isKeys_1.isKeys)(e, ['Space', 'ArrowDown', 'ArrowUp']) && !open) {
91
+ e.preventDefault();
98
92
  handleToggle();
99
93
  }
100
- onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
94
+ onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
101
95
  };
102
96
  /** Событие выбора значения из раскрывающегося списка */
103
- var handleChange = function (event, _a) {
97
+ var handleChange = function (e, _a) {
104
98
  var value = _a.value;
105
- if (!isValueControlled || onChange) {
106
- setValueState(value);
107
- }
108
- onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
99
+ setValueState(value);
100
+ onChange === null || onChange === void 0 ? void 0 : onChange(value, e);
109
101
  if (!multiple)
110
102
  handleClose();
111
103
  };
112
104
  /** Представление значение элемента контроля по умолчанию */
113
105
  var renderDefaultValue = function (option) {
114
106
  var _a = option.label, label = _a === void 0 ? '' : _a, _b = option.value, value = _b === void 0 ? '' : _b;
115
- if (!value && value !== 0) {
107
+ if (!value && value !== 0)
116
108
  return null;
117
- }
118
- var params = {
119
- multiple: multiple,
120
- label: label,
121
- value: value,
122
- };
123
- if ((0, helpers_1.isMultipleParams)(params)) {
124
- return react_1.default.createElement("span", null, tslib_1.__spreadArray([], tslib_1.__read(params.label), false).join(', '));
125
- }
126
- if ((0, helpers_1.isNotMultipleParams)(params)) {
127
- return react_1.default.createElement("span", null, params.label);
128
- }
109
+ if ((0, helpers_1.isMultipleLabel)(label, multiple))
110
+ return react_1.default.createElement("span", null, tslib_1.__spreadArray([], tslib_1.__read(label), false).join(', '));
111
+ if ((0, helpers_1.isNotMultipleLabel)(label, multiple))
112
+ return react_1.default.createElement("span", null, label);
129
113
  return null;
130
114
  };
131
115
  /** Значение для текстового поля компонента */
@@ -135,12 +119,10 @@ var SelectRender = function (inProps, ref) {
135
119
  multiple: multiple,
136
120
  value: valueState,
137
121
  };
138
- if ((0, helpers_1.isMultipleParams)(params)) {
139
- return (_a = params.value) === null || _a === void 0 ? void 0 : _a.join(',');
140
- }
141
- if ((0, helpers_1.isNotMultipleParams)(params)) {
142
- return params.value;
143
- }
122
+ if ((0, helpers_1.isMultipleParams)(params))
123
+ return ((_a = params.value) === null || _a === void 0 ? void 0 : _a.join(',')) || '';
124
+ if ((0, helpers_1.isNotMultipleParams)(params))
125
+ return (params === null || params === void 0 ? void 0 : params.value) || '';
144
126
  return '';
145
127
  };
146
128
  /** Представление значение элемента контроля */
@@ -150,22 +132,22 @@ var SelectRender = function (inProps, ref) {
150
132
  /** Устанавливает фокус на элементе контроля
151
133
  * если компонент по умолчанию открыт — defaultOpen={true}
152
134
  * и является неконтролируемым */
153
- if (defaultOpen && !isOpenControlled) {
135
+ if (defaultOpen)
154
136
  (_a = bodyInnerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
155
- }
156
- }, [open]);
137
+ }, []);
157
138
  (0, react_1.useEffect)(function () {
158
139
  var _a;
159
140
  /** Автофокус на элементе контроля */
160
- if (autoFocus) {
141
+ if (autoFocus)
161
142
  (_a = bodyInnerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
162
- }
163
143
  }, [autoFocus]);
164
144
  return (react_1.default.createElement(react_1.default.Fragment, null,
165
- react_1.default.createElement(components_1.SelectInput, tslib_1.__assign({ size: size, disabled: disabled, required: required, multiline: multiline, fullWidth: fullWidth }, other, { open: open, onClick: handleClick, onKeyDown: handleKeyDown, value: inputValue(), renderedValue: renderValue({
145
+ react_1.default.createElement(components_1.SelectInput, tslib_1.__assign({ size: size, disabled: disabled, required: required, multiline: multiline, fullWidth: fullWidth }, other, { open: open, value: inputValue(), onClick: handleClick, onKeyDown: handleKeyDown, renderedValue: renderValue({
166
146
  label: currentLabel,
167
147
  value: valueState,
168
- }), bodyProps: tslib_1.__assign(tslib_1.__assign({}, bodyProps), { ref: (0, useMultiRef_1.useMultiRef)([bodyRef, bodyInnerRef]) }), ref: ref })),
169
- react_1.default.createElement(DataList_1.DataList, tslib_1.__assign({ equalAnchorWidth: true }, dataListProps, { listProps: tslib_1.__assign({ size: size, role: 'listbox' }, dataListProps === null || dataListProps === void 0 ? void 0 : dataListProps.listProps), open: open, multiple: multiple, selected: (valueState || ''), onSelect: handleChange, anchorRef: bodyInnerRef, onClose: handleClose }), children)));
148
+ }), bodyProps: tslib_1.__assign(tslib_1.__assign({}, bodyProps), { ref: bodyRef }), ref: ref })),
149
+ react_1.default.createElement(DataList_1.DataList, tslib_1.__assign({ equalAnchorWidth: true }, dataListProps, { listProps: tslib_1.__assign({ size: size, role: 'listbox' }, dataListProps === null || dataListProps === void 0 ? void 0 : dataListProps.listProps), open: open, multiple: multiple, onClose: handleClose, onSelect: handleChange, anchorRef: bodyInnerRef,
150
+ // TODO: add `null` to `DataListSelected`
151
+ selected: (valueState || null) }), children)));
170
152
  };
171
153
  exports.Select = (0, react_1.forwardRef)(SelectRender);
@@ -14,7 +14,7 @@ var FieldLabel_1 = require("../../../FieldLabel");
14
14
  var Fieldset_1 = require("../../../Fieldset");
15
15
  var constants_1 = require("../../constants");
16
16
  var index_1 = require("../../index");
17
- var SelectConsumer_1 = require("../SelectConsumer");
17
+ var SelectInputContextConsumer_1 = require("../SelectInputContextConsumer");
18
18
  exports.SelectInput = (0, react_1.forwardRef)(function (_a, ref) {
19
19
  var _b = _a.size, size = _b === void 0 ? constants_1.SELECT_DEFAULT_SIZE : _b, _c = _a.multiline, multiline = _c === void 0 ? constants_1.SELECT_DEFAULT_MULTILINE : _c, open = _a.open, label = _a.label, error = _a.error, id = _a.id, name = _a.name, renderLeft = _a.renderLeft, renderRight = _a.renderRight, renderedValue = _a.renderedValue, fullWidth = _a.fullWidth, disabled = _a.disabled, hint = _a.hint, required = _a.required, className = _a.className, inputProps = _a.inputProps, valueProp = _a.value, placeholderProp = _a.placeholder, defaultValue = _a.defaultValue, onFocus = _a.onFocus, onBlur = _a.onBlur, onClick = _a.onClick, onKeyDown = _a.onKeyDown, labelProps = _a.labelProps, fieldProps = _a.fieldProps, hintProps = _a.hintProps, labelRef = _a.labelRef, inputRef = _a.inputRef, fieldRef = _a.fieldRef, bodyProps = _a.bodyProps, other = tslib_1.__rest(_a, ["size", "multiline", "open", "label", "error", "id", "name", "renderLeft", "renderRight", "renderedValue", "fullWidth", "disabled", "hint", "required", "className", "inputProps", "value", "placeholder", "defaultValue", "onFocus", "onBlur", "onClick", "onKeyDown", "labelProps", "fieldProps", "hintProps", "labelRef", "inputRef", "fieldRef", "bodyProps"]);
20
20
  var _d = tslib_1.__read((0, useBoolean_1.useBoolean)(), 2), focused = _d[0], _e = _d[1], on = _e.on, off = _e.off;
@@ -27,14 +27,13 @@ exports.SelectInput = (0, react_1.forwardRef)(function (_a, ref) {
27
27
  off();
28
28
  onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
29
29
  }, [onBlur]);
30
- return (react_1.default.createElement(FieldControl_1.FieldControl, tslib_1.__assign({ error: error, size: size, filled: filled, focused: focused, disabled: disabled, fullWidth: fullWidth, required: required }, other, { className: (0, index_1.cnSelect)({
31
- multiline: multiline,
32
- }, [className]), ref: ref }),
33
- react_1.default.createElement("div", tslib_1.__assign({ role: "button", "aria-haspopup": "listbox", "aria-expanded": open }, bodyProps, { onClick: onClick, onKeyDown: onKeyDown, tabIndex: disabled ? -1 : 0, onFocus: handleFocus, onBlur: handleBlur, className: (0, index_1.cnSelect)('Body', [bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.className]) }),
30
+ return (react_1.default.createElement(FieldControl_1.FieldControl, tslib_1.__assign({ size: size, error: error, filled: filled, focused: focused, disabled: disabled, required: required, fullWidth: fullWidth }, other, { ref: ref, className: (0, index_1.cnSelect)({ multiline: multiline }, [className]) }),
31
+ react_1.default.createElement("div", tslib_1.__assign({ role: "button", "aria-expanded": open, "aria-haspopup": "listbox" }, bodyProps, { onClick: onClick, onBlur: handleBlur, onKeyDown: onKeyDown, onFocus: handleFocus, tabIndex: disabled ? -1 : 0, className: (0, index_1.cnSelect)('Body', [bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.className]) }),
34
32
  react_1.default.createElement(FieldIcon_1.FieldIcon, { icon: renderLeft, className: (0, index_1.cnSelect)('RenderLeft') }),
35
33
  react_1.default.createElement("div", { className: (0, index_1.cnSelect)('FieldContainer') },
34
+ react_1.default.createElement("div", { className: (0, index_1.cnSelect)('HiddenLabel'), "aria-hidden": true }, label),
36
35
  react_1.default.createElement(FieldLabel_1.FieldLabel, tslib_1.__assign({}, labelProps, { className: (0, index_1.cnSelect)('Label', [labelProps === null || labelProps === void 0 ? void 0 : labelProps.className]), ref: (labelProps === null || labelProps === void 0 ? void 0 : labelProps.ref) || labelRef }), label),
37
- react_1.default.createElement(SelectConsumer_1.SelectInputConsumer, { id: id, name: name, value: valueProp, defaultValue: defaultValue, placeholder: placeholderProp, fieldProps: fieldProps, inputProps: inputProps, fieldRef: (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.ref) || fieldRef, inputRef: (inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref) || inputRef, renderedValue: renderedValue })),
36
+ react_1.default.createElement(SelectInputContextConsumer_1.SelectInputContextConsumer, { id: id, name: name, value: valueProp, fieldProps: fieldProps, inputProps: inputProps, defaultValue: defaultValue, renderedValue: renderedValue, placeholder: placeholderProp, fieldRef: (fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.ref) || fieldRef, inputRef: (inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref) || inputRef })),
38
37
  react_1.default.createElement(FieldIcon_1.FieldIcon, { icon: renderRight, className: (0, index_1.cnSelect)('RenderRight') }),
39
38
  react_1.default.createElement(FieldIcon_1.FieldIcon, { icon: icons_1.ChevronDownIcon, className: (0, classnames_1.classnames)((0, index_1.cnSelect)('RenderRight'), (0, index_1.cnSelect)('DropDownIcon', { open: open })) }),
40
39
  react_1.default.createElement(Fieldset_1.Fieldset, { className: (0, index_1.cnSelect)('Fieldset') })),
@@ -0,0 +1,5 @@
1
+ import type { FC } from 'react';
2
+ import type { SelectInputProps } from '../SelectInput';
3
+ type SelectInputContextConsumerProps = Pick<SelectInputProps, 'value' | 'placeholder' | 'defaultValue' | 'id' | 'name' | 'fieldProps' | 'fieldRef' | 'inputProps' | 'inputRef' | 'renderedValue'>;
4
+ export declare const SelectInputContextConsumer: FC<SelectInputContextConsumerProps>;
5
+ export {};
@@ -1,11 +1,11 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.SelectInputConsumer = void 0;
3
+ exports.SelectInputContextConsumer = void 0;
4
4
  var tslib_1 = require("tslib");
5
5
  var react_1 = tslib_1.__importDefault(require("react"));
6
6
  var FieldControl_1 = require("../../../FieldControl");
7
7
  var index_1 = require("../../index");
8
- var SelectInputConsumer = function (_a) {
8
+ var SelectInputContextConsumer = function (_a) {
9
9
  var id = _a.id, name = _a.name, _b = _a.value, valueProp = _b === void 0 ? '' : _b, placeholderProp = _a.placeholder, defaultValue = _a.defaultValue, inputProps = _a.inputProps, inputRef = _a.inputRef, fieldRef = _a.fieldRef, fieldProps = _a.fieldProps, renderedValue = _a.renderedValue;
10
10
  var context = (0, FieldControl_1.useFieldControl)();
11
11
  var _c = tslib_1.__read(context, 1), fieldControl = _c[0];
@@ -18,4 +18,4 @@ var SelectInputConsumer = function (_a) {
18
18
  ]), ref: fieldRef }), placeholder || renderedValue),
19
19
  react_1.default.createElement("input", tslib_1.__assign({ id: id, name: name, defaultValue: defaultValue, value: valueProp, disabled: disabled, required: required, tabIndex: -1, "aria-hidden": true, readOnly: true }, inputProps, { className: (0, index_1.cnSelect)('Input', [inputProps === null || inputProps === void 0 ? void 0 : inputProps.className]), ref: inputRef }))));
20
20
  };
21
- exports.SelectInputConsumer = SelectInputConsumer;
21
+ exports.SelectInputContextConsumer = SelectInputContextConsumer;
@@ -0,0 +1 @@
1
+ export * from './SelectInputContextConsumer';
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  var tslib_1 = require("tslib");
4
- tslib_1.__exportStar(require("./SelectInputConsumer"), exports);
4
+ tslib_1.__exportStar(require("./SelectInputContextConsumer"), exports);
@@ -1,8 +1,5 @@
1
- import type { SelectPropLabel, SelectProps, SelectPropValue } from '../types';
2
- export type SelectedParams<MULTIPLE extends boolean = false> = {
3
- multiple: SelectProps<MULTIPLE>['multiple'];
4
- value?: SelectPropValue<MULTIPLE>;
5
- label?: SelectPropLabel<MULTIPLE>;
6
- };
7
- export declare const isMultipleParams: (params: SelectedParams<boolean>) => params is SelectedParams<true>;
8
- export declare const isNotMultipleParams: (params: SelectedParams<boolean>) => params is SelectedParams<false>;
1
+ import type { SelectProps, SelectLabel } from '../types';
2
+ export declare const isMultipleParams: (params: SelectProps<boolean>) => params is SelectProps<true>;
3
+ export declare const isNotMultipleParams: (params: SelectProps<boolean>) => params is SelectProps<false>;
4
+ export declare const isMultipleLabel: (_label: SelectLabel<boolean>, multiple?: boolean) => _label is SelectLabel<true>;
5
+ export declare const isNotMultipleLabel: (_label: SelectLabel<boolean>, multiple?: boolean) => _label is SelectLabel<false>;
@@ -1,7 +1,11 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.isNotMultipleParams = exports.isMultipleParams = void 0;
3
+ exports.isNotMultipleLabel = exports.isMultipleLabel = exports.isNotMultipleParams = exports.isMultipleParams = void 0;
4
4
  var isMultipleParams = function (params) { return !!params.multiple; };
5
5
  exports.isMultipleParams = isMultipleParams;
6
6
  var isNotMultipleParams = function (params) { return !params.multiple; };
7
7
  exports.isNotMultipleParams = isNotMultipleParams;
8
+ var isMultipleLabel = function (_label, multiple) { return !!multiple; };
9
+ exports.isMultipleLabel = isMultipleLabel;
10
+ var isNotMultipleLabel = function (_label, multiple) { return !multiple; };
11
+ exports.isNotMultipleLabel = isNotMultipleLabel;
@@ -1,45 +1,37 @@
1
1
  import type { ReactElement, ReactNode, SyntheticEvent } from 'react';
2
2
  import type { ExtendableComponentPropsWithRef } from '../../types/ExtendableComponentPropsWithRef';
3
3
  import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
4
- import type { DataListBaseProps, DataListSelected } from '../DataList';
4
+ import type { DataListBaseProps, DataListOptionProps, DataListSelected } from '../DataList';
5
5
  import type { SelectInputProps, SelectInputRef } from './components';
6
- export type SelectSizeVariant = FormElementSizeVariant;
7
- export type SelectLabel = string | number | undefined;
8
- export type SelectPropLabel<MULTIPLE extends boolean> = (MULTIPLE extends true ? SelectLabel[] : SelectLabel) | undefined;
9
- export type SelectPropValue<MULTIPLE extends boolean> = DataListSelected<MULTIPLE>;
10
- export type SelectedOptionProp<MULTIPLE extends boolean> = {
11
- label?: SelectPropLabel<MULTIPLE>;
6
+ export type SelectPropSize = FormElementSizeVariant;
7
+ export type SelectLabel<MULTIPLE extends boolean = false> = (MULTIPLE extends true ? DataListOptionProps['label'][] : DataListOptionProps['label']) | undefined;
8
+ export type SelectPropValue<MULTIPLE extends boolean = false> = DataListSelected<MULTIPLE>;
9
+ export type SelectPropOnChange<MULTIPLE extends boolean = false> = (value: SelectPropValue<MULTIPLE>, e: SyntheticEvent | KeyboardEvent) => void;
10
+ export type SelectedOption<MULTIPLE extends boolean = false> = {
11
+ label?: SelectLabel<MULTIPLE>;
12
12
  value?: SelectPropValue<MULTIPLE>;
13
13
  };
14
- export type SelectRenderValue<MULTIPLE extends boolean> = (option: SelectedOptionProp<MULTIPLE>) => ReactNode | null;
15
- type SelectOpenControlledProps = {
16
- /** Текущее состояние списка. Если `true`, список отображается. */
17
- open?: boolean;
18
- /** Состояние открытие по умолчанию (неконтролируемый компонент) */
19
- defaultOpen?: never;
20
- };
21
- type SelectOpenUncontrolledProps = {
22
- /** Текущее состояние списка. Если `true`, список отображается. */
23
- open?: never;
24
- /** Состояние открытие по умолчанию (неконтролируемый компонент) */
25
- defaultOpen: boolean;
26
- };
27
- type SelectControlledProps<MULTIPLE extends boolean = false> = {
28
- /** Выбранное значение */
29
- value?: SelectPropValue<MULTIPLE>;
30
- /** Обработчик события на изменение выбранного значения */
31
- onChange?: (value: SelectPropValue<MULTIPLE>, e: SyntheticEvent | KeyboardEvent) => void;
32
- /** Значение поля по умолчанию (неконтролируемый компонент) */
33
- defaultValue?: never;
34
- };
35
- type SelectUncontrolledProps<MULTIPLE extends boolean = false> = {
36
- /** Значение поля по умолчанию (неконтролируемый компонент) */
37
- defaultValue: SelectPropValue<MULTIPLE>;
38
- /** Выбранное значение */
39
- value?: never;
40
- /** Обработчик события на изменение выбранного значения */
41
- onChange?: never;
42
- };
14
+ export type SelectPropRenderValue<MULTIPLE extends boolean = false> = (option: SelectedOption<MULTIPLE>) => ReactNode | null;
15
+ /**
16
+ * @deprecated
17
+ * Use the `SelectRenderValueProp` type to replace it.
18
+ * */
19
+ export type SelectRenderValue<MULTIPLE extends boolean = false> = SelectPropRenderValue<MULTIPLE>;
20
+ /**
21
+ * @deprecated
22
+ * Use the `SelectLabel` type to replace it.
23
+ * */
24
+ export type SelectPropLabel<MULTIPLE extends boolean = false> = SelectLabel<MULTIPLE>;
25
+ /**
26
+ * @deprecated
27
+ * Use the `SelectSizeProp` type to replace it.
28
+ * */
29
+ export type SelectSizeVariant = SelectPropSize;
30
+ /**
31
+ * @deprecated
32
+ * Use the `SelectedPropOption` type to replace it.
33
+ * */
34
+ export type SelectedOptionProp<MULTIPLE extends boolean = false> = SelectedOption<MULTIPLE>;
43
35
  type SelectPropsDeprecated<MULTIPLE extends boolean = false> = {
44
36
  /**
45
37
  * Свойства компонента Menu
@@ -52,21 +44,31 @@ export type SelectProps<MULTIPLE extends boolean = false> = ExtendableComponentP
52
44
  /** Если `true` устанавливает автофокус */
53
45
  autoFocus?: boolean;
54
46
  /** Размер компонента */
55
- size?: SelectSizeVariant;
47
+ size?: SelectPropSize;
48
+ /** Текущее состояние списка. Если `true`, список отображается. */
49
+ open?: boolean;
50
+ /** Состояние открытие по умолчанию (неконтролируемый компонент) */
51
+ defaultOpen?: boolean;
52
+ /** Выбранное значение */
53
+ value?: SelectPropValue<MULTIPLE>;
54
+ /** Обработчик события на изменение выбранного значения */
55
+ onChange?: SelectPropOnChange<MULTIPLE>;
56
+ /** Значение поля по умолчанию (неконтролируемый компонент) */
57
+ defaultValue?: SelectPropValue<MULTIPLE>;
56
58
  /** Рендер-функция для выбранного значения */
57
- renderValue?: SelectRenderValue<MULTIPLE>;
59
+ renderValue?: SelectPropRenderValue<MULTIPLE>;
58
60
  /** Содержимое компонента */
59
61
  children?: ReactNode;
60
62
  /** Свойства компонента DataList */
61
63
  dataListProps?: Partial<Omit<DataListBaseProps<MULTIPLE>, 'onClose' | 'open' | 'anchorRef' | 'multiple' | 'selected' | 'onSelect'>>;
62
64
  /** Функция обратного вызова, которая будет вызвана когда компонент запрашивает закрытие */
63
- onClose?: () => void;
65
+ onClose?(): void;
64
66
  /** Функция обратного вызова, которая будет вызвана когда компонент запрашивает открытие */
65
- onOpen?: () => void;
67
+ onOpen?(): void;
66
68
  /** Если `true` из списка можно выбрать несколько вариантов */
67
69
  multiple?: MULTIPLE;
68
70
  /** Идентификатор компонента для тестов */
69
71
  'data-testid'?: string;
70
- } & Pick<SelectInputProps, 'id' | 'name' | 'label' | 'placeholder' | 'disabled' | 'required' | 'disableStroke' | 'error' | 'hint' | 'fullWidth' | 'renderLeft' | 'renderRight' | 'multiline' | 'inputProps' | 'labelProps' | 'hintProps' | 'bodyProps' | 'inputRef' | 'labelRef' | 'bodyRef'> & SelectPropsDeprecated<MULTIPLE> & (SelectControlledProps<MULTIPLE> | SelectUncontrolledProps<MULTIPLE>) & (SelectOpenControlledProps | SelectOpenUncontrolledProps), 'div'>;
72
+ } & Pick<SelectInputProps, 'id' | 'name' | 'label' | 'placeholder' | 'disabled' | 'required' | 'disableStroke' | 'error' | 'hint' | 'fullWidth' | 'renderLeft' | 'renderRight' | 'multiline' | 'inputProps' | 'labelProps' | 'hintProps' | 'bodyProps' | 'inputRef' | 'labelRef' | 'bodyRef'> & SelectPropsDeprecated<MULTIPLE>, 'div'>;
71
73
  export type SelectComponent = <MULTIPLE extends boolean = false>(props: SelectProps<MULTIPLE>) => ReactElement | null;
72
74
  export {};
@@ -1,6 +1,6 @@
1
1
  import type { ElementType, ReactElement } from 'react';
2
2
  import type { ResponsiveValue } from '../../types/ResponsiveValue';
3
- import type { PolymorphicComponentPropsWithoutRef } from '../../utils/polymorphicComponentWithRef';
3
+ import type { PolymorphicComponentPropsWithRef } from '../../utils/polymorphicComponentWithRef';
4
4
  export declare const stackGapVariant: readonly ["0", "xs", "s", "m", "l", "xl", "2xl", "3xl", "4xl", "5xl", "6xl", "7xl", "8xl"];
5
5
  export declare const stackDirectionVariant: readonly ["row", "column", "rowReverse", "columnReverse"];
6
6
  export declare const stackAlignVariant: readonly ["center", "start", "end", "baseline"];
@@ -27,4 +27,4 @@ export type StackBaseProps = {
27
27
  /** React-элемент для разделителя между дочерними компонентами стека */
28
28
  divider?: ReactElement;
29
29
  };
30
- export type StackProps<As extends ElementType = 'div'> = PolymorphicComponentPropsWithoutRef<StackBaseProps, As>;
30
+ export type StackProps<As extends ElementType = 'div'> = PolymorphicComponentPropsWithRef<StackBaseProps, As>;
@@ -2,76 +2,13 @@ import type { AutocompleteDefaultOption, AutocompletePropGetOptionDisabled, Auto
2
2
  export declare const defaultGetOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption>;
3
3
  export declare const defaultGetOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption>;
4
4
  export declare const defaultGetOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption>;
5
- export declare function withDefaultGetters<OPTION>(props: AutocompleteProps<OPTION>): ({
5
+ export declare function withDefaultGetters<OPTION>(props: AutocompleteProps<OPTION>): {
6
6
  options: OPTION[];
7
7
  size?: import("../../types/FormElementSizeVariant").FormElementSizeVariant;
8
8
  value?: import("./types").AutocompletePropValue<OPTION>;
9
9
  defaultValue?: import("./types").AutocompletePropValue<OPTION>;
10
- onChange?: ((e: import("react").SyntheticEvent | KeyboardEvent, value: OPTION | null) => void) | undefined;
11
- inputValue?: string;
12
- onInputChange?: (e: import("react").ChangeEvent<HTMLInputElement> | null, value: string) => void;
13
- renderInput?: import("./types").AutocompleteRenderInput;
14
- renderOption?: import("./types").AutocompletePropRenderOption<OPTION> | undefined;
15
- getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
16
- getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
17
- getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
18
- disableCloseOnSelect?: boolean;
19
- allowCustomValue?: boolean;
20
- loading?: boolean;
21
- noOptionsText?: import("react").ReactNode;
22
- clearText?: string;
23
- openText?: string;
24
- closeText?: string;
25
- loadingText?: import("react").ReactNode;
26
- onClose?: () => void;
27
- onOpen?: () => void;
28
- disableClearButton?: boolean;
29
- searchFunction?: import("./types").AutocompleteSearchFunction<OPTION> | undefined;
30
- disableShowEmptyOptionsList?: boolean;
31
- disableShowChevron?: boolean;
32
- dataListProps?: Partial<Omit<import("../DataList").DataListProps, "onSelect" | "open" | "onClose" | "multiple" | "selected" | "anchorRef">>;
33
- } & {
34
- error?: boolean | undefined;
35
- label?: string | undefined;
36
- style?: import("react").CSSProperties | undefined;
37
- className?: string | undefined;
38
- onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
39
- autoFocus?: boolean | undefined;
40
- disabled?: boolean | undefined;
41
- placeholder?: string | undefined;
42
- required?: boolean | undefined;
43
- fullWidth?: boolean | undefined;
44
- disableStroke?: boolean | undefined;
45
- hint?: string | null | undefined;
46
- renderLeft?: import("../FieldIcon").FieldIconProps["icon"];
47
- renderRight?: import("../FieldIcon").FieldIconProps["icon"];
48
- inputProps?: import("../FieldInput").FieldInputProps | undefined;
49
- bodyProps?: import("react").ComponentPropsWithRef<"label"> | undefined;
50
- hintProps?: Omit<import("../FieldHint").FieldHintProps, "children"> | undefined;
51
- } & {
52
10
  open?: boolean;
53
- defaultOpen?: never;
54
- } & (OPTION extends {
55
- label: AutocompleteDefaultOption["label"];
56
- } ? Record<string, unknown> : {
57
- getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
58
- }) & (OPTION extends {
59
- id: AutocompleteDefaultOption["id"];
60
- } ? Record<string, unknown> : {
61
- getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
62
- }) & (OPTION extends {
63
- disabled: AutocompleteDefaultOption["disabled"];
64
- } ? Record<string, unknown> : {
65
- getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
66
- }) & {
67
- getOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption> | AutocompletePropGetOptionLabel<OPTION>;
68
- getOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption> | AutocompletePropGetOptionKey<OPTION>;
69
- getOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption> | AutocompletePropGetOptionDisabled<OPTION>;
70
- }) | ({
71
- options: OPTION[];
72
- size?: import("../../types/FormElementSizeVariant").FormElementSizeVariant;
73
- value?: import("./types").AutocompletePropValue<OPTION>;
74
- defaultValue?: import("./types").AutocompletePropValue<OPTION>;
11
+ defaultOpen?: boolean;
75
12
  onChange?: ((e: import("react").SyntheticEvent | KeyboardEvent, value: OPTION | null) => void) | undefined;
76
13
  inputValue?: string;
77
14
  onInputChange?: (e: import("react").ChangeEvent<HTMLInputElement> | null, value: string) => void;
@@ -95,6 +32,7 @@ export declare function withDefaultGetters<OPTION>(props: AutocompleteProps<OPTI
95
32
  disableShowEmptyOptionsList?: boolean;
96
33
  disableShowChevron?: boolean;
97
34
  dataListProps?: Partial<Omit<import("../DataList").DataListProps, "onSelect" | "open" | "onClose" | "multiple" | "selected" | "anchorRef">>;
35
+ ref?: import("react").Ref<HTMLDivElement>;
98
36
  } & {
99
37
  error?: boolean | undefined;
100
38
  label?: string | undefined;
@@ -113,23 +51,20 @@ export declare function withDefaultGetters<OPTION>(props: AutocompleteProps<OPTI
113
51
  inputProps?: import("../FieldInput").FieldInputProps | undefined;
114
52
  bodyProps?: import("react").ComponentPropsWithRef<"label"> | undefined;
115
53
  hintProps?: Omit<import("../FieldHint").FieldHintProps, "children"> | undefined;
116
- } & {
117
- open?: never;
118
- defaultOpen?: boolean;
119
54
  } & (OPTION extends {
120
55
  label: AutocompleteDefaultOption["label"];
121
- } ? Record<string, unknown> : {
56
+ } ? object : {
122
57
  getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
123
58
  }) & (OPTION extends {
124
59
  id: AutocompleteDefaultOption["id"];
125
- } ? Record<string, unknown> : {
60
+ } ? object : {
126
61
  getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
127
62
  }) & (OPTION extends {
128
63
  disabled: AutocompleteDefaultOption["disabled"];
129
- } ? Record<string, unknown> : {
64
+ } ? object : {
130
65
  getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
131
66
  }) & {
132
67
  getOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption> | AutocompletePropGetOptionLabel<OPTION>;
133
68
  getOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption> | AutocompletePropGetOptionKey<OPTION>;
134
69
  getOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption> | AutocompletePropGetOptionDisabled<OPTION>;
135
- });
70
+ };
@@ -1,4 +1,4 @@
1
- import type { ChangeEvent, ReactElement, ReactNode, SyntheticEvent } from 'react';
1
+ import type { ChangeEvent, ReactElement, ReactNode, Ref, SyntheticEvent } from 'react';
2
2
  import type { FormElementSizeVariant } from '../../types/FormElementSizeVariant';
3
3
  import type { DataListProps } from '../DataList';
4
4
  import type { InputProps } from '../Input';
@@ -18,18 +18,6 @@ export type AutocompleteDefaultOption = {
18
18
  };
19
19
  export type AutocompleteSearchFunction<OPTION> = (options: OPTION[], searchValue: string) => OPTION[];
20
20
  export type AutocompleteRenderInput = (props: InputProps) => ReactNode;
21
- type AutocompleteOpenControlledProps = {
22
- /** Текущее состояние списка. Если `true`, список отображается. */
23
- open?: boolean;
24
- /** Состояние открытие по умолчанию (неконтролируемый компонент) */
25
- defaultOpen?: never;
26
- };
27
- type AutocompleteOpenUncontrolledProps = {
28
- /** Текущее состояние списка. Если `true`, список отображается. */
29
- open?: never;
30
- /** Состояние открытие по умолчанию (неконтролируемый компонент) */
31
- defaultOpen?: boolean;
32
- };
33
21
  type AutocompleteInputProps = Pick<InputProps, 'placeholder' | 'autoFocus' | 'fullWidth' | 'disabled' | 'label' | 'required' | 'disableStroke' | 'style' | 'error' | 'hint' | 'renderLeft' | 'renderRight' | 'className' | 'inputProps' | 'hintProps' | 'bodyProps' | 'onKeyDown'>;
34
22
  type AutocompleteDataListProps = Partial<Omit<DataListProps, 'onClose' | 'open' | 'anchorRef' | 'multiple' | 'selected' | 'onSelect'>>;
35
23
  export type AutocompleteProps<OPTION = AutocompleteDefaultOption> = {
@@ -41,6 +29,10 @@ export type AutocompleteProps<OPTION = AutocompleteDefaultOption> = {
41
29
  value?: AutocompletePropValue<OPTION>;
42
30
  /** Выбранное значение опции по умолчанию */
43
31
  defaultValue?: AutocompletePropValue<OPTION>;
32
+ /** Текущее состояние списка. Если `true`, список отображается. */
33
+ open?: boolean;
34
+ /** Состояние открытие по умолчанию (неконтролируемый компонент) */
35
+ defaultOpen?: boolean;
44
36
  /** Функция обратного вызова, которая будет вызвана при выборе значения */
45
37
  onChange?: (e: SyntheticEvent | KeyboardEvent, value: OPTION | null) => void;
46
38
  /** Введённое значение в текстовом поле */
@@ -87,17 +79,19 @@ export type AutocompleteProps<OPTION = AutocompleteDefaultOption> = {
87
79
  disableShowChevron?: boolean;
88
80
  /** Свойства компонента DataList */
89
81
  dataListProps?: AutocompleteDataListProps;
90
- } & AutocompleteInputProps & (AutocompleteOpenControlledProps | AutocompleteOpenUncontrolledProps) & (OPTION extends {
82
+ /** Ссылка на HTML элемент */
83
+ ref?: Ref<HTMLDivElement>;
84
+ } & AutocompleteInputProps & (OPTION extends {
91
85
  label: AutocompleteDefaultOption['label'];
92
- } ? Record<string, unknown> : {
86
+ } ? object : {
93
87
  getOptionLabel?: AutocompletePropGetOptionLabel<OPTION>;
94
88
  }) & (OPTION extends {
95
89
  id: AutocompleteDefaultOption['id'];
96
- } ? Record<string, unknown> : {
90
+ } ? object : {
97
91
  getOptionKey?: AutocompletePropGetOptionKey<OPTION>;
98
92
  }) & (OPTION extends {
99
93
  disabled: AutocompleteDefaultOption['disabled'];
100
- } ? Record<string, unknown> : {
94
+ } ? object : {
101
95
  getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION>;
102
96
  });
103
97
  export type AutocompleteComponent = <OPTION = AutocompleteDefaultOption>(props: AutocompleteProps<OPTION>) => ReactElement | null;