@astral/ui 4.4.1 → 4.6.0

package/components/DataGrid/Head/Head.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo } from 'react';
 import { Checkbox } from '../../Checkbox';
 import { dataGridClassnames } from '../constants';
@@ -9,13 +9,14 @@ export const Head = (props) => {
     const { checkboxProps, handleSort } = useLogic(props);
     const { columns, gridColumns, isSelectable, sorting, onSelectAllRows, isHideSelectAll, } = props;
     const renderColumns = useMemo(() => {
-        return columns.map(({ field, label, sortable, align }, index) => {
+        return columns.map(({ field, label, sortable, align, columnHint }, index) => {
             const isFirstCell = !index;
             const startAdornmentRender = () => {
-                if (isHideSelectAll || !isFirstCell || !isSelectable) {
+                const showCheckbox = isFirstCell && isSelectable && !isHideSelectAll;
+                if (!showCheckbox && !columnHint) {
                     return null;
                 }
-                return (_jsx(CheckboxCell, { children: _jsx(Checkbox, { ...checkboxProps, onChange: onSelectAllRows }) }));
+                return (_jsxs(_Fragment, { children: [showCheckbox && (_jsx(CheckboxCell, { children: _jsx(Checkbox, { ...checkboxProps, onChange: onSelectAllRows }) })), columnHint] }));
             };
             return (_jsx(HeadCell, { sorting: sorting, field: field, label: label, isSortable: sortable, align: align, startAdornment: startAdornmentRender(), onSort: handleSort }, label));
         });

package/components/DataGrid/HeadCell/styles.js

@@ -1,3 +1,4 @@
+import { hintIconClassnames } from '../../HintIcon';
 import { styled } from '../../styles';
 import { alignToJustifyContent } from '../utils';
 export const Wrapper = styled('div', {
@@ -20,4 +21,8 @@ export const Wrapper = styled('div', {
     width: 16px;
     height: 16px;
   }
+
+  .${hintIconClassnames.iconWrapper}  {
+    margin-right: ${({ theme }) => theme.spacing(1)};
+  }
 `;

package/components/DataGrid/types.d.ts

@@ -223,6 +223,10 @@ export type DataGridColumns<TData extends Record<string, CellValue>> = {
      * Скрывает содержимое столбца от инструментов мониторинга
      */
     isHidePersonalData?: boolean;
+    /**
+     * Принимает компонент DataGridColumnHintIcon - подсказка в шапке колонки
+     */
+    columnHint?: ReactNode;
 };
 export type DataGridRowOptionColumns<TData extends Record<string, CellValue>> = {
     /**

package/components/DataGridColumnHintIcon/DataGridColumnHintIcon.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { type HintIconProps } from '../HintIcon';
+export type DataGridColumnHintIconProps = Omit<HintIconProps, 'renderIcon' | 'variant' | 'iconOption'>;
+export declare const DataGridColumnHintIcon: (props: DataGridColumnHintIconProps) => JSX.Element;

package/components/DataGridColumnHintIcon/DataGridColumnHintIcon.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { InfoOutlineSm } from '../../icons';
+import { HintIcon } from '../HintIcon';
+export const DataGridColumnHintIcon = (props) => {
+    return (_jsx(HintIcon, { renderIcon: () => _jsx(InfoOutlineSm, {}), variant: "info", ...props }));
+};

package/components/DataGridColumnHintIcon/index.d.ts

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

package/components/DataGridColumnHintIcon/index.js

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

package/components/HintIcon/HintIcon.d.ts

@@ -1,36 +1,3 @@
 /// <reference types="react" />
-import { type TooltipPlacement } from './types';
-export type HintIconProps = {
-    /**
-     * Определяет иконку отображения
-     */
-    variant: 'question' | 'info';
-    /**
-     * Опции для иконки
-     */
-    iconOption?: {
-        /**
-         * Определяет тип иконки
-         * @default fill
-         */
-        variant?: 'fill' | 'outline';
-        /**
-         * Определяет цвет иконки
-         * @default lightGrey
-         */
-        color?: 'warning' | 'grey' | 'lightGrey';
-    };
-    /**
-     *  Текст заголовка BottomDrawer
-     */
-    title: string;
-    /**
-     *  Текст тултипа или контента BottomDrawer
-     */
-    note: string;
-    /**
-     *  Положение тултипа
-     */
-    tooltipPlacement?: TooltipPlacement;
-};
-export declare const HintIcon: ({ variant, title, note, iconOption, tooltipPlacement, }: HintIconProps) => JSX.Element;
+import { type HintIconProps } from './types';
+export declare const HintIcon: ({ variant, title, note, iconOption, tooltipPlacement, renderIcon, }: HintIconProps) => JSX.Element;

package/components/HintIcon/HintIcon.js

@@ -3,7 +3,7 @@ import { BottomDrawer } from '../BottomDrawer';
 import { Icon } from './Icon';
 import { DrawerContent } from './styles';
 import { useLogic } from './useLogic';
-export const HintIcon = ({ variant, title, note, iconOption, tooltipPlacement = 'bottom', }) => {
+export const HintIcon = ({ variant, title, note, iconOption, tooltipPlacement = 'bottom', renderIcon, }) => {
     const { handleClose, handleOpen, open } = useLogic();
-    return (_jsxs(_Fragment, { children: [_jsx(Icon, { onClick: handleOpen, variant: variant, iconOption: iconOption, note: note, tooltipPlacement: tooltipPlacement }), _jsx(BottomDrawer, { title: title, open: open, onClose: handleClose, children: _jsx(DrawerContent, { children: note }) })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Icon, { onClick: handleOpen, variant: variant, iconOption: iconOption, note: note, tooltipPlacement: tooltipPlacement, renderIcon: renderIcon }), _jsx(BottomDrawer, { title: title, open: open, onClose: handleClose, children: _jsx(DrawerContent, { children: note }) })] }));
 };

package/components/HintIcon/Icon/Icon.d.ts

@@ -1,8 +1,7 @@
-/// <reference types="react" />
-import { type HintIconProps } from '../HintIcon';
-import type { TooltipPlacement } from '../types';
-export type IconProps = Pick<HintIconProps, 'variant' | 'iconOption' | 'note'> & {
-    onClick: () => void;
+import type { SyntheticEvent } from 'react';
+import type { HintIconProps, TooltipPlacement } from '../types';
+export type IconProps = Pick<HintIconProps, 'variant' | 'iconOption' | 'note' | 'renderIcon'> & {
+    onClick: (e: SyntheticEvent) => void;
     tooltipPlacement: TooltipPlacement;
 };
 export declare const Icon: (props: IconProps) => JSX.Element;

package/components/HintIcon/Icon/Icon.js

@@ -1,9 +1,10 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Tooltip } from '../../Tooltip';
+import { hintIconClassnames } from '../constants';
 import { IconWrapper } from './styles';
 import { useLogic } from './useLogic';
 export const Icon = (props) => {
     const { getIcon, iconColor } = useLogic(props);
     const { onClick, note, tooltipPlacement } = props;
-    return (_jsx(Tooltip, { title: note, placement: tooltipPlacement, children: _jsx(IconWrapper, { onClick: onClick, "$color": iconColor, children: getIcon() }) }));
+    return (_jsx(Tooltip, { title: note, placement: tooltipPlacement, children: _jsx(IconWrapper, { onClick: onClick, "$color": iconColor, className: hintIconClassnames.iconWrapper, children: getIcon() }) }));
 };

package/components/HintIcon/Icon/useLogic/hooks/useIconColor/useIconColor.d.ts

@@ -1,5 +1,7 @@
+import { type ReactNode } from 'react';
 type UseIconColorParams = {
     color?: 'warning' | 'grey' | 'lightGrey';
+    renderIcon?: () => ReactNode;
 };
-export declare const useIconColor: ({ color }: UseIconColorParams) => string;
+export declare const useIconColor: ({ color, renderIcon }: UseIconColorParams) => string;
 export {};

package/components/HintIcon/Icon/useLogic/hooks/useIconColor/useIconColor.js

@@ -1,11 +1,14 @@
 import { useTheme } from '../../../../../theme';
-export const useIconColor = ({ color }) => {
+export const useIconColor = ({ color, renderIcon }) => {
     const theme = useTheme();
     const colorMap = {
         warning: theme.palette.yellow[800],
         grey: theme.palette.grey[800],
         lightGrey: theme.palette.grey[400],
     };
+    if (renderIcon) {
+        return 'currentColor';
+    }
     if (color) {
         return colorMap[color];
     }

package/components/HintIcon/Icon/useLogic/useLogic.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
+import { type ReactNode } from 'react';
 import { type IconProps } from '../Icon';
 type UseLogicParams = IconProps;
-export declare const useLogic: ({ iconOption, variant }: UseLogicParams) => {
-    getIcon: () => JSX.Element;
+export declare const useLogic: ({ iconOption, variant, renderIcon, }: UseLogicParams) => {
+    getIcon: () => ReactNode;
     iconColor: string;
 };
 export {};

package/components/HintIcon/Icon/useLogic/useLogic.js

@@ -1,9 +1,12 @@
 import { ICONS } from '../../constants';
 import { useIconColor } from './hooks';
-export const useLogic = ({ iconOption, variant }) => {
-    const iconColor = useIconColor({ color: iconOption?.color });
+export const useLogic = ({ iconOption, variant, renderIcon, }) => {
+    const iconColor = useIconColor({ color: iconOption?.color, renderIcon });
     const { variant: iconOptionVariant = 'fill' } = iconOption || {};
     const getIcon = () => {
+        if (renderIcon) {
+            return renderIcon();
+        }
         const icon = ICONS[variant][iconOptionVariant];
         if (icon) {
             return icon;

package/components/HintIcon/constants.d.ts

@@ -1,4 +1,7 @@
 /// <reference types="react" />
+export declare const hintIconClassnames: {
+    iconWrapper: string;
+};
 export declare const ICONS: {
     question: {
         fill: JSX.Element;

package/components/HintIcon/constants.js

@@ -1,5 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { InfoFillMd, InfoOutlineMd, QuestionFillMd, QuestionOutlineMd, } from '../../icons';
+import { createUIKitClassname } from '../utils';
+export const hintIconClassnames = {
+    iconWrapper: createUIKitClassname('hint-icon__icon-wrapper'),
+};
 export const ICONS = {
     question: {
         fill: _jsx(QuestionFillMd, {}),

package/components/HintIcon/index.d.ts

@@ -1 +1,3 @@
 export * from './HintIcon';
+export type { HintIconProps } from './types';
+export { hintIconClassnames } from './constants';

package/components/HintIcon/index.js

@@ -1 +1,2 @@
 export * from './HintIcon';
+export { hintIconClassnames } from './constants';

package/components/HintIcon/styles.d.ts

@@ -3,9 +3,3 @@ export declare const DrawerContent: 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 IconWrapper: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
-} & {
-    $color: string;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/components/HintIcon/styles.js

@@ -2,10 +2,3 @@ import { styled } from '../styles';
 export const DrawerContent = styled.div `
   padding: ${({ theme }) => theme.spacing(5, 4)};
 `;
-export const IconWrapper = styled('div', {
-    shouldForwardProp: (prop) => !['$color'].includes(prop),
-}) `
-  display: flex;
-
-  color: ${({ $color }) => $color};
-`;

package/components/HintIcon/types.d.ts

@@ -1 +1,39 @@
+import { type ReactNode } from 'react';
 export type TooltipPlacement = 'left' | 'top' | 'right' | 'bottom';
+export type HintIconProps = {
+    /**
+     * Определяет иконку отображения
+     */
+    variant: 'question' | 'info';
+    /**
+     * Опции для иконки
+     */
+    iconOption?: {
+        /**
+         * Определяет тип иконки
+         * @default fill
+         */
+        variant?: 'fill' | 'outline';
+        /**
+         * Определяет цвет иконки
+         * @default lightGrey
+         */
+        color?: 'warning' | 'grey' | 'lightGrey';
+    };
+    /**
+     *  Текст заголовка BottomDrawer
+     */
+    title: string;
+    /**
+     *  Текст тултипа или контента BottomDrawer
+     */
+    note: string;
+    /**
+     *  Положение тултипа
+     */
+    tooltipPlacement?: TooltipPlacement;
+    /**
+     * Задание кастомной иконки
+     */
+    renderIcon?: () => ReactNode;
+};

package/components/HintIcon/useLogic/useLogic.d.ts

@@ -1,5 +1,6 @@
+import { type SyntheticEvent } from 'react';
 export declare const useLogic: () => {
     open: boolean;
-    handleOpen: () => void;
-    handleClose: () => void;
+    handleOpen: (e: SyntheticEvent) => void;
+    handleClose: (e: SyntheticEvent) => void;
 };

package/components/HintIcon/useLogic/useLogic.js

@@ -3,12 +3,14 @@ import { useViewportType } from '../../hooks';
 export const useLogic = () => {
     const [open, setOpen] = useState(false);
     const { isMobile } = useViewportType();
-    const handleOpen = () => {
+    const handleOpen = (e) => {
+        e.stopPropagation();
         if (isMobile) {
             setOpen((prevState) => !prevState);
         }
     };
-    const handleClose = () => {
+    const handleClose = (e) => {
+        e.stopPropagation();
         if (isMobile) {
             setOpen(false);
         }

package/components/Tree/MultipleTreeList/MultipleTreeList.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
-import { type MultipleTreeListProps } from './types';
+import { type MultipleTreeListProps, type MultipleValue } from './types';
 export type { MultipleTreeListProps };
-export declare const MultipleTreeList: ({ data, value, className, expandedLevel, disabledItems, ...props }: MultipleTreeListProps) => JSX.Element;
+export declare const MultipleTreeList: <TValue extends MultipleValue = string[]>({ data, value, className, expandedLevel, disabledItems, ...props }: MultipleTreeListProps<TValue>) => JSX.Element;

package/components/Tree/MultipleTreeList/MultipleTreeList.js

@@ -5,5 +5,5 @@ import { useLogic } from './useLogic';
 const INITIAL_LEVEL = 0;
 export const MultipleTreeList = ({ data, value, className, expandedLevel = 10, disabledItems, ...props }) => {
     const { formattedDisabledItems } = useLogic({ disabledItems });
-    return (_jsx(List, { className: className, children: data.map((item) => (_jsx(TreeItem, { value: value, ...item, level: INITIAL_LEVEL, expandedLevel: expandedLevel, disabledItems: formattedDisabledItems, ...props }, item.id))) }));
+    return (_jsx(List, { className: className, children: data.map((item) => (_jsx(TreeItem, { item: item, value: value, level: INITIAL_LEVEL, expandedLevel: expandedLevel, disabledItems: formattedDisabledItems, ...props }, item.id))) }));
 };

package/components/Tree/MultipleTreeList/TreeItem/TreeItem.d.ts

@@ -1,15 +1,16 @@
 import { type FunctionComponent } from 'react';
 import type { TreeListData } from '../../types';
 import type { MultipleValue } from '../types';
-type FormatDisableItem = {
+export type FormatDisableItem = {
     id: string;
     disabledReason?: string;
 };
-export type TreeItemProps = TreeListData & {
+export type TreeItemProps<TValue extends MultipleValue = string[]> = {
+    item: TreeListData;
     /**
      * Выбранные значения
      */
-    value?: MultipleValue;
+    value?: TValue;
     /**
      * Render-props, позволяет более гибко настраивать содержимое item
      */
@@ -34,7 +35,10 @@ export type TreeItemProps = TreeListData & {
     /**
      * Функция, которая запускается при выборе item
      */
-    onChange: (value: MultipleValue) => void;
+    onChange: (value: TValue) => void;
+    /**
+     *  Переключает компонент в режим работы с объектами а не с id элементов
+     */
+    isObjectMode?: boolean;
 };
-export declare const TreeItem: (props: TreeItemProps) => JSX.Element;
-export {};
+export declare const TreeItem: <TValue extends MultipleValue = string[]>(props: TreeItemProps<TValue>) => JSX.Element;

package/components/Tree/MultipleTreeList/TreeItem/TreeItem.js

@@ -4,12 +4,13 @@ import { List, StyledCheckbox, StyledTreeItem } from './styles';
 import { useLogic } from './useLogic';
 export const TreeItem = (props) => {
     const { isSelected, isIndeterminate, isDefaultExpanded, disabledReason, isDisabled, handleChange, } = useLogic(props);
-    const { id, label, note, level, renderItem, children = [], value, isInitialExpanded, expandedLevel, disabledItems, options, onChange, } = props;
+    const { level, renderItem, value, isInitialExpanded, expandedLevel, disabledItems, onChange, item, isObjectMode, } = props;
+    const { id, label, note, children = [], options } = item;
     const handleClick = (event) => {
         event.stopPropagation();
     };
     if (children.length) {
-        return (_jsx(StyledTreeItem, { isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected, indeterminate: isSelected ? false : isIndeterminate }), label: renderItem ? renderItem({ label, note, id }) : label, disabled: isDisabled, onChange: handleChange, onClick: handleClick }), level: level, onClick: handleChange, children: _jsx(List, { children: children.map((child) => (_jsx(TreeItem, { ...child, renderItem: renderItem, level: level + 1, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, disabledItems: disabledItems, value: value, onChange: onChange }, child.id))) }) }));
+        return (_jsx(StyledTreeItem, { isSelected: isSelected, isDefaultExpanded: isDefaultExpanded, isForceExpanded: options?.isForceExpanded, isDisabled: isDisabled, disabledReason: disabledReason, note: renderItem ? null : note, component: "li", label: _jsx(FormControlLabel, { control: _jsx(StyledCheckbox, { checked: isSelected, indeterminate: isSelected ? false : isIndeterminate }), label: renderItem ? renderItem({ label, note, id }) : label, disabled: isDisabled, onChange: handleChange, onClick: handleClick }), level: level, onClick: handleChange, children: _jsx(List, { children: children.map((child) => (_jsx(TreeItem, { item: child, renderItem: renderItem, level: level + 1, isInitialExpanded: isInitialExpanded, expandedLevel: expandedLevel, disabledItems: disabledItems, value: value, onChange: onChange, isObjectMode: isObjectMode }, child.id))) }) }));
     }
     return (_jsx(StyledTreeItem, { 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, disabled: isDisabled, onChange: handleChange, onClick: handleClick }), level: level, onClick: handleChange }));
 };

package/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.d.ts

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/useLogic.js

@@ -1,38 +1,44 @@
 import { useEffect, useMemo } from 'react';
-import { checkIsIndeterminate, checkIsSelected, getAllChildrenId, } from './utils';
-export const useLogic = ({ id, value = [], children, level, isInitialExpanded, expandedLevel, disabledItems, onChange, }) => {
+import { checkIsIndeterminate, checkIsSelected, getAllChildrenId, getIdFromValue, getItemsToAdd, } from './utils';
+export const useLogic = ({ item, value = [], level, isInitialExpanded, expandedLevel, disabledItems, onChange, isObjectMode, }) => {
+    const { id, children } = item;
     const childrenIds = useMemo(() => getAllChildrenId(children, disabledItems), [children, disabledItems]);
     const isSelected = checkIsSelected(value, id);
     const isIndeterminate = checkIsIndeterminate(value, childrenIds);
     const isDefaultExpanded = 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;
     useEffect(() => {
         if (!childrenIds.length) {
             return undefined;
         }
-        const isEveryChildChecked = childrenIds.every((childrenId) => value?.includes(childrenId));
+        const isEveryChildChecked = childrenIds.every((childrenId) => value?.some((treeItem) => getIdFromValue(treeItem) === childrenId));
         if (!isSelected && isEveryChildChecked) {
-            onChange([...value, id]);
+            const addItem = isObjectMode ? item : id;
+            const newValue = value ? [...value, addItem] : [addItem];
+            onChange(newValue);
         }
         if (isSelected && !isEveryChildChecked) {
-            onChange(value.filter((selectedId) => selectedId !== id));
+            const removeItem = value?.filter((selectedItem) => getIdFromValue(selectedItem) !== id);
+            onChange(removeItem);
         }
-    }, [value, childrenIds]);
+    }, [value, childrenIds, isSelected]);
     const handleChange = () => {
-        if (children) {
-            if (value.includes(id)) {
-                return onChange(value.filter((selectedId) => ![id, ...childrenIds].includes(selectedId)));
-            }
-            onChange([...value, id, ...childrenIds]);
-        }
-        else {
-            if (value.includes(id)) {
-                return onChange(value.filter((selectedId) => selectedId !== id));
-            }
-            onChange([...value, id]);
+        const isValueIncludesId = value?.some((treeItem) => getIdFromValue(treeItem) === id);
+        if (isValueIncludesId) {
+            // Удаление элемента и всех его дочерних элементов
+            const idsToRemove = children ? [id, ...childrenIds] : [id];
+            const filteredValue = value?.filter((selectedItem) => {
+                const selectedId = getIdFromValue(selectedItem);
+                return !idsToRemove.includes(selectedId);
+            });
+            return onChange(filteredValue);
         }
+        // Добавление элемента и всех его дочерних элементов
+        const itemsToAdd = getItemsToAdd(item, children, childrenIds, isObjectMode);
+        const newValue = value ? [...value, ...itemsToAdd] : itemsToAdd;
+        onChange(newValue);
     };
     return {
         isSelected,

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/checkIsIndeterminate/checkIsIndeterminate.d.ts

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/checkIsIndeterminate/checkIsIndeterminate.js

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

package/components/Tree/MultipleTreeList/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/Tree/MultipleTreeList/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/Tree/MultipleTreeList/TreeItem/useLogic/utils/findObjectsByIds/findObjectsByIds.d.ts

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

package/components/Tree/MultipleTreeList/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/Tree/MultipleTreeList/TreeItem/useLogic/utils/findObjectsByIds/index.d.ts

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/findObjectsByIds/index.js

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getIdFromValue/getIdFromValue.d.ts

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

package/components/Tree/MultipleTreeList/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/Tree/MultipleTreeList/TreeItem/useLogic/utils/getIdFromValue/index.d.ts

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getIdFromValue/index.js

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getItemsToAdd/getItemsToAdd.d.ts

@@ -0,0 +1,5 @@
+import type { TreeListData } from '../../../../../types';
+/**
+ * Формирует массив элементов для добавления в зависимости от режима работы
+ */
+export declare const getItemsToAdd: (item: TreeListData, children: TreeListData[] | undefined, childrenIds: string[], isObjectMode: boolean | undefined) => (string | TreeListData)[];

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getItemsToAdd/getItemsToAdd.js

@@ -0,0 +1,14 @@
+import { findObjectsByIds } from '../findObjectsByIds';
+/**
+ * Формирует массив элементов для добавления в зависимости от режима работы
+ */
+export const getItemsToAdd = (item, children, childrenIds, isObjectMode) => {
+    if (!children) {
+        return isObjectMode ? [item] : [item.id];
+    }
+    if (isObjectMode) {
+        const childrenObjects = findObjectsByIds(children, childrenIds);
+        return [item, ...childrenObjects];
+    }
+    return [item.id, ...childrenIds];
+};

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getItemsToAdd/index.d.ts

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/getItemsToAdd/index.js

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

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/index.d.ts

@@ -1,3 +1,6 @@
 export { checkIsIndeterminate } from './checkIsIndeterminate';
 export { checkIsSelected } from './checkIsSelected';
 export { getAllChildrenId } from './getAllChildrenId';
+export { findObjectsByIds } from './findObjectsByIds';
+export { getIdFromValue } from './getIdFromValue';
+export { getItemsToAdd } from './getItemsToAdd';

package/components/Tree/MultipleTreeList/TreeItem/useLogic/utils/index.js

@@ -1,3 +1,6 @@
 export { checkIsIndeterminate } from './checkIsIndeterminate';
 export { checkIsSelected } from './checkIsSelected';
 export { getAllChildrenId } from './getAllChildrenId';
+export { findObjectsByIds } from './findObjectsByIds';
+export { getIdFromValue } from './getIdFromValue';
+export { getItemsToAdd } from './getItemsToAdd';