@ozen-ui/kit 0.60.0 → 0.61.0

package/__inner__/esm/components/AutocompleteNext/helpers.d.ts

@@ -2,7 +2,7 @@ import type { AutocompleteDefaultOption, AutocompletePropGetOptionDisabled, Auto
 export declare const defaultGetOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption>;
 export declare const defaultGetOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption>;
 export declare const defaultGetOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption>;
-export declare function withDefaultGetters<OPTION = AutocompleteDefaultOption, MULTIPLE extends boolean = false>(props: AutocompleteProps<OPTION, MULTIPLE>): ({
+export declare function withDefaultGetters<OPTION = AutocompleteDefaultOption, MULTIPLE extends boolean = false>(props: AutocompleteProps<OPTION, MULTIPLE>): {
     multiple?: MULTIPLE | undefined;
     limitTags?: number | "responsive";
     renderTag?: import("./types").AutocompletePropRenderTag;
@@ -11,76 +11,8 @@ export declare function withDefaultGetters<OPTION = AutocompleteDefaultOption, M
     size?: import("./types").AutocompletePropSize;
     value?: import("./types").AutocompletePropValue<OPTION, MULTIPLE>;
     defaultValue?: import("./types").AutocompletePropValue<OPTION, MULTIPLE>;
-    onChange?: import("./types").AutocompleteOnChange<OPTION, MULTIPLE> | undefined;
-    inputValue?: string;
-    onInputChange?: import("./types").AutocompleteOnInputChange;
-    renderInput?: import("./types").AutocompletePropRenderInput;
-    renderOption?: import("./types").AutocompletePropRenderOption<OPTION> | undefined;
-    getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
-    getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
-    getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
-    disableCloseOnSelect?: boolean;
-    allowCustomValue?: boolean;
-    loading?: boolean;
-    noOptionsText?: import("react").ReactNode;
-    clearText?: string;
-    openText?: string;
-    closeText?: string;
-    loadingText?: import("react").ReactNode;
-    onClose?(): void;
-    onOpen?(): void;
-    disableClearButton?: boolean;
-    searchFunction?: import("./types").AutocompletePropSearchFunction<OPTION> | undefined;
-    disableShowEmptyOptionsList?: boolean;
-    disableShowChevron?: boolean;
-    popoverProps?: import("./components").AutocompleteDropdownProps["popoverProps"];
-    listProps?: import("./components").AutocompleteDropdownProps["listProps"];
-} & {
-    error?: boolean | undefined;
-    label?: string | undefined;
-    style?: import("react").CSSProperties | undefined;
-    className?: string | undefined;
-    onKeyDown?: import("react").KeyboardEventHandler<HTMLDivElement> | undefined;
-    autoFocus?: boolean | undefined;
-    disabled?: boolean | undefined;
-    placeholder?: string | undefined;
-    required?: boolean | undefined;
-    fullWidth?: boolean | undefined;
-    disableStroke?: boolean | undefined;
-    hint?: string | null | undefined;
-    renderLeft?: import("../FieldIcon").FieldIconProps["icon"];
-    renderRight?: import("../FieldIcon").FieldIconProps["icon"];
-    inputProps?: import("../FieldInput").FieldInputProps | undefined;
-    bodyProps?: import("react").ComponentPropsWithRef<"label"> | undefined;
-    hintProps?: Omit<import("../FieldHint").FieldHintProps, "children"> | undefined;
-} & {
     open?: boolean;
-    defaultOpen?: never;
-} & (OPTION extends {
-    label: AutocompleteDefaultOption["label"];
-} ? Record<string, unknown> : {
-    getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
-}) & (OPTION extends {
-    id: AutocompleteDefaultOption["id"];
-} ? Record<string, unknown> : {
-    getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
-}) & (OPTION extends {
-    disabled: AutocompleteDefaultOption["disabled"];
-} ? Record<string, unknown> : {
-    getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
-}) & {
-    getOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption> | AutocompletePropGetOptionLabel<OPTION>;
-    getOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption> | AutocompletePropGetOptionKey<OPTION>;
-    getOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption> | AutocompletePropGetOptionDisabled<OPTION>;
-}) | ({
-    multiple?: MULTIPLE | undefined;
-    limitTags?: number | "responsive";
-    renderTag?: import("./types").AutocompletePropRenderTag;
-    renderMoreTag?: import("./types").AutocompletePropRenderMoreTag<OPTION> | undefined;
-    options: OPTION[];
-    size?: import("./types").AutocompletePropSize;
-    value?: import("./types").AutocompletePropValue<OPTION, MULTIPLE>;
-    defaultValue?: import("./types").AutocompletePropValue<OPTION, MULTIPLE>;
+    defaultOpen?: boolean;
     onChange?: import("./types").AutocompleteOnChange<OPTION, MULTIPLE> | undefined;
     inputValue?: string;
     onInputChange?: import("./types").AutocompleteOnInputChange;
@@ -105,6 +37,7 @@ export declare function withDefaultGetters<OPTION = AutocompleteDefaultOption, M
     disableShowChevron?: boolean;
     popoverProps?: import("./components").AutocompleteDropdownProps["popoverProps"];
     listProps?: import("./components").AutocompleteDropdownProps["listProps"];
+    ref?: import("react").Ref<HTMLDivElement>;
 } & {
     error?: boolean | undefined;
     label?: string | undefined;
@@ -123,25 +56,22 @@ export declare function withDefaultGetters<OPTION = AutocompleteDefaultOption, M
     inputProps?: import("../FieldInput").FieldInputProps | undefined;
     bodyProps?: import("react").ComponentPropsWithRef<"label"> | undefined;
     hintProps?: Omit<import("../FieldHint").FieldHintProps, "children"> | undefined;
-} & {
-    open?: never;
-    defaultOpen?: boolean;
 } & (OPTION extends {
     label: AutocompleteDefaultOption["label"];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionLabel?: AutocompletePropGetOptionLabel<OPTION> | undefined;
 }) & (OPTION extends {
     id: AutocompleteDefaultOption["id"];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionKey?: AutocompletePropGetOptionKey<OPTION> | undefined;
 }) & (OPTION extends {
     disabled: AutocompleteDefaultOption["disabled"];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION> | undefined;
 }) & {
     getOptionLabel: AutocompletePropGetOptionLabel<AutocompleteDefaultOption> | AutocompletePropGetOptionLabel<OPTION>;
     getOptionKey: AutocompletePropGetOptionKey<AutocompleteDefaultOption> | AutocompletePropGetOptionKey<OPTION>;
     getOptionDisabled: AutocompletePropGetOptionDisabled<AutocompleteDefaultOption> | AutocompletePropGetOptionDisabled<OPTION>;
-});
+};
 export declare const isMultipleParams: <OPTION>(params: AutocompleteProps<OPTION, boolean>) => params is AutocompleteProps<OPTION, true>;
 export declare const isNotMultipleParams: <OPTION>(params: AutocompleteProps<OPTION, boolean>) => params is AutocompleteProps<OPTION, false>;

package/__inner__/esm/components/AutocompleteNext/types.d.ts

@@ -33,18 +33,6 @@ export type AutocompleteRenderMoreTagProps<OPTION> = {
     omittedValues?: AutocompletePropValue<OPTION, true>;
 };
 export type AutocompletePropRenderMoreTag<OPTION> = (props: AutocompleteRenderMoreTagProps<OPTION>, ref?: Ref<TagRef>) => ReactNode;
-type AutocompleteOpenControlledProps = {
-    /** Текущее состояние списка. Если `true`, список отображается. */
-    open?: boolean;
-    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
-    defaultOpen?: never;
-};
-type AutocompleteOpenUncontrolledProps = {
-    /** Текущее состояние списка. Если `true`, список отображается. */
-    open?: never;
-    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
-    defaultOpen?: boolean;
-};
 type AutocompleteInputProps = Pick<InputProps, 'hint' | 'style' | 'error' | 'label' | 'disabled' | 'required' | 'autoFocus' | 'fullWidth' | 'className' | 'hintProps' | 'bodyProps' | 'onKeyDown' | 'inputProps' | 'renderLeft' | 'renderRight' | 'placeholder' | 'disableStroke'>;
 export type AutocompleteOnChange<OPTION, MULTIPLE extends boolean> = (e: SyntheticEvent | KeyboardEvent, value: (MULTIPLE extends true ? OPTION[] : OPTION) | null) => void;
 export type AutocompleteOnInputChange = (e: ChangeEvent<HTMLInputElement> | null, value: string) => void;
@@ -67,6 +55,10 @@ export type AutocompleteProps<OPTION = AutocompleteDefaultOption, MULTIPLE exten
     value?: AutocompletePropValue<OPTION, MULTIPLE>;
     /** Выбранное значение опции по умолчанию */
     defaultValue?: AutocompletePropValue<OPTION, MULTIPLE>;
+    /** Текущее состояние списка. Если `true`, список отображается. */
+    open?: boolean;
+    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
+    defaultOpen?: boolean;
     /** Функция обратного вызова, которая будет вызвана при выборе значения */
     onChange?: AutocompleteOnChange<OPTION, MULTIPLE>;
     /** Введённое значение в текстовом поле */
@@ -115,17 +107,19 @@ export type AutocompleteProps<OPTION = AutocompleteDefaultOption, MULTIPLE exten
     popoverProps?: AutocompleteDropdownProps['popoverProps'];
     /** Свойства компонента List */
     listProps?: AutocompleteDropdownProps['listProps'];
-} & AutocompleteInputProps & (AutocompleteOpenControlledProps | AutocompleteOpenUncontrolledProps) & (OPTION extends {
+    /** Ссылка на HTML элемент */
+    ref?: Ref<HTMLDivElement>;
+} & AutocompleteInputProps & (OPTION extends {
     label: AutocompleteDefaultOption['label'];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionLabel?: AutocompletePropGetOptionLabel<OPTION>;
 }) & (OPTION extends {
     id: AutocompleteDefaultOption['id'];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionKey?: AutocompletePropGetOptionKey<OPTION>;
 }) & (OPTION extends {
     disabled: AutocompleteDefaultOption['disabled'];
-} ? Record<string, unknown> : {
+} ? object : {
     getOptionDisabled?: AutocompletePropGetOptionDisabled<OPTION>;
 });
 export type AutocompleteComponent = <OPTION = AutocompleteDefaultOption, MULTIPLE extends boolean = false>(props: AutocompleteProps<OPTION, MULTIPLE>) => ReactElement | null;

package/__inner__/esm/components/DatePicker/DatePicker.d.ts

@@ -1,39 +1,5 @@
 import './DatePicker.css';
 import React from 'react';
-import type { DatePickerOnChange } from './types';
+import type { DatePickerProps } from './types';
 export declare const cnDatePicker: import("@bem-react/classname").ClassNameFormatter;
-export declare const DatePicker: React.ForwardRefExoticComponent<(Omit<{
-    value?: Date | null;
-    defaultValue?: Date | null;
-    onChange?: DatePickerOnChange;
-    onInputChange?: import("./types").DatePickerOnInputChange;
-    onClose?: () => void;
-    onOpen?: () => void;
-    calendarProps?: import("../Calendar").CalendarProps;
-    popoverProps?: import("../Popover").PopoverBaseProps;
-    clearText?: string;
-    disableClearButton?: boolean;
-    onError?: import("./types").DatePickerPropOnError;
-} & Pick<import("../Calendar").CalendarProps, "exclude" | "offsetDate" | "minDate" | "maxDate"> & Pick<import("../Input").InputProps, "error" | "label" | "onKeyDown" | "disabled" | "placeholder" | "required" | "size" | "fullWidth" | "disableStroke" | "hint" | "renderLeft" | "renderRight" | "inputProps" | "hintProps"> & {
-    open?: boolean;
-    defaultOpen?: never;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "value" | "defaultValue" | "error" | "label" | "onChange" | "onError" | "onKeyDown" | "disabled" | "open" | "onClose" | "placeholder" | "required" | "size" | "exclude" | "fullWidth" | "disableStroke" | "hint" | "renderLeft" | "renderRight" | "inputProps" | "hintProps" | "clearText" | "disableClearButton" | "onInputChange" | "onOpen" | "defaultOpen" | "popoverProps" | "offsetDate" | "minDate" | "maxDate" | "calendarProps">, "ref"> | Omit<{
-    value?: Date | null;
-    defaultValue?: Date | null;
-    onChange?: DatePickerOnChange;
-    onInputChange?: import("./types").DatePickerOnInputChange;
-    onClose?: () => void;
-    onOpen?: () => void;
-    calendarProps?: import("../Calendar").CalendarProps;
-    popoverProps?: import("../Popover").PopoverBaseProps;
-    clearText?: string;
-    disableClearButton?: boolean;
-    onError?: import("./types").DatePickerPropOnError;
-} & Pick<import("../Calendar").CalendarProps, "exclude" | "offsetDate" | "minDate" | "maxDate"> & Pick<import("../Input").InputProps, "error" | "label" | "onKeyDown" | "disabled" | "placeholder" | "required" | "size" | "fullWidth" | "disableStroke" | "hint" | "renderLeft" | "renderRight" | "inputProps" | "hintProps"> & {
-    open?: never;
-    defaultOpen?: boolean;
-} & Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLDivElement> | null | undefined;
-}, "value" | "defaultValue" | "error" | "label" | "onChange" | "onError" | "onKeyDown" | "disabled" | "open" | "onClose" | "placeholder" | "required" | "size" | "exclude" | "fullWidth" | "disableStroke" | "hint" | "renderLeft" | "renderRight" | "inputProps" | "hintProps" | "clearText" | "disableClearButton" | "onInputChange" | "onOpen" | "defaultOpen" | "popoverProps" | "offsetDate" | "minDate" | "maxDate" | "calendarProps">, "ref">) & React.RefAttributes<HTMLDivElement>>;
+export declare const DatePicker: React.ForwardRefExoticComponent<Omit<DatePickerProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/__inner__/esm/components/DatePicker/types.d.ts

@@ -15,24 +15,16 @@ export type DatePickerPropOnError = (props: {
     inputValue?: string;
     value?: Date | null;
 }) => void;
-type DatePickerOpenControlledProps = {
-    /** Текущее состояние списка. Если `true`, список отображается. */
-    open?: boolean;
-    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
-    defaultOpen?: never;
-};
-type DatePickerOpenUncontrolledProps = {
-    /** Текущее состояние списка. Если `true`, список отображается. */
-    open?: never;
-    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
-    defaultOpen?: boolean;
-};
 export type DatePickerRef = ComponentRef<typeof FIELD_CONTROL_DEFAULT_TAG>;
 export type DatePickerProps = ExtendableComponentPropsWithRef<{
     /** Выбранная дата */
     value?: Date | null;
     /** Выбранная дата по умолчанию (неконтролируемое состояние) */
     defaultValue?: Date | null;
+    /** Текущее состояние списка. Если `true`, список отображается. */
+    open?: boolean;
+    /** Состояние открытие по умолчанию (неконтролируемый компонент) */
+    defaultOpen?: boolean;
     /** Функция обратного вызова, которая будет вызвана при выборе значения */
     onChange?: DatePickerOnChange;
     /** Введённое значение в текстовом поле */
@@ -51,5 +43,4 @@ export type DatePickerProps = ExtendableComponentPropsWithRef<{
     disableClearButton?: boolean;
     /** Функция обратно вызова, которая сработает если пользователь ввёл дату с ошибкой */
     onError?: DatePickerPropOnError;
-} & Pick<CalendarProps, 'minDate' | 'maxDate' | 'exclude' | 'offsetDate'> & Pick<InputProps, 'label' | 'hint' | 'onKeyDown' | 'size' | 'error' | 'required' | 'fullWidth' | 'disableStroke' | 'disabled' | 'renderLeft' | 'renderRight' | 'placeholder' | 'inputProps' | 'hintProps'> & (DatePickerOpenControlledProps | DatePickerOpenUncontrolledProps), typeof FIELD_CONTROL_DEFAULT_TAG>;
-export {};
+} & Pick<CalendarProps, 'minDate' | 'maxDate' | 'exclude' | 'offsetDate'> & Pick<InputProps, 'label' | 'hint' | 'onKeyDown' | 'size' | 'error' | 'required' | 'fullWidth' | 'disableStroke' | 'disabled' | 'renderLeft' | 'renderRight' | 'placeholder' | 'inputProps' | 'hintProps'>, typeof FIELD_CONTROL_DEFAULT_TAG>;

package/__inner__/esm/components/Segment/Segment.js

@@ -29,7 +29,7 @@ export var Segment = forwardRef(function (inProps, ref) {
         selected: valueState,
         onChange: handleChange,
     }); }, [name, disabled, iconSize, selectedColor, valueState, handleChange]);
-    return (React.createElement("fieldset", __assign({ ref: ref, disabled: disabled, className: cnSegment('', {
+    return (React.createElement("fieldset", __assign({ ref: ref, disabled: disabled, className: cnSegment({
             size: size,
             variant: variant,
             disabled: disabled,

package/__inner__/esm/components/Segment/components/SegmentItem/SegmentItem.js

@@ -12,7 +12,7 @@ export var SegmentItem = forwardRef(function (_a, ref) {
         onChange === null || onChange === void 0 ? void 0 : onChange(event);
         onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(event);
     };
-    return (React.createElement("label", __assign({ ref: ref, className: cnSegmentItem('', __assign({ disabled: disabled, selected: selected }, (selected && { selectedColor: selectedColor })), [className]), "data-testid": dataTestId }, labelProps),
+    return (React.createElement("label", __assign({ ref: ref, className: cnSegmentItem(__assign({ disabled: disabled, selected: selected }, (selected && { selectedColor: selectedColor })), [className]), "data-testid": dataTestId }, labelProps),
         Icon && (React.createElement(Icon, { className: cnSegmentItem('Icon'), ref: iconRef, size: iconSize })),
         children,
         React.createElement("input", __assign({ disabled: disabled, type: "radio", name: nameProp || name, className: cnSegmentItem('Radio'), onChange: handleChange, checked: selected, value: value, "data-testid": inputTestId }, other, { ref: inputRef })),

package/__inner__/esm/components/Select/Select.css

@@ -57,6 +57,12 @@
       color: var(--textfield-placeholder-color);
     }
 
+  .Select-HiddenLabel {
+    visibility: hidden;
+    block-size: 0;
+    opacity: 0;
+  }
+
   .Select_multiline .Select-FieldContainer {
       overflow: auto;
     }

package/__inner__/esm/components/Select/Select.js

@@ -7,10 +7,11 @@ import { useMultiRef } from '../../hooks/useMultiRef';
 import { useThemeProps } from '../../hooks/useThemeProps';
 import { cn } from '../../utils/classname';
 import { isKeys } from '../../utils/isKeys';
+import { isString } from '../../utils/isString';
 import { DataList, DataListOption } from '../DataList';
 import { SelectInput } from './components';
 import { SELECT_DEFAULT_AUTO_FOCUS, SELECT_DEFAULT_DEFAULT_OPEN, SELECT_DEFAULT_DISABLED, SELECT_DEFAULT_FULL_WIDTH, SELECT_DEFAULT_MULTILINE, SELECT_DEFAULT_REQUIRED, SELECT_DEFAULT_SIZE, } from './constants';
-import { isMultipleParams, isNotMultipleParams } from './helpers';
+import { isMultipleLabel, isMultipleParams, isNotMultipleLabel, isNotMultipleParams, } from './helpers';
 export var cnSelect = cn('Select');
 var SelectRender = function (inProps, ref) {
     var props = useThemeProps({
@@ -19,21 +20,20 @@ var SelectRender = function (inProps, ref) {
     });
     var _a = props.size, size = _a === void 0 ? SELECT_DEFAULT_SIZE : _a, _b = props.autoFocus, autoFocus = _b === void 0 ? SELECT_DEFAULT_AUTO_FOCUS : _b, _c = props.fullWidth, fullWidth = _c === void 0 ? SELECT_DEFAULT_FULL_WIDTH : _c, _d = props.disabled, disabled = _d === void 0 ? SELECT_DEFAULT_DISABLED : _d, _e = props.required, required = _e === void 0 ? SELECT_DEFAULT_REQUIRED : _e, _f = props.multiline, multiline = _f === void 0 ? SELECT_DEFAULT_MULTILINE : _f, _g = props.defaultOpen, defaultOpen = _g === void 0 ? 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 = __rest(props, ["size", "autoFocus", "fullWidth", "disabled", "required", "multiline", "defaultOpen", "value", "defaultValue", "onChange", "renderValue", "children", "onClick", "onKeyDown", "menuProps", "dataListProps", "bodyProps", "bodyRef", "onClose", "onOpen", "open", "multiple"]);
     var bodyInnerRef = useRef(null);
-    /** @deprecated props */
-    var bodyRef = (bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.ref) || bodeRefProp;
+    var bodyRef = useMultiRef([(bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.ref) || bodeRefProp, bodyInnerRef]);
     var dataListProps = dataListPropsProp || menuProps;
     var _h = __read(useControlled({
         value: valueProp,
         defaultValue: defaultValue,
         name: 'Select',
         state: 'value',
-    }), 3), valueState = _h[0], setValueState = _h[1], isValueControlled = _h[2];
+    }), 2), valueState = _h[0], setValueState = _h[1];
     var _j = __read(useControlled({
         value: openProp,
         defaultValue: defaultOpen,
         name: 'Select',
         state: 'open',
-    }), 3), open = _j[0], setOpen = _j[1], isOpenControlled = _j[2];
+    }), 2), open = _j[0], setOpen = _j[1];
     var currentLabel;
     var isNotSelectOption = function (child) { return !isValidElement(child) || child.type !== DataListOption; };
     var resolvedChildren = isFragment(children)
@@ -42,27 +42,23 @@ var SelectRender = function (inProps, ref) {
     Children.forEach(resolvedChildren, function (child) {
         var _a, _b;
         if (!isNotSelectOption(child)) {
-            var label = typeof child.props.children === 'string'
+            var label = isString(child.props.children)
                 ? (_a = child.props.label) !== null && _a !== void 0 ? _a : child.props.children
                 : child.props.label;
-            var params = {
-                multiple: multiple,
-                label: currentLabel,
-                value: valueState,
-            };
-            if (isMultipleParams(params)) {
+            var params = __assign(__assign({}, inProps), { multiple: multiple, value: valueState });
+            if (isMultipleParams(params) &&
+                isMultipleLabel(currentLabel, multiple)) {
                 var selected = (_b = params.value) === null || _b === void 0 ? void 0 : _b.includes(child.props.value);
-                if (selected) {
-                    currentLabel = __spreadArray(__spreadArray([], __read((params.label || [])), false), [
+                if (selected)
+                    currentLabel = __spreadArray(__spreadArray([], __read((currentLabel || [])), false), [
                         label,
                     ], false);
-                }
             }
-            if (isNotMultipleParams(params)) {
+            if (isNotMultipleParams(params) &&
+                isNotMultipleLabel(currentLabel, multiple)) {
                 var selected = params.value === child.props.value;
-                if (selected) {
+                if (selected)
                     currentLabel = label;
-                }
             }
         }
     });
@@ -77,52 +73,40 @@ var SelectRender = function (inProps, ref) {
     var handleToggle = function () {
         if (disabled)
             return;
-        if (open) {
+        if (open)
             handleClose();
-        }
-        else {
+        else
             handleOpen();
-        }
     };
-    var handleClick = function (event) {
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+    var handleClick = function (e) {
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
         handleToggle();
     };
     /** Управление элементом контроля через клавиатуру */
-    var handleKeyDown = function (event) {
-        if (isKeys(event, ['Space', 'ArrowDown', 'ArrowUp']) && !open) {
-            event.preventDefault();
+    var handleKeyDown = function (e) {
+        if (isKeys(e, ['Space', 'ArrowDown', 'ArrowUp']) && !open) {
+            e.preventDefault();
             handleToggle();
         }
-        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
+        onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
     };
     /** Событие выбора значения из раскрывающегося списка */
-    var handleChange = function (event, _a) {
+    var handleChange = function (e, _a) {
         var value = _a.value;
-        if (!isValueControlled || onChange) {
-            setValueState(value);
-        }
-        onChange === null || onChange === void 0 ? void 0 : onChange(value, event);
+        setValueState(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(value, e);
         if (!multiple)
             handleClose();
     };
     /** Представление значение элемента контроля по умолчанию */
     var renderDefaultValue = function (option) {
         var _a = option.label, label = _a === void 0 ? '' : _a, _b = option.value, value = _b === void 0 ? '' : _b;
-        if (!value && value !== 0) {
+        if (!value && value !== 0)
             return null;
-        }
-        var params = {
-            multiple: multiple,
-            label: label,
-            value: value,
-        };
-        if (isMultipleParams(params)) {
-            return React.createElement("span", null, __spreadArray([], __read(params.label), false).join(', '));
-        }
-        if (isNotMultipleParams(params)) {
-            return React.createElement("span", null, params.label);
-        }
+        if (isMultipleLabel(label, multiple))
+            return React.createElement("span", null, __spreadArray([], __read(label), false).join(', '));
+        if (isNotMultipleLabel(label, multiple))
+            return React.createElement("span", null, label);
         return null;
     };
     /** Значение для текстового поля компонента */
@@ -132,12 +116,10 @@ var SelectRender = function (inProps, ref) {
             multiple: multiple,
             value: valueState,
         };
-        if (isMultipleParams(params)) {
-            return (_a = params.value) === null || _a === void 0 ? void 0 : _a.join(',');
-        }
-        if (isNotMultipleParams(params)) {
-            return params.value;
-        }
+        if (isMultipleParams(params))
+            return ((_a = params.value) === null || _a === void 0 ? void 0 : _a.join(',')) || '';
+        if (isNotMultipleParams(params))
+            return (params === null || params === void 0 ? void 0 : params.value) || '';
         return '';
     };
     /** Представление значение элемента контроля */
@@ -147,22 +129,22 @@ var SelectRender = function (inProps, ref) {
         /** Устанавливает фокус на элементе контроля
          * если компонент по умолчанию открыт — defaultOpen={true}
          * и является неконтролируемым */
-        if (defaultOpen && !isOpenControlled) {
+        if (defaultOpen)
             (_a = bodyInnerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-    }, [open]);
+    }, []);
     useEffect(function () {
         var _a;
         /** Автофокус на элементе контроля */
-        if (autoFocus) {
+        if (autoFocus)
             (_a = bodyInnerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
     }, [autoFocus]);
     return (React.createElement(React.Fragment, null,
-        React.createElement(SelectInput, __assign({ size: size, disabled: disabled, required: required, multiline: multiline, fullWidth: fullWidth }, other, { open: open, onClick: handleClick, onKeyDown: handleKeyDown, value: inputValue(), renderedValue: renderValue({
+        React.createElement(SelectInput, __assign({ size: size, disabled: disabled, required: required, multiline: multiline, fullWidth: fullWidth }, other, { open: open, value: inputValue(), onClick: handleClick, onKeyDown: handleKeyDown, renderedValue: renderValue({
                 label: currentLabel,
                 value: valueState,
-            }), bodyProps: __assign(__assign({}, bodyProps), { ref: useMultiRef([bodyRef, bodyInnerRef]) }), ref: ref })),
-        React.createElement(DataList, __assign({ equalAnchorWidth: true }, dataListProps, { listProps: __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)));
+            }), bodyProps: __assign(__assign({}, bodyProps), { ref: bodyRef }), ref: ref })),
+        React.createElement(DataList, __assign({ equalAnchorWidth: true }, dataListProps, { listProps: __assign({ size: size, role: 'listbox' }, dataListProps === null || dataListProps === void 0 ? void 0 : dataListProps.listProps), open: open, multiple: multiple, onClose: handleClose, onSelect: handleChange, anchorRef: bodyInnerRef, 
+            // TODO: add `null` to `DataListSelected`
+            selected: (valueState || null) }), children)));
 };
 export var Select = forwardRef(SelectRender);

package/__inner__/esm/components/Select/components/SelectInput/SelectInput.js

@@ -11,7 +11,7 @@ import { FieldLabel } from '../../../FieldLabel';
 import { Fieldset } from '../../../Fieldset';
 import { SELECT_DEFAULT_MULTILINE, SELECT_DEFAULT_SIZE } from '../../constants';
 import { cnSelect } from '../../index';
-import { SelectInputConsumer } from '../SelectConsumer';
+import { SelectInputContextConsumer } from '../SelectInputContextConsumer';
 export var SelectInput = forwardRef(function (_a, ref) {
     var _b = _a.size, size = _b === void 0 ? SELECT_DEFAULT_SIZE : _b, _c = _a.multiline, multiline = _c === void 0 ? 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 = __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"]);
     var _d = __read(useBoolean(), 2), focused = _d[0], _e = _d[1], on = _e.on, off = _e.off;
@@ -24,14 +24,13 @@ export var SelectInput = forwardRef(function (_a, ref) {
         off();
         onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
     }, [onBlur]);
-    return (React.createElement(FieldControl, __assign({ error: error, size: size, filled: filled, focused: focused, disabled: disabled, fullWidth: fullWidth, required: required }, other, { className: cnSelect({
-            multiline: multiline,
-        }, [className]), ref: ref }),
-        React.createElement("div", __assign({ role: "button", "aria-haspopup": "listbox", "aria-expanded": open }, bodyProps, { onClick: onClick, onKeyDown: onKeyDown, tabIndex: disabled ? -1 : 0, onFocus: handleFocus, onBlur: handleBlur, className: cnSelect('Body', [bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.className]) }),
+    return (React.createElement(FieldControl, __assign({ size: size, error: error, filled: filled, focused: focused, disabled: disabled, required: required, fullWidth: fullWidth }, other, { ref: ref, className: cnSelect({ multiline: multiline }, [className]) }),
+        React.createElement("div", __assign({ role: "button", "aria-expanded": open, "aria-haspopup": "listbox" }, bodyProps, { onClick: onClick, onBlur: handleBlur, onKeyDown: onKeyDown, onFocus: handleFocus, tabIndex: disabled ? -1 : 0, className: cnSelect('Body', [bodyProps === null || bodyProps === void 0 ? void 0 : bodyProps.className]) }),
             React.createElement(FieldIcon, { icon: renderLeft, className: cnSelect('RenderLeft') }),
             React.createElement("div", { className: cnSelect('FieldContainer') },
+                React.createElement("div", { className: cnSelect('HiddenLabel'), "aria-hidden": true }, label),
                 React.createElement(FieldLabel, __assign({}, labelProps, { className: cnSelect('Label', [labelProps === null || labelProps === void 0 ? void 0 : labelProps.className]), ref: (labelProps === null || labelProps === void 0 ? void 0 : labelProps.ref) || labelRef }), label),
-                React.createElement(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 })),
+                React.createElement(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 })),
             React.createElement(FieldIcon, { icon: renderRight, className: cnSelect('RenderRight') }),
             React.createElement(FieldIcon, { icon: ChevronDownIcon, className: classnames(cnSelect('RenderRight'), cnSelect('DropDownIcon', { open: open })) }),
             React.createElement(Fieldset, { className: cnSelect('Fieldset') })),

package/__inner__/esm/components/Select/components/SelectInputContextConsumer/SelectInputContextConsumer.d.ts

@@ -0,0 +1,5 @@
+import type { FC } from 'react';
+import type { SelectInputProps } from '../SelectInput';
+type SelectInputContextConsumerProps = Pick<SelectInputProps, 'value' | 'placeholder' | 'defaultValue' | 'id' | 'name' | 'fieldProps' | 'fieldRef' | 'inputProps' | 'inputRef' | 'renderedValue'>;
+export declare const SelectInputContextConsumer: FC<SelectInputContextConsumerProps>;
+export {};

package/__inner__/esm/components/Select/components/{SelectConsumer/SelectInputConsumer.js → SelectInputContextConsumer/SelectInputContextConsumer.js}

@@ -2,7 +2,7 @@ import { __assign, __read } from "tslib";
 import React from 'react';
 import { useFieldControl } from '../../../FieldControl';
 import { cnSelect } from '../../index';
-export var SelectInputConsumer = function (_a) {
+export var SelectInputContextConsumer = function (_a) {
     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;
     var context = useFieldControl();
     var _c = __read(context, 1), fieldControl = _c[0];

package/__inner__/esm/components/Select/components/SelectInputContextConsumer/index.d.ts

@@ -0,0 +1 @@
+export * from './SelectInputContextConsumer';

package/__inner__/esm/components/Select/components/SelectInputContextConsumer/index.js

@@ -0,0 +1 @@
+export * from './SelectInputContextConsumer';

package/__inner__/esm/components/Select/helpers/types.d.ts

@@ -1,8 +1,5 @@
-import type { SelectPropLabel, SelectProps, SelectPropValue } from '../types';
-export type SelectedParams<MULTIPLE extends boolean = false> = {
-    multiple: SelectProps<MULTIPLE>['multiple'];
-    value?: SelectPropValue<MULTIPLE>;
-    label?: SelectPropLabel<MULTIPLE>;
-};
-export declare const isMultipleParams: (params: SelectedParams<boolean>) => params is SelectedParams<true>;
-export declare const isNotMultipleParams: (params: SelectedParams<boolean>) => params is SelectedParams<false>;
+import type { SelectProps, SelectLabel } from '../types';
+export declare const isMultipleParams: (params: SelectProps<boolean>) => params is SelectProps<true>;
+export declare const isNotMultipleParams: (params: SelectProps<boolean>) => params is SelectProps<false>;
+export declare const isMultipleLabel: (_label: SelectLabel<boolean>, multiple?: boolean) => _label is SelectLabel<true>;
+export declare const isNotMultipleLabel: (_label: SelectLabel<boolean>, multiple?: boolean) => _label is SelectLabel<false>;

package/__inner__/esm/components/Select/helpers/types.js

@@ -1,2 +1,4 @@
 export var isMultipleParams = function (params) { return !!params.multiple; };
 export var isNotMultipleParams = function (params) { return !params.multiple; };
+export var isMultipleLabel = function (_label, multiple) { return !!multiple; };
+export var isNotMultipleLabel = function (_label, multiple) { return !multiple; };