@ozen-ui/kit 0.68.0 → 0.69.0

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseDropdown/useAutocompleteBaseDropdown.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseDropdown = void 0;
+var tslib_1 = require("tslib");
+var useControlled_1 = require("../../../../hooks/useControlled");
+var useAutocompleteBaseDropdown = function (_a) {
+    var openProp = _a.open, defaultOpen = _a.defaultOpen, onClose = _a.onClose, onOpen = _a.onOpen;
+    var _b = tslib_1.__read((0, useControlled_1.useControlled)({
+        value: openProp,
+        defaultValue: defaultOpen,
+        name: 'AutocompleteBaseDropdown',
+        state: 'open',
+    }), 2), isOpen = _b[0], setIsOpen = _b[1];
+    /** Закрытие */
+    var close = function () {
+        setIsOpen(false);
+        onClose === null || onClose === void 0 ? void 0 : onClose();
+    };
+    /** Открытие */
+    var open = function () {
+        setIsOpen(true);
+        onOpen === null || onOpen === void 0 ? void 0 : onOpen();
+    };
+    /** Переключатель открытия и закрытия */
+    var toggle = function () {
+        if (isOpen) {
+            close();
+        }
+        else {
+            open();
+        }
+    };
+    return {
+        isOpen: isOpen !== null && isOpen !== void 0 ? isOpen : false,
+        open: open,
+        close: close,
+        toggle: toggle,
+    };
+};
+exports.useAutocompleteBaseDropdown = useAutocompleteBaseDropdown;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAutocompleteBaseInput';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useAutocompleteBaseInput"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/types.d.ts

@@ -0,0 +1,5 @@
+import type { AutocompleteBaseInputOnChange, AutocompleteBaseInputValue } from '../../entities';
+export type AutocompleteBaseInputControl = {
+    value: AutocompleteBaseInputValue;
+    setValue: AutocompleteBaseInputOnChange;
+};

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/useAutocompleteBaseInput.d.ts

@@ -0,0 +1,6 @@
+import type { AutocompleteBaseInputOnChange, AutocompleteBaseInputValue } from '../../entities';
+import type { AutocompleteBaseInputControl } from './types';
+export declare const useAutocompleteBaseInput: ({ inputValue: inputValueProp, onChange, }: {
+    inputValue: AutocompleteBaseInputValue | undefined;
+    onChange: AutocompleteBaseInputOnChange | undefined;
+}) => AutocompleteBaseInputControl;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInput/useAutocompleteBaseInput.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseInput = void 0;
+var tslib_1 = require("tslib");
+var useControlled_1 = require("../../../../hooks/useControlled");
+var useAutocompleteBaseInput = function (_a) {
+    var inputValueProp = _a.inputValue, onChange = _a.onChange;
+    var _b = tslib_1.__read((0, useControlled_1.useControlled)({
+        value: inputValueProp,
+        defaultValue: '',
+        name: 'AutocompleteBaseInput',
+        state: 'inputValue',
+    }), 2), inputValue = _b[0], setInputValueState = _b[1];
+    var setInputValue = function (event, value) {
+        setInputValueState(value);
+        onChange === null || onChange === void 0 ? void 0 : onChange(event, value !== null && value !== void 0 ? value : '');
+    };
+    return {
+        value: inputValue !== null && inputValue !== void 0 ? inputValue : '',
+        setValue: setInputValue,
+    };
+};
+exports.useAutocompleteBaseInput = useAutocompleteBaseInput;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAutocompleteBaseInputEvents';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useAutocompleteBaseInputEvents"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/types.d.ts

@@ -0,0 +1,12 @@
+import type { FocusEventHandler, KeyboardEventHandler, MouseEventHandler } from 'react';
+import type { AutocompleteBaseInputChangeEvent } from '../../entities';
+export type AutocompleteBaseInputEventsOnBlur = FocusEventHandler<HTMLElement>;
+export type AutocompleteBaseInputEventsOnClick = MouseEventHandler<HTMLElement>;
+export type AutocompleteBaseInputEventsOnChange = (event: AutocompleteBaseInputChangeEvent) => void;
+export type AutocompleteBaseInputEventsOnKeyDown = KeyboardEventHandler<HTMLElement>;
+export type AutocompleteBaseInputEventsControl = {
+    onChange: AutocompleteBaseInputEventsOnChange;
+    onBlur: AutocompleteBaseInputEventsOnBlur;
+    onClick: AutocompleteBaseInputEventsOnClick;
+    onKeyDown: AutocompleteBaseInputEventsOnKeyDown;
+};

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/useAutocompleteBaseInputEvents.d.ts

@@ -0,0 +1,13 @@
+import type { AutocompleteBaseDropdownControl } from '../useAutocompleteBaseDropdown';
+import type { AutocompleteBaseInputControl } from '../useAutocompleteBaseInput';
+import type { AutocompleteBaseSearchControl } from '../useAutocompleteBaseSearch';
+import type { AutocompleteBaseValueControl } from '../useAutocompleteBaseValue';
+import type { AutocompleteBaseInputEventsControl } from './types';
+export declare const useAutocompleteBaseInputEvents: <Option, Multiple extends boolean>({ multiple, inputControl, valueControl, dropdownControl, searchControl, allowCustomValue, }: {
+    multiple: Multiple;
+    inputControl: AutocompleteBaseInputControl;
+    valueControl: AutocompleteBaseValueControl<Option, Multiple>;
+    dropdownControl: AutocompleteBaseDropdownControl;
+    searchControl: AutocompleteBaseSearchControl<Option>;
+    allowCustomValue: boolean | undefined;
+}) => AutocompleteBaseInputEventsControl;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseInputEvents/useAutocompleteBaseInputEvents.js

@@ -0,0 +1,97 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseInputEvents = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var useStoredValue_1 = require("../../../../hooks/useStoredValue");
+var isKeys_1 = require("../../../../utils/isKeys");
+var utils_1 = require("../../utils");
+var useAutocompleteBaseInputEvents = function (_a) {
+    var multiple = _a.multiple, inputControl = _a.inputControl, valueControl = _a.valueControl, dropdownControl = _a.dropdownControl, searchControl = _a.searchControl, allowCustomValue = _a.allowCustomValue;
+    var lastInputValue = (0, useStoredValue_1.useStoredValue)('');
+    var observableValuesAllowCustomValueSync = (function () {
+        if ((0, utils_1.isMultipleInternalValue)(valueControl.value, multiple) ||
+            !valueControl.value) {
+            return [];
+        }
+        var observableValues = [];
+        Object.entries(valueControl.value).forEach(function (_a) {
+            var _b = tslib_1.__read(_a, 2), _key = _b[0], value = _b[1];
+            var key = _key;
+            if (key === 'raw') {
+                return;
+            }
+            observableValues.push(value);
+        });
+        return observableValues;
+    })();
+    (0, react_1.useEffect)(function () {
+        var _a;
+        if (allowCustomValue || multiple) {
+            return;
+        }
+        var value = valueControl.value;
+        if ((0, utils_1.isSingleInternalValue)(value, multiple)) {
+            lastInputValue.current = (_a = value === null || value === void 0 ? void 0 : value.label) !== null && _a !== void 0 ? _a : '';
+            if (lastInputValue.current !== inputControl.value) {
+                inputControl.setValue(null, lastInputValue.current);
+            }
+        }
+    }, tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(observableValuesAllowCustomValueSync), false), [allowCustomValue], false));
+    var onChange = function (event) {
+        var value = event.target.value;
+        // Открываем список при вводе первого символа (при условии, что список еще не открыт)
+        if (value.length && !dropdownControl.isOpen) {
+            dropdownControl.open();
+        }
+        if (multiple) {
+            inputControl.setValue(event, value);
+        }
+        if (value && !multiple) {
+            inputControl.setValue(event, value);
+        }
+        if (!value && !multiple) {
+            valueControl.setValue(event, null, {
+                source: 'input',
+            });
+        }
+        searchControl.activate(value);
+    };
+    /** Актуализация значения текстового поля после его покидания */
+    var onBlur = function () {
+        if (allowCustomValue) {
+            return;
+        }
+        if (inputControl.value !== lastInputValue.current) {
+            inputControl.setValue(null, lastInputValue.current);
+        }
+    };
+    /** Открытие списка по клику на текстовом поле */
+    var onClick = function () {
+        dropdownControl.toggle();
+    };
+    /** Управление элементом контроля через клавиатуру */
+    var onKeyDown = function (event) {
+        if ((0, isKeys_1.isKeys)(event, ['ArrowDown', 'ArrowUp']) && !dropdownControl.isOpen) {
+            event.preventDefault();
+            dropdownControl.open();
+        }
+        var value = valueControl.value;
+        if ((0, utils_1.isMultipleInternalValue)(value, multiple) &&
+            (0, isKeys_1.isKeys)(event, ['Backspace']) &&
+            !inputControl.value) {
+            if (value) {
+                valueControl.setValue(event, value[value.length - 1] || null, {
+                    source: 'input',
+                });
+            }
+        }
+    };
+    return {
+        onChange: onChange,
+        onBlur: onBlur,
+        onClick: onClick,
+        onKeyDown: onKeyDown,
+    };
+};
+exports.useAutocompleteBaseInputEvents = useAutocompleteBaseInputEvents;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAutocompleteBaseOptions';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useAutocompleteBaseOptions"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/types.d.ts

@@ -0,0 +1,8 @@
+import type { AutocompleteBaseInternalOption } from '../../entities';
+export type AutocompleteBaseOptionsIsSelected<Option> = (option: AutocompleteBaseInternalOption<Option>) => boolean;
+export type AutocompleteBaseOptionsControl<Option> = {
+    options: AutocompleteBaseInternalOption<Option>[];
+    filteredOptions: AutocompleteBaseInternalOption<Option>[];
+    isSelected: AutocompleteBaseOptionsIsSelected<Option>;
+    hasOptions: boolean;
+};

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/useAutocompleteBaseOptions.d.ts

@@ -0,0 +1,11 @@
+import type { AutocompleteBasePrepareOption } from '../../entities';
+import type { AutocompleteBaseSearchControl } from '../useAutocompleteBaseSearch';
+import type { AutocompleteBaseValueControl } from '../useAutocompleteBaseValue';
+import type { AutocompleteBaseOptionsControl } from './types';
+export declare const useAutocompleteBaseOptions: <Option, Multiple extends boolean>({ options: optionsProp, prepare, searchControl, valueControl, multiple, }: {
+    options: Option[];
+    prepare: AutocompleteBasePrepareOption<Option>;
+    searchControl: AutocompleteBaseSearchControl<Option>;
+    valueControl: AutocompleteBaseValueControl<Option, Multiple>;
+    multiple: boolean;
+}) => AutocompleteBaseOptionsControl<Option>;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseOptions/useAutocompleteBaseOptions.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseOptions = void 0;
+var utils_1 = require("../../utils");
+var useAutocompleteBaseOptions = function (_a) {
+    var optionsProp = _a.options, prepare = _a.prepare, searchControl = _a.searchControl, valueControl = _a.valueControl, multiple = _a.multiple;
+    var options = optionsProp.map(prepare);
+    var filteredOptions = searchControl.isActive
+        ? searchControl.search(options)
+        : options;
+    var isSelected = function (option) {
+        var _a, _b, _c;
+        if ((0, utils_1.isMultipleInternalValue)(valueControl.value, multiple)) {
+            return ((_b = (_a = valueControl.value) === null || _a === void 0 ? void 0 : _a.some(function (selectedOption) { return selectedOption.id === option.id; })) !== null && _b !== void 0 ? _b : false);
+        }
+        return ((_c = valueControl.value) === null || _c === void 0 ? void 0 : _c.id) === option.id;
+    };
+    var hasOptions = (filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.length) > 0;
+    return {
+        options: options,
+        filteredOptions: filteredOptions,
+        isSelected: isSelected,
+        hasOptions: hasOptions,
+    };
+};
+exports.useAutocompleteBaseOptions = useAutocompleteBaseOptions;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAutocompleteBaseSearch';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useAutocompleteBaseSearch"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/types.d.ts

@@ -0,0 +1,8 @@
+import type { AutocompleteBaseInternalOption } from '../../entities';
+export type AutocompleteBaseSearchControlFunction<Option> = (options: AutocompleteBaseInternalOption<Option>[]) => AutocompleteBaseInternalOption<Option>[];
+export type AutocompleteBaseSearchControl<Option> = {
+    isActive: boolean;
+    activate: (searchValue: string) => void;
+    deactivate: () => void;
+    search: AutocompleteBaseSearchControlFunction<Option>;
+};

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/useAutocompleteBaseSearch.d.ts

@@ -0,0 +1,3 @@
+import type { AutocompleteBaseSearchFunction } from '../../entities';
+import type { AutocompleteBaseSearchControl } from './types';
+export declare const useAutocompleteBaseSearch: <Option>(searchFunction: AutocompleteBaseSearchFunction<Option> | undefined) => AutocompleteBaseSearchControl<Option>;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseSearch/useAutocompleteBaseSearch.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseSearch = void 0;
+var tslib_1 = require("tslib");
+var react_1 = require("react");
+var useAutocompleteBaseSearch = function (searchFunction) {
+    var _a = tslib_1.__read((0, react_1.useState)(''), 2), searchValue = _a[0], setSearchValue = _a[1];
+    var search = function (options) {
+        if (searchFunction) {
+            return searchFunction(options, searchValue);
+        }
+        return options.filter(function (option) {
+            return option.label.toLowerCase().includes(searchValue.toLowerCase());
+        });
+    };
+    var activate = function (searchValue) {
+        setSearchValue(searchValue);
+    };
+    var deactivate = function () {
+        setSearchValue('');
+    };
+    var isActive = !!searchValue;
+    return {
+        isActive: isActive,
+        activate: activate,
+        deactivate: deactivate,
+        search: search,
+    };
+};
+exports.useAutocompleteBaseSearch = useAutocompleteBaseSearch;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/index.d.ts

@@ -0,0 +1,2 @@
+export * from './useAutocompleteBaseValue';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./useAutocompleteBaseValue"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/types.d.ts

@@ -0,0 +1,12 @@
+import type { SyntheticEvent } from 'react';
+import type { AutocompleteBaseInternalValue, AutocompleteBaseInternalOption, AutocompleteBaseOnChangeSource } from '../../entities';
+export type AutocompleteBaseValueControlSetValueParams = {
+    source: AutocompleteBaseOnChangeSource;
+};
+export type AutocompleteBaseValueControlSetValue<Option> = (event: SyntheticEvent | KeyboardEvent | null, option: AutocompleteBaseInternalOption<Option> | null, params: AutocompleteBaseValueControlSetValueParams) => void;
+export type AutocompleteBaseValueControl<Option, Multiple extends boolean> = {
+    value: AutocompleteBaseInternalValue<Option, Multiple> | undefined;
+    setValue: AutocompleteBaseValueControlSetValue<Option>;
+    hasValue: boolean;
+    selectedOptionsLength: number;
+};

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/useAutocompleteBaseValue.d.ts

@@ -0,0 +1,15 @@
+import type { AutocompleteBaseValue, AutocompleteBasePrepareOption, AutocompleteBaseOnChange } from '../../entities';
+import type { AutocompleteBaseProps } from '../../types';
+import type { AutocompleteBaseInputControl } from '../useAutocompleteBaseInput';
+import type { AutocompleteBaseSearchControl } from '../useAutocompleteBaseSearch';
+import type { AutocompleteBaseValueControl } from './types';
+export declare const useAutocompleteBaseValue: <Option, Multiple extends boolean>({ value: valueProp, defaultValue, onChange: onChangeProp, inProps, prepareOption, searchControl, multiple, inputControl, }: {
+    value: AutocompleteBaseValue<Option, Multiple> | undefined;
+    defaultValue: AutocompleteBaseValue<Option, Multiple> | undefined;
+    onChange: AutocompleteBaseOnChange<Option, Multiple>;
+    inProps: AutocompleteBaseProps<Option, Multiple>;
+    multiple: Multiple;
+    prepareOption: AutocompleteBasePrepareOption<Option>;
+    searchControl: AutocompleteBaseSearchControl<Option>;
+    inputControl: AutocompleteBaseInputControl;
+}) => AutocompleteBaseValueControl<Option, Multiple>;

package/__inner__/cjs/components/AutocompleteBase/hooks/useAutocompleteBaseValue/useAutocompleteBaseValue.js

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAutocompleteBaseValue = void 0;
+var tslib_1 = require("tslib");
+var useControlled_1 = require("../../../../hooks/useControlled");
+var array_1 = require("../../../../utils/array");
+var isNotNil_1 = require("../../../../utils/isNotNil");
+var utils_1 = require("../../utils");
+var useAutocompleteBaseValue = function (_a) {
+    var _b;
+    var valueProp = _a.value, defaultValue = _a.defaultValue, onChangeProp = _a.onChange, inProps = _a.inProps, prepareOption = _a.prepareOption, searchControl = _a.searchControl, multiple = _a.multiple, inputControl = _a.inputControl;
+    var prepareValue = function (value) {
+        if (!value) {
+            return null;
+        }
+        if ((0, array_1.isArray)(value)) {
+            return value.map(function (value) {
+                return prepareOption(value);
+            });
+        }
+        return prepareOption(value);
+    };
+    var _c = tslib_1.__read((0, useControlled_1.useControlled)({
+        value: valueProp === undefined ? undefined : prepareValue(valueProp),
+        defaultValue: defaultValue === undefined ? undefined : prepareValue(defaultValue),
+        name: 'AutocompleteBase',
+        state: 'value',
+    }), 2), valueState = _c[0], setValueState = _c[1];
+    var onChange = function (event, option, params) {
+        setValueState(prepareValue(option));
+        onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(event, option, params);
+    };
+    var setValue = function (event, option, paramsProp) {
+        var _a, _b, _c, _d;
+        var source = paramsProp.source;
+        var inputValue = '';
+        var params = tslib_1.__assign(tslib_1.__assign({}, inProps), { onChange: onChange });
+        if ((0, utils_1.isMultipleProps)(params) &&
+            (0, utils_1.isMultipleInternalValue)(valueState, multiple)) {
+            if (option === null) {
+                onChange === null || onChange === void 0 ? void 0 : onChange(event, null, { source: source });
+            }
+            else {
+                var value_1 = valueState !== null && valueState !== void 0 ? valueState : [];
+                var optionId_1 = option.id;
+                var optionIsSelected_1 = value_1.find(function (item) { return item.id === optionId_1; });
+                var result = (function () {
+                    if (optionIsSelected_1) {
+                        var options_1 = [];
+                        value_1.forEach(function (option) {
+                            if (option.id !== optionId_1) {
+                                options_1.push(option.raw);
+                            }
+                        });
+                        return options_1;
+                    }
+                    if (option) {
+                        return tslib_1.__spreadArray(tslib_1.__spreadArray([], tslib_1.__read(value_1.map(function (option) { return option.raw; })), false), [option.raw], false);
+                    }
+                    return value_1.map(function (option) { return option.raw; });
+                })();
+                (_a = params.onChange) === null || _a === void 0 ? void 0 : _a.call(params, event, result, { source: source });
+            }
+            searchControl.deactivate();
+        }
+        else if ((0, utils_1.isSingleProps)(params)) {
+            inputValue = (_b = option === null || option === void 0 ? void 0 : option.label) !== null && _b !== void 0 ? _b : '';
+            (_c = params.onChange) === null || _c === void 0 ? void 0 : _c.call(params, event, (_d = option === null || option === void 0 ? void 0 : option.raw) !== null && _d !== void 0 ? _d : null, { source: source });
+            if (option) {
+                searchControl.deactivate();
+            }
+        }
+        inputControl.setValue(null, inputValue);
+    };
+    var hasValue = (0, utils_1.isMultipleInternalValue)(valueState, multiple)
+        ? !!valueState && valueState.length > 0
+        : (0, isNotNil_1.isNotNil)(valueState);
+    var selectedOptionsLength = (0, utils_1.isMultipleInternalValue)(valueState, multiple)
+        ? (_b = valueState === null || valueState === void 0 ? void 0 : valueState.length) !== null && _b !== void 0 ? _b : 0
+        : 0;
+    return {
+        value: valueState,
+        setValue: setValue,
+        hasValue: hasValue,
+        selectedOptionsLength: selectedOptionsLength,
+    };
+};
+exports.useAutocompleteBaseValue = useAutocompleteBaseValue;

package/__inner__/cjs/components/AutocompleteBase/index.d.ts

@@ -0,0 +1,6 @@
+export * from './entities';
+export * from './modules';
+export * from './utils';
+export * from './AutocompleteBaseContext';
+export * from './AutocompleteBase';
+export * from './types';

package/__inner__/cjs/components/AutocompleteBase/index.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./entities"), exports);
+tslib_1.__exportStar(require("./modules"), exports);
+tslib_1.__exportStar(require("./utils"), exports);
+tslib_1.__exportStar(require("./AutocompleteBaseContext"), exports);
+tslib_1.__exportStar(require("./AutocompleteBase"), exports);
+tslib_1.__exportStar(require("./types"), exports);

package/__inner__/cjs/components/AutocompleteBase/modules/AutocompleteBaseDropdown/AutocompleteBaseDropdown.css

@@ -0,0 +1,67 @@
+.AutocompleteBaseDropdown {
+  --scroll-bar-size: 12px;
+}
+  .AutocompleteBaseDropdown::-webkit-scrollbar {
+    inline-size: var(--scroll-bar-size);
+  }
+  .AutocompleteBaseDropdown::-webkit-scrollbar-thumb {
+    background-color: var(--color-background-secondary);
+    border-radius: calc(var(--scroll-bar-size) / 2);
+    border: calc(var(--scroll-bar-size) / 4) solid transparent;
+    background-clip: padding-box;
+    border-image: initial;
+    min-block-size: 24px;
+  }
+  .AutocompleteBaseDropdown::-webkit-scrollbar-thumb:hover,
+    .AutocompleteBaseDropdown::-webkit-scrollbar-thumb:active {
+      border: calc(var(--scroll-bar-size) / 4) solid transparent;
+      background-clip: padding-box;
+    }
+  .AutocompleteBaseDropdown::-webkit-scrollbar-thumb:hover {
+      background-color: var(--color-background-secondary-hover);
+    }
+  .AutocompleteBaseDropdown::-webkit-scrollbar-thumb:active {
+      background-color: var(--color-background-secondary-pressed);
+    }
+  .AutocompleteBaseDropdown::-webkit-scrollbar-corner {
+    background: transparent;
+  }
+  .AutocompleteBaseDropdown {
+  overflow: hidden auto;
+  max-block-size: 40vh;
+}
+.AutocompleteBaseDropdown-animation-enter {
+    opacity: 0;
+    transform: translate(0, calc(var(--spacing-2xs) * -1));
+    pointer-events: none;
+  }
+.AutocompleteBaseDropdown-animation-enter-active {
+    opacity: 1;
+    transition:
+      opacity var(--transition-default),
+      transform var(--transition-default);
+    transform: translate(0);
+    pointer-events: none;
+  }
+.AutocompleteBaseDropdown-animation-enter-done {
+    opacity: 1;
+    transform: translate(0);
+  }
+.AutocompleteBaseDropdown-animation-exit {
+    opacity: 1;
+    transform: translate(0);
+    pointer-events: none;
+  }
+.AutocompleteBaseDropdown-animation-exit-active {
+    opacity: 0;
+    transition:
+      opacity var(--transition-default),
+      transform var(--transition-default);
+    transform: translate(0, calc(var(--spacing-2xs) * -1));
+    pointer-events: none;
+  }
+.AutocompleteBaseDropdown-animation-exit-done {
+    opacity: 0;
+    transform: translate(0, calc(var(--spacing-2xs) * -1));
+    pointer-events: none;
+  }

package/__inner__/cjs/components/AutocompleteBase/modules/AutocompleteBaseDropdown/AutocompleteBaseDropdown.d.ts

@@ -0,0 +1,2 @@
+import type { AutocompleteBaseDropdownBaseProps } from './types';
+export declare const AutocompleteBaseDropdown: import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<AutocompleteBaseDropdownBaseProps, import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<import("../../../Paper").PaperBaseProps, "div">>;

package/__inner__/cjs/components/AutocompleteBase/modules/AutocompleteBaseDropdown/AutocompleteBaseDropdown.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AutocompleteBaseDropdown = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var useCreateResizeObserver_1 = require("../../../../hooks/useCreateResizeObserver");
+var useMultiRef_1 = require("../../../../hooks/useMultiRef");
+var useStoredValue_1 = require("../../../../hooks/useStoredValue");
+var classname_1 = require("../../../../utils/classname");
+var getPaperSizeToFormElement_1 = require("../../../../utils/getPaperSizeToFormElement");
+var polymorphicComponentWithRef_1 = require("../../../../utils/polymorphicComponentWithRef");
+var Paper_1 = require("../../../Paper");
+var Popover_1 = require("../../../Popover");
+var AutocompleteBaseContext_1 = require("../../AutocompleteBaseContext");
+var cnAutocompleteBaseDropdown = (0, classname_1.cn)('AutocompleteBaseDropdown');
+exports.AutocompleteBaseDropdown = (0, polymorphicComponentWithRef_1.polymorphicComponentWithRef)(function (_a, ref) {
+    var children = _a.children, _b = _a.strategy, strategy = _b === void 0 ? 'absolute' : _b, _c = _a.offset, offset = _c === void 0 ? [0, 4] : _c, _d = _a.placement, placement = _d === void 0 ? 'bottom-start' : _d, _e = _a.as, as = _e === void 0 ? Paper_1.Paper : _e, className = _a.className, onExited = _a.onExited, popoverProps = tslib_1.__rest(_a, ["children", "strategy", "offset", "placement", "as", "className", "onExited"]);
+    var _f = (0, AutocompleteBaseContext_1.useAutocompleteBaseContext)(), size = _f.size, dropdownControl = _f.dropdownControl, searchControl = _f.searchControl, anchorRef = _f.anchorRef, inputRef = _f.inputRef;
+    var radius = (0, getPaperSizeToFormElement_1.getPaperSizeToFormElement)(size);
+    var updateStored = (0, useStoredValue_1.useStoredValue)(null);
+    var resizeObserver = (0, useCreateResizeObserver_1.useCreateResizeObserver)(function () {
+        var _a;
+        (_a = updateStored.current) === null || _a === void 0 ? void 0 : _a.call(updateStored);
+    });
+    (0, react_1.useEffect)(function () {
+        var input = inputRef.current;
+        if (input) {
+            resizeObserver === null || resizeObserver === void 0 ? void 0 : resizeObserver.observe(inputRef.current);
+        }
+    }, [inputRef]);
+    return (react_1.default.createElement(Popover_1.Popover, tslib_1.__assign({ offset: offset, strategy: strategy, placement: placement, setUpdate: function (update) {
+            updateStored.current = update;
+        }, as: as, transitionProps: { classNames: 'AutocompleteBaseDropdown-animation' }, className: cnAutocompleteBaseDropdown('', [className]), equalAnchorWidth: true, disableReturnFocus: true, disableEnforceFocus: true, onExited: function () {
+            onExited === null || onExited === void 0 ? void 0 : onExited();
+            searchControl.deactivate();
+        } }, popoverProps, { open: dropdownControl.isOpen, radius: radius, onClose: dropdownControl.close, anchorRef: anchorRef, ref: (0, useMultiRef_1.useMultiRef)([ref, popoverProps === null || popoverProps === void 0 ? void 0 : popoverProps.ref]) }), children));
+});

package/__inner__/cjs/components/AutocompleteBase/modules/AutocompleteBaseDropdown/constants.d.ts

@@ -0,0 +1 @@
+export declare const AUTOCOMPLETE_BASE_DROPDOWN_DEFAULT_TAG: import("../../../../utils/polymorphicComponentWithRef").PolymorphicComponentWithRef<import("../../../Paper").PaperBaseProps, "div">;