chili-ui 0.0.1

package/dist/components/DropDownSelect/handlers.js

@@ -0,0 +1,215 @@
+import { isFunction, isNil } from 'lodash';
+import { getText } from '../../src/SuggestionList/helpers';
+import { filterData } from './helpers';
+export const createChangeHandler = ({ props, mergeState, }) => (ev) => {
+    const { name, onChange, onFilterChange, textField, } = props;
+    if (isFunction(onChange)) {
+        const changeEvent = Object.assign(Object.assign({}, ev), { component: {
+                value: ev.target.value,
+                name,
+            } });
+        onChange(changeEvent);
+    }
+    if (isFunction(onFilterChange)) {
+        const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                value: getText(ev.target.value, textField),
+                name,
+                suggestion: ev.target.value,
+            } });
+        onFilterChange(customEvent);
+    }
+    mergeState({
+        filterValue: null,
+        highlightedSuggestion: ev.target.value,
+        isOpen: false,
+        selectedSuggestion: ev.target.value,
+        value: ev.target.value,
+    });
+};
+export const createBlurHandler = ({ props, state, validate, value, mergeState, }) => (ev) => {
+    const { onFilterChange, onBlur, name, textField, } = props;
+    const { highlightedSuggestion, } = state;
+    const isValid = validate();
+    if (isFunction(onFilterChange)) {
+        const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                name,
+                value: getText(value, textField),
+                suggestion: value,
+            } });
+        onFilterChange(customEvent);
+    }
+    if (isFunction(onBlur)) {
+        const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                value,
+                name,
+                isValid,
+            } });
+        onBlur(customEvent);
+    }
+    mergeState({
+        filterValue: null,
+        highlightedSuggestion,
+        isFocused: false,
+        isOpen: false,
+    });
+};
+export const createFocusHandler = ({ props, value, mergeState, }) => (ev) => {
+    const { onFocus, name, } = props;
+    if (isFunction(onFocus)) {
+        const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                value,
+                name,
+            } });
+        onFocus(customEvent);
+    }
+    mergeState({ isOpen: true });
+    mergeState({ isFocused: true });
+};
+export const createIconClickHandler = ({ props, state, inputRef, mergeState, }) => () => {
+    const { isDisabled = false, } = props;
+    if (isDisabled)
+        return;
+    if (inputRef.current)
+        inputRef.current.focus();
+    mergeState({
+        isOpen: !state.isOpen,
+    });
+};
+export const createKeyDownHandler = ({ props, state, mergeState, }) => (ev) => {
+    const { data, filterRule, name, onChange, onFilterChange, placeholder, searchFields, shouldAllowEmpty, shouldFilterValues, textField, } = props;
+    const { isOpen, highlightedSuggestion, } = state;
+    if (!data)
+        return;
+    const filterValue = isNil(props.filterValue) ? state.filterValue : props.filterValue;
+    const filteredData = (() => {
+        if (shouldFilterValues != null) {
+            return filterData({
+                data, filterValue, textField, filterRule, searchFields,
+            }) || [];
+        }
+        return data;
+    })();
+    const fullData = placeholder && shouldAllowEmpty ? [placeholder, ...filteredData] : filteredData;
+    const suggestionIndex = highlightedSuggestion !== null
+        ? fullData.indexOf(highlightedSuggestion || '')
+        : fullData.indexOf(placeholder || '');
+    if (ev.key === 'ArrowDown' || ev.key === 'Down') {
+        // prevent page scroll
+        ev.preventDefault();
+        // suggestion list is a cycle
+        const nextIndex = (suggestionIndex + 1) % fullData.length;
+        const nextSuggestion = fullData[nextIndex];
+        mergeState({
+            highlightedSuggestion: nextSuggestion,
+        });
+        return;
+    }
+    if (ev.key === 'ArrowUp' || ev.key === 'Up') {
+        // prevent page scroll
+        ev.preventDefault();
+        // suggestion list is a cycle
+        const nextIndex = (() => {
+            if (suggestionIndex <= 0)
+                return fullData.length - 1;
+            return suggestionIndex - 1;
+        })();
+        const nextSuggestion = fullData[nextIndex];
+        mergeState({
+            highlightedSuggestion: nextSuggestion,
+        });
+        return;
+    }
+    if (ev.key === 'Enter') {
+        if (isOpen)
+            mergeState({ isOpen: false });
+        const value = getText(highlightedSuggestion, textField);
+        if (isFunction(onFilterChange)) {
+            const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                    name,
+                    value,
+                    suggestion: highlightedSuggestion,
+                } });
+            onFilterChange(customEvent);
+        }
+        if (isFunction(onChange)) {
+            const changeEvent = Object.assign(Object.assign({}, ev), { component: {
+                    value: highlightedSuggestion,
+                    name,
+                } });
+            onChange(changeEvent);
+        }
+        if (isOpen) {
+            mergeState({
+                isOpen: false,
+            });
+        }
+        mergeState({
+            filterValue: null,
+            selectedSuggestion: highlightedSuggestion,
+            value,
+        });
+        return;
+    }
+    if ((ev.key === 'Escape' || ev.key === 'Esc') && isOpen) {
+        mergeState({
+            isOpen: false,
+        });
+        return;
+    }
+    if (ev.keyCode === 32 && !shouldFilterValues) {
+        ev.preventDefault();
+        mergeState({
+            isOpen: true,
+        });
+    }
+};
+export const createFilterChangeHandler = ({ props, mergeState, value, }) => (ev) => {
+    const { onFilterChange, data, shouldFilterValues, name, textField, } = props;
+    if (isFunction(onFilterChange)) {
+        const customEvent = Object.assign(Object.assign({}, ev), { component: {
+                name,
+                value: ev.target.value,
+                suggestion: getText(value, textField) === ev.target.value ? value : null,
+            } });
+        onFilterChange(customEvent);
+    }
+    mergeState({
+        filterValue: ev.target.value,
+    });
+    if (ev.target.value && data && shouldFilterValues) {
+        mergeState({
+            isOpen: true,
+        });
+    }
+};
+export const createClearIconClickHandler = ({ props, mergeState, }) => (ev) => {
+    const { onChange, name, } = props;
+    if (isFunction(onChange)) {
+        const changeEvent = Object.assign(Object.assign({}, ev), { component: {
+                value: null,
+                name,
+            } });
+        onChange(changeEvent);
+    }
+    mergeState({
+        filterValue: null,
+        highlightedSuggestion: null,
+        selectedSuggestion: null,
+        value: null,
+    });
+};
+export const createResetHandler = ({ props, mergeState, value, }) => () => {
+    mergeState({
+        value,
+    });
+    if (isFunction(props.onChange)) {
+        const customEvent = {
+            component: {
+                name: props.name,
+                value,
+            },
+        };
+        props.onChange(customEvent);
+    }
+};
+//# sourceMappingURL=handlers.js.map

package/dist/components/DropDownSelect/handlers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlers.js","sourceRoot":"","sources":["../../../leda/components/DropDownSelect/handlers.ts"],"names":[],"mappings":"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"}

package/dist/components/DropDownSelect/helpers.d.ts

@@ -0,0 +1,5 @@
+import type { SomeObject } from '../../commonTypes';
+import type { DropDownSelectProps, FilterDataProps, GetComponentClassNames } from './types';
+export declare const getComponentClassNames: GetComponentClassNames;
+export declare const getInputValue: (value: string | number | SomeObject | null, filterValue: string | null, shouldFilterValues?: boolean, textField?: string) => string;
+export declare const filterData: ({ data, filterRule, filterValue, searchFields, textField, }: FilterDataProps) => DropDownSelectProps['data'];

package/dist/components/DropDownSelect/helpers.js

@@ -0,0 +1,51 @@
+import { isNil, isArray, isObject } from 'lodash';
+import { getText } from '../../src/SuggestionList/helpers';
+import { filterSuggestionByRule, getClassNames, getIsEmptyAndRequired } from '../../utils';
+// component elements class names
+export const getComponentClassNames = ({ theme, className, isDisabled, isFocused, isOpen, isValid, isRequired, value, }) => {
+    const wrapperClassNames = getClassNames(theme.wrapper, className);
+    const inputWrapperClassNames = getClassNames(theme.inputWrapper, {
+        [theme.inputWrapperDisabled]: isDisabled,
+        [theme.inputWrapperFocused]: isFocused,
+        [theme.inputWrapperInvalid]: !isValid,
+        [theme.inputWrapperRequired]: getIsEmptyAndRequired(value, isRequired),
+    });
+    const selectIconClassNames = getClassNames(theme.selectIcon, {
+        [theme.selectIconOpened]: isDisabled ? false : isOpen,
+        [theme.selectIconClosed]: isDisabled ? true : !isOpen,
+    });
+    return {
+        wrapperClassNames,
+        inputWrapperClassNames,
+        selectIconClassNames,
+    };
+};
+export const getInputValue = (value, filterValue, shouldFilterValues, textField) => {
+    if (shouldFilterValues) {
+        return isNil(filterValue) ? (getText(value || '', textField) || '').toString() : filterValue;
+    }
+    if (isNil(value)) {
+        return '';
+    }
+    return (getText(value, textField) || '').toString();
+};
+export const filterData = ({ data, filterRule, filterValue, searchFields, textField, }) => {
+    if (!data)
+        return undefined;
+    const filteredData = data.filter((item) => {
+        const isValueMatchingTextField = filterSuggestionByRule(getText(item, textField), filterValue !== null && filterValue !== void 0 ? filterValue : '', filterRule);
+        if (isArray(searchFields) && textField && isObject(item)) {
+            const isValueMatchingSearchFields = searchFields.some((searchField) => {
+                if (item[searchField] === undefined)
+                    return false;
+                return filterSuggestionByRule(item[searchField].toString(), filterValue !== null && filterValue !== void 0 ? filterValue : '', filterRule);
+            });
+            return isValueMatchingTextField || isValueMatchingSearchFields;
+        }
+        return isValueMatchingTextField;
+    });
+    if (filteredData.length === 0)
+        return undefined;
+    return filteredData;
+};
+//# sourceMappingURL=helpers.js.map

package/dist/components/DropDownSelect/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../leda/components/DropDownSelect/helpers.ts"],"names":[],"mappings":"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"}

package/dist/components/DropDownSelect/hooks.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import type { CustomElements, DropDownSelectProps, DropDownSelectState, UseCustomElementsExtra, Value } from './types';
+export declare const useSyncedHighlightedValue: ({ filterValue, shouldFilterValues, mergeState, data, }: {
+    filterValue: string | null;
+    shouldFilterValues: boolean;
+    mergeState: React.Dispatch<Partial<DropDownSelectState>>;
+    data: DropDownSelectProps['data'];
+}) => void;
+export declare const useCustomElements: (props: DropDownSelectProps, state: DropDownSelectState, { inputSuggestion }: UseCustomElementsExtra) => CustomElements;
+export declare const useCorrectSuggestionsInControlledMode: ({ mergeState, valueProp, }: {
+    mergeState: React.Dispatch<Partial<DropDownSelectState>>;
+    valueProp?: Value | undefined;
+}) => void;

package/dist/components/DropDownSelect/hooks.js

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { getText } from '../../src/SuggestionList/helpers';
+import { useElement } from '../../utils';
+import { Div } from '../Div';
+import { filterData } from './helpers';
+export const useSyncedHighlightedValue = ({ filterValue, shouldFilterValues, mergeState, data, }) => {
+    React.useEffect(() => {
+        if (shouldFilterValues && data && filterValue) {
+            const filteredData = filterData({ data, filterValue }) || [];
+            // обновляем highlighted value
+            mergeState({
+                highlightedSuggestion: getText(filteredData[0]) || null,
+            });
+        }
+    }, [data, shouldFilterValues, filterValue, mergeState]);
+};
+export const useCustomElements = (props, state, { inputSuggestion }) => {
+    const { wrapperRender, inputRender, } = props;
+    const Wrapper = useElement('Wrapper', Div, wrapperRender, props, state);
+    const Input = useElement('Input', 'input', inputRender, Object.assign(Object.assign({}, props), { suggestion: inputSuggestion }), state);
+    return {
+        Wrapper,
+        Input,
+    };
+};
+export const useCorrectSuggestionsInControlledMode = ({ mergeState, valueProp, }) => {
+    React.useEffect(() => {
+        if (valueProp !== undefined) {
+            mergeState({
+                highlightedSuggestion: valueProp,
+                selectedSuggestion: valueProp,
+            });
+        }
+    }, [mergeState, valueProp]);
+};
+//# sourceMappingURL=hooks.js.map

package/dist/components/DropDownSelect/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../../leda/components/DropDownSelect/hooks.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,OAAO,EAAE,MAAM,kCAAkC,CAAC;AAC3D,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AACzC,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAKvC,MAAM,CAAC,MAAM,yBAAyB,GAAG,CAAC,EACxC,WAAW,EACX,kBAAkB,EAClB,UAAU,EACV,IAAI,GAML,EAAQ,EAAE;IACT,KAAK,CAAC,SAAS,CAAC,GAAS,EAAE;QACzB,IAAI,kBAAkB,IAAI,IAAI,IAAI,WAAW,EAAE,CAAC;YAC9C,MAAM,YAAY,GAAG,UAAU,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC;YAC7D,8BAA8B;YAC9B,UAAU,CAAC;gBACT,qBAAqB,EAAE,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,IAAI,IAAI;aACxD,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,EAAE,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC;AAC1D,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAC/B,KAA0B,EAC1B,KAA0B,EAC1B,EAAE,eAAe,EAA0B,EAC3B,EAAE;IAClB,MAAM,EACJ,aAAa,EAAE,WAAW,GAC3B,GAAG,KAAK,CAAC;IAEV,MAAM,OAAO,GAAG,UAAU,CACxB,SAAS,EACT,GAAG,EACH,aAAa,EACb,KAAK,EACL,KAAK,CACN,CAAC;IAEF,MAAM,KAAK,GAAG,UAAU,CACtB,OAAO,EACP,OAA2E,EAC3E,WAAW,kCAEN,KAAK,KACR,UAAU,EAAE,eAAe,KAE7B,KAAK,CACN,CAAC;IAEF,OAAO;QACL,OAAO;QACP,KAAK;KACN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,qCAAqC,GAAG,CAAC,EACpD,UAAU,EACV,SAAS,GAIV,EAAE,EAAE;IACH,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC5B,UAAU,CAAC;gBACT,qBAAqB,EAAE,SAAS;gBAChC,kBAAkB,EAAE,SAAS;aAC9B,CAAC,CAAC;QACL,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,CAAC;AAC9B,CAAC,CAAC"}

package/dist/components/DropDownSelect/index.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import type { DropDownSelectProps, Value } from './types';
+export declare const DropDownSelect: <T extends Value>(props: DropDownSelectProps<T>, ref?: React.Ref<HTMLElement>) => React.ReactElement;

package/dist/components/DropDownSelect/index.js

@@ -0,0 +1,96 @@
+'use client';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { isNil } from 'lodash';
+import { COMPONENTS_NAMESPACES } from '../../constants';
+import { SuggestionList } from '../../src/SuggestionList';
+import { useElement, useProps, useTheme, } from '../../utils';
+import { Div } from '../Div';
+import { useValidation } from '../Validation';
+import { createBlurHandler, createChangeHandler, createClearIconClickHandler, createFilterChangeHandler, createFocusHandler, createIconClickHandler, createKeyDownHandler, createResetHandler, } from './handlers';
+import { filterData, getComponentClassNames, getInputValue } from './helpers';
+import { useCorrectSuggestionsInControlledMode, useCustomElements, useSyncedHighlightedValue } from './hooks';
+import { getText } from '../../src/SuggestionList/helpers';
+import { Icon } from '../Icon';
+import { IconTypes } from '../..';
+export const DropDownSelect = React.forwardRef((props, ref) => {
+    const _a = useProps(props), { autoComplete = 'off', boundingContainerRef, className, compareObjectsBy, data, defaultValue = null, filterRule, filterValue: filterValueProp, form, groupBy, hasClearButton, iconRender, inputRender, invalidMessage, invalidMessageRender, isDisabled = false, isLoading = false, isOpen: isOpenProp, isRequired = false, isValid: isValidProp, itemRender, listRender, name, noSuggestionsText, noSuggestionsRender, onBlur, onChange, onFilterChange, onFocus, placeholder, requiredMessage, searchFields, shouldAllowEmpty = false, shouldFilterValues = false, shouldValidateUnmounted, sortSuggestions, textField, theme: themeProp, validator, value: valueProp, wrapperRender } = _a, restProps = __rest(_a, ["autoComplete", "boundingContainerRef", "className", "compareObjectsBy", "data", "defaultValue", "filterRule", "filterValue", "form", "groupBy", "hasClearButton", "iconRender", "inputRender", "invalidMessage", "invalidMessageRender", "isDisabled", "isLoading", "isOpen", "isRequired", "isValid", "itemRender", "listRender", "name", "noSuggestionsText", "noSuggestionsRender", "onBlur", "onChange", "onFilterChange", "onFocus", "placeholder", "requiredMessage", "searchFields", "shouldAllowEmpty", "shouldFilterValues", "shouldValidateUnmounted", "sortSuggestions", "textField", "theme", "validator", "value", "wrapperRender"]);
+    const [state, mergeState] = React.useReducer((oldState, newState) => (Object.assign(Object.assign({}, oldState), newState)), {
+        filterValue: null,
+        highlightedSuggestion: defaultValue !== null && defaultValue !== void 0 ? defaultValue : null,
+        selectedSuggestion: defaultValue !== null && defaultValue !== void 0 ? defaultValue : null,
+        isFocused: false,
+        isOpen: false,
+        value: defaultValue,
+    });
+    const { isFocused, highlightedSuggestion, selectedSuggestion } = state;
+    const isOpen = isNil(isOpenProp) ? state.isOpen : isOpenProp;
+    const value = valueProp === undefined ? state.value : valueProp;
+    const filterValue = isNil(filterValueProp) ? state.filterValue : filterValueProp;
+    const inputValue = getInputValue(value, filterValue, shouldFilterValues, textField);
+    const inputSuggestion = getText(value, textField) === inputValue ? value : null;
+    const theme = useTheme(themeProp, COMPONENTS_NAMESPACES.dropDownSelect);
+    const { isValid, validateCurrent, InvalidMessage, } = useValidation(props, state, {
+        reset: createResetHandler({
+            props, mergeState, value: defaultValue,
+        }),
+    });
+    const inputRef = React.useRef(null);
+    const { inputWrapperClassNames, selectIconClassNames, wrapperClassNames, } = getComponentClassNames({
+        theme, className, isDisabled, isFocused, isOpen, isValid, isRequired, value,
+    });
+    const handlerData = {
+        props, state, mergeState, inputRef, validate: validateCurrent, value,
+    };
+    const handleChange = createChangeHandler(handlerData);
+    const handleBlur = createBlurHandler(handlerData);
+    const handleFocus = createFocusHandler(handlerData);
+    const handleIconClick = createIconClickHandler(handlerData);
+    const handleKeyDown = createKeyDownHandler(handlerData);
+    const handleFilterChange = createFilterChangeHandler(handlerData);
+    const handleClearIconClick = createClearIconClickHandler(handlerData);
+    useSyncedHighlightedValue({
+        filterValue, shouldFilterValues, mergeState, data,
+    });
+    useCorrectSuggestionsInControlledMode({
+        mergeState, valueProp,
+    });
+    const { Wrapper, Input, } = useCustomElements(props, state, { inputSuggestion });
+    const shouldRenderClearIcon = !isDisabled && hasClearButton && (value !== null || filterValue !== null);
+    const suggestionListData = (() => {
+        const filteredData = shouldFilterValues
+            ? filterData({
+                data, filterValue, textField, filterRule, searchFields,
+            })
+            : data;
+        if (filteredData === undefined)
+            return [];
+        if (sortSuggestions) {
+            return [...filteredData].sort(sortSuggestions);
+        }
+        return filteredData;
+    })();
+    const handleInputClick = () => {
+        mergeState({
+            isOpen: true,
+        });
+    };
+    const handleIconMouseDown = (event) => {
+        event.preventDefault();
+    };
+    const IconElement = useElement('Icon', (elementProps) => (_jsx(Icon, Object.assign({ icon: IconTypes.Icons.ChevronDown }, elementProps))), iconRender, props);
+    return (_jsxs(Wrapper, { className: wrapperClassNames, ref: ref, children: [_jsxs(Div, { className: inputWrapperClassNames, children: [_jsx(Input, Object.assign({}, restProps, { "aria-invalid": !isValid, "aria-required": isRequired, autoComplete: autoComplete, className: theme.input, disabled: isDisabled, form: form, name: name, onBlur: handleBlur, onChange: handleFilterChange, onClick: handleInputClick, onFocus: handleFocus, onKeyDown: handleKeyDown, placeholder: isNil(value) ? placeholder : '', readOnly: !shouldFilterValues, ref: inputRef, value: getInputValue(value, filterValue, shouldFilterValues, textField) })), shouldRenderClearIcon && (_jsx(Icon, { icon: IconTypes.Icons.X, className: theme.clearIcon, onClick: handleClearIconClick })), _jsx(IconElement, { className: selectIconClassNames, onMouseDown: handleIconMouseDown, onClick: handleIconClick })] }), _jsx(SuggestionList, { boundingContainerRef: boundingContainerRef, compareObjectsBy: compareObjectsBy, data: suggestionListData, groupBy: groupBy, highlightedSuggestion: highlightedSuggestion, isLoading: isLoading, isOpen: isDisabled ? false : isOpen, itemRender: itemRender, listRender: listRender, noSuggestionsText: noSuggestionsText, noSuggestionsRender: noSuggestionsRender, onClick: handleChange, placeholder: placeholder, selectedSuggestion: selectedSuggestion, shouldAllowEmpty: shouldAllowEmpty, textField: textField, theme: theme, value: value }), !isDisabled && !isLoading && !isOpen && !isFocused && (_jsx(InvalidMessage, {}))] }));
+});
+DropDownSelect.displayName = 'DropDownSelect';
+//# sourceMappingURL=index.js.map

package/dist/components/DropDownSelect/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../leda/components/DropDownSelect/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/DropDownSelect/theme.d.ts

@@ -0,0 +1,24 @@
+export declare const defaultDropDownSelectTheme: {
+    input: string;
+    inputWrapper: string;
+    inputWrapperDisabled: string;
+    inputWrapperFocused: string;
+    inputWrapperInvalid: string;
+    inputWrapperRequired: string;
+    clearIcon: string;
+    selectIcon: string;
+    selectIconClosed: string;
+    selectIconOpened: string;
+    wrapper: string;
+    container: string;
+    containerVisible: string;
+    containerTop: string;
+    group: string;
+    groupLabel: string;
+    item: string;
+    itemHighlighted: string;
+    itemPlaceholder: string;
+    itemSelected: string;
+    list: string;
+    noSuggestions: string;
+};

package/dist/components/DropDownSelect/theme.js

@@ -0,0 +1,5 @@
+/* eslint-disable key-spacing */
+import { defaultSuggestionListTheme } from '../../src/SuggestionList/theme';
+export const defaultDropDownSelectTheme = Object.assign(Object.assign({}, defaultSuggestionListTheme), { input: 'ld-input-element', inputWrapper: 'ld-input-element-wrapper', inputWrapperDisabled: 'ld-disabled', inputWrapperFocused: 'ld-focused', inputWrapperInvalid: 'ld-danger', inputWrapperRequired: 'ld-required', clearIcon: 'ld-input-icon', selectIcon: 'ld-input-icon', selectIconClosed: 'ld-closed', selectIconOpened: 'ld-opened', wrapper: 'ld-dropdownselect-wrapper' });
+/* eslint-enable key-spacing */
+//# sourceMappingURL=theme.js.map

package/dist/components/DropDownSelect/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sourceRoot":"","sources":["../../../leda/components/DropDownSelect/theme.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,EAAE,0BAA0B,EAAE,MAAM,gCAAgC,CAAC;AAE5E,MAAM,CAAC,MAAM,0BAA0B,mCAClC,0BAA0B,KAC7B,KAAK,EAAuB,kBAAkB,EAC9C,YAAY,EAAgB,0BAA0B,EACtD,oBAAoB,EAAQ,aAAa,EACzC,mBAAmB,EAAS,YAAY,EACxC,mBAAmB,EAAS,WAAW,EACvC,oBAAoB,EAAQ,aAAa,EACzC,SAAS,EAAmB,eAAe,EAC3C,UAAU,EAAkB,eAAe,EAC3C,gBAAgB,EAAY,WAAW,EACvC,gBAAgB,EAAY,WAAW,EACvC,OAAO,EAAqB,2BAA2B,GACxD,CAAC;AACF,+BAA+B"}

package/dist/components/DropDownSelect/types.d.ts

@@ -0,0 +1,149 @@
+import type * as React from 'react';
+import type { CustomEventHandler, CustomRender, SomeObject } from '../../commonTypes';
+import type { COMPONENTS_NAMESPACES } from '../../constants';
+import type { SuggestionListProps } from '../../src/SuggestionList/types';
+import type { GlobalDefaultTheme, PartialGlobalDefaultTheme } from '../../utils/useTheme';
+import type { DivProps } from '../Div';
+import type { ValidationProps } from '../Validation/types';
+import type { IconTypes } from '../..';
+export type Value = SomeObject | string | number | null;
+export interface ChangeMouseEvent<T extends Value> extends React.MouseEvent {
+    component: {
+        name?: string;
+        value: T;
+    };
+}
+export interface ChangeKeyboardEvent<T extends Value> extends React.KeyboardEvent<HTMLInputElement> {
+    component: {
+        name?: string;
+        value: T;
+    };
+}
+export interface ExtendedChangeEvent<T extends Value = Value> extends React.ChangeEvent {
+    component: {
+        name?: string;
+        value: T;
+    };
+}
+export interface ResetChangeEvent<T extends Value = Value> {
+    component: {
+        name?: string;
+        value: T;
+    };
+}
+export type ChangeEvent<T extends Value = Value> = ChangeMouseEvent<T> | ChangeKeyboardEvent<T> | ExtendedChangeEvent<T> | ResetChangeEvent<T>;
+export interface BlurEvent<T extends Value = Value> extends React.FocusEvent<HTMLInputElement> {
+    component: {
+        isValid: boolean;
+        name?: string;
+        value: T;
+    };
+}
+export interface FocusEvent<T extends Value = Value> extends React.FocusEvent<HTMLInputElement> {
+    component: {
+        name?: string;
+        value: T;
+    };
+}
+export interface DropDownSelectProps<T extends Value = Value> extends ValidationProps {
+    autoComplete?: string;
+    boundingContainerRef?: React.RefObject<HTMLElement>;
+    compareObjectsBy?: T extends object ? ((suggestionListItem: T) => unknown) | string : never;
+    data?: T[];
+    defaultValue?: Value;
+    filterRule?: FilterRules;
+    filterValue?: string;
+    groupBy?: (option: T) => string | undefined;
+    hasClearButton?: boolean;
+    iconRender?: CustomRender<DropDownSelectProps<T>, DropDownSelectState, unknown>;
+    inputRender?: CustomRender<DropDownSelectProps<T>, DropDownSelectState, React.InputHTMLAttributes<HTMLInputElement>>;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    isOpen?: boolean;
+    itemRender?: SuggestionListProps['itemRender'];
+    listRender?: SuggestionListProps['listRender'];
+    /** This will be shown when no suggestions are found */
+    noSuggestionsText?: React.ReactNode;
+    noSuggestionsRender?: SuggestionListProps['noSuggestionsRender'];
+    onBlur?: CustomEventHandler<BlurEvent<T>>;
+    onChange?: CustomEventHandler<ChangeEvent<T>>;
+    onFilterChange?: CustomEventHandler<ChangeEvent<string>>;
+    onFocus?: CustomEventHandler<FocusEvent<T>>;
+    placeholder?: string;
+    ref?: React.Ref<HTMLElement>;
+    /** You can use any of the data object's fields for seraching */
+    searchFields?: string[];
+    shouldAllowEmpty?: boolean;
+    shouldFilterValues?: boolean;
+    /** Сортировка выпадающего списка */
+    sortSuggestions?: (a: T, b: T) => number;
+    textField?: T extends object ? string : never;
+    theme?: PartialGlobalDefaultTheme[typeof COMPONENTS_NAMESPACES.dropDownSelect];
+    value?: T | null;
+    wrapperRender?: CustomRender<DropDownSelectProps<T>, DropDownSelectState, DivProps>;
+    [x: string]: unknown;
+}
+export interface DropDownSelectState {
+    filterValue: string | null;
+    highlightedSuggestion: Value;
+    selectedSuggestion: Value;
+    isFocused: boolean;
+    isOpen: boolean;
+    value: string | number | SomeObject | null;
+}
+export interface GetComponentClassNames {
+    (data: {
+        theme: GlobalDefaultTheme[typeof COMPONENTS_NAMESPACES.dropDownSelect];
+        className?: string;
+        isDisabled?: boolean;
+        isFocused?: boolean;
+        isOpen?: boolean;
+        isRequired?: boolean;
+        isValid?: boolean;
+        value: string | number | SomeObject | null;
+    }): {
+        inputWrapperClassNames?: string;
+        selectIconClassNames?: string;
+        wrapperClassNames?: string;
+    };
+}
+export interface HandlerCreatorData {
+    props: DropDownSelectProps;
+    state: DropDownSelectState;
+    mergeState: (state: Partial<DropDownSelectState>) => void;
+    value: DropDownSelectState['value'];
+    inputRef: React.MutableRefObject<HTMLInputElement | null>;
+    validate: (value?: string | number | SomeObject | null) => boolean;
+}
+export type ChangeHandler = CustomEventHandler<React.MouseEvent<HTMLElement> & {
+    target: {
+        value: string | number | SomeObject;
+    };
+}>;
+export type BlurHandler = CustomEventHandler<React.FocusEvent<HTMLInputElement>>;
+export type FocusHandler = CustomEventHandler<React.FocusEvent<HTMLInputElement>>;
+export type IconClickHandler = CustomEventHandler<React.MouseEvent<SVGElement>>;
+export type KeyDownHandler = CustomEventHandler<React.KeyboardEvent<HTMLInputElement>>;
+export type FilterChangeHandler = CustomEventHandler<React.ChangeEvent<HTMLInputElement>>;
+export type ClearIconClickHandler = CustomEventHandler<React.MouseEvent<SVGElement>>;
+export interface CustomElements {
+    Input: React.FC<React.InputHTMLAttributes<HTMLInputElement> & React.RefAttributes<HTMLInputElement>>;
+    Wrapper: React.FC<DivProps>;
+}
+export type FilterRules = 'smart' | 'startsWith' | 'includes';
+export interface FilterDataProps {
+    data: DropDownSelectProps['data'];
+    filterValue: string | null;
+    textField?: string;
+    filterRule?: FilterRules;
+    searchFields?: string[];
+}
+export interface UseCustomElementsExtra {
+    inputSuggestion?: Value;
+}
+export interface IconProps {
+    className?: string;
+    icon?: IconTypes.Icons;
+    onMouseDown?: React.MouseEventHandler<Element>;
+    onClick?: React.MouseEventHandler<Element>;
+}