@antscorp/antsomi-ui 2.0.39 → 2.0.40

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

@@ -43,7 +43,7 @@ const { t } = i18nInstance;
 const { Text } = Typography;
 export function MatchesAny(props) {
     // Props
-    const { maxSelectedItem, maxLengthEachItem = 200, objectName, loading = false, showExtendValue = true, selectedItems: selectedItemsProp, items, groupSelectProps, renderExtraValues, customItemRenders, listEmptyProps, selectedListEmptyProps, selectedTreeData: selectedTreeDataProp, searchValue = '', isExternalSearch, onApply = () => { }, onCancel = () => { }, onLoadMore = () => { }, onChangeSearch, ...restOfProps } = props;
+    const { maxSelectedItem, maxLengthEachItem, objectName, loading = false, showExtendValue = true, selectedItems: selectedItemsProp, items, groupSelectProps, renderExtraValues, customItemRenders, listEmptyProps, selectedListEmptyProps, selectedTreeData: selectedTreeDataProp, searchValue = '', isExternalSearch, onApply = () => { }, onCancel = () => { }, onLoadMore = () => { }, onChangeSearch, ...restOfProps } = props;
     // State
     const [state, setState] = useState(matchesAnyInitialState);
     const [maxItemsError, setMaxItemsError] = useState(false);
@@ -55,7 +55,9 @@ export function MatchesAny(props) {
     const { description: selectedListEmptyDescription = t(translations.global.selectItemsFromList).toString(), icon: selectedListEmptyIcon = _jsx(DataIcon, { color: globalToken?.bw5, size: 48 }), ...restSelectedListEmptyProps } = selectedListEmptyProps || {};
     useDeepCompareEffect(() => {
         const isOverMaxSelected = maxSelectedItem && selectedItems && selectedItems.length > maxSelectedItem;
-        const isSomeTextTooLong = selectedItems && selectedItems.some(item => item.key?.toString().length > maxLengthEachItem);
+        const isSomeTextTooLong = maxLengthEachItem
+            ? selectedItems && selectedItems.some(item => item.key?.toString().length > maxLengthEachItem)
+            : false;
         setMaxItemsError(!!isOverMaxSelected);
         setItemOverMaxLength(!!isSomeTextTooLong);
         if (isApply && !isOverMaxSelected && !isSomeTextTooLong)
@@ -183,7 +185,7 @@ export function MatchesAny(props) {
     };
     const handleClickRemoveInvalid = () => {
         selectedItems?.forEach(item => {
-            if (item.key?.toString().length > maxLengthEachItem) {
+            if (maxLengthEachItem && item.key?.toString().length > maxLengthEachItem) {
                 onRemoveItem(item);
             }
         });
@@ -205,6 +207,7 @@ export function MatchesAny(props) {
                                             : extraValue.render
                                         : item[extraValue.key] }) }, `${extraValue.key}`))) }))] }), _jsxs(Flex, { align: "center", gap: 10, children: [mode === 'select' && renderItemError(item), mode === 'select' &&
                             item.key?.toString().length &&
+                            maxLengthEachItem &&
                             item.key?.toString().length > maxLengthEachItem && _jsx(ErrorIcon, { size: 16 }), isExtendValue && (_jsx(Icon, { type: "icon-ants-empty-flag", size: 20, color: globalToken?.colorPrimary })), _jsx(ActionButton, { className: "select-button", align: "center", justify: "center", onClick: () => {
                                 // Call onSelectItem function if provided
                                 if (onSelectItem) {
@@ -215,7 +218,7 @@ export function MatchesAny(props) {
                                     onRemoveItem(item);
                                 }
                             }, children: _jsx(Icon, { type: `icon-ants-${onSelectItem ? 'double-arrow-up' : 'remove-slim'}`, size: 11 }) })] })] }));
-    }, [customItemRenders, renderExtraValues, itemOverMaxLength, renderItemError]);
+    }, [renderExtraValues, customItemRenders, maxLengthEachItem, renderItemError]);
     // Memos
     const { treeData } = useDeepCompareMemo(() => {
         const { results, matchedParents } = recursiveSearchItems({
@@ -376,7 +379,7 @@ export function MatchesAny(props) {
     return (_jsx(ConfigProvider, { theme: MATCHES_ANY_THEME, children: _jsxs(MatchesAnyWrapper, { ...restOfProps, vertical: true, justify: "space-between", children: [_jsxs(Flex, { style: { width: '100%', height: '100%' }, children: [renderSelectList(), renderSelectedList()] }), _jsxs(Flex, { className: "matches-any__footer", align: "center", justify: "space-between", children: [_jsxs(Flex, { align: "center", gap: 10, children: [_jsx(Button, { type: "primary", disabled: isDisableApply, onClick: onClickApply, children: translate(translationsLocale._ACT_APPLY) }), _jsx(Button, { onClick: () => onCancel(), children: translate(translationsLocale._ACT_CANCEL) }), isApply && (maxItemsError || itemOverMaxLength) && (_jsxs(_Fragment, { children: [_jsx(Typography, { style: { color: globalToken?.colorError }, children: translate(translationsLocale._OPERATOR_MATCH_ANY_EX_VALUE_LIMIT) }), itemOverMaxLength && (_jsx(Button, { type: "text", onClick: handleClickRemoveInvalid, children: translate(translationsLocale._OPERATOR_MATCH_ANY_EX_VALUE_LIMIT_REMOVE_INV) }))] }))] }), showExtendValue && (_jsx(ExtendValuePopup, { getPopupContainer: trigger => trigger.parentElement || document.body, onApply: onApplyExtendValue, children: _jsx(Button, { icon: _jsx(Icon, { type: "icon-ants-empty-flag" }), children: t(translations.extendValue.title).toString() }) }))] })] }) }));
 }
 export function MatchesAnySelect(props) {
-    const { maxSelectedItem, maxLengthEachItem = 200, placeholder = 'Select an item', dropdownStyle, objectName, selectedItems, items, loading, popupClassName, groupSelectProps, renderExtraValues, customItemRenders, popoverProps, listEmptyProps, selectedListEmptyProps, selectedTreeData, error, onChangeSearch, onChange = () => { }, onLoadMore, ...restProps } = props;
+    const { maxSelectedItem, maxLengthEachItem, placeholder = 'Select an item', dropdownStyle, objectName, selectedItems, items, loading, popupClassName, groupSelectProps, renderExtraValues, customItemRenders, popoverProps, listEmptyProps, selectedListEmptyProps, selectedTreeData, error, onChangeSearch, onChange = () => { }, onLoadMore, ...restProps } = props;
     // State
     const [state, setState] = useState(initialState);
     // Variables

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "2.0.39",
+  "version": "2.0.40",
   "description": "An enterprise-class UI design language and React UI library.",
   "sideEffects": [
     "dist/*",
@@ -251,4 +251,4 @@
     "react-dom": ">=16.9.0",
     "react-router-dom": ">= 5.1.0"
   }
-}
+}