@astral/ui 4.4.0 → 4.5.0

package/components/TreeLikeAsyncAutocomplete/useLogic/useLogic.js

@@ -0,0 +1,82 @@
+import { useEffect, useState, } from 'react';
+import { useAsyncOptions } from '../../hooks';
+import { DEFAULT_DELAY_MS, DEFAULT_MIN_SEARCH_CHARACTERS } from '../constants';
+export const useLogic = ({ onBlur, isError, value, isDisabled, fetchDelayMs = DEFAULT_DELAY_MS, fetchOptions, minSymbolsToFetch = DEFAULT_MIN_SEARCH_CHARACTERS, onDataLoadError, onChange, loadingErrorMsg, treeProps, dialogProps, onShowUserHint, ...restInputProps }) => {
+    const [isOpen, setOpen] = useState(false);
+    const [isLoadingModal, setIsLoadingModal] = useState(false);
+    const { options, isLoadingData, isLoadingError, onInputChange: propsOnInputChange, onOpen: propsOnOpen, onRetry: propsOnRetry, meta, } = useAsyncOptions({
+        fetchOptions,
+        fetchDelayMs,
+        minSymbolsToFetch,
+        onDataLoadError,
+    });
+    useEffect(() => {
+        if (!isLoadingData) {
+            setIsLoadingModal(false);
+        }
+    }, [isLoadingData]);
+    const onInputBlur = (event) => {
+        // Если произошла потеря фокуса, но открылась окно поиска элемента, то не вызываем onBlur, так как произойдет преждевременная валидация
+        if (!isOpen) {
+            onBlur?.(event);
+        }
+    };
+    const onOpen = () => {
+        if (minSymbolsToFetch === 0) {
+            setIsLoadingModal(true);
+        }
+        propsOnOpen('', undefined, true);
+        setOpen(true);
+    };
+    const onKeyDown = (event) => {
+        if (event.code === 'Enter') {
+            setOpen(true);
+        }
+    };
+    const onClose = (event) => {
+        onBlur?.(event);
+        setOpen(false);
+    };
+    const onRetry = (search = '') => {
+        setIsLoadingModal(true);
+        propsOnRetry(search);
+    };
+    const onInputChange = (search) => {
+        if (isLoadingError) {
+            setIsLoadingModal(true);
+        }
+        propsOnInputChange(search, 'input');
+    };
+    return {
+        inputProps: {
+            onBlur: onInputBlur,
+            onClick: onOpen,
+            onKeyDown,
+            error: isError,
+            disabled: isDisabled,
+            value,
+            onChange,
+            ...restInputProps,
+        },
+        optionsModalProps: {
+            isOpen,
+            initialValue: value,
+            meta,
+            isLoading: isLoadingData,
+            isLoadingError,
+            loadingErrorMsg,
+            treeProps,
+            dialogProps: {
+                ...dialogProps,
+                onClose,
+            },
+            options,
+            onRetry,
+            onChange,
+            onInputChange,
+            isLoadingModal,
+            onShowUserHint,
+            minSymbolsToFetch,
+        },
+    };
+};

package/components/TreeLikeAsyncAutocomplete/useLogic/utils/deepMultipleFind/deepMultipleFind.d.ts

@@ -0,0 +1,3 @@
+import type { TreeAsyncAutocompleteValue } from '../../../../TreeAsyncAutocomplete';
+import type { TreeLikeAsyncAutocompleteValue } from '../../../types';
+export declare const deepMultipleFind: (tree: TreeLikeAsyncAutocompleteValue, callback: (item: TreeAsyncAutocompleteValue) => boolean) => TreeLikeAsyncAutocompleteValue;

package/components/TreeLikeAsyncAutocomplete/useLogic/utils/deepMultipleFind/deepMultipleFind.js

@@ -0,0 +1,12 @@
+export const deepMultipleFind = (tree, callback) => {
+    const result = [];
+    for (const item of tree) {
+        if (callback(item)) {
+            result.push(item);
+        }
+        if (item.children) {
+            result.push(...deepMultipleFind(item.children, callback));
+        }
+    }
+    return result;
+};

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

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

package/components/TreeLikeAsyncAutocomplete/useLogic/utils/deepMultipleFind/index.js

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

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

@@ -0,0 +1 @@
+export { deepMultipleFind } from './deepMultipleFind';

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

@@ -0,0 +1 @@
+export { deepMultipleFind } from './deepMultipleFind';

package/components/TreeLikeList/TreeItem/TreeItem.d.ts

@@ -1,52 +1,4 @@
-import { type FunctionComponent } from 'react';
-import type { TreeListData } from '../../Tree';
+/// <reference types="react" />
 import type { MultipleValue } from '../types';
-type FormatDisableItem = {
-    id: string;
-    disabledReason?: string;
-};
-export type TreeItemProps = TreeListData & {
-    /**
-     * Выбранные значения
-     */
-    value?: MultipleValue;
-    /**
-     * Уникальный префикс для идентификаторов в рамках дерева
-     */
-    prefixId?: string;
-    /**
-     * Render-props, позволяет более гибко настраивать содержимое item
-     */
-    renderItem?: FunctionComponent<Omit<TreeListData, 'children'>>;
-    /**
-     * Уровень вложенности в дереве
-     */
-    level: number;
-    /**
-     * Если true, при выборе родителя будет возможность выбора дочерних элементов
-     */
-    isConfirmChildrenSelection?: boolean;
-    /**
-     * Если true, то дерево будет раскрыто по умолчанию
-     * @default false
-     */
-    isInitialExpanded?: boolean;
-    /**
-     * Уровень раскрытия дерева по умолчанию, при isExpanded=true
-     */
-    expandedLevel: number;
-    /**
-     * Цепочки идентификаторов до выбранных элементов дерева
-     */
-    chainsToSelectedItem?: MultipleValue[];
-    /**
-     * Список `value` элементов дерева, которые не доступны для взаимодействия
-     */
-    disabledItems?: FormatDisableItem[];
-    /**
-     * Функция, которая запускается при выборе item
-     */
-    onChange: (value: MultipleValue) => void;
-};
-export declare const TreeItem: (props: TreeItemProps) => JSX.Element;
-export {};
+import type { TreeItemProps } from './types';
+export declare const TreeItem: <TValue extends MultipleValue = string[]>(props: TreeItemProps<TValue>) => JSX.Element;

package/components/TreeLikeList/TreeItem/TreeItem.js

@@ -5,9 +5,10 @@ import { List, PopoverContent, StyledCheckbox, StyledTooltip, StyledTreeItem, }
 import { useLogic } from './useLogic';
 export const TreeItem = (props) => {
     const { isSelected, isDefaultExpanded, disabledReason, isDisabled, nextLevel, formControlLabelProps, tooltipProps, confirmChildrenButtonProps, handleChange, } = useLogic(props);
-    const { id, prefixId, label, note, level, renderItem, children = [], value, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem, disabledItems, options, onChange, } = props;
+    const { item, prefixId, level, renderItem, value, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem, disabledItems, onChange, isObjectMode, } = props;
+    const { id, label, note, children = [], options } = item;
     if (children.length) {
-        return (_jsx(StyledTreeItem, { id: id, prefixId: prefixId, isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, disabledReason: disabledReason, isDisabled: isDisabled, note: renderItem ? null : note, isNotBlockingExpandList: true, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledTooltip, { arrow: false, placement: "right", leaveDelay: 250, title: _jsx(PopoverContent, { children: _jsx(Button, { variant: "light", ...confirmChildrenButtonProps, children: !isSelected ? 'Исключить дочерние' : 'Выбрать дочерние' }) }), ...tooltipProps, children: _jsx(StyledCheckbox, { checked: isSelected }) }), label: renderItem ? renderItem({ label, note, id }) : label, ...formControlLabelProps }), level: level, onClick: handleChange, children: _jsx(List, { children: children.map((child) => (_jsx(TreeItem, { prefixId: prefixId, ...child, renderItem: renderItem, level: nextLevel, isConfirmChildrenSelection: isConfirmChildrenSelection, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, chainsToSelectedItem: chainsToSelectedItem, disabledItems: disabledItems, value: value, onChange: onChange }, child.id))) }) }));
+        return (_jsx(StyledTreeItem, { id: id, prefixId: prefixId, isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, disabledReason: disabledReason, isDisabled: isDisabled, note: renderItem ? null : note, isNotBlockingExpandList: true, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledTooltip, { arrow: false, placement: "right", leaveDelay: 250, title: _jsx(PopoverContent, { children: _jsx(Button, { variant: "light", ...confirmChildrenButtonProps, children: !isSelected ? 'Исключить дочерние' : 'Выбрать дочерние' }) }), ...tooltipProps, children: _jsx(StyledCheckbox, { checked: isSelected }) }), label: renderItem ? renderItem({ label, note, id }) : label, ...formControlLabelProps }), level: level, onClick: handleChange, children: _jsx(List, { children: children.map((child) => (_jsx(TreeItem, { isObjectMode: isObjectMode, prefixId: prefixId, item: child, renderItem: renderItem, level: nextLevel, isConfirmChildrenSelection: isConfirmChildrenSelection, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, chainsToSelectedItem: chainsToSelectedItem, disabledItems: disabledItems, value: value, onChange: onChange }, child.id))) }) }));
     }
     return (_jsx(StyledTreeItem, { id: id, prefixId: prefixId, isSelected: isSelected, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected }), label: renderItem ? renderItem({ label, note, id }) : label, ...formControlLabelProps }), level: level, onClick: handleChange }));
 };

package/components/TreeLikeList/TreeItem/types.d.ts

@@ -0,0 +1,56 @@
+import type { FunctionComponent } from 'react';
+import type { TreeListData } from '../../Tree';
+import type { MultipleValue } from '../types';
+type FormatDisableItem = {
+    id: string;
+    disabledReason?: string;
+};
+export type TreeItemProps<TValue extends MultipleValue = string[]> = {
+    item: TreeListData;
+    /**
+     * Выбранные значения
+     */
+    value?: TValue;
+    /**
+     * Уникальный префикс для идентификаторов в рамках дерева
+     */
+    prefixId?: string;
+    /**
+     * Render-props, позволяет более гибко настраивать содержимое item
+     */
+    renderItem?: FunctionComponent<Omit<TreeListData, 'children'>>;
+    /**
+     * Уровень вложенности в дереве
+     */
+    level: number;
+    /**
+     * Если true, при выборе родителя будет возможность выбора дочерних элементов
+     */
+    isConfirmChildrenSelection?: boolean;
+    /**
+     * Если true, то дерево будет раскрыто по умолчанию
+     * @default false
+     */
+    isInitialExpanded?: boolean;
+    /**
+     * Уровень раскрытия дерева по умолчанию, при isExpanded=true
+     */
+    expandedLevel: number;
+    /**
+     * Цепочки идентификаторов до выбранных элементов дерева
+     */
+    chainsToSelectedItem?: string[][];
+    /**
+     * Список `value` элементов дерева, которые не доступны для взаимодействия
+     */
+    disabledItems?: FormatDisableItem[];
+    /**
+     * Функция, которая запускается при выборе item
+     */
+    onChange: (value: TValue) => void;
+    /**
+     *  Переключает компонент в режим работы с объектами а не с id элементов
+     */
+    isObjectMode?: boolean;
+};
+export {};

package/components/TreeLikeList/TreeItem/types.js

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

package/components/TreeLikeList/TreeItem/useLogic/useLogic.d.ts

@@ -1,7 +1,8 @@
 import { type SyntheticEvent } from 'react';
-import { type TreeItemProps } from '../TreeItem';
-type UseLogicProps = TreeItemProps;
-export declare const useLogic: ({ id, value, children, level, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem, disabledItems, onChange, }: UseLogicProps) => {
+import type { MultipleValue } from '../../types';
+import type { TreeItemProps } from '../types';
+type UseLogicProps<TValue extends MultipleValue = string[]> = TreeItemProps<TValue>;
+export declare const useLogic: <TValue extends MultipleValue = string[]>({ item, value, level, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem, disabledItems, onChange, isObjectMode, }: UseLogicProps<TValue>) => {
     isSelected: boolean;
     isDefaultExpanded: boolean | undefined;
     isDisabled: boolean;

package/components/TreeLikeList/TreeItem/useLogic/useLogic.js

@@ -1,14 +1,15 @@
 import { useMemo } from 'react';
 import { useToggle } from '../../../hooks';
-import { checkIsSelected, getAllChildrenId } from './utils';
-export const useLogic = ({ id, value = [], children, level, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem = [], disabledItems, onChange, }) => {
+import { addItem, addItemsByIds, checkIsSelected, getAllChildrenId, getCurrentValueIds, removeItem, removeItemsByIds, } from './utils';
+export const useLogic = ({ item, value = [], level, isConfirmChildrenSelection, isInitialExpanded, expandedLevel, chainsToSelectedItem = [], disabledItems, onChange, isObjectMode, }) => {
+    const { id, children } = item;
     const [isTooltipOpen, openTooltip, closeTooltip] = useToggle();
     const childrenIds = useMemo(() => getAllChildrenId(children, disabledItems), [children, disabledItems]);
     const isSelected = checkIsSelected(value, id);
-    const flatChainsToSelectedItem = useMemo(() => chainsToSelectedItem?.reduce((acc, chain) => [...(acc || []), ...(chain || [])], []), [chainsToSelectedItem]);
+    const flatChainsToSelectedItem = useMemo(() => chainsToSelectedItem?.reduce((acc, chain) => acc.concat(chain), []), [chainsToSelectedItem]);
     const isDefaultExpanded = flatChainsToSelectedItem?.includes(id) ||
         (isInitialExpanded && level <= expandedLevel - 1);
-    const disabledItem = disabledItems?.find((item) => item.id === id);
+    const disabledItem = disabledItems?.find((formatDisableItem) => formatDisableItem.id === id);
     const isDisabled = Boolean(disabledItem);
     const disabledReason = disabledItem?.disabledReason;
     const nextLevel = level + 1;
@@ -16,29 +17,37 @@ export const useLogic = ({ id, value = [], children, level, isConfirmChildrenSel
         if (isDisabled) {
             return;
         }
+        const currentValueIds = getCurrentValueIds(value);
         // Сбрасываем значение
-        if (value.includes(id)) {
-            const hasSelectedChildren = value.some((val) => childrenIds.includes(val));
-            // Если нет включенных дочерних элементов, то не предлагаем их выключить
+        if (currentValueIds.includes(id)) {
+            const hasSelectedChildren = childrenIds.some((childrenId) => currentValueIds.includes(childrenId));
             if (isConfirmChildrenSelection && hasSelectedChildren) {
                 openTooltip();
             }
-            return onChange(value.filter((selectedId) => selectedId !== id));
+            const newValue = removeItem(value, id);
+            return onChange(newValue);
         }
         // Добавляем новый элемент
-        onChange([...value, id]);
-        const isAllChildrenSelected = childrenIds.every((childrenId) => value.includes(childrenId));
-        // Если все дочерние уже включены, то не предлагаем их выбрать
+        const newValue = addItem(value, item, isObjectMode);
+        onChange(newValue);
+        const isAllChildrenSelected = childrenIds.every((childrenId) => currentValueIds.includes(childrenId));
         if (isConfirmChildrenSelection && !isAllChildrenSelected) {
             openTooltip();
         }
     };
     const handleConfirmChildrenSelection = () => {
+        const currentValueIds = getCurrentValueIds(value);
         if (isSelected) {
-            onChange([...value, ...childrenIds]);
+            // Элемент выбран - выбираем все дочерние элементы
+            const idsToAdd = childrenIds.filter((childrenId) => !currentValueIds.includes(childrenId));
+            const newValue = addItemsByIds(value, idsToAdd, children, isObjectMode);
+            onChange(newValue);
         }
         else {
-            onChange(value.filter((selectedId) => !childrenIds.includes(selectedId)));
+            // Элемент не выбран - исключаем все дочерние элементы
+            const idsToRemove = childrenIds.filter((childrenId) => currentValueIds.includes(childrenId));
+            const newValue = removeItemsByIds(value, idsToRemove);
+            onChange(newValue);
         }
         closeTooltip();
     };

package/components/TreeLikeList/TreeItem/useLogic/utils/addItem/addItem.d.ts

@@ -0,0 +1,6 @@
+import type { TreeListData } from '../../../../../Tree';
+import type { MultipleValue } from '../../../../types';
+/**
+ * Добавляет элемент в value
+ */
+export declare const addItem: <TValue extends MultipleValue = string[]>(value: TValue, item: TreeListData, isObjectMode?: boolean) => TValue;

package/components/TreeLikeList/TreeItem/useLogic/utils/addItem/addItem.js

@@ -0,0 +1,8 @@
+/**
+ * Добавляет элемент в value
+ */
+export const addItem = (value, item, isObjectMode) => {
+    const currentValue = value || [];
+    const newItem = isObjectMode ? item : item.id;
+    return [...currentValue, newItem];
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/addItem/index.d.ts

@@ -0,0 +1 @@
+export { addItem } from './addItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/addItem/index.js

@@ -0,0 +1 @@
+export { addItem } from './addItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/addItemsByIds/addItemsByIds.d.ts

@@ -0,0 +1,6 @@
+import type { TreeListData } from '../../../../../Tree';
+import type { MultipleValue } from '../../../../types';
+/**
+ * Добавляет элементы в value по массиву id
+ */
+export declare const addItemsByIds: <TValue extends MultipleValue = string[]>(value: TValue, idsToAdd: string[], children: TreeListData[] | undefined, isObjectMode?: boolean) => TValue;

package/components/TreeLikeList/TreeItem/useLogic/utils/addItemsByIds/addItemsByIds.js

@@ -0,0 +1,15 @@
+import { findObjectsByIds } from '../findObjectsByIds';
+/**
+ * Добавляет элементы в value по массиву id
+ */
+export const addItemsByIds = (value, idsToAdd, children, isObjectMode) => {
+    if (idsToAdd.length === 0) {
+        return value;
+    }
+    const currentValue = value || [];
+    if (isObjectMode) {
+        const objectsToAdd = findObjectsByIds(children || [], idsToAdd);
+        return [...currentValue, ...objectsToAdd];
+    }
+    return [...currentValue, ...idsToAdd];
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/addItemsByIds/index.d.ts

@@ -0,0 +1 @@
+export { addItemsByIds } from './addItemsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/addItemsByIds/index.js

@@ -0,0 +1 @@
+export { addItemsByIds } from './addItemsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/checkIsSelected/checkIsSelected.d.ts

@@ -1 +1,2 @@
-export declare const checkIsSelected: (value: string[] | undefined, optionId: string) => boolean;
+import type { MultipleValue } from '../../../../types';
+export declare const checkIsSelected: <TValue extends MultipleValue = string[]>(value: TValue, optionId: string) => boolean;

package/components/TreeLikeList/TreeItem/useLogic/utils/checkIsSelected/checkIsSelected.js

@@ -1,6 +1,7 @@
+import { getIdFromValue } from '../getIdFromValue';
 export const checkIsSelected = (value, optionId) => {
     if (!value || !value.length) {
         return false;
     }
-    return value.includes(optionId);
+    return value.some((item) => getIdFromValue(item) === optionId);
 };

package/components/TreeLikeList/TreeItem/useLogic/utils/findObjectsByIds/findObjectsByIds.d.ts

@@ -0,0 +1,5 @@
+import type { TreeListData } from '../../../../../Tree';
+/**
+ * Находит объекты TreeListData в дереве по массиву ID
+ */
+export declare const findObjectsByIds: (nodes: TreeListData[], ids: string[]) => TreeListData[];

package/components/TreeLikeList/TreeItem/useLogic/utils/findObjectsByIds/findObjectsByIds.js

@@ -0,0 +1,22 @@
+/**
+ * Находит объекты TreeListData в дереве по массиву ID
+ */
+export const findObjectsByIds = (nodes, ids) => {
+    if (!ids.length) {
+        return [];
+    }
+    // Создаем Map для быстрого поиска объектов по ID
+    const idToObjectMap = new Map();
+    const traverse = (items) => {
+        for (const item of items) {
+            idToObjectMap.set(item.id, item);
+            if (item.children) {
+                traverse(item.children);
+            }
+        }
+    };
+    traverse(nodes);
+    return ids
+        .map((id) => idToObjectMap.get(id))
+        .filter((obj) => obj !== undefined);
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/findObjectsByIds/index.d.ts

@@ -0,0 +1 @@
+export { findObjectsByIds } from './findObjectsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/findObjectsByIds/index.js

@@ -0,0 +1 @@
+export { findObjectsByIds } from './findObjectsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/getCurrentValueIds/getCurrentValueIds.d.ts

@@ -0,0 +1,5 @@
+import type { MultipleValue } from '../../../../types';
+/**
+ * Получает массив идентификаторов из значения
+ */
+export declare const getCurrentValueIds: (value: MultipleValue) => string[];

package/components/TreeLikeList/TreeItem/useLogic/utils/getCurrentValueIds/getCurrentValueIds.js

@@ -0,0 +1,10 @@
+import { getIdFromValue } from '../getIdFromValue';
+/**
+ * Получает массив идентификаторов из значения
+ */
+export const getCurrentValueIds = (value) => {
+    if (!value) {
+        return [];
+    }
+    return value.map((treeItem) => getIdFromValue(treeItem));
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/getCurrentValueIds/index.d.ts

@@ -0,0 +1 @@
+export { getCurrentValueIds } from './getCurrentValueIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/getCurrentValueIds/index.js

@@ -0,0 +1 @@
+export { getCurrentValueIds } from './getCurrentValueIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/getIdFromValue/getIdFromValue.d.ts

@@ -0,0 +1,5 @@
+import { type TreeListData } from '../../../../../Tree';
+/**
+ * Получает Id из значения, которое может быть строкой или объектом TreeListData
+ */
+export declare const getIdFromValue: (item: string | TreeListData) => string;

package/components/TreeLikeList/TreeItem/useLogic/utils/getIdFromValue/getIdFromValue.js

@@ -0,0 +1,6 @@
+/**
+ * Получает Id из значения, которое может быть строкой или объектом TreeListData
+ */
+export const getIdFromValue = (item) => {
+    return typeof item === 'string' ? item : item.id;
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/getIdFromValue/index.d.ts

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

package/components/TreeLikeList/TreeItem/useLogic/utils/getIdFromValue/index.js

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

package/components/TreeLikeList/TreeItem/useLogic/utils/index.d.ts

@@ -1,2 +1,9 @@
 export { checkIsSelected } from './checkIsSelected';
 export { getAllChildrenId } from './getAllChildrenId';
+export { getIdFromValue } from './getIdFromValue';
+export { findObjectsByIds } from './findObjectsByIds';
+export { getCurrentValueIds } from './getCurrentValueIds';
+export { removeItemsByIds } from './removeItemsByIds';
+export { addItemsByIds } from './addItemsByIds';
+export { removeItem } from './removeItem';
+export { addItem } from './addItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/index.js

@@ -1,2 +1,9 @@
 export { checkIsSelected } from './checkIsSelected';
 export { getAllChildrenId } from './getAllChildrenId';
+export { getIdFromValue } from './getIdFromValue';
+export { findObjectsByIds } from './findObjectsByIds';
+export { getCurrentValueIds } from './getCurrentValueIds';
+export { removeItemsByIds } from './removeItemsByIds';
+export { addItemsByIds } from './addItemsByIds';
+export { removeItem } from './removeItem';
+export { addItem } from './addItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItem/index.d.ts

@@ -0,0 +1 @@
+export { removeItem } from './removeItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItem/index.js

@@ -0,0 +1 @@
+export { removeItem } from './removeItem';

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItem/removeItem.d.ts

@@ -0,0 +1,5 @@
+import type { MultipleValue } from '../../../../types';
+/**
+ * Удаляет элемент из value по id
+ */
+export declare const removeItem: <TValue extends MultipleValue = string[]>(value: TValue, idToRemove: string) => TValue;

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItem/removeItem.js

@@ -0,0 +1,10 @@
+import { getIdFromValue } from '../getIdFromValue';
+/**
+ * Удаляет элемент из value по id
+ */
+export const removeItem = (value, idToRemove) => {
+    if (!value) {
+        return value;
+    }
+    return value.filter((treeItem) => getIdFromValue(treeItem) !== idToRemove);
+};

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItemsByIds/index.d.ts

@@ -0,0 +1 @@
+export { removeItemsByIds } from './removeItemsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItemsByIds/index.js

@@ -0,0 +1 @@
+export { removeItemsByIds } from './removeItemsByIds';

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItemsByIds/removeItemsByIds.d.ts

@@ -0,0 +1,5 @@
+import type { MultipleValue } from '../../../../types';
+/**
+ * Удаляет элементы из value по массиву id
+ */
+export declare const removeItemsByIds: <TValue extends MultipleValue = string[]>(value: TValue, idsToRemove: string[]) => TValue;

package/components/TreeLikeList/TreeItem/useLogic/utils/removeItemsByIds/removeItemsByIds.js

@@ -0,0 +1,11 @@
+import { getIdFromValue } from '../getIdFromValue';
+/**
+ * Удаляет элементы из value по массиву id
+ */
+export const removeItemsByIds = (value, idsToRemove) => {
+    if (!value || idsToRemove.length === 0) {
+        return value;
+    }
+    const idsSet = new Set(idsToRemove);
+    return value.filter((treeItem) => !idsSet.has(getIdFromValue(treeItem)));
+};

package/components/TreeLikeList/TreeLikeList.d.ts

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import { type TreeLikeListProps } from './types';
-export type { TreeLikeListProps };
-export declare const TreeLikeList: (props: TreeLikeListProps) => JSX.Element;
+import type { MultipleValue, TreeLikeListProps } from './types';
+export declare const TreeLikeList: <TValue extends MultipleValue = string[]>(props: TreeLikeListProps<TValue>) => JSX.Element;

package/components/TreeLikeList/TreeLikeList.js

@@ -6,5 +6,5 @@ const INITIAL_LEVEL = 0;
 export const TreeLikeList = (props) => {
     const { listProps, itemProps } = useLogic(props);
     const { data, className, expandedLevel = 10, disabledItems, ...restProps } = props;
-    return (_jsx(List, { className: className, ...listProps, children: data.map((item) => (_jsx(TreeItem, { ...item, level: INITIAL_LEVEL, expandedLevel: expandedLevel, ...itemProps, ...restProps }, item.id))) }));
+    return (_jsx(List, { className: className, ...listProps, children: data.map((item) => (_jsx(TreeItem, { item: item, level: INITIAL_LEVEL, expandedLevel: expandedLevel, ...itemProps, ...restProps }, item.id))) }));
 };

package/components/TreeLikeList/index.d.ts

@@ -1 +1,2 @@
 export * from './TreeLikeList';
+export type { TreeLikeListProps } from './types';

package/components/TreeLikeList/types.d.ts

@@ -1,15 +1,15 @@
 import { type FunctionComponent } from 'react';
 import type { TreeListData } from '../Tree';
-export type MultipleValue = string[] | undefined;
+export type MultipleValue = TreeListData[] | string[] | undefined;
 export type DisabledItemValue = string | {
     id: string;
     disabledReason?: string;
 };
-export type TreeLikeListProps = {
+export type TreeLikeListProps<TValue extends MultipleValue = string[]> = {
     /**
      * Выбранные значения
      */
-    value?: MultipleValue;
+    value?: TValue;
     /**
      * Данные, которые необходимо отобразить в виде дерева.
      */
@@ -43,5 +43,9 @@ export type TreeLikeListProps = {
     /**
      * Функция, которая запускается при изменении состояния.
      */
-    onChange: (value: MultipleValue) => void;
+    onChange: (value: TValue) => void;
+    /**
+     *  Переключает компонент в режим работы с объектами а не с id элементов
+     */
+    isObjectMode?: boolean;
 };

package/components/TreeLikeList/useLogic/useLogic.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
-import { type TreeLikeListProps } from '../TreeLikeList';
-type UseLogicParams = TreeLikeListProps;
-export declare const useLogic: ({ data, value, disabledItems }: UseLogicParams) => {
+import type { MultipleValue, TreeLikeListProps } from '../types';
+type UseLogicParams<TValue extends MultipleValue = string[]> = TreeLikeListProps<TValue>;
+export declare const useLogic: <TValue extends MultipleValue = string[]>({ data, value, disabledItems, }: UseLogicParams<TValue>) => {
     listProps: {
         ref: import("react").RefObject<HTMLUListElement>;
     };