@astral/ui 4.4.0 → 4.5.0

package/components/TreeLikeAsyncAutocomplete/OptionsModal/Loader/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/Loader/index.js

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/Loader/styles.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/Loader/styles.js

@@ -0,0 +1,8 @@
+import { styled } from '../../../styles';
+export const Wrapper = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/NoData.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const NoData: () => JSX.Element;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/NoData.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Typography } from '../../../Typography';
+import { Wrapper } from './styles';
+export const NoData = () => {
+    return (_jsx(Wrapper, { children: _jsx(Typography, { color: "textSecondary", children: "\u041F\u043E \u0432\u0432\u0435\u0434\u0435\u043D\u043D\u043E\u043C\u0443 \u0437\u0430\u043F\u0440\u043E\u0441\u0443 \u043D\u0438\u0447\u0435\u0433\u043E \u043D\u0435 \u043D\u0430\u0439\u0434\u0435\u043D\u043E" }) }));
+};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/index.js

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/styles.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/styles.js

@@ -0,0 +1,8 @@
+import { styled } from '../../../styles';
+export const Wrapper = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/OptionsModal.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { OptionsModalProps } from './types';
+export declare const OptionsModal: (props: OptionsModalProps) => JSX.Element;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/OptionsModal.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../../Button';
+import { Dialog } from '../../Dialog';
+import { DialogActions } from '../../DialogActions';
+import { Paper } from '../../Paper';
+import { TreeLikeList } from '../../TreeLikeList';
+import { Typography } from '../../Typography';
+import { SEARCH_FIELD_HELPER_TEXT } from './constants';
+import { ErrorMessage } from './ErrorMessage';
+import { Loader } from './Loader';
+import { NoData } from './NoData';
+import { SearchSuggestion } from './SearchSuggestion';
+import { StyledDialogContent, StyledSearchField, TreeListWrapper, UserHintWrapper, } from './styles';
+import { useLogic } from './useLogic';
+export const OptionsModal = (props) => {
+    const { isNoResult, searchFieldProps, modalProps, treeListProps, cancelButtonProps, confirmButtonProps, handleRetry, isShowUserHint, isShowModalLoader, isShowSearchFieldLoader, isShowSearchSuggestion, isLoadingError, treeProps, loadingErrorMsg, } = useLogic(props);
+    const renderComponent = () => {
+        if (isShowSearchSuggestion) {
+            return _jsx(SearchSuggestion, {});
+        }
+        if (isShowModalLoader) {
+            return _jsx(Loader, {});
+        }
+        if (isLoadingError) {
+            return (_jsx(ErrorMessage, { loadingErrorMsg: loadingErrorMsg, onRetry: handleRetry }));
+        }
+        if (isNoResult) {
+            return _jsx(NoData, {});
+        }
+        return (_jsx(TreeLikeList, { ...treeProps, ...treeListProps }));
+    };
+    return (_jsxs(Dialog, { ...modalProps, children: [_jsxs(StyledDialogContent, { "$size": modalProps.size, children: [_jsx(StyledSearchField, { fullWidth: true, ...searchFieldProps, isLoading: isShowSearchFieldLoader, helperText: SEARCH_FIELD_HELPER_TEXT }), _jsx(Paper, { variant: "outlined", children: _jsxs(TreeListWrapper, { children: [renderComponent(), isShowUserHint && (_jsx(UserHintWrapper, { children: _jsx(Typography, { variant: "caption", color: "grey", colorIntensity: "600", children: "\u0423\u0442\u043E\u0447\u043D\u0438\u0442\u0435 \u0437\u0430\u043F\u0440\u043E\u0441 \u0434\u043B\u044F \u0431\u043E\u043B\u0435\u0435 \u043B\u0443\u0447\u0448\u0435\u0433\u043E \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u0430 \u043F\u043E\u0438\u0441\u043A\u0430" }) }))] }) })] }), _jsxs(DialogActions, { children: [_jsx(Button, { variant: "text", ...cancelButtonProps, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), _jsx(Button, { ...confirmButtonProps, children: "\u0412\u044B\u0431\u0440\u0430\u0442\u044C" })] })] }));
+};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/SearchSuggestion.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const SearchSuggestion: () => JSX.Element;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/SearchSuggestion.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Typography } from '../../../Typography';
+import { Wrapper } from './styles';
+export const SearchSuggestion = () => {
+    return (_jsx(Wrapper, { children: _jsx(Typography, { color: "textSecondary", children: "\u041F\u0440\u043E\u0434\u043E\u043B\u0436\u0430\u0439\u0442\u0435 \u0432\u0432\u043E\u0434\u0438\u0442\u044C \u0434\u043B\u044F \u043F\u043E\u0438\u0441\u043A\u0430" }) }));
+};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/index.js

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/styles.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/styles.js

@@ -0,0 +1,8 @@
+import { styled } from '../../../styles';
+export const Wrapper = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/constants.d.ts

@@ -0,0 +1 @@
+export declare const SEARCH_FIELD_HELPER_TEXT = "\u0412\u0432\u0435\u0434\u0438\u0442\u0435 \u0442\u043E\u0447\u043D\u044B\u0439 \u0437\u0430\u043F\u0440\u043E\u0441 \u0434\u043B\u044F \u043B\u0443\u0447\u0448\u0435\u0433\u043E \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u0430 \u043F\u043E\u0438\u0441\u043A\u0430";

package/components/TreeLikeAsyncAutocomplete/OptionsModal/constants.js

@@ -0,0 +1 @@
+export const SEARCH_FIELD_HELPER_TEXT = 'Введите точный запрос для лучшего результата поиска';

package/components/TreeLikeAsyncAutocomplete/OptionsModal/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/index.js

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export declare const StyledDialogContent: import("@emotion/styled").StyledComponent<import("../../DialogContent").DialogContentProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    $size: Size;
+}, {}, {}>;
+export declare const TreeListWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledSearchField: import("@emotion/styled").StyledComponent<Omit<import("../../SearchField").SearchFieldProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const UserHintWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export {};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.js

@@ -0,0 +1,48 @@
+import { formHelperTextClasses } from '@mui/material';
+import { DIALOG_SIZES } from '../../Dialog';
+import { DialogContent } from '../../DialogContent';
+import { SearchField } from '../../SearchField';
+import { styled } from '../../styles';
+import { treeListClassnames } from '../../Tree';
+export const StyledDialogContent = styled(DialogContent, {
+    shouldForwardProp: (prop) => !['$size'].includes(prop),
+}) `
+  display: grid;
+  grid-template-columns: 100%;
+  grid-template-rows: max-content 1fr;
+  gap: ${({ theme }) => theme.spacing(4)};
+
+  width: ${({ $size }) => DIALOG_SIZES[$size].minWidth};
+  height: ${({ $size }) => ($size === 'md' ? '500px' : `calc(${DIALOG_SIZES[$size].minWidth} - 50px)`)};
+  padding-bottom: ${({ theme }) => theme.spacing(4)};
+  
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    width: auto;
+  }
+`;
+export const TreeListWrapper = styled.div `
+    overflow: auto;
+
+    height: 100%;
+  
+  & .${treeListClassnames.list} {
+    width: auto;
+    min-width: max-content;
+  }
+`;
+export const StyledSearchField = styled(SearchField) `
+  & .${formHelperTextClasses.root} {
+    display: flex;
+
+    margin-top: ${({ theme }) => theme.spacing(2)};
+    
+    color: ${({ theme }) => theme.palette.grey[500]};
+  }
+`;
+export const UserHintWrapper = styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 36px;
+`;

package/components/TreeLikeAsyncAutocomplete/OptionsModal/types.d.ts

@@ -0,0 +1,69 @@
+import type { DialogProps } from '../../Dialog';
+import type { TreeListProps } from '../../Tree';
+import type { TreeLikeAsyncAutocompleteValue } from '../types';
+export type OptionsModalProps = {
+    /**
+     * Если true, модальное окно будет открыто
+     */
+    isOpen: boolean;
+    /**
+     * Флаг, определяющий отображение состояния загрузки в модальном окне.
+     */
+    isLoadingModal: boolean;
+    /**
+     * Функция определения необходимости показа подсказки пользователю
+     */
+    onShowUserHint?: (options: TreeLikeAsyncAutocompleteValue) => boolean;
+    /**
+     * Опции, которые необходимо отобразить в виде дерева.
+     */
+    options: TreeLikeAsyncAutocompleteValue;
+    /**
+     * Выбранное значения
+     */
+    initialValue?: TreeLikeAsyncAutocompleteValue;
+    /**
+     * Флаг загрузки options
+     * Если true, вместо дерева options будет отображен лоадер
+     */
+    isLoading?: boolean;
+    /**
+     * Флаг ошибки загрузки options
+     * Если true, вместо дерева options будет отображен плейсхолдер с ошибкой
+     */
+    isLoadingError?: boolean;
+    /**
+     * Текст ошибки при загрузке данных
+     */
+    loadingErrorMsg?: string;
+    /**
+     * Предназначен для конфигурации древовидного списка
+     */
+    treeProps?: Pick<TreeListProps, 'disabledItems' | 'renderItem'>;
+    /**
+     * Параметры предназначены для конфигурации модального окна
+     */
+    dialogProps: Omit<DialogProps, 'open' | 'onChange' | 'disableRestoreFocus'>;
+    /**
+     * Функция обработки нажатия на кнопку "Повторить запрос"
+     */
+    onRetry?: (search?: string) => void;
+    /**
+     * Функция, которая запускается при выборе item
+     */
+    onChange?: (newValue?: TreeLikeAsyncAutocompleteValue) => void;
+    /**
+     * Функция обработки изменения поля ввода
+     */
+    onInputChange: (value: string) => void;
+    /**
+     * Метаданные опций
+     */
+    meta?: {
+        isAllDataLoaded?: boolean;
+    };
+    /**
+     * Минимальное количество символов для выполнения запроса
+     */
+    minSymbolsToFetch?: number;
+};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/types.js

@@ -0,0 +1 @@
+export {};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/index.js

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

package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.d.ts

@@ -0,0 +1,27 @@
+import { type ButtonProps } from '../../../Button';
+import { type DialogProps, type DialogSize } from '../../../Dialog';
+import { type SearchFieldProps } from '../../../SearchField';
+import { type TreeLikeListProps } from '../../../TreeLikeList';
+import type { TreeLikeAsyncAutocompleteValue } from '../../types';
+import type { OptionsModalProps } from '../types';
+type UseLogicParams = OptionsModalProps;
+type UseLogicResult = {
+    isNoResult: boolean;
+    isShowSearchSuggestion: boolean;
+    searchFieldProps: SearchFieldProps;
+    modalProps: DialogProps & {
+        size: DialogSize;
+    };
+    treeListProps: TreeLikeListProps<TreeLikeAsyncAutocompleteValue>;
+    cancelButtonProps: ButtonProps;
+    confirmButtonProps: ButtonProps;
+    handleRetry: () => void;
+    isShowUserHint?: boolean;
+    isShowModalLoader: boolean;
+    isShowSearchFieldLoader?: boolean;
+    treeProps?: Pick<TreeLikeListProps, 'disabledItems' | 'renderItem'>;
+    isLoadingError?: boolean;
+    loadingErrorMsg?: string;
+};
+export declare const useLogic: ({ isOpen, initialValue, options, onChange, dialogProps, onInputChange, onRetry, meta, onShowUserHint, isLoadingModal, minSymbolsToFetch, isLoading, isLoadingError, loadingErrorMsg, treeProps, }: UseLogicParams) => UseLogicResult;
+export {};

package/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/useLogic.js

@@ -0,0 +1,92 @@
+import { useEffect, useMemo, useState, } from 'react';
+import { deepMap } from '../../../utils/array';
+export const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInputChange, onRetry, meta, onShowUserHint, isLoadingModal, minSymbolsToFetch = 0, isLoading, isLoadingError, loadingErrorMsg, treeProps, }) => {
+    const [value, setValue] = useState(initialValue);
+    const [searchValue, setSearchValue] = useState();
+    const { onClose, ...restDialogProps } = dialogProps;
+    useEffect(() => {
+        setValue(initialValue);
+    }, [initialValue]);
+    useEffect(() => {
+        // В поле ввода вставляем выбранное значение или пустую строку для запроса на открытие модального окна
+        if (isOpen) {
+            setSearchValue('');
+        }
+    }, [isOpen]);
+    const addIsForceExpandedFlag = (item) => {
+        if (item.children) {
+            return {
+                ...item,
+                options: { ...(item.options || {}), isForceExpanded: true },
+            };
+        }
+        return item;
+    };
+    // Если строка поиска не пустая и загрузки нет, то раскрываем все дерево в отфильтрованной выдаче
+    const optionToRender = useMemo(() => searchValue && !isLoading
+        ? deepMap(options, 'children', addIsForceExpandedFlag)
+        : options, [options, searchValue, isLoading]);
+    const handleChangeSearchField = (event) => {
+        setSearchValue(event.target.value);
+        onInputChange(event.target.value);
+    };
+    const handleChange = (newValue) => setValue(newValue);
+    const handleClose = (event) => {
+        setValue(initialValue);
+        onClose?.(event, 'escapeKeyDown');
+    };
+    const handleCancel = (event) => {
+        setValue(initialValue);
+        onClose?.(event, 'escapeKeyDown');
+    };
+    const handleClick = (event) => {
+        onChange?.(value);
+        onClose?.(event, 'escapeKeyDown');
+    };
+    const isNoResult = Boolean(searchValue) && !options.length;
+    const isDisabledButton = !value || isNoResult;
+    const handleRetry = () => {
+        onRetry?.(searchValue);
+    };
+    const isShowUserHint = onShowUserHint?.(options) || meta?.isAllDataLoaded;
+    const isShowModalLoader = isLoadingModal && options.length === 0;
+    const isShowSearchFieldLoader = (isLoading && !isLoadingModal) ||
+        (isLoading && isLoadingModal && options.length > 0);
+    const isShowSearchSuggestion = Boolean((!searchValue && minSymbolsToFetch > 0) ||
+        (searchValue && searchValue.length < minSymbolsToFetch));
+    return {
+        isShowModalLoader,
+        isShowSearchFieldLoader,
+        isNoResult,
+        handleRetry,
+        isShowUserHint,
+        isShowSearchSuggestion,
+        treeProps,
+        loadingErrorMsg,
+        isLoadingError,
+        modalProps: {
+            onClose: handleClose,
+            disableRestoreFocus: true,
+            open: isOpen,
+            size: 'md',
+            ...restDialogProps,
+        },
+        searchFieldProps: {
+            value: searchValue,
+            onChange: handleChangeSearchField,
+        },
+        treeListProps: {
+            value,
+            data: optionToRender,
+            onChange: handleChange,
+            isObjectMode: true,
+        },
+        cancelButtonProps: {
+            onClick: handleCancel,
+        },
+        confirmButtonProps: {
+            disabled: isDisabledButton,
+            onClick: handleClick,
+        },
+    };
+};

package/components/TreeLikeAsyncAutocomplete/TreeLikeAsyncAutocomplete.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import type { TreeLikeAsyncAutocompleteProps } from './types';
+export declare const TreeLikeAsyncAutocomplete: import("react").ForwardRefExoticComponent<Omit<TreeLikeAsyncAutocompleteProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/components/TreeLikeAsyncAutocomplete/TreeLikeAsyncAutocomplete.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { Input } from './Input';
+import { OptionsModal } from './OptionsModal';
+import { useLogic } from './useLogic';
+export const TreeLikeAsyncAutocomplete = forwardRef((props, forwardedRef) => {
+    const { inputProps, optionsModalProps } = useLogic(props);
+    return (_jsxs(_Fragment, { children: [_jsx(Input, { ref: forwardedRef, ...inputProps }), _jsx(OptionsModal, { ...optionsModalProps })] }));
+});

package/components/TreeLikeAsyncAutocomplete/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const DEFAULT_MIN_SEARCH_CHARACTERS = 0;
+export declare const DEFAULT_DELAY_MS = 300;

package/components/TreeLikeAsyncAutocomplete/constants.js

@@ -0,0 +1,2 @@
+export const DEFAULT_MIN_SEARCH_CHARACTERS = 0;
+export const DEFAULT_DELAY_MS = 300;

package/components/TreeLikeAsyncAutocomplete/index.d.ts

@@ -0,0 +1,2 @@
+export type { TreeLikeAsyncAutocompleteValue, TreeLikeAsyncAutocompleteProps, FetchOptionsResult, } from './types';
+export * from './TreeLikeAsyncAutocomplete';

package/components/TreeLikeAsyncAutocomplete/index.js

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

package/components/TreeLikeAsyncAutocomplete/types.d.ts

@@ -0,0 +1,69 @@
+import type { FetchOptionsResult, TreeAsyncAutocompleteValue } from '../TreeAsyncAutocomplete';
+import type { TreeAutocompleteProps } from '../TreeAutocomplete';
+/**
+ * Значение для TreeLikeAsyncAutocomplete - массив элементов дерева
+ */
+export type TreeLikeAsyncAutocompleteValue = TreeAsyncAutocompleteValue[];
+export type { FetchOptionsResult };
+export type TreeLikeAsyncAutocompleteProps = Omit<TreeAutocompleteProps, 'options' | 'isLoading' | 'isLoadingError' | 'value' | 'onChange' | 'filterOptions' | 'trimmed' | 'maxLength' | 'type'> & {
+    /**
+     * Выбранное значения
+     */
+    value?: TreeLikeAsyncAutocompleteValue;
+    /**
+     * Функция, которая запускается при выборе item
+     */
+    onChange?: (newValue?: TreeLikeAsyncAutocompleteValue) => void;
+    /**
+     * Функция для асинхронной загрузки опций на основе поискового запроса
+     * При возникновении ошибки запроса данных, компонент сам ее обработает.
+     * Для обработки ошибок вручную используйте параметр `onDataLoadError`
+     *
+     * @param search - Строка поиска, введенная пользователем. На основе этой
+     *   строки функция должна вернуть подходящие опции.
+     * @param signal - Объект `AbortSignal`, который позволяет отменить запрос,
+     *   если пользователь изменил поисковый запрос или закрыл компонент.
+     *
+     * @returns Promise<FetchResult> Промис, который разрешается объектом с массивом узлов дерева и метаданными.
+     *
+     * @example
+     ```typescript
+     * const fetchOptions = async (search: string, signal?: AbortSignal) => {
+     *   const response = await fetch(`/api/options/search?query=${search}`, {
+     *     signal
+     *   });
+     *   const data = await response.json();
+     *
+     *   return {
+     *     options: data.items,
+     *     meta: {
+     *       isAllDataLoaded: data.isAllDataLoaded,
+     *     }
+     *   };
+     * };
+     *
+     * <TreeLikeAsyncAutocomplete fetchOptions={fetchOptions} />
+     * ```
+     */
+    fetchOptions: (search: string, signal?: AbortSignal) => Promise<FetchOptionsResult>;
+    /**
+     * Задержка для fetchOptions
+     */
+    fetchDelayMs?: number;
+    /**
+     * Функция для обработки ошибок загрузки данных
+     */
+    onDataLoadError?: (error: Error) => void;
+    /**
+     * Минимальное количество символов для выполнения запроса
+     */
+    minSymbolsToFetch?: number;
+    /**
+     * Функция определения необходимости показа подсказки пользователю
+     */
+    onShowUserHint?: (options: TreeLikeAsyncAutocompleteValue) => boolean;
+    /**
+     * Флаг загрузки данных
+     */
+    isLoading?: boolean;
+};

package/components/TreeLikeAsyncAutocomplete/types.js

@@ -0,0 +1 @@
+export {};

package/components/TreeLikeAsyncAutocomplete/useLogic/index.d.ts

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

package/components/TreeLikeAsyncAutocomplete/useLogic/index.js

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