@astral/ui 4.4.0 → 4.5.0

package/node/components/TreeLikeAsyncAutocomplete/Input/useLogic/useLogic.d.ts

@@ -0,0 +1,18 @@
+import { type MouseEvent, type SyntheticEvent } from 'react';
+import { type TreeLikeAsyncAutocompleteValue } from '../../types';
+import type { InputProps } from '../types';
+type UseLogicParams = Pick<InputProps, 'value' | 'disabled' | 'inputRef' | 'onChange' | 'isLoading' | 'onClick'>;
+export declare const useLogic: ({ value, disabled, isLoading, inputRef: externalInputRef, onChange: propsOnChange, onClick: propsOnClick, }: UseLogicParams) => {
+    isVisibleClearButton: boolean;
+    onClearAll: (event: SyntheticEvent<HTMLButtonElement>) => void;
+    onChange: (newValue: TreeLikeAsyncAutocompleteValue | undefined) => void;
+    onClick: (event: MouseEvent<HTMLDivElement>) => void;
+    isVisibleTagsList: boolean;
+    textFieldProps: {
+        value: string;
+        $isHidden: boolean;
+        inputRef: import("react").RefObject<HTMLInputElement>;
+        onClick: (event: MouseEvent<HTMLDivElement>) => void;
+    };
+};
+export {};

package/node/components/TreeLikeAsyncAutocomplete/Input/useLogic/useLogic.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLogic = void 0;
+const react_1 = require("react");
+const hooks_1 = require("../../../hooks");
+const useLogic = ({ value, disabled, isLoading, inputRef: externalInputRef, onChange: propsOnChange, onClick: propsOnClick, }) => {
+    const inputRef = (0, hooks_1.useForwardedRef)(externalInputRef);
+    const prevValue = (0, react_1.useRef)(undefined);
+    (0, react_1.useEffect)(() => {
+        if (value && !prevValue.current) {
+            prevValue.current = value;
+        }
+        if (!value && prevValue.current) {
+            inputRef.current?.focus();
+            prevValue.current = undefined;
+        }
+    }, [value]);
+    const prepareValue = () => {
+        if (!value || (Array.isArray(value) && !value.length)) {
+            return '';
+        }
+        return value.map((item) => item.label).join(', ');
+    };
+    const preparedValue = prepareValue();
+    const hasValue = Boolean(preparedValue);
+    const onChange = (newValue) => {
+        propsOnChange?.(newValue);
+    };
+    const onClearAll = (event) => {
+        event.stopPropagation();
+        onChange?.([]);
+        inputRef.current?.focus();
+    };
+    const onClick = (event) => {
+        if (!isLoading) {
+            propsOnClick?.(event);
+        }
+    };
+    const isVisibleClearButton = !disabled && !isLoading && Boolean(value?.length);
+    return {
+        isVisibleClearButton,
+        onClearAll,
+        onChange,
+        onClick,
+        isVisibleTagsList: hasValue,
+        textFieldProps: {
+            value: preparedValue,
+            $isHidden: hasValue,
+            inputRef,
+            onClick,
+        },
+    };
+};
+exports.useLogic = useLogic;

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+type Props = {
+    /**
+     * Текст ошибки при загрузке данных
+     */
+    loadingErrorMsg?: string;
+    /**
+     * Функция обработки нажатия на кнопку "Повторить запрос"
+     */
+    onRetry?: () => void;
+};
+export declare const ErrorMessage: ({ loadingErrorMsg, onRetry, }: Props) => JSX.Element;
+export {};

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/ErrorMessage/ErrorMessage.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorMessage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Button_1 = require("../../../Button");
+const Typography_1 = require("../../../Typography");
+const styles_1 = require("./styles");
+const DEFAULT_ERROR_MSG = 'Не удалось загрузить данные';
+const ErrorMessage = ({ loadingErrorMsg = DEFAULT_ERROR_MSG, onRetry, }) => ((0, jsx_runtime_1.jsxs)(styles_1.Wrapper, { children: [(0, jsx_runtime_1.jsx)(Typography_1.Typography, { color: "textSecondary", children: loadingErrorMsg }), onRetry && (0, jsx_runtime_1.jsx)(Button_1.Button, { onClick: onRetry, children: "\u041F\u043E\u043F\u0440\u043E\u0431\u043E\u0432\u0430\u0442\u044C \u0441\u043D\u043E\u0432\u0430" })] }));
+exports.ErrorMessage = ErrorMessage;

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/ErrorMessage/index.js

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./ErrorMessage"), exports);

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/ErrorMessage/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/ErrorMessage/styles.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = void 0;
+const styles_1 = require("../../../styles");
+exports.Wrapper = styles_1.styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: ${({ theme }) => theme.spacing(3)};
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

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

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

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

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Loader = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Loader_1 = require("../../../Loader");
+const styles_1 = require("./styles");
+const Loader = () => ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { children: (0, jsx_runtime_1.jsx)(Loader_1.Loader, {}) }));
+exports.Loader = Loader;

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Loader"), exports);

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/Loader/styles.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = void 0;
+const styles_1 = require("../../../styles");
+exports.Wrapper = styles_1.styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

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

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

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

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NoData = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Typography_1 = require("../../../Typography");
+const styles_1 = require("./styles");
+const NoData = () => {
+    return ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { children: (0, jsx_runtime_1.jsx)(Typography_1.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" }) }));
+};
+exports.NoData = NoData;

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./NoData"), exports);

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/NoData/styles.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = void 0;
+const styles_1 = require("../../../styles");
+exports.Wrapper = styles_1.styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/OptionsModal.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OptionsModal = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Button_1 = require("../../Button");
+const Dialog_1 = require("../../Dialog");
+const DialogActions_1 = require("../../DialogActions");
+const Paper_1 = require("../../Paper");
+const TreeLikeList_1 = require("../../TreeLikeList");
+const Typography_1 = require("../../Typography");
+const constants_1 = require("./constants");
+const ErrorMessage_1 = require("./ErrorMessage");
+const Loader_1 = require("./Loader");
+const NoData_1 = require("./NoData");
+const SearchSuggestion_1 = require("./SearchSuggestion");
+const styles_1 = require("./styles");
+const useLogic_1 = require("./useLogic");
+const OptionsModal = (props) => {
+    const { isNoResult, searchFieldProps, modalProps, treeListProps, cancelButtonProps, confirmButtonProps, handleRetry, isShowUserHint, isShowModalLoader, isShowSearchFieldLoader, isShowSearchSuggestion, isLoadingError, treeProps, loadingErrorMsg, } = (0, useLogic_1.useLogic)(props);
+    const renderComponent = () => {
+        if (isShowSearchSuggestion) {
+            return (0, jsx_runtime_1.jsx)(SearchSuggestion_1.SearchSuggestion, {});
+        }
+        if (isShowModalLoader) {
+            return (0, jsx_runtime_1.jsx)(Loader_1.Loader, {});
+        }
+        if (isLoadingError) {
+            return ((0, jsx_runtime_1.jsx)(ErrorMessage_1.ErrorMessage, { loadingErrorMsg: loadingErrorMsg, onRetry: handleRetry }));
+        }
+        if (isNoResult) {
+            return (0, jsx_runtime_1.jsx)(NoData_1.NoData, {});
+        }
+        return ((0, jsx_runtime_1.jsx)(TreeLikeList_1.TreeLikeList, { ...treeProps, ...treeListProps }));
+    };
+    return ((0, jsx_runtime_1.jsxs)(Dialog_1.Dialog, { ...modalProps, children: [(0, jsx_runtime_1.jsxs)(styles_1.StyledDialogContent, { "$size": modalProps.size, children: [(0, jsx_runtime_1.jsx)(styles_1.StyledSearchField, { fullWidth: true, ...searchFieldProps, isLoading: isShowSearchFieldLoader, helperText: constants_1.SEARCH_FIELD_HELPER_TEXT }), (0, jsx_runtime_1.jsx)(Paper_1.Paper, { variant: "outlined", children: (0, jsx_runtime_1.jsxs)(styles_1.TreeListWrapper, { children: [renderComponent(), isShowUserHint && ((0, jsx_runtime_1.jsx)(styles_1.UserHintWrapper, { children: (0, jsx_runtime_1.jsx)(Typography_1.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" }) }))] }) })] }), (0, jsx_runtime_1.jsxs)(DialogActions_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { variant: "text", ...cancelButtonProps, children: "\u041E\u0442\u043C\u0435\u043D\u0430" }), (0, jsx_runtime_1.jsx)(Button_1.Button, { ...confirmButtonProps, children: "\u0412\u044B\u0431\u0440\u0430\u0442\u044C" })] })] }));
+};
+exports.OptionsModal = OptionsModal;

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

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

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

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchSuggestion = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const Typography_1 = require("../../../Typography");
+const styles_1 = require("./styles");
+const SearchSuggestion = () => {
+    return ((0, jsx_runtime_1.jsx)(styles_1.Wrapper, { children: (0, jsx_runtime_1.jsx)(Typography_1.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" }) }));
+};
+exports.SearchSuggestion = SearchSuggestion;

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./SearchSuggestion"), exports);

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/SearchSuggestion/styles.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Wrapper = void 0;
+const styles_1 = require("../../../styles");
+exports.Wrapper = styles_1.styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 100%;
+`;

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/constants.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SEARCH_FIELD_HELPER_TEXT = void 0;
+exports.SEARCH_FIELD_HELPER_TEXT = 'Введите точный запрос для лучшего результата поиска';

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./OptionsModal"), exports);

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/styles.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UserHintWrapper = exports.StyledSearchField = exports.TreeListWrapper = exports.StyledDialogContent = void 0;
+const material_1 = require("@mui/material");
+const Dialog_1 = require("../../Dialog");
+const DialogContent_1 = require("../../DialogContent");
+const SearchField_1 = require("../../SearchField");
+const styles_1 = require("../../styles");
+const Tree_1 = require("../../Tree");
+exports.StyledDialogContent = (0, styles_1.styled)(DialogContent_1.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_1.DIALOG_SIZES[$size].minWidth};
+  height: ${({ $size }) => ($size === 'md' ? '500px' : `calc(${Dialog_1.DIALOG_SIZES[$size].minWidth} - 50px)`)};
+  padding-bottom: ${({ theme }) => theme.spacing(4)};
+  
+  ${({ theme }) => theme.breakpoints.down('sm')} {
+    width: auto;
+  }
+`;
+exports.TreeListWrapper = styles_1.styled.div `
+    overflow: auto;
+
+    height: 100%;
+  
+  & .${Tree_1.treeListClassnames.list} {
+    width: auto;
+    min-width: max-content;
+  }
+`;
+exports.StyledSearchField = (0, styles_1.styled)(SearchField_1.SearchField) `
+  & .${material_1.formHelperTextClasses.root} {
+    display: flex;
+
+    margin-top: ${({ theme }) => theme.spacing(2)};
+    
+    color: ${({ theme }) => theme.palette.grey[500]};
+  }
+`;
+exports.UserHintWrapper = styles_1.styled.div `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  height: 36px;
+`;

package/node/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/node/components/TreeLikeAsyncAutocomplete/OptionsModal/types.js

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

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

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

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./useLogic"), exports);

package/node/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 {};