@astral/ui 4.7.0 → 4.9.0

package/node/components/NavMenu/Item/ItemButton/styles.js

@@ -20,8 +20,8 @@ exports.StyledListItemButton = (0, styles_1.styled)(ListItemButton_1.ListItemBut
   overflow: hidden;
 
   box-sizing: border-box;
-  min-height: 36px;
-  padding: ${({ theme }) => theme.microSpacing(4, 4, 4, 5)};
+  min-height: 44px;
+  padding: ${({ theme }) => theme.microSpacing(6, 5)};
   
   border-radius: ${({ theme }) => theme.shape.small};
   
@@ -68,8 +68,8 @@ exports.StyledListItemButton = (0, styles_1.styled)(ListItemButton_1.ListItemBut
   ${({ theme }) => theme.breakpoints.down('sm')} {
     overflow: hidden;
 
-    min-height: 44px;
-    padding: ${({ theme }) => theme.spacing(0, 4)};
+    min-height: 48px;
+    padding: ${({ theme }) => theme.spacing(3, 2, 3, 4)};
 
     border-radius: ${({ theme }) => theme.shape.small};
     

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

@@ -3,9 +3,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.OptionsModal = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const Button_1 = require("../../Button");
+const CheckableTag_1 = require("../../CheckableTag");
 const Dialog_1 = require("../../Dialog");
 const DialogActions_1 = require("../../DialogActions");
 const Paper_1 = require("../../Paper");
+const TagBadge_1 = require("../../TagBadge");
 const TreeLikeList_1 = require("../../TreeLikeList");
 const Typography_1 = require("../../Typography");
 const constants_1 = require("./constants");
@@ -16,7 +18,7 @@ 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 { isNoResult, searchFieldProps, modalProps, treeListProps, cancelButtonProps, confirmButtonProps, handleRetry, isShowUserHint, isShowModalLoader, isShowSearchFieldLoader, isShowSearchSuggestion, isLoadingError, treeProps, loadingErrorMsg, badgeContent, checkableTagProps, isShowSelectedTree, selectedTreeProps, } = (0, useLogic_1.useLogic)(props);
     const renderComponent = () => {
         if (isShowSearchSuggestion) {
             return (0, jsx_runtime_1.jsx)(SearchSuggestion_1.SearchSuggestion, {});
@@ -30,8 +32,11 @@ const OptionsModal = (props) => {
         if (isNoResult) {
             return (0, jsx_runtime_1.jsx)(NoData_1.NoData, {});
         }
+        if (isShowSelectedTree) {
+            return ((0, jsx_runtime_1.jsx)(TreeLikeList_1.TreeLikeList, { ...treeProps, ...selectedTreeProps }));
+        }
         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" })] })] }));
+    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)(CheckableTag_1.CheckableTag, { ...checkableTagProps, endAddon: (badgeProps) => ((0, jsx_runtime_1.jsx)(TagBadge_1.TagBadge, { ...badgeProps, badgeContent: badgeContent, showZero: true })) }), (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/styles.js

@@ -12,7 +12,7 @@ exports.StyledDialogContent = (0, styles_1.styled)(DialogContent_1.DialogContent
 }) `
   display: grid;
   grid-template-columns: 100%;
-  grid-template-rows: max-content 1fr;
+  grid-template-rows: max-content 32px 1fr;
   gap: ${({ theme }) => theme.spacing(4)};
 
   width: ${({ $size }) => Dialog_1.DIALOG_SIZES[$size].minWidth};

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/hooks/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("./useSelectedTreeView"), exports);

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/hooks/useSelectedTreeView/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("./useSelectedTreeView"), exports);

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/hooks/useSelectedTreeView/useSelectedTreeView.d.ts

@@ -0,0 +1,20 @@
+import { type ChangeEvent } from 'react';
+import { type TreeListData } from '../../../../../Tree';
+import type { TreeLikeAsyncAutocompleteValue } from '../../../../types';
+type UseSelectedTreeViewParams = {
+    value?: TreeLikeAsyncAutocompleteValue;
+    searchValue?: string;
+    onInputChange: (value: string) => void;
+    onClearSearch: () => void;
+};
+type UseSelectedTreeViewResult = {
+    isShowSelectedTree: boolean;
+    setIsShowSelectedTree: (value: boolean) => void;
+    selectedTreeData: TreeLikeAsyncAutocompleteValue;
+    filteredSelectedTreeData: TreeListData[];
+    selectedTreeDataToRender: TreeListData[];
+    onChangeTreeView: (event: ChangeEvent<HTMLInputElement>) => void;
+    isNoResultInSelectedTree: boolean;
+};
+export declare const useSelectedTreeView: ({ value, searchValue, onInputChange, onClearSearch, }: UseSelectedTreeViewParams) => UseSelectedTreeViewResult;
+export {};

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/hooks/useSelectedTreeView/useSelectedTreeView.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectedTreeView = void 0;
+const react_1 = require("react");
+const array_1 = require("../../../../../utils/array");
+const utils_1 = require("../../utils");
+const addIsForceExpandedFlag = (item) => {
+    if (item.children) {
+        return {
+            ...item,
+            options: { ...(item.options || {}), isForceExpanded: true },
+        };
+    }
+    return item;
+};
+const useSelectedTreeView = ({ value, searchValue, onInputChange, onClearSearch, }) => {
+    const [isShowSelectedTree, setIsShowSelectedTree] = (0, react_1.useState)();
+    // Сохраняем порядок узлов
+    const nodeOrderRef = (0, react_1.useRef)(new Map());
+    // Строим дерево из выбранных элементов
+    const selectedTreeData = (0, react_1.useMemo)(() => {
+        if (!value || value.length === 0) {
+            nodeOrderRef.current.clear();
+            return [];
+        }
+        const tree = (0, utils_1.buildSelectedTree)(value);
+        return (0, utils_1.preserveNodeOrder)(tree, nodeOrderRef.current);
+    }, [value]);
+    // Применяем клиентский поиск к выбранным элементам
+    const filteredSelectedTreeData = (0, react_1.useMemo)(() => {
+        if (!isShowSelectedTree || !searchValue) {
+            return selectedTreeData;
+        }
+        return (0, utils_1.findInTree)(selectedTreeData, searchValue);
+    }, [selectedTreeData, searchValue, isShowSelectedTree]);
+    // Определяем isNoResult для режима выбранных элементов
+    const isNoResultInSelectedTree = !searchValue || !isShowSelectedTree
+        ? false
+        : filteredSelectedTreeData.length === 0;
+    // Применяем флаг раскрытия для отфильтрованного дерева выбранных элементов
+    const selectedTreeDataToRender = (0, react_1.useMemo)(() => {
+        if (!searchValue || !isShowSelectedTree) {
+            return filteredSelectedTreeData;
+        }
+        return (0, array_1.deepMap)(filteredSelectedTreeData, 'children', addIsForceExpandedFlag);
+    }, [filteredSelectedTreeData, searchValue, isShowSelectedTree]);
+    const onChangeTreeView = (event) => {
+        const newIsShowSelectedTree = event.target.checked;
+        setIsShowSelectedTree(newIsShowSelectedTree);
+        onClearSearch();
+        if (!newIsShowSelectedTree) {
+            onInputChange('');
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        // Когда все элементы убраны из выбранного дерева, возвращаемся на основное дерево
+        if (!value?.length) {
+            setIsShowSelectedTree(false);
+        }
+    }, [value]);
+    return {
+        isShowSelectedTree: isShowSelectedTree ?? false,
+        setIsShowSelectedTree,
+        selectedTreeData,
+        filteredSelectedTreeData,
+        selectedTreeDataToRender,
+        onChangeTreeView,
+        isNoResultInSelectedTree,
+    };
+};
+exports.useSelectedTreeView = useSelectedTreeView;

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

@@ -1,4 +1,5 @@
 import { type ButtonProps } from '../../../Button';
+import { type CheckableTagProps } from '../../../CheckableTag';
 import { type DialogProps, type DialogSize } from '../../../Dialog';
 import { type SearchFieldProps } from '../../../SearchField';
 import { type TreeLikeListProps } from '../../../TreeLikeList';
@@ -22,6 +23,10 @@ type UseLogicResult = {
     treeProps?: Pick<TreeLikeListProps, 'disabledItems' | 'renderItem'>;
     isLoadingError?: boolean;
     loadingErrorMsg?: string;
+    badgeContent: number;
+    selectedTreeProps: TreeLikeListProps<TreeLikeAsyncAutocompleteValue>;
+    isShowSelectedTree?: boolean;
+    checkableTagProps: CheckableTagProps;
 };
 export declare const useLogic: ({ isOpen, initialValue, options, onChange, dialogProps, onInputChange, onRetry, meta, onShowUserHint, isLoadingModal, minSymbolsToFetch, isLoading, isLoadingError, loadingErrorMsg, treeProps, }: UseLogicParams) => UseLogicResult;
 export {};

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

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLogic = void 0;
 const react_1 = require("react");
 const array_1 = require("../../../utils/array");
+const hooks_1 = require("./hooks");
 const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInputChange, onRetry, meta, onShowUserHint, isLoadingModal, minSymbolsToFetch = 0, isLoading, isLoadingError, loadingErrorMsg, treeProps, }) => {
     const [value, setValue] = (0, react_1.useState)(initialValue);
     const [searchValue, setSearchValue] = (0, react_1.useState)();
@@ -16,6 +17,15 @@ const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInpu
             setSearchValue('');
         }
     }, [isOpen]);
+    const onClearSearch = () => {
+        setSearchValue('');
+    };
+    const { isShowSelectedTree, selectedTreeDataToRender, onChangeTreeView, isNoResultInSelectedTree, } = (0, hooks_1.useSelectedTreeView)({
+        value,
+        searchValue,
+        onInputChange,
+        onClearSearch,
+    });
     const addIsForceExpandedFlag = (item) => {
         if (item.children) {
             return {
@@ -30,8 +40,13 @@ const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInpu
         ? (0, array_1.deepMap)(options, 'children', addIsForceExpandedFlag)
         : options, [options, searchValue, isLoading]);
     const handleChangeSearchField = (event) => {
-        setSearchValue(event.target.value);
-        onInputChange(event.target.value);
+        const newSearchValue = event.target.value;
+        setSearchValue(newSearchValue);
+        // В режиме выбранных элементов используем клиентский поиск, не вызываем onInputChange
+        // В обычном режиме используем асинхронный поиск через запросы
+        if (!isShowSelectedTree) {
+            onInputChange(newSearchValue);
+        }
     };
     const handleChange = (newValue) => setValue(newValue);
     const handleClose = (event) => {
@@ -46,7 +61,23 @@ const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInpu
         onChange?.(value);
         onClose?.(event, 'escapeKeyDown');
     };
-    const isNoResult = Boolean(searchValue) && !options.length;
+    // Определяем isNoResult в зависимости от режима
+    const isNoResult = (0, react_1.useMemo)(() => {
+        if (!searchValue) {
+            return false;
+        }
+        // В режиме выбранных элементов проверяем отфильтрованное дерево
+        if (isShowSelectedTree) {
+            return isNoResultInSelectedTree;
+        }
+        // В обычном режиме проверяем options
+        return !options.length;
+    }, [
+        searchValue,
+        isShowSelectedTree,
+        isNoResultInSelectedTree,
+        options.length,
+    ]);
     const isDisabledButton = !value || isNoResult;
     const handleRetry = () => {
         onRetry?.(searchValue);
@@ -55,8 +86,10 @@ const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInpu
     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));
+    // Подсказка о минимальном количестве символов показывается только в обычном режиме
+    const isShowSearchSuggestion = Boolean(!isShowSelectedTree &&
+        ((!searchValue && minSymbolsToFetch > 0) ||
+            (searchValue && searchValue.length < minSymbolsToFetch)));
     return {
         isShowModalLoader,
         isShowSearchFieldLoader,
@@ -67,6 +100,24 @@ const useLogic = ({ isOpen, initialValue, options, onChange, dialogProps, onInpu
         treeProps,
         loadingErrorMsg,
         isLoadingError,
+        badgeContent: value?.length ?? 0,
+        isShowSelectedTree,
+        checkableTagProps: {
+            onChange: onChangeTreeView,
+            checked: isShowSelectedTree,
+            disabled: !value?.length,
+            size: 'large',
+            variant: 'light',
+            label: 'Показать выбранные',
+            color: 'default',
+        },
+        selectedTreeProps: {
+            value,
+            data: selectedTreeDataToRender,
+            onChange: handleChange,
+            isObjectMode: true,
+            isInitialExpanded: true,
+        },
         modalProps: {
             onClose: handleClose,
             disableRestoreFocus: true,

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/buildSelectedTree/buildSelectedTree.d.ts

@@ -0,0 +1,6 @@
+import type { TreeLikeAsyncAutocompleteValue } from '../../../../types';
+/**
+ * Строит дерево из выбранных элементов с учетом breadcrumbs
+ * Если несколько элементов имеют общего родителя, они объединяются в один узел
+ */
+export declare const buildSelectedTree: (selectedItems: TreeLikeAsyncAutocompleteValue) => TreeLikeAsyncAutocompleteValue;

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/buildSelectedTree/buildSelectedTree.js

@@ -0,0 +1,105 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildSelectedTree = void 0;
+/**
+ * Создает breadcrumbs для элемента на основе его позиции в пути
+ */
+const createBreadcrumbs = (path, currentIndex) => {
+    if (currentIndex === 0) {
+        return undefined;
+    }
+    // Берем все элементы до текущего индекса и создаем breadcrumbs
+    // Breadcrumbs должны содержать только id, label, note (без children и options)
+    return path.slice(0, currentIndex).map((item) => ({
+        id: item.id,
+        label: item.label,
+        note: item.note,
+    }));
+};
+/**
+ * Получает или создает Map для дочернего узла
+ */
+const getOrCreateChildrenMap = (node, nodeChildrenMaps) => {
+    const existingMap = nodeChildrenMaps.get(node);
+    if (existingMap) {
+        return existingMap;
+    }
+    const childrenMap = new Map();
+    nodeChildrenMaps.set(node, childrenMap);
+    // Если у узла уже есть children, добавляем их в Map
+    if (node.children) {
+        node.children.forEach((child) => {
+            childrenMap.set(child.id, child);
+        });
+    }
+    return childrenMap;
+};
+/**
+ * Преобразует Map в массив TreeLikeAsyncAutocompleteValue
+ */
+const convertToArray = (level, nodeChildrenMaps) => {
+    const result = [];
+    level.forEach((node) => {
+        const childrenMap = nodeChildrenMaps.get(node);
+        const children = childrenMap && childrenMap.size > 0
+            ? convertToArray(childrenMap, nodeChildrenMaps)
+            : undefined;
+        result.push({
+            ...node,
+            children: children && children.length > 0 ? children : undefined,
+        });
+    });
+    return result;
+};
+/**
+ * Строит дерево из выбранных элементов с учетом breadcrumbs
+ * Если несколько элементов имеют общего родителя, они объединяются в один узел
+ */
+const buildSelectedTree = (selectedItems) => {
+    if (!selectedItems || selectedItems.length === 0) {
+        return [];
+    }
+    const rootLevel = new Map();
+    const nodeChildrenMaps = new WeakMap();
+    // Обрабатываем каждый выбранный элемент
+    selectedItems.forEach((item) => {
+        // Строим путь от корня к элементу: breadcrumbs + сам элемент
+        const path = [
+            ...(item.breadcrumbs ?? []),
+            item,
+        ];
+        // Проходим по пути и создаем/обновляем узлы дерева
+        path.reduce((currentLevel, pathItem, index) => {
+            const existingNode = currentLevel.get(pathItem.id);
+            const restoredBreadcrumbs = createBreadcrumbs(path, index);
+            if (existingNode) {
+                // Если узел уже существует, обновляем его поля из pathItem
+                const existingChildren = existingNode.children;
+                Object.assign(existingNode, pathItem, {
+                    children: existingChildren,
+                    breadcrumbs: restoredBreadcrumbs,
+                    options: {
+                        ...existingNode.options,
+                        ...pathItem.options,
+                        isDefaultExpanded: true,
+                    },
+                });
+                return getOrCreateChildrenMap(existingNode, nodeChildrenMaps);
+            }
+            // Создаем новый узел с восстановленными breadcrumbs
+            const newNode = {
+                ...pathItem,
+                breadcrumbs: restoredBreadcrumbs,
+                children: undefined,
+                options: {
+                    ...pathItem.options,
+                    isDefaultExpanded: true,
+                },
+            };
+            currentLevel.set(pathItem.id, newNode);
+            return getOrCreateChildrenMap(newNode, nodeChildrenMaps);
+        }, rootLevel);
+    });
+    return convertToArray(rootLevel, nodeChildrenMaps);
+};
+exports.buildSelectedTree = buildSelectedTree;

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/buildSelectedTree/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("./buildSelectedTree"), exports);

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/findInTree/findInTree.d.ts

@@ -0,0 +1,2 @@
+import { type TreeListData } from '../../../../../Tree';
+export declare const findInTree: (tree: TreeListData[], searchValue: string, filterOptions?: ((node: TreeListData, filterSearchValue: string) => boolean) | undefined) => TreeListData[];

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/findInTree/findInTree.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findInTree = void 0;
+const defaultFilterOptions = (node, searchValue) => {
+    if (typeof node.label !== 'string') {
+        return;
+    }
+    const preparedSearchValue = searchValue.trim().toLowerCase();
+    const preparedLabel = node.label.toLowerCase();
+    const resultByLabel = preparedLabel.includes(preparedSearchValue);
+    if (resultByLabel) {
+        return resultByLabel;
+    }
+    if (typeof node.note !== 'string') {
+        return;
+    }
+    const preparedNote = node.note.toLowerCase();
+    return preparedNote.includes(preparedSearchValue);
+};
+const findInTree = (tree, searchValue, filterOptions) => {
+    const compareFunc = filterOptions || defaultFilterOptions;
+    const search = (nodes) => {
+        const results = [];
+        for (const node of nodes) {
+            // Если label включает искомый термин, добавляем узел в результаты
+            if (compareFunc(node, searchValue)) {
+                results.push({ ...node, options: { isDefaultExpanded: false } });
+                // Если узел соответствует поиску, пропускаем обработку его потомков
+                continue;
+            }
+            // Если у узла есть потомки, рекурсивно ищем в них
+            if (node.children) {
+                const childResults = search(node.children);
+                if (childResults.length > 0) {
+                    // Добавляем узел только один раз с найденными потомками
+                    results.push({
+                        ...node,
+                        children: childResults,
+                    });
+                }
+            }
+        }
+        return results;
+    };
+    return search(tree);
+};
+exports.findInTree = findInTree;

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/findInTree/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("./findInTree"), exports);

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

@@ -0,0 +1,3 @@
+export * from './buildSelectedTree';
+export * from './findInTree';
+export * from './preserveNodeOrder';

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

@@ -0,0 +1,19 @@
+"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("./buildSelectedTree"), exports);
+__exportStar(require("./findInTree"), exports);
+__exportStar(require("./preserveNodeOrder"), exports);

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

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

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/preserveNodeOrder/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("./preserveNodeOrder"), exports);

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/preserveNodeOrder/preserveNodeOrder.d.ts

@@ -0,0 +1,7 @@
+import type { TreeLikeAsyncAutocompleteValue } from '../../../../types';
+type NodeOrderMap = Map<string, number>;
+/**
+ * Гарантирует неизменность порядка узлов при операциях выбора элементов в дереве
+ */
+export declare const preserveNodeOrder: (tree: TreeLikeAsyncAutocompleteValue, nodeOrderRef: NodeOrderMap) => TreeLikeAsyncAutocompleteValue;
+export {};

package/node/components/TreeLikeAsyncAutocomplete/OptionsModal/useLogic/utils/preserveNodeOrder/preserveNodeOrder.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.preserveNodeOrder = void 0;
+/**
+ * Гарантирует неизменность порядка узлов при операциях выбора элементов в дереве
+ */
+const preserveNodeOrder = (tree, nodeOrderRef) => {
+    // Обновляем порядок узлов: сохраняем существующий или используем порядок из дерева
+    const updateNodeOrder = (nodes) => {
+        nodes.forEach((node) => {
+            const nodeWithOrder = node;
+            const orderFromTree = nodeWithOrder.options?.order;
+            if (!nodeOrderRef.has(node.id)) {
+                nodeOrderRef.set(node.id, orderFromTree ?? nodeOrderRef.size);
+            }
+            if (node.children) {
+                updateNodeOrder(node.children);
+            }
+        });
+    };
+    updateNodeOrder(tree);
+    // Сортируем дерево по сохраненному порядку
+    const sortByOrder = (nodes) => [...nodes]
+        .sort((a, b) => {
+        const orderA = nodeOrderRef.get(a.id) ?? Infinity;
+        const orderB = nodeOrderRef.get(b.id) ?? Infinity;
+        return orderA - orderB;
+    })
+        .map((node) => ({
+        ...node,
+        children: node.children ? sortByOrder(node.children) : undefined,
+    }));
+    return sortByOrder(tree);
+};
+exports.preserveNodeOrder = preserveNodeOrder;