@antscorp/antsomi-ui 1.3.5-beta.700 → 1.3.5-beta.703

package/es/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { Dayjs } from 'dayjs';
 import { TAdvancedType, TCalculationType, TOperatorKey, TOption, TShowCalculationTypeCondition, ValueTypes } from './types';
 export interface AdvancedPickerProps {
     label?: string;
@@ -24,16 +25,25 @@ export interface AdvancedPickerProps {
     isViewMode?: boolean;
     /**
      *
-     * @example const disabledTime = {
-        disabledHours: range(0, 24).splice(4, 20),
-        disabledMinutes: range(30, 60),
-        disabledSeconds: [55, 56],
+     * @example const disabledTime = (date?: Dayjs) => {
+        if (date?.get('date') !== 31)
+          return {
+            disabledHours: () => [],
+            disabledMinutes: () => [],
+            disabledSeconds: () => [],
+          };
+  
+        return {
+          disabledHours: () => range(0, 24).splice(4, 20),
+          disabledMinutes: () => range(30, 60),
+          disabledSeconds: () => [55, 56],
+        };
       };
      */
-    disabledTime?: {
-        disabledHours: number[];
-        disabledMinutes: number[];
-        disabledSeconds: number[];
+    disabledTime?: (date?: Dayjs) => {
+        disabledHours: () => number[];
+        disabledMinutes: () => number[];
+        disabledSeconds: () => number[];
     };
     /**
      * Only show fixed calendar (hide dynamic and )

package/es/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.js

@@ -24,12 +24,12 @@ import { DatePickerCustomInput, DatePickerHeader, DropdownContent, DropdownHeade
 import { CALCULATION_DATES, CALCULATION_TYPES, DATE_TYPES, DEFAULT_DATE_FORMAT, VALUE_TYPES, ADVANCED_PICKER_TYPE, WEEK_ARR, QUARTER_PLACEHOLDER, WEEK_PLACEHOLDER, DAY_LABEL_SHORT, MONTH_LABEL_FULL, DAY_OF_MONTH, ANCHOR_LEAP_YEAR, GRANULARITY_MAPPING, } from './constants';
 import { globalToken, THEME } from '@antscorp/antsomi-ui/es/constants';
 import { useOutsideClick } from '@antscorp/antsomi-ui/es/hooks/useOutsideClick';
-const isDisabledSpecificTime = (current, info, disabledTime) => {
+const isDisabledSpecificTime = (current, info, disabledTime, date) => {
     if (info.type !== 'time' || typeof current !== 'number' || !disabledTime)
         return false;
-    const isDisabledHour = info.subType === 'hour' && disabledTime.disabledHours.includes(current);
-    const isDisabledMinute = info.subType === 'minute' && disabledTime.disabledMinutes.includes(current);
-    const isDisabledSecond = info.subType === 'second' && disabledTime.disabledSeconds.includes(current);
+    const isDisabledHour = info.subType === 'hour' && disabledTime(date).disabledHours().includes(current);
+    const isDisabledMinute = info.subType === 'minute' && disabledTime(date).disabledMinutes().includes(current);
+    const isDisabledSecond = info.subType === 'second' && disabledTime(date).disabledSeconds().includes(current);
     return isDisabledHour || isDisabledMinute || isDisabledSecond;
 };
 const PATH = '@antscorp/antsomi-ui/es/components/molecules/DatePicker/components/Advanced/DatePickerAdvanced.tsx';
@@ -351,7 +351,7 @@ export const AdvancedPicker = props => {
             renderDropdownFooter()));
     };
     const cellRender = useCallback((current, info) => {
-        const isDisabledTime = isDisabledSpecificTime(current, info, disabledTime);
+        const isDisabledTime = isDisabledSpecificTime(current, info, disabledTime, dayjs(date));
         return (React.createElement("div", { className: "antsomi-picker-cell-inner", style: Object.assign({ pointerEvents: 'all', width: '100%' }, (isDisabledTime
                 ? {
                     color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.colorTextDisabled,

package/es/components/molecules/MatchAnySelect/MatchesAnySelect.js

@@ -15,8 +15,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { ConfigProvider } from 'antd';
 import clsx from 'clsx';
 import { isEmpty, uniqBy } from 'lodash';
-import React, { useEffect, useState } from 'react';
-import deepmerge from 'deepmerge';
+import React, { useCallback, useEffect, useState } from 'react';
 // Components
 import { Button, Flex, Icon, Input, Popover, Spin, Tooltip, Typography, } from '@antscorp/antsomi-ui/es/components/atoms';
 import { EmptyData, PopoverSelect, Select } from '@antscorp/antsomi-ui/es/components/molecules';
@@ -42,17 +41,18 @@ const initialState = {
 const matchesAnyInitialState = {
     searchValue: '',
     selectedItems: [],
+    selectedTreeData: [],
     isShowLoadMoreEl: false,
 };
 const { t } = i18nInstance;
 const { Text } = Typography;
 export function MatchesAny(props) {
     // Props
-    const { objectName, loading = false, showExtendValue = true, items, groupSelectProps, renderExtraValues, customItemRenders, listEmptyProps, selectedListEmptyProps, selectedTreeData: selectedTreeDataProp, onSelectedTreeDataChange = () => { }, onApply = () => { }, onCancel = () => { }, onLoadMore = () => { }, onChangeSearch } = props, restOfProps = __rest(props, ["objectName", "loading", "showExtendValue", "items", "groupSelectProps", "renderExtraValues", "customItemRenders", "listEmptyProps", "selectedListEmptyProps", "selectedTreeData", "onSelectedTreeDataChange", "onApply", "onCancel", "onLoadMore", "onChangeSearch"]);
+    const { objectName, loading = false, showExtendValue = true, selectedItems: selectedItemsProp, items, groupSelectProps, renderExtraValues, customItemRenders, listEmptyProps, selectedListEmptyProps, selectedTreeData: selectedTreeDataProp, onApply = () => { }, onCancel = () => { }, onLoadMore = () => { }, onChangeSearch } = props, restOfProps = __rest(props, ["objectName", "loading", "showExtendValue", "selectedItems", "items", "groupSelectProps", "renderExtraValues", "customItemRenders", "listEmptyProps", "selectedListEmptyProps", "selectedTreeData", "onApply", "onCancel", "onLoadMore", "onChangeSearch"]);
     // State
     const [state, setState] = useState(matchesAnyInitialState);
     // Variables
-    const { searchValue, selectedItems, isShowLoadMoreEl } = state;
+    const { searchValue, selectedItems, selectedTreeData, isShowLoadMoreEl } = state;
     const _a = listEmptyProps || {}, { icon: listEmptyIcon, description: listEmptyDescription = t(translations.global.noResultsMatchesKeyWord).toString() } = _a, restListEmptyProps = __rest(_a, ["icon", "description"]);
     const _b = selectedListEmptyProps || {}, { description: selectedListEmptyDescription = t(translations.global.selectItemsFromList).toString(), icon: selectedListEmptyIcon = React.createElement(DataIcon, { color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw5, size: 48 }) } = _b, restSelectedListEmptyProps = __rest(_b, ["description", "icon"]);
     // Refs
@@ -70,8 +70,8 @@ export function MatchesAny(props) {
      * Updates the `selectedItems` state when the `selectedItems` prop changes.
      */
     useDeepCompareEffect(() => {
-        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: props.selectedItems })));
-    }, [props.selectedItems]);
+        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: selectedItemsProp })));
+    }, [selectedItemsProp]);
     useEffect(() => {
         // Delay for show load more el
         setTimeout(() => {
@@ -79,23 +79,11 @@ export function MatchesAny(props) {
         }, 500);
     }, []);
     useDeepCompareEffect(() => {
-        const selectedTreeData = getSelectedTreeData(items || [], selectedItems || [], selectedTreeDataProp || []);
-        if (!isEmpty(selectedTreeData)) {
-            onSelectedTreeDataChange(selectedTreeData);
+        if (!isEmpty(selectedTreeDataProp)) {
+            setState(prev => (Object.assign(Object.assign({}, prev), { selectedTreeData: selectedTreeDataProp })));
         }
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [items, selectedItems]);
+    }, [selectedTreeDataProp]);
     // Handlers
-    /**
-     * Adds an item and, if applicable, its leaf descendants to the list of selected items.
-     *
-     * If the item has children, the function flattens the tree structure and adds only the leaf nodes
-     * (nodes without children) to the selected items list. If the item does not have children, it adds
-     * the item directly to the selected items list.
-     *
-     * @param {MatchesAnyItem} item - The item to be added to the selected items list.
-     *                              This item can have children.
-     */
     const onSelectItem = (item) => {
         let newSelectedItems = [...(selectedItems || [])];
         if (item.children) {
@@ -105,7 +93,8 @@ export function MatchesAny(props) {
         else {
             newSelectedItems = newSelectedItems.concat(item);
         }
-        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: newSelectedItems })));
+        const newSelectedTreeData = getSelectedTreeData(items || [], newSelectedItems || [], selectedTreeData || []);
+        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: newSelectedItems, selectedTreeData: newSelectedTreeData })));
     };
     /**
      * Removes an item and its descendants from the list of selected items.
@@ -115,38 +104,38 @@ export function MatchesAny(props) {
      *
      */
     const onRemoveItem = (item) => {
-        setState(prev => {
-            var _a;
-            return (Object.assign(Object.assign({}, prev), { selectedItems: (_a = prev.selectedItems) === null || _a === void 0 ? void 0 : _a.filter(selectedItem => {
-                    if (item.children) {
-                        const flattenChild = flatTree(item.children, 'children');
-                        return (selectedItem.key !== item.key &&
-                            !(flattenChild === null || flattenChild === void 0 ? void 0 : flattenChild.some(item => item.key === selectedItem.key)));
-                    }
-                    return selectedItem.key !== item.key;
-                }) }));
+        const newSelectedItems = selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(selectedItem => {
+            if (item.children) {
+                const flattenChild = flatTree(item.children, 'children');
+                return (selectedItem.key !== item.key &&
+                    !(flattenChild === null || flattenChild === void 0 ? void 0 : flattenChild.some(item => item.key === selectedItem.key)));
+            }
+            return selectedItem.key !== item.key;
         });
+        const newSelectedTreeData = getSelectedTreeData(items || [], newSelectedItems || [], selectedTreeData || []);
+        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: newSelectedItems, selectedTreeData: newSelectedTreeData })));
     };
     const onSelectAll = () => {
         const flattenTreeData = flatTree(items, 'children').filter(item => !item.children &&
             !(selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.some(selectedItem => selectedItem.key === item.key || selectedItem.title === item.title)));
-        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: uniqBy([...(prev.selectedItems || []), ...flattenTreeData], 'key') })));
+        const newSelectedItems = uniqBy([...(state.selectedItems || []), ...flattenTreeData], 'key');
+        const newSelectedTreeData = getSelectedTreeData(items || [], newSelectedItems || [], selectedTreeData);
+        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: newSelectedItems, selectedTreeData: newSelectedTreeData })));
     };
     const onRemoveAll = () => {
-        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: [] })));
+        setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: [], selectedTreeData: [] })));
     };
     const onClickApply = () => {
-        const selectedTreeData = getSelectedTreeData(items || [], selectedItems || [], selectedTreeDataProp || []);
-        onApply(selectedItems || [], selectedTreeData);
+        onApply(selectedItems || [], selectedTreeData || []);
     };
-    const renderItemError = (item) => {
+    const renderItemError = useCallback((item) => {
         if (customItemRenders === null || customItemRenders === void 0 ? void 0 : customItemRenders.error) {
             return customItemRenders === null || customItemRenders === void 0 ? void 0 : customItemRenders.error(item);
         }
         return item.error ? (React.createElement(Tooltip, { title: item.error },
             React.createElement(WarningIcon, { size: 16 }))) : null;
-    };
-    const renderItemNodeTitle = ({ item, mode = 'unselect', onSelectItem, onRemoveItem, }) => {
+    }, [customItemRenders]);
+    const renderItemNodeTitle = useCallback(({ item, mode = 'unselect', onSelectItem, onRemoveItem, }) => {
         var _a, _b;
         const { isExtendValue, title, subTitle } = item; // Destructure properties from item
         return (React.createElement(React.Fragment, null,
@@ -176,7 +165,7 @@ export function MatchesAny(props) {
                         }
                     } },
                     React.createElement(Icon, { type: `icon-ants-${onSelectItem ? 'double-arrow-up' : 'remove-slim'}`, size: 11 })))));
-    };
+    }, [customItemRenders, renderExtraValues, renderItemError]);
     // Memos
     const { treeData, matchedParents } = useDeepCompareMemo(() => {
         var _a;
@@ -201,10 +190,7 @@ export function MatchesAny(props) {
                     (selectedItem.isExtendValue && selectedItem.title === item.title)))
                 : selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.some(selectedItem => selectedItem.key === item.key ||
                     (selectedItem.isExtendValue && selectedItem.title === item.title));
-            return Object.assign(Object.assign(Object.assign({}, item), { title: renderItemNodeTitle({
-                    item,
-                    onSelectItem,
-                }), disabled: isSelected }), (item.children && {
+            return Object.assign(Object.assign(Object.assign({}, item), { disabled: isSelected }), (item.children && {
                 children: serializeTreeData(item.children),
             }));
         });
@@ -216,38 +202,6 @@ export function MatchesAny(props) {
         return { treeData, matchedParents };
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [items, searchValue, selectedItems, groupSelectProps, onChangeSearch]);
-    // const selectedTreeData = useDeepCompareMemo(() => [], [items, selectedItems]);
-    const selectedTreeData = useDeepCompareMemo(() => {
-        var _a;
-        const notExtendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => !item.isExtendValue)) || [];
-        const extendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => item.isExtendValue)) || [];
-        const serializeTreeData = (list) => {
-            var _a;
-            return ((_a = list
-                .filter(item => {
-                /**
-                 * Checks if the given item or any of its descendants are selected.
-                 *
-                 * If the item has children, it flattens the children tree structure and checks if any node is selected.
-                 * If the item does not have children, it directly checks if the item is in the selected items list.
-                 *
-                 */
-                const isSelected = item.children
-                    ? flatTree(item.children, 'children').some(item => notExtendValueSelectedItems === null || notExtendValueSelectedItems === void 0 ? void 0 : notExtendValueSelectedItems.some(selectedItem => selectedItem.key === item.key))
-                    : notExtendValueSelectedItems === null || notExtendValueSelectedItems === void 0 ? void 0 : notExtendValueSelectedItems.some(selectedItem => selectedItem.key === item.key);
-                return isSelected;
-            })) === null || _a === void 0 ? void 0 : _a.map(item => (Object.assign(Object.assign(Object.assign(Object.assign({}, item), { title: renderItemNodeTitle({ item, mode: 'select', onRemoveItem }) }), (item.children && {
-                children: serializeTreeData(item.children),
-            })), (!!item.error && { className: 'error-node' }))))) || [];
-        };
-        const mergeItems = deepmerge(selectedTreeDataProp || [], items || [], {
-            arrayMerge(target, source) {
-                return uniqBy([...target, ...source], 'key');
-            },
-        });
-        return serializeTreeData(mergeItems).concat(((_a = [...extendValueSelectedItems]) === null || _a === void 0 ? void 0 : _a.map(item => (Object.assign(Object.assign({}, item), { title: renderItemNodeTitle({ item, mode: 'select', onRemoveItem }) })))) || []);
-        // eslint-disable-next-line react-hooks/exhaustive-deps
-    }, [items, selectedItems, selectedTreeDataProp]);
     const isDisableRemoveAll = useDeepCompareMemo(() => !(selectedTreeData === null || selectedTreeData === void 0 ? void 0 : selectedTreeData.length), [selectedTreeData]);
     const isDisableSelectAll = useDeepCompareMemo(() => {
         const flattenTreeData = flatTree(treeData, 'children');
@@ -290,14 +244,21 @@ export function MatchesAny(props) {
                             : items === null || items === void 0 ? void 0 : items.map(item => item.key), selectable: false, treeData: treeData, switcherIcon: props => (React.createElement(Icon, { type: "icon-ants-caret-down", style: {
                                 transform: props.expanded ? 'rotate(0)' : 'rotate(-90deg)',
                                 transition: 'transform 0.3s ease',
-                            }, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 })), height: 396 }),
+                            }, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 })), titleRender: item => renderItemNodeTitle({
+                            item: item,
+                            onSelectItem,
+                        }), height: 396 }),
                     isShowLoadMoreEl && React.createElement("div", { ref: loadMoreRef }))) : (React.createElement(EmptyData, Object.assign({ icon: listEmptyIcon, showIcon: !!listEmptyIcon, description: listEmptyDescription }, restListEmptyProps)))))));
     };
     const renderSelectedList = () => (React.createElement("div", { className: "matches-any__section" },
         React.createElement(Flex, { className: "matches-any__header", justify: "space-between" },
             React.createElement(Text, { strong: true }, `${t(translations.global.selected)} (${(selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.length) || 0})`),
             React.createElement(TextButton, { disabled: isDisableRemoveAll, onClick: onRemoveAll }, t(translations.global.removeAll).toString())),
-        React.createElement("div", { className: "matches-any__body" }, !(selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.length) ? (React.createElement(EmptyData, Object.assign({ icon: selectedListEmptyIcon, description: selectedListEmptyDescription }, restSelectedListEmptyProps))) : (React.createElement(StyledTree, { defaultExpandedKeys: selectedTreeData === null || selectedTreeData === void 0 ? void 0 : selectedTreeData.map(item => item.key), selectable: false, treeData: selectedTreeData, height: 420, switcherIcon: props => (React.createElement(Icon, { type: "icon-ants-caret-down", style: {
+        React.createElement("div", { className: "matches-any__body" }, !(selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.length) ? (React.createElement(EmptyData, Object.assign({ icon: selectedListEmptyIcon, description: selectedListEmptyDescription }, restSelectedListEmptyProps))) : (React.createElement(StyledTree, { defaultExpandedKeys: selectedTreeData === null || selectedTreeData === void 0 ? void 0 : selectedTreeData.map(item => item.key), selectable: false, treeData: selectedTreeData, titleRender: item => renderItemNodeTitle({
+                item: item,
+                mode: 'select',
+                onRemoveItem,
+            }), height: 420, switcherIcon: props => (React.createElement(Icon, { type: "icon-ants-caret-down", style: {
                     transform: props.expanded ? 'rotate(0)' : 'rotate(-90deg)',
                     transition: 'transform 0.3s ease',
                 }, color: globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8 })) })))));
@@ -308,12 +269,16 @@ export function MatchesAny(props) {
         // If there are available values to add
         if (availableExtendValues) {
             // Create new items in the format required (MatchesAnyItem)
-            const newSelectedItems = availableExtendValues.map(value => ({
-                key: value,
-                title: value,
-                isExtendValue: true, // Flag to indicate that this item is an extend value
-            }));
-            setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: [...(selectedItems || []), ...newSelectedItems] })));
+            const newSelectedItems = [
+                ...(selectedItems || []),
+                ...availableExtendValues.map(value => ({
+                    key: value,
+                    title: value,
+                    isExtendValue: true, // Flag to indicate that this item is an extend value
+                })),
+            ];
+            const newSelectedTreeData = getSelectedTreeData(items || [], newSelectedItems || [], selectedTreeData || []);
+            setState(prev => (Object.assign(Object.assign({}, prev), { selectedItems: newSelectedItems, selectedTreeData: newSelectedTreeData })));
         }
     };
     return (React.createElement(ConfigProvider, { theme: MATCHES_ANY_THEME },
@@ -330,7 +295,7 @@ export function MatchesAny(props) {
 }
 export function MatchesAnySelect(props) {
     var _a, _b, _c;
-    const { placeholder = 'Select an item', dropdownStyle, objectName, selectedItems, items, loading, popupClassName, groupSelectProps, renderExtraValues, customItemRenders, popoverProps, listEmptyProps, selectedListEmptyProps, selectedTreeData, onChangeSearch, onChange = () => { }, onSelectedTreeDataChange, onLoadMore } = props, restProps = __rest(props, ["placeholder", "dropdownStyle", "objectName", "selectedItems", "items", "loading", "popupClassName", "groupSelectProps", "renderExtraValues", "customItemRenders", "popoverProps", "listEmptyProps", "selectedListEmptyProps", "selectedTreeData", "onChangeSearch", "onChange", "onSelectedTreeDataChange", "onLoadMore"]);
+    const { placeholder = 'Select an item', dropdownStyle, objectName, selectedItems, items, loading, popupClassName, groupSelectProps, renderExtraValues, customItemRenders, popoverProps, listEmptyProps, selectedListEmptyProps, selectedTreeData, onChangeSearch, onChange = () => { }, onLoadMore } = props, restProps = __rest(props, ["placeholder", "dropdownStyle", "objectName", "selectedItems", "items", "loading", "popupClassName", "groupSelectProps", "renderExtraValues", "customItemRenders", "popoverProps", "listEmptyProps", "selectedListEmptyProps", "selectedTreeData", "onChangeSearch", "onChange", "onLoadMore"]);
     // State
     const [state, setState] = useState(initialState);
     // Variables
@@ -343,7 +308,7 @@ export function MatchesAnySelect(props) {
         onChange(selectedItems, selectedTreeData);
         setState(prev => (Object.assign(Object.assign({}, prev), { isOpenPopover: false })));
     };
-    return (React.createElement(Popover, Object.assign({ open: isOpenPopover, arrow: false, placement: "bottomLeft", content: React.createElement(MatchesAny, { className: popupClassName, items: items, selectedItems: selectedItems, loading: loading, objectName: objectName, groupSelectProps: groupSelectProps, renderExtraValues: renderExtraValues, customItemRenders: customItemRenders, listEmptyProps: listEmptyProps, selectedListEmptyProps: selectedListEmptyProps, selectedTreeData: selectedTreeData, onChangeSearch: onChangeSearch, onApply: onApplyMatchesAny, onCancel: () => setState(prev => (Object.assign(Object.assign({}, prev), { isOpenPopover: false }))), onLoadMore: onLoadMore, onSelectedTreeDataChange: onSelectedTreeDataChange }), align: {
+    return (React.createElement(Popover, Object.assign({ open: isOpenPopover, arrow: false, placement: "bottomLeft", content: React.createElement(MatchesAny, { className: popupClassName, items: items, selectedItems: selectedItems, loading: loading, objectName: objectName, groupSelectProps: groupSelectProps, renderExtraValues: renderExtraValues, customItemRenders: customItemRenders, listEmptyProps: listEmptyProps, selectedListEmptyProps: selectedListEmptyProps, selectedTreeData: selectedTreeData, onChangeSearch: onChangeSearch, onApply: onApplyMatchesAny, onCancel: () => setState(prev => (Object.assign(Object.assign({}, prev), { isOpenPopover: false }))), onLoadMore: onLoadMore }), align: {
             overflow: {
                 shiftY: 0,
                 shiftX: 0,

package/es/components/molecules/MatchAnySelect/types.d.ts

@@ -50,8 +50,6 @@ export interface MatchesAnySelectProps<TItem = any> extends Omit<SelectProps, 'o
     listEmptyProps?: EmptyDataProps;
     /** Empty UI for selected list items */
     selectedListEmptyProps?: EmptyDataProps;
-    /** Callback function when selectedTreeData change */
-    onSelectedTreeDataChange?: (selectedTreeData: MatchesAnyItem<TItem>[]) => void;
     /** Callback function that is called when the selected items change. */
     onChange?: (selectedItems: MatchesAnyItem<TItem>[], selectedTreeData?: MatchesAnyItem<TItem>[]) => void;
     /** Callback function that is called when the search value changes */
@@ -59,7 +57,7 @@ export interface MatchesAnySelectProps<TItem = any> extends Omit<SelectProps, 'o
     /** Callback function that is called when the user scroll */
     onLoadMore?: () => void;
 }
-export interface MatchesAnyProps<TItem = any> extends Omit<FlexProps, 'children'>, Pick<MatchesAnySelectProps<TItem>, 'objectName' | 'loading' | 'showExtendValue' | 'items' | 'selectedItems' | 'onLoadMore' | 'groupSelectProps' | 'onChangeSearch' | 'renderExtraValues' | 'customItemRenders' | 'listEmptyProps' | 'selectedListEmptyProps' | 'selectedTreeData' | 'onSelectedTreeDataChange'> {
+export interface MatchesAnyProps<TItem = any> extends Omit<FlexProps, 'children'>, Pick<MatchesAnySelectProps<TItem>, 'objectName' | 'loading' | 'showExtendValue' | 'items' | 'selectedItems' | 'onLoadMore' | 'groupSelectProps' | 'onChangeSearch' | 'renderExtraValues' | 'customItemRenders' | 'listEmptyProps' | 'selectedListEmptyProps' | 'selectedTreeData'> {
     /**
      * Callback function that is called when the apply action is triggered.
      *

package/es/components/molecules/MatchAnySelect/utils.js

@@ -1,8 +1,18 @@
-// Types
+// Libraries
 import deepmerge from 'deepmerge';
 // Utils
 import { flatTree } from '@antscorp/antsomi-ui/es/utils';
-import { uniqBy } from 'lodash';
+const customMergeTreeData = (key) => (target, source) => {
+    const merged = target.map(item => {
+        const found = source.find(s => s[key] === item[key]);
+        if (found) {
+            return deepmerge(found, item, { arrayMerge: customMergeTreeData(key) });
+        }
+        return item;
+    });
+    const newItems = source.filter(s => !target.some(t => t[key] === s[key]));
+    return [...merged, ...newItems];
+};
 export const getSelectedTreeData = (items, selectedItems, selectedTreeData = []) => {
     const notExtendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => !item.isExtendValue)) || [];
     const extendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => item.isExtendValue)) || [];
@@ -26,9 +36,7 @@ export const getSelectedTreeData = (items, selectedItems, selectedTreeData = [])
         }))))) || [];
     };
     const mergeItems = deepmerge(selectedTreeData || [], items || [], {
-        arrayMerge(target, source) {
-            return uniqBy([...target, ...source], 'key');
-        },
+        arrayMerge: customMergeTreeData('key'),
     });
     return serializeTreeData(mergeItems).concat(extendValueSelectedItems);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.3.5-beta.700",
+  "version": "1.3.5-beta.703",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",