npm - @pega/cosmos-react-condition-builder - Versions diffs - 8.0.0-build.9.1 → 8.0.1 - Mend

@pega/cosmos-react-condition-builder 8.0.0-build.9.1 → 8.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (72) hide show

package/lib/components/ConditionBuilder/RhsControls/ValueSelector.js CHANGED Viewed

@@ -1,158 +1,202 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useState, useEffect, useRef, useCallback } from 'react';
-import { useI18n, ComboBox, createStringMatcher, hasProp, Button, Icon } from '@pega/cosmos-react-core';
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { ComboBox, createStringMatcher, hasProp, useI18n, usePrevious } from '@pega/cosmos-react-core';
+const CHUNK_SIZE = 10;
+const getFilteredOptions = (options, filterValue) => {
+    const matcher = createStringMatcher(filterValue);
+    return options.filter(option => {
+        if (typeof option === 'object')
+            return matcher.test(option.primary);
+        return matcher.test(option);
+    });
+};
+const getItems = (item, values) => {
+    return item.map(option => {
+        if (typeof option === 'object') {
+            return {
+                ...option,
+                selected: Array.isArray(values) ? values.includes(option.id) : values === option.id
+            };
+        }
+        return {
+            id: option,
+            primary: option,
+            selected: Array.isArray(values) ? values.includes(option) : values === option
+        };
+    });
+};
 /** A control for selecting multiple values using checkboxes in an overlay */
-const ValueSelector = ({ values, selectedField, comparator, rhs, onChange, onBlur, onClear, status, mode, parameters, placeholder, label, info, setApiError }) => {
+const ValueSelector = ({ values, selectedField, comparator, rhs, onChange, onBlur, status, mode, parameters, placeholder, label, info, setApiError }) => {
     const t = useI18n();
     const inputRef = useRef(null);
     const [filterValue, setFilterValue] = useState('');
-    const [options, setOptions] = useState([]);
-    const [filterOptions, setFilterOptions] = useState([]);
-    const [selectedOptions, setSelectedOptions] = useState([]);
+    const prevFilterValue = usePrevious(filterValue);
     const [loading, setLoading] = useState(false);
-    const [hasMore, setHasMore] = useState(true);
+    const isSelectedFieldPossibleValuesFunction = hasProp(selectedField, 'possibleValues') && typeof selectedField.possibleValues === 'function';
+    const [hasMore, setHasMore] = useState(isSelectedFieldPossibleValuesFunction);
     const [items, setItems] = useState([]);
-    const itemsToRender = (item) => {
-        return item.map(option => {
-            if (typeof option === 'object') {
-                return {
-                    ...option,
-                    selected: Array.isArray(values) ? values.includes(option.id) : values === option.id
-                };
+    const [selected, setSelected] = useState();
+    const fetchPossibleValues = useCallback((isFirstChunkLoad, subscribed = true) => {
+        if (isSelectedFieldPossibleValuesFunction && (isFirstChunkLoad || !loading)) {
+            setLoading(true);
+            if (isFirstChunkLoad) {
+                setApiError?.(null);
+                setItems([]);
             }
-            return {
-                id: option,
-                primary: option,
-                selected: Array.isArray(values) ? values.includes(option) : values === option
-            };
-        });
-    };
-    useEffect(() => {
-        const updatedItems = items.map(item => {
-            const result = Array.isArray(values) ? values.includes(item.id) : values === item.id;
-            return { ...item, selected: result };
-        });
-        setItems(updatedItems);
-        setSelectedOptions(values.length > 0 ? selectedOptions.filter(opt => values.includes(opt.id)) : []);
-    }, [values]);
-    useEffect(() => {
-        const matcher = createStringMatcher(filterValue);
-        setFilterOptions(options.filter(option => {
-            if (typeof option === 'object')
-                return matcher.test(option.primary);
-            return matcher.test(option);
-        }));
-    }, [filterValue, options]);
-    const isPossibleValuesSet = !!selectedField.possibleValues;
+            selectedField.possibleValues({
+                searchString: filterValue,
+                comparator,
+                lhs: selectedField,
+                pageNumber: isFirstChunkLoad ? 1 : Math.floor(items.length / CHUNK_SIZE) + 1,
+                pageSize: CHUNK_SIZE
+            })
+                .then(response => {
+                if (subscribed) {
+                    setApiError?.(null);
+                    setHasMore(response.length >= CHUNK_SIZE);
+                    const newItems = getItems(response, values);
+                    setItems(curr => (isFirstChunkLoad ? newItems : [...curr, ...newItems]));
+                    setLoading(false);
+                }
+            })
+                .catch(err => {
+                if (err && subscribed) {
+                    setApiError?.(t('condition_builder_possible_values_error'));
+                    setLoading(false);
+                }
+            });
+        }
+    }, [
+        isSelectedFieldPossibleValuesFunction,
+        loading,
+        items,
+        selectedField,
+        filterValue,
+        comparator,
+        values
+    ]);
     useEffect(() => {
-        if (!selectedField)
-            return;
         let subscribed = true;
         if (hasProp(rhs, 'parameterId')) {
-            setOptions(parameters);
+            setItems(getItems(getFilteredOptions(parameters, filterValue), values));
         }
         else if (hasProp(selectedField, 'possibleValues')) {
             const { possibleValues } = selectedField;
             if (typeof possibleValues === 'function') {
-                setLoading(true);
-                setOptions([]);
-                possibleValues({ searchString: filterValue, comparator, lhs: selectedField })
-                    .then(response => {
-                    if (!subscribed)
-                        return;
-                    setOptions(response);
-                    setSelectedOptions(response.filter(opt => typeof opt === 'object' && values.includes(opt.id)));
-                    setLoading(false);
-                })
-                    .catch(err => {
-                    if (err && subscribed) {
-                        setApiError?.(t('condition_builder_possible_values_error'));
-                        setOptions([]);
-                        setLoading(false);
-                    }
-                });
+                if (prevFilterValue !== filterValue) {
+                    fetchPossibleValues(true, subscribed);
+                }
+                else {
+                    setItems(curr => curr.map(i => ({
+                        ...i,
+                        selected: Array.isArray(values) ? values.includes(i.id) : values === i.id
+                    })));
+                }
             }
             else if (Array.isArray(possibleValues)) {
-                setOptions(possibleValues);
+                setItems(getItems(getFilteredOptions(possibleValues, filterValue), values));
             }
             else {
-                setOptions([]);
+                setItems([]);
             }
         }
         return () => {
             subscribed = false;
-            setApiError?.(null);
         };
-    }, [filterValue, selectedField.id, isPossibleValuesSet, comparator]);
+    }, [
+        rhs,
+        parameters,
+        filterValue,
+        values,
+        selectedField.id,
+        selectedField.possibleValues,
+        comparator
+    ]);
     useEffect(() => {
         setFilterValue('');
     }, [selectedField, comparator]);
-    const getSelections = () => {
+    useEffect(() => {
+        let subscribed = true;
+        const handlePossibleValues = (ids, setSelectedFn) => {
+            const { possibleValues } = selectedField;
+            if (typeof possibleValues === 'function') {
+                possibleValues({
+                    lhs: selectedField,
+                    ids
+                })
+                    .then(response => {
+                    if (subscribed) {
+                        const options = response.map(option => typeof option === 'object'
+                            ? { id: option.id, text: option.primary }
+                            : { id: option, text: option });
+                        setSelectedFn(options);
+                    }
+                })
+                    .catch(err => {
+                    if (err && subscribed) {
+                        setApiError?.(t('condition_builder_possible_values_error'));
+                        return [];
+                    }
+                });
+            }
+            else if (Array.isArray(possibleValues)) {
+                const options = ids.map(id => {
+                    const optionLabel = possibleValues.find(opt => typeof opt === 'object' && opt.id === id);
+                    return { id, text: optionLabel?.primary ?? id };
+                });
+                setSelectedFn(options);
+            }
+        };
         if (typeof values === 'string') {
-            let itemLabel;
             if (hasProp(rhs, 'parameterId')) {
                 const selectedItem = parameters.find(item => item.id === values);
-                itemLabel = selectedItem !== undefined ? selectedItem.primary : values;
+                setSelected({
+                    items: { id: values, text: selectedItem !== undefined ? selectedItem.primary : values }
+                });
+            }
+            else if (hasProp(selectedField, 'possibleValues')) {
+                handlePossibleValues([values], options => setSelected({ items: options[0] }));
+            }
+            else {
+                setSelected({
+                    items: { id: values, text: values }
+                });
             }
-            else
-                itemLabel = values;
-            return {
-                items: { id: values, text: itemLabel }
-            };
         }
-        if (values.length > 0) {
-            return {
-                items: values.map(s => {
-                    const optionLabel = (options.length > 0 ? options : selectedOptions).find(opt => typeof opt === 'object' && opt.id === s);
-                    return { id: s, text: optionLabel?.primary ?? s };
-                }),
-                onRemove: (value) => {
-                    onChange((() => {
-                        const current = values;
-                        return current.filter(selection => selection !== value);
-                    })());
-                }
+        else if (values.length > 0) {
+            const onRemove = (value) => {
+                onChange((() => {
+                    const current = values;
+                    return current.filter(selection => selection !== value);
+                })());
             };
-        }
-        return undefined;
-    };
-    useEffect(() => {
-        if (filterValue !== '') {
-            setItems(itemsToRender(filterOptions.slice(0, 10)));
+            if (hasProp(rhs, 'parameterId')) {
+                setSelected({
+                    items: values.map(s => {
+                        const optionLabel = parameters.find(opt => typeof opt === 'object' && opt.id === s);
+                        return { id: s, text: optionLabel?.primary ?? s };
+                    }),
+                    onRemove
+                });
+            }
+            else if (hasProp(selectedField, 'possibleValues')) {
+                handlePossibleValues(values, options => setSelected({ items: options, onRemove }));
+            }
+            else {
+                setSelected({ items: values.map(s => ({ id: s, text: s })), onRemove });
+            }
         }
         else {
-            setItems(itemsToRender(options.slice(0, 10)));
-        }
-    }, [options, filterOptions]);
-    const loadMore = useCallback(() => {
-        if (!loading) {
-            setLoading(true);
-            let totalItem;
-            if (filterOptions.length > 0)
-                totalItem = filterOptions;
-            else
-                totalItem = options;
-            const remItems = totalItem.length - items.length;
-            let newItemsLength = 10;
-            if (remItems <= newItemsLength) {
-                setHasMore(false);
-                newItemsLength = remItems;
-            }
-            setLoading(false);
-            setItems(prev => {
-                return [
-                    ...prev,
-                    ...itemsToRender(totalItem.slice(items.length, items.length + newItemsLength))
-                ];
-            });
+            setSelected(undefined);
         }
-    }, [options, loading, filterOptions, items, hasMore]);
-    return (_jsx(ComboBox, { ref: inputRef, mode: mode, label: label ?? t('condition_builder_possible_values_label'), placeholder: placeholder ??
-            (mode === 'single-select'
-                ? t('condition_builder_single_selection_text_default')
-                : t('condition_builder_multi_selection_text_default')), value: filterValue, onChange: e => {
+        return () => {
+            subscribed = false;
+        };
+    }, [values, rhs, parameters, selectedField.id, selectedField.possibleValues]);
+    return (_jsx(ComboBox, { ref: inputRef, mode: mode, label: label ?? t('condition_builder_possible_values_label'), placeholder: placeholder, value: filterValue, onChange: e => {
             setFilterValue(e.target.value);
-            setHasMore(true);
+            if (mode === 'single-select' && !e.target.value)
+                onChange('');
         }, onBlur: () => {
             onBlur?.(values);
             setFilterValue('');
@@ -164,9 +208,6 @@ const ValueSelector = ({ values, selectedField, comparator, rhs, onChange, onBlu
                     onChange(id);
                 }
                 else {
-                    const selectedOption = options.find(opt => typeof opt === 'object' && opt.id === id);
-                    if (selectedOption)
-                        setSelectedOptions([...selectedOptions, selectedOption]);
                     onChange((() => {
                         const current = values;
                         return current.includes(id)
@@ -176,16 +217,9 @@ const ValueSelector = ({ values, selectedField, comparator, rhs, onChange, onBlu
                 }
             },
             loading,
-            loadMore: hasMore ? loadMore : undefined
-        }, selected: getSelections(), status: status, info: info, actions: onClear &&
-            values.length > 0 && (_jsx(Button, { icon: true, variant: 'simple', label: t('clear'), onClick: () => {
-                onChange([]);
-                onClear();
-                if (inputRef.current) {
-                    const inputEl = inputRef.current.querySelector('input');
-                    inputEl?.focus();
-                }
-            }, children: _jsx(Icon, { name: 'times' }) })) }));
+            loadMore: hasMore ? () => fetchPossibleValues(false) : undefined,
+            accent: createStringMatcher(filterValue)
+        }, onMenuOpen: () => fetchPossibleValues(true), selected: selected, status: status, info: info }));
 };
 export default ValueSelector;
 //# sourceMappingURL=ValueSelector.js.map

package/lib/components/ConditionBuilder/RhsControls/ValueSelector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ValueSelector.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/ValueSelector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useRef, useCallback } from 'react';\nimport type { Dispatch, SetStateAction } from 'react';\n\nimport {\n useI18n,\n ComboBox,\n createStringMatcher,\n hasProp,\n Button,\n Icon\n} from '@pega/cosmos-react-core';\nimport type { BaseProps, NoChildrenProp, ComboBoxProps, MenuProps } from '@pega/cosmos-react-core';\n\nimport type {\n LeafCondition,\n ParameterValue,\n ReferenceValue,\n ValueSelection\n} from '../ConditionBuilder.types';\nimport type { Comparator } from '../core/types';\n\ninterface ValueSelectorProps<T extends { id: string; possibleValues?: ValueSelection<T> }>\n extends BaseProps,\n NoChildrenProp {\n mode: ComboBoxProps['mode'];\n /** Previous selection /\n values: string[] \| string;\n /* Current selected LHS /\n selectedField: T;\n /* Current selected comparator /\n comparator: Comparator;\n /* Rhs for the condition /\n rhs: NonNullable<LeafCondition['rhs']>;\n /* Passed Parameters array for Rhstype PARAMETER /\n parameters: ParameterValue[];\n /* Callback for changes /\n onChange: (selection: string[] \| string) => void;\n /* Callback for blur /\n onBlur?: (selection?: string[] \| string) => void;\n /* Callback for clear /\n onClear?: () => void;\n /* Used to indicate any errors on the control /\n status?: 'error';\n /* Placeholder text to display in empty control /\n placeholder?: ComboBoxProps['placeholder'];\n /* Custom label for input. Makes label visible if provided. /\n label?: ComboBoxProps['label'];\n /* Guidance text that apppears below the input. /\n info?: ComboBoxProps['info'];\n /* sets status and info /\n setApiError?: Dispatch<SetStateAction<string \| null>>;\n}\n\n/* A control for selecting multiple values using checkboxes in an overlay */\nconst ValueSelector = <F extends object & { id: string; possibleValues?: ValueSelection<F> }>({\n values,\n selectedField,\n comparator,\n rhs,\n onChange,\n onBlur,\n onClear,\n status,\n mode,\n parameters,\n placeholder,\n label,\n info,\n setApiError\n}: ValueSelectorProps<F>) => {\n const t = useI18n();\n\n const inputRef = useRef<HTMLDivElement>(null);\n\n const [filterValue, setFilterValue] = useState('');\n const [options, setOptions] = useState<(string \| ParameterValue \| ReferenceValue)[]>([]);\n const [filterOptions, setFilterOptions] = useState<(string \| ParameterValue \| ReferenceValue)[]>(\n []\n );\n const [selectedOptions, setSelectedOptions] = useState<ReferenceValue[]>([]);\n const [loading, setLoading] = useState(false);\n const [hasMore, setHasMore] = useState(true);\n const [items, setItems] = useState<MenuProps['items']>([]);\n\n const itemsToRender = (item: (string \| ParameterValue \| ReferenceValue)[]) => {\n return item.map(option => {\n if (typeof option === 'object') {\n return {\n ...option,\n selected: Array.isArray(values) ? values.includes(option.id) : values === option.id\n };\n }\n return {\n id: option,\n primary: option,\n selected: Array.isArray(values) ? values.includes(option) : values === option\n };\n });\n };\n\n useEffect(() => {\n const updatedItems = items.map(item => {\n const result = Array.isArray(values) ? values.includes(item.id) : values === item.id;\n return { ...item, selected: result };\n });\n setItems(updatedItems);\n\n setSelectedOptions(\n values.length > 0 ? selectedOptions.filter(opt => values.includes(opt.id)) : []\n );\n }, [values]);\n\n useEffect(() => {\n const matcher = createStringMatcher(filterValue);\n setFilterOptions(\n options.filter(option => {\n if (typeof option === 'object') return matcher.test(option.primary);\n return matcher.test(option);\n })\n );\n }, [filterValue, options]);\n\n const isPossibleValuesSet = !!selectedField.possibleValues;\n\n useEffect(() => {\n if (!selectedField) return;\n let subscribed = true;\n\n if (hasProp(rhs, 'parameterId')) {\n setOptions(parameters);\n } else if (hasProp(selectedField, 'possibleValues')) {\n const { possibleValues } = selectedField;\n if (typeof possibleValues === 'function') {\n setLoading(true);\n setOptions([]);\n possibleValues({ searchString: filterValue, comparator, lhs: selectedField })\n .then(response => {\n if (!subscribed) return;\n setOptions(response);\n setSelectedOptions(\n response.filter(\n opt => typeof opt === 'object' && values.includes(opt.id)\n ) as ReferenceValue[]\n );\n setLoading(false);\n })\n .catch(err => {\n if (err && subscribed) {\n setApiError?.(t('condition_builder_possible_values_error'));\n setOptions([]);\n setLoading(false);\n }\n });\n } else if (Array.isArray(possibleValues)) {\n setOptions(possibleValues);\n } else {\n setOptions([]);\n }\n }\n\n return () => {\n subscribed = false;\n setApiError?.(null);\n };\n }, [filterValue, selectedField.id, isPossibleValuesSet, comparator]);\n\n useEffect(() => {\n setFilterValue('');\n }, [selectedField, comparator]);\n\n const getSelections = () => {\n if (typeof values === 'string') {\n let itemLabel;\n if (hasProp(rhs, 'parameterId')) {\n const selectedItem = parameters.find(item => item.id === values);\n itemLabel = selectedItem !== undefined ? selectedItem.primary : values;\n } else itemLabel = values;\n\n return {\n items: { id: values, text: itemLabel }\n };\n }\n if (values.length > 0) {\n return {\n items: values.map(s => {\n const optionLabel = (options.length > 0 ? options : selectedOptions).find(\n opt => typeof opt === 'object' && opt.id === s\n ) as ParameterValue \| ReferenceValue \| undefined;\n return { id: s, text: optionLabel?.primary ?? s };\n }),\n onRemove: (value: string) => {\n onChange(\n (() => {\n const current = values as string[];\n return current.filter(selection => selection !== value) as string \| string[];\n })()\n );\n }\n };\n }\n\n return undefined;\n };\n\n useEffect(() => {\n if (filterValue !== '') {\n setItems(itemsToRender(filterOptions.slice(0, 10)));\n } else {\n setItems(itemsToRender(options.slice(0, 10)));\n }\n }, [options, filterOptions]);\n\n const loadMore = useCallback(() => {\n if (!loading) {\n setLoading(true);\n\n let totalItem: (string \| ParameterValue \| ReferenceValue)[];\n if (filterOptions.length > 0) totalItem = filterOptions;\n else totalItem = options;\n\n const remItems = totalItem.length - items.length;\n let newItemsLength = 10;\n if (remItems <= newItemsLength) {\n setHasMore(false);\n newItemsLength = remItems;\n }\n\n setLoading(false);\n setItems(prev => {\n return [\n ...prev,\n ...itemsToRender(totalItem.slice(items.length, items.length + newItemsLength))\n ];\n });\n }\n }, [options, loading, filterOptions, items, hasMore]);\n\n return (\n <ComboBox\n ref={inputRef}\n mode={mode}\n label={label ?? t('condition_builder_possible_values_label')}\n placeholder={\n placeholder ??\n (mode === 'single-select'\n ? t('condition_builder_single_selection_text_default')\n : t('condition_builder_multi_selection_text_default'))\n }\n value={filterValue}\n onChange={e => {\n setFilterValue(e.target.value);\n setHasMore(true);\n }}\n onBlur={() => {\n onBlur?.(values);\n setFilterValue('');\n }}\n menu={{\n items,\n onItemClick: id => {\n if (mode === 'single-select') {\n setFilterValue('');\n onChange(id);\n } else {\n const selectedOption = options.find(opt => typeof opt === 'object' && opt.id === id) as\n \| ReferenceValue\n \| undefined;\n if (selectedOption) setSelectedOptions([...selectedOptions, selectedOption]);\n onChange(\n (() => {\n const current = values as string[];\n return current.includes(id)\n ? current.filter(selection => selection !== id)\n : [...values, id];\n })()\n );\n }\n },\n loading,\n loadMore: hasMore ? loadMore : undefined\n }}\n selected={getSelections()}\n status={status}\n info={info}\n actions={\n onClear &&\n values.length > 0 && (\n <Button\n icon\n variant='simple'\n label={t('clear')}\n onClick={() => {\n onChange([]);\n onClear();\n if (inputRef.current) {\n const inputEl = inputRef.current.querySelector('input');\n inputEl?.focus();\n }\n }}\n >\n <Icon name='times' />\n </Button>\n )\n }\n />\n );\n};\n\nexport default ValueSelector;\n"]}
1	+ {"version":3,"file":"ValueSelector.js","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/ValueSelector.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjE,OAAO,EACL,QAAQ,EACR,mBAAmB,EACnB,OAAO,EACP,OAAO,EACP,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAYjC,MAAM,UAAU,GAAG,EAAE,CAAC;AAgCtB,MAAM,kBAAkB,GAAG,CACzB,OAAqD,EACrD,WAAmB,EACnB,EAAE;IACF,MAAM,OAAO,GAAG,mBAAmB,CAAC,WAAW,CAAC,CAAC;IACjD,OAAO,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;QAC7B,IAAI,OAAO,MAAM,KAAK,QAAQ;YAAE,OAAO,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;QACpE,OAAO,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAC9B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAG,CACf,IAAkD,EAClD,MAAyB,EACzB,EAAE;IACF,OAAO,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;QACvB,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;YAC/B,OAAO;gBACL,GAAG,MAAM;gBACT,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,EAAE;aACpF,CAAC;QACJ,CAAC;QACD,OAAO;YACL,EAAE,EAAE,MAAM;YACV,OAAO,EAAE,MAAM;YACf,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,MAAM;SAC9E,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,6EAA6E;AAC7E,MAAM,aAAa,GAAG,CAAwE,EAC5F,MAAM,EACN,aAAa,EACb,UAAU,EACV,GAAG,EACH,QAAQ,EACR,MAAM,EACN,MAAM,EACN,IAAI,EACJ,UAAU,EACV,WAAW,EACX,KAAK,EACL,IAAI,EACJ,WAAW,EACW,EAAE,EAAE;IAC1B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE9C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACnD,MAAM,eAAe,GAAG,WAAW,CAAC,WAAW,CAAC,CAAC;IACjD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,qCAAqC,GACzC,OAAO,CAAC,aAAa,EAAE,gBAAgB,CAAC,IAAI,OAAO,aAAa,CAAC,cAAc,KAAK,UAAU,CAAC;IACjG,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,qCAAqC,CAAC,CAAC;IAC9E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAqB,EAAE,CAAC,CAAC;IAC3D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,EAA6B,CAAC;IAEtE,MAAM,mBAAmB,GAAG,WAAW,CACrC,CAAC,gBAAyB,EAAE,aAAsB,IAAI,EAAE,EAAE;QACxD,IAAI,qCAAqC,IAAI,CAAC,gBAAgB,IAAI,CAAC,OAAO,CAAC,EAAE,CAAC;YAC5E,UAAU,CAAC,IAAI,CAAC,CAAC;YACjB,IAAI,gBAAgB,EAAE,CAAC;gBACrB,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC;gBACpB,QAAQ,CAAC,EAAE,CAAC,CAAC;YACf,CAAC;YACA,aAAa,CAAC,cAA4C,CAAC;gBAC1D,YAAY,EAAE,WAAW;gBACzB,UAAU;gBACV,GAAG,EAAE,aAAa;gBAClB,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,CAAC,GAAG,CAAC;gBAC5E,QAAQ,EAAE,UAAU;aACrB,CAAC;iBACC,IAAI,CAAC,QAAQ,CAAC,EAAE;gBACf,IAAI,UAAU,EAAE,CAAC;oBACf,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC;oBACpB,UAAU,CAAC,QAAQ,CAAC,MAAM,IAAI,UAAU,CAAC,CAAC;oBAC1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;oBAC5C,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;oBACzE,UAAU,CAAC,KAAK,CAAC,CAAC;gBACpB,CAAC;YACH,CAAC,CAAC;iBACD,KAAK,CAAC,GAAG,CAAC,EAAE;gBACX,IAAI,GAAG,IAAI,UAAU,EAAE,CAAC;oBACtB,WAAW,EAAE,CAAC,CAAC,CAAC,yCAAyC,CAAC,CAAC,CAAC;oBAC5D,UAAU,CAAC,KAAK,CAAC,CAAC;gBACpB,CAAC;YACH,CAAC,CAAC,CAAC;QACP,CAAC;IACH,CAAC,EACD;QACE,qCAAqC;QACrC,OAAO;QACP,KAAK;QACL,aAAa;QACb,WAAW;QACX,UAAU;QACV,MAAM;KACP,CACF,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,GAAG,IAAI,CAAC;QAEtB,IAAI,OAAO,CAAC,GAAG,EAAE,aAAa,CAAC,EAAE,CAAC;YAChC,QAAQ,CAAC,QAAQ,CAAC,kBAAkB,CAAC,UAAU,EAAE,WAAW,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;QAC1E,CAAC;aAAM,IAAI,OAAO,CAAC,aAAa,EAAE,gBAAgB,CAAC,EAAE,CAAC;YACpD,MAAM,EAAE,cAAc,EAAE,GAAG,aAAa,CAAC;YACzC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;gBACzC,IAAI,eAAe,KAAK,WAAW,EAAE,CAAC;oBACpC,mBAAmB,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC;gBACxC,CAAC;qBAAM,CAAC;oBACN,QAAQ,CAAC,IAAI,CAAC,EAAE,CACd,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;wBACb,GAAG,CAAC;wBACJ,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC,EAAE;qBAC1E,CAAC,CAAC,CACJ,CAAC;gBACJ,CAAC;YACH,CAAC;iBAAM,IAAI,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;gBACzC,QAAQ,CAAC,QAAQ,CAAC,kBAAkB,CAAC,cAAc,EAAE,WAAW,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;YAC9E,CAAC;iBAAM,CAAC;gBACN,QAAQ,CAAC,EAAE,CAAC,CAAC;YACf,CAAC;QACH,CAAC;QAED,OAAO,GAAG,EAAE;YACV,UAAU,GAAG,KAAK,CAAC;QACrB,CAAC,CAAC;IACJ,CAAC,EAAE;QACD,GAAG;QACH,UAAU;QACV,WAAW;QACX,MAAM;QACN,aAAa,CAAC,EAAE;QAChB,aAAa,CAAC,cAAc;QAC5B,UAAU;KACX,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,cAAc,CAAC,EAAE,CAAC,CAAC;IACrB,CAAC,EAAE,CAAC,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC;IAEhC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,UAAU,GAAG,IAAI,CAAC;QAEtB,MAAM,oBAAoB,GAAG,CAAC,GAAa,EAAE,aAA4C,EAAE,EAAE;YAC3F,MAAM,EAAE,cAAc,EAAE,GAAG,aAAa,CAAC;YACzC,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE,CAAC;gBACxC,cAA4C,CAAC;oBAC5C,GAAG,EAAE,aAAa;oBAClB,GAAG;iBACJ,CAAC;qBACC,IAAI,CAAC,QAAQ,CAAC,EAAE;oBACf,IAAI,UAAU,EAAE,CAAC;wBACf,MAAM,OAAO,GAAG,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CACpC,OAAO,MAAM,KAAK,QAAQ;4BACxB,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,MAAM,CAAC,OAAO,EAAE;4BACzC,CAAC,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,CACjC,CAAC;wBACF,aAAa,CAAC,OAAO,CAAC,CAAC;oBACzB,CAAC;gBACH,CAAC,CAAC;qBACD,KAAK,CAAC,GAAG,CAAC,EAAE;oBACX,IAAI,GAAG,IAAI,UAAU,EAAE,CAAC;wBACtB,WAAW,EAAE,CAAC,CAAC,CAAC,yCAAyC,CAAC,CAAC,CAAC;wBAC5D,OAAO,EAAE,CAAC;oBACZ,CAAC;gBACH,CAAC,CAAC,CAAC;YACP,CAAC;iBAAM,IAAI,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;gBACzC,MAAM,OAAO,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE;oBAC3B,MAAM,WAAW,GAAG,cAAc,CAAC,IAAI,CACrC,GAAG,CAAC,EAAE,CAAC,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,CAC9B,CAAC;oBACpB,OAAO,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,EAAE,EAAE,CAAC;gBAClD,CAAC,CAAC,CAAC;gBACH,aAAa,CAAC,OAAO,CAAC,CAAC;YACzB,CAAC;QACH,CAAC,CAAC;QAEF,IAAI,OAAO,MAAM,KAAK,QAAQ,EAAE,CAAC;YAC/B,IAAI,OAAO,CAAC,GAAG,EAAE,aAAa,CAAC,EAAE,CAAC;gBAChC,MAAM,YAAY,GAAG,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,MAAM,CAAC,CAAC;gBACjE,WAAW,CAAC;oBACV,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,KAAK,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE;iBACxF,CAAC,CAAC;YACL,CAAC;iBAAM,IAAI,OAAO,CAAC,aAAa,EAAE,gBAAgB,CAAC,EAAE,CAAC;gBACpD,oBAAoB,CAAC,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;YAChF,CAAC;iBAAM,CAAC;gBACN,WAAW,CAAC;oBACV,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE;iBACpC,CAAC,CAAC;YACL,CAAC;QACH,CAAC;aAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YAC7B,MAAM,QAAQ,GAAG,CAAC,KAAa,EAAE,EAAE;gBACjC,QAAQ,CACN,CAAC,GAAG,EAAE;oBACJ,MAAM,OAAO,GAAG,MAAkB,CAAC;oBACnC,OAAO,OAAO,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,KAAK,KAAK,CAAsB,CAAC;gBAC/E,CAAC,CAAC,EAAE,CACL,CAAC;YACJ,CAAC,CAAC;YACF,IAAI,OAAO,CAAC,GAAG,EAAE,aAAa,CAAC,EAAE,CAAC;gBAChC,WAAW,CAAC;oBACV,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;wBACpB,MAAM,WAAW,GAAG,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,OAAO,GAAG,KAAK,QAAQ,IAAI,GAAG,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;wBACpF,OAAO,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,IAAI,CAAC,EAAE,CAAC;oBACpD,CAAC,CAAC;oBACF,QAAQ;iBACT,CAAC,CAAC;YACL,CAAC;iBAAM,IAAI,OAAO,CAAC,aAAa,EAAE,gBAAgB,CAAC,EAAE,CAAC;gBACpD,oBAAoB,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC,WAAW,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;YACrF,CAAC;iBAAM,CAAC;gBACN,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,CAAC;YAC1E,CAAC;QACH,CAAC;aAAM,CAAC;YACN,WAAW,CAAC,SAAS,CAAC,CAAC;QACzB,CAAC;QAED,OAAO,GAAG,EAAE;YACV,UAAU,GAAG,KAAK,CAAC;QACrB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,EAAE,UAAU,EAAE,aAAa,CAAC,EAAE,EAAE,aAAa,CAAC,cAAc,CAAC,CAAC,CAAC;IAE9E,OAAO,CACL,KAAC,QAAQ,IACP,GAAG,EAAE,QAAQ,EACb,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,IAAI,CAAC,CAAC,yCAAyC,CAAC,EAC5D,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,CAAC,EAAE;YACZ,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC/B,IAAI,IAAI,KAAK,eAAe,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK;gBAAE,QAAQ,CAAC,EAAE,CAAC,CAAC;QAChE,CAAC,EACD,MAAM,EAAE,GAAG,EAAE;YACX,MAAM,EAAE,CAAC,MAAM,CAAC,CAAC;YACjB,cAAc,CAAC,EAAE,CAAC,CAAC;QACrB,CAAC,EACD,IAAI,EAAE;YACJ,KAAK;YACL,WAAW,EAAE,EAAE,CAAC,EAAE;gBAChB,IAAI,IAAI,KAAK,eAAe,EAAE,CAAC;oBAC7B,cAAc,CAAC,EAAE,CAAC,CAAC;oBACnB,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACf,CAAC;qBAAM,CAAC;oBACN,QAAQ,CACN,CAAC,GAAG,EAAE;wBACJ,MAAM,OAAO,GAAG,MAAkB,CAAC;wBACnC,OAAO,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC;4BACzB,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC,SAAS,KAAK,EAAE,CAAC;4BAC/C,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,EAAE,CAAC,CAAC;oBACtB,CAAC,CAAC,EAAE,CACL,CAAC;gBACJ,CAAC;YACH,CAAC;YACD,OAAO;YACP,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS;YAChE,MAAM,EAAE,mBAAmB,CAAC,WAAW,CAAC;SACzC,EACD,UAAU,EAAE,GAAG,EAAE,CAAC,mBAAmB,CAAC,IAAI,CAAC,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,GACV,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import type { Dispatch, SetStateAction } from 'react';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport type { BaseProps, ComboBoxProps, MenuProps, NoChildrenProp } from '@pega/cosmos-react-core';\nimport {\n ComboBox,\n createStringMatcher,\n hasProp,\n useI18n,\n usePrevious\n} from '@pega/cosmos-react-core';\nimport type { Selected } from '@pega/cosmos-react-core/lib/components/ComboBox/ComboBox.types';\n\nimport type {\n LeafCondition,\n ParameterValue,\n ReferenceValue,\n ValueSelection,\n ValueSelectionFunction\n} from '../ConditionBuilder.types';\nimport type { Comparator } from '../core/types';\n\nconst CHUNK_SIZE = 10;\n\ninterface ValueSelectorProps<T extends { id: string; possibleValues?: ValueSelection<T> }>\n extends BaseProps,\n NoChildrenProp {\n mode: ComboBoxProps['mode'];\n /** Previous selection /\n values: string[] \| string;\n /* Current selected LHS /\n selectedField: T;\n /* Current selected comparator /\n comparator: Comparator;\n /* Rhs for the condition /\n rhs: NonNullable<LeafCondition['rhs']>;\n /* Passed Parameters array for Rhstype PARAMETER /\n parameters: ParameterValue[];\n /* Callback for changes /\n onChange: (selection: string[] \| string) => void;\n /* Callback for blur /\n onBlur?: (selection?: string[] \| string) => void;\n /* Used to indicate any errors on the control /\n status?: 'error';\n /* Placeholder text to display in empty control /\n placeholder?: ComboBoxProps['placeholder'];\n /* Custom label for input. Makes label visible if provided. /\n label?: ComboBoxProps['label'];\n /* Guidance text that apppears below the input. /\n info?: ComboBoxProps['info'];\n /* sets status and info /\n setApiError?: Dispatch<SetStateAction<string \| null>>;\n}\n\nconst getFilteredOptions = (\n options: (string \| ParameterValue \| ReferenceValue)[],\n filterValue: string\n) => {\n const matcher = createStringMatcher(filterValue);\n return options.filter(option => {\n if (typeof option === 'object') return matcher.test(option.primary);\n return matcher.test(option);\n });\n};\n\nconst getItems = (\n item: (string \| ParameterValue \| ReferenceValue)[],\n values: string[] \| string\n) => {\n return item.map(option => {\n if (typeof option === 'object') {\n return {\n ...option,\n selected: Array.isArray(values) ? values.includes(option.id) : values === option.id\n };\n }\n return {\n id: option,\n primary: option,\n selected: Array.isArray(values) ? values.includes(option) : values === option\n };\n });\n};\n\n/* A control for selecting multiple values using checkboxes in an overlay */\nconst ValueSelector = <F extends object & { id: string; possibleValues?: ValueSelection<F> }>({\n values,\n selectedField,\n comparator,\n rhs,\n onChange,\n onBlur,\n status,\n mode,\n parameters,\n placeholder,\n label,\n info,\n setApiError\n}: ValueSelectorProps<F>) => {\n const t = useI18n();\n\n const inputRef = useRef<HTMLDivElement>(null);\n\n const [filterValue, setFilterValue] = useState('');\n const prevFilterValue = usePrevious(filterValue);\n const [loading, setLoading] = useState(false);\n const isSelectedFieldPossibleValuesFunction =\n hasProp(selectedField, 'possibleValues') && typeof selectedField.possibleValues === 'function';\n const [hasMore, setHasMore] = useState(isSelectedFieldPossibleValuesFunction);\n const [items, setItems] = useState<MenuProps['items']>([]);\n const [selected, setSelected] = useState<ComboBoxProps['selected']>();\n\n const fetchPossibleValues = useCallback(\n (isFirstChunkLoad: boolean, subscribed: boolean = true) => {\n if (isSelectedFieldPossibleValuesFunction && (isFirstChunkLoad \|\| !loading)) {\n setLoading(true);\n if (isFirstChunkLoad) {\n setApiError?.(null);\n setItems([]);\n }\n (selectedField.possibleValues as ValueSelectionFunction<F>)({\n searchString: filterValue,\n comparator,\n lhs: selectedField,\n pageNumber: isFirstChunkLoad ? 1 : Math.floor(items.length / CHUNK_SIZE) + 1,\n pageSize: CHUNK_SIZE\n })\n .then(response => {\n if (subscribed) {\n setApiError?.(null);\n setHasMore(response.length >= CHUNK_SIZE);\n const newItems = getItems(response, values);\n setItems(curr => (isFirstChunkLoad ? newItems : [...curr, ...newItems]));\n setLoading(false);\n }\n })\n .catch(err => {\n if (err && subscribed) {\n setApiError?.(t('condition_builder_possible_values_error'));\n setLoading(false);\n }\n });\n }\n },\n [\n isSelectedFieldPossibleValuesFunction,\n loading,\n items,\n selectedField,\n filterValue,\n comparator,\n values\n ]\n );\n\n useEffect(() => {\n let subscribed = true;\n\n if (hasProp(rhs, 'parameterId')) {\n setItems(getItems(getFilteredOptions(parameters, filterValue), values));\n } else if (hasProp(selectedField, 'possibleValues')) {\n const { possibleValues } = selectedField;\n if (typeof possibleValues === 'function') {\n if (prevFilterValue !== filterValue) {\n fetchPossibleValues(true, subscribed);\n } else {\n setItems(curr =>\n curr.map(i => ({\n ...i,\n selected: Array.isArray(values) ? values.includes(i.id) : values === i.id\n }))\n );\n }\n } else if (Array.isArray(possibleValues)) {\n setItems(getItems(getFilteredOptions(possibleValues, filterValue), values));\n } else {\n setItems([]);\n }\n }\n\n return () => {\n subscribed = false;\n };\n }, [\n rhs,\n parameters,\n filterValue,\n values,\n selectedField.id,\n selectedField.possibleValues,\n comparator\n ]);\n\n useEffect(() => {\n setFilterValue('');\n }, [selectedField, comparator]);\n\n useEffect(() => {\n let subscribed = true;\n\n const handlePossibleValues = (ids: string[], setSelectedFn: (options: Selected[]) => void) => {\n const { possibleValues } = selectedField;\n if (typeof possibleValues === 'function') {\n (possibleValues as ValueSelectionFunction<F>)({\n lhs: selectedField,\n ids\n })\n .then(response => {\n if (subscribed) {\n const options = response.map(option =>\n typeof option === 'object'\n ? { id: option.id, text: option.primary }\n : { id: option, text: option }\n );\n setSelectedFn(options);\n }\n })\n .catch(err => {\n if (err && subscribed) {\n setApiError?.(t('condition_builder_possible_values_error'));\n return [];\n }\n });\n } else if (Array.isArray(possibleValues)) {\n const options = ids.map(id => {\n const optionLabel = possibleValues.find(\n opt => typeof opt === 'object' && opt.id === id\n ) as ReferenceValue;\n return { id, text: optionLabel?.primary ?? id };\n });\n setSelectedFn(options);\n }\n };\n\n if (typeof values === 'string') {\n if (hasProp(rhs, 'parameterId')) {\n const selectedItem = parameters.find(item => item.id === values);\n setSelected({\n items: { id: values, text: selectedItem !== undefined ? selectedItem.primary : values }\n });\n } else if (hasProp(selectedField, 'possibleValues')) {\n handlePossibleValues([values], options => setSelected({ items: options[0] }));\n } else {\n setSelected({\n items: { id: values, text: values }\n });\n }\n } else if (values.length > 0) {\n const onRemove = (value: string) => {\n onChange(\n (() => {\n const current = values as string[];\n return current.filter(selection => selection !== value) as string \| string[];\n })()\n );\n };\n if (hasProp(rhs, 'parameterId')) {\n setSelected({\n items: values.map(s => {\n const optionLabel = parameters.find(opt => typeof opt === 'object' && opt.id === s);\n return { id: s, text: optionLabel?.primary ?? s };\n }),\n onRemove\n });\n } else if (hasProp(selectedField, 'possibleValues')) {\n handlePossibleValues(values, options => setSelected({ items: options, onRemove }));\n } else {\n setSelected({ items: values.map(s => ({ id: s, text: s })), onRemove });\n }\n } else {\n setSelected(undefined);\n }\n\n return () => {\n subscribed = false;\n };\n }, [values, rhs, parameters, selectedField.id, selectedField.possibleValues]);\n\n return (\n <ComboBox\n ref={inputRef}\n mode={mode}\n label={label ?? t('condition_builder_possible_values_label')}\n placeholder={placeholder}\n value={filterValue}\n onChange={e => {\n setFilterValue(e.target.value);\n if (mode === 'single-select' && !e.target.value) onChange('');\n }}\n onBlur={() => {\n onBlur?.(values);\n setFilterValue('');\n }}\n menu={{\n items,\n onItemClick: id => {\n if (mode === 'single-select') {\n setFilterValue('');\n onChange(id);\n } else {\n onChange(\n (() => {\n const current = values as string[];\n return current.includes(id)\n ? current.filter(selection => selection !== id)\n : [...values, id];\n })()\n );\n }\n },\n loading,\n loadMore: hasMore ? () => fetchPossibleValues(false) : undefined,\n accent: createStringMatcher(filterValue)\n }}\n onMenuOpen={() => fetchPossibleValues(true)}\n selected={selected}\n status={status}\n info={info}\n />\n );\n};\n\nexport default ValueSelector;\n"]}

package/lib/components/ConditionBuilder/RhsControls/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AAcjE,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAMpF,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAyC3F;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,MAAM,EAAE,KAAK,EAAE,EACf,SAAS,CAAC,EAAE,SAAS,EACrB,UAAU,GAAE,OAAe,GAC1B,OAAO,~~CA+FT~~;AAED,wHAAwH;AACxH,wBAAgB,aAAa,CAC3B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,EAC3B,aAAa,CAAC,EAAE,mBAAmB,GAClC,aAAa,CAAC,KAAK,CAAC,CAgDtB;AAID,wBAAgB,qBAAqB,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAG,MAAM,CAkBtF;AAED,yDAAyD;AACzD,UAAU,eAAgB,SAAQ,SAAS;IACzC,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,mCAAmC;IACnC,UAAU,EAAE,UAAU,CAAC;IAEvB,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,4EAA4E;IAC5E,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,gDAAgD;IAChD,QAAQ,EAAE,CAAC,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEhE,+DAA+D;IAC/D,cAAc,EAAE,OAAO,CAAC;IAExB,0BAA0B;IAC1B,aAAa,EAAE,KAAK,GAAG,QAAQ,CAAC;IAEhC,uDAAuD;IACvD,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAE5B,oHAAoH;IACpH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IAEpC,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;AAED,+DAA+D;AAC/D,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,~~CAublE~~,CAAC;AACF,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ConditionBuilder/RhsControls/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAe,GAAG,EAAE,MAAM,OAAO,CAAC;AAcjE,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAMpF,OAAO,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACpE,OAAO,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAyC3F;;;;;;GAMG;AACH,wBAAgB,UAAU,CACxB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EACzB,MAAM,EAAE,KAAK,EAAE,EACf,SAAS,CAAC,EAAE,SAAS,EACrB,UAAU,GAAE,OAAe,GAC1B,OAAO,CAiGT;AAED,wHAAwH;AACxH,wBAAgB,aAAa,CAC3B,SAAS,EAAE,SAAS,EACpB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,EAC3B,aAAa,CAAC,EAAE,mBAAmB,GAClC,aAAa,CAAC,KAAK,CAAC,CAgDtB;AAID,wBAAgB,qBAAqB,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAG,MAAM,CAkBtF;AAED,yDAAyD;AACzD,UAAU,eAAgB,SAAQ,SAAS;IACzC,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,mCAAmC;IACnC,UAAU,EAAE,UAAU,CAAC;IAEvB,4BAA4B;IAC5B,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAE1B,4EAA4E;IAC5E,MAAM,EAAE,KAAK,EAAE,CAAC;IAEhB,gDAAgD;IAChD,QAAQ,EAAE,CAAC,GAAG,EAAE,aAAa,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAEhE,+DAA+D;IAC/D,cAAc,EAAE,OAAO,CAAC;IAExB,0BAA0B;IAC1B,aAAa,EAAE,KAAK,GAAG,QAAQ,CAAC;IAEhC,uDAAuD;IACvD,aAAa,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IAE5B,oHAAoH;IACpH,aAAa,CAAC,EAAE,mBAAmB,CAAC;IAEpC,wBAAwB;IACxB,MAAM,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;CAC3B;AAED,+DAA+D;AAC/D,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAoblE,CAAC;AACF,eAAe,WAAW,CAAC"}

package/lib/components/ConditionBuilder/RhsControls/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useMemo } from 'react';
 import { DateInput, DateTimeInput, Flex, Input, hasProp, TimeInput, useI18n, DateRangeInput, TimeRangeInput, NumberRangeInput } from '@pega/cosmos-react-core';
-import { convertTimeValueToMs, convertMsToTimeValue } from '../core/time-utils';
+import { convertTimeValueToMs } from '../core/time-utils';
 import { getItem } from '../core/utils';
 import ValueSelector from './ValueSelector';
 import FieldSelector from './FieldSelector';
@@ -102,8 +102,11 @@ export function isValidRhs(rhs, lhs, fields, fieldType, trimValues = false) {
             !isValidLiteralValue(rhs.end, fieldType, trimValues)) {
             return false;
         }
-        if (typeof rhs.start === 'number' && typeof rhs.end === 'number') {
-            return rhs.start < rhs.end;
+        if (fieldType === 'TIME_ONLY') {
+            if (typeof rhs.start === 'number' && typeof rhs.end === 'number')
+                return rhs.start < rhs.end;
+            if (typeof rhs.start === 'string' && typeof rhs.end === 'string')
+                return convertTimeValueToMs(rhs.start) < convertTimeValueToMs(rhs.end);
         }
         const startDate = new Date(rhs.start);
         const endDate = new Date(rhs.end);
@@ -263,9 +266,7 @@ const RhsControls = (props) => {
             return;
         }
         const truncatedValue = truncateISODateString(valueAsISOString, fieldType); // Truncate to return a wall time as per spec
-        onChange({
-            value: fieldType === 'TIME_ONLY' ? convertTimeValueToMs(truncatedValue) : truncatedValue
-        });
+        onChange({ value: truncatedValue });
     };
     const handleDateRangeValueChange = ({ start, end }) => {
         if (start.valueAsTimestamp === undefined && end.valueAsTimestamp === undefined) {
@@ -285,11 +286,8 @@ const RhsControls = (props) => {
             truncateISODateString(end.valueAsISOString, fieldType)
         ];
         const onChangeParam = {
-            start: (fieldType === 'TIME_ONLY'
-                ? convertTimeValueToMs(truncatedStartValue)
-                : truncatedStartValue) ?? '',
-            end: (fieldType === 'TIME_ONLY' ? convertTimeValueToMs(truncatedEndValue) : truncatedEndValue) ??
-                ''
+            start: truncatedStartValue ?? '',
+            end: truncatedEndValue ?? ''
         };
         if (start.valueAsTimestamp &&
             end.valueAsTimestamp &&
@@ -334,11 +332,11 @@ const RhsControls = (props) => {
             alignItems: itemDirection === 'column' ? 'stretch' : alignItems,
             justify: 'between',
             gap: 0.5
-        }, children: [_jsx(RhsModeSwitch, { parameters: parameters, fieldType: fieldType, comparator: comparator, rhs: rhs, onChange: onChange, mode: itemDirection === 'column' ? 'combo-box' : 'menu-button', validRhsTypes: validRhsTypes, dateFunctions: dateFunctions }), hasProp(rhs, 'field') && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { value: rhs.field, onChange: handleFieldChange, fields: fieldOptions, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : undefined, label: t('condition_builder_compare_with_another_field') }) })), hasProp(rhs, 'parameterId') && (_jsxs(Flex, { item: { grow: 1 }, children: [parameters.length === 1 && (_jsx(Input, { value: parameters[0].primary.toString(), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_empty_value_text') : undefined, name: 'rhs-text-parameter-input', label: t('condition_builder_value_label'), readOnly: true })), parameters.length > 1 && (_jsx(ValueSelector, { parameters: parameters, mode: 'single-select', values: rhs.parameterId.toString(), selectedField: matchingField, rhs: rhs, comparator: comparator, onChange: handleValueSelection, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_empty_selection_error_text') : undefined, label: t('condition_builder_value_label') }))] })), hasProp(rhs, 'value') && !hasProp(rhs, 'dateFunction') && (_jsxs(Flex, { item: { grow: 1 }, children: [fieldType === 'TEXT' && useValueSelector && (_jsx(ValueSelector, { parameters: parameters, mode: 'single-select', values: rhs.value.toString(), selectedField: matchingField, comparator: comparator, rhs: rhs, onChange: handleValueSelection, status: showError || apiError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : apiError, setApiError: setApiError, label: t('condition_builder_value_label') })), fieldType === 'TEXT' && !useValueSelector && (_jsx(Input, { value: rhs.value.toString(), onChange: handleValueChange, status: showError ? 'error' : undefined, info: showError ? t('empty_value') : undefined, name: 'rhs-text-literal-input', label: t('condition_builder_value_label') })), (fieldType === 'DECIMAL' || fieldType === 'INTEGER') && (_jsx(NumericInput, { rhs: rhs, onChange: onChange, allowDecimal: fieldType !== 'INTEGER', status: showError ? 'error' : undefined })), fieldType === 'TIME_ONLY' && (_jsx(TimeInput, { value: rhs.value !== '' ? convertMsToTimeValue(Number(rhs.value)) : undefined, withSeconds: true, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_time') : '', label: t('condition_builder_value_label') })), fieldType === 'DATE_ONLY' && (_jsx(DateInput, { value: rhs.value, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date') : '', label: t('condition_builder_value_label') })), fieldType === 'DATE_TIME' && (_jsx(DateTimeInput, { value: rhs.value !== '' ? rhs.value : undefined, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date') : '', label: t('condition_builder_value_label') }))] })), (fieldType === 'DATE_ONLY' || fieldType === 'DATE_TIME') &&
-                (hasProp(rhs, 'relativeDate') || hasProp(rhs, 'dateFunction')) && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(TimePeriodComp, { rhs: rhs, fieldType: fieldType, onChange: onChange, dateFunctionsList: dateFunctions ? dateFunctions[fieldType] : [], status: showError ? 'error' : undefined }) })), hasProp(rhs, 'values') && (_jsxs(Flex, { item: { grow: 1 }, children: [useValueSelector && (_jsx(ValueSelector, { parameters: parameters, mode: 'multi-select', values: rhs.values.map(String), selectedField: matchingField, comparator: comparator, rhs: rhs, onChange: handleValueSelection, status: showError || apiError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : apiError, setApiError: setApiError, label: t('condition_builder_value_label') })), !useValueSelector && (_jsx(Input, { value: csvInput, onChange: handleCSVChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_values') : undefined, label: t('condition_builder_value_label'), placeholder: t('condition_builder_enter_csv_placeholder') }))] })), hasProp(rhs, 'start') && (_jsxs(Flex, { item: { grow: 1 }, children: [(fieldType === 'DECIMAL' || fieldType === 'INTEGER') && (_jsx(NumberRangeInput, { value: { start: rhs.start.toString(), end: rhs.end.toString() }, onChange: handleNumberRangeValueChange, status: showError ? 'error' : undefined, label: t('condition_builder_value_label'), info: showError ? t('condition_builder_invalid_number_range') : undefined, handle: handle, numberOfDecimals: fieldType === 'INTEGER' ? 0 : undefined })), fieldType === 'DATE_ONLY' && (_jsx(DateRangeInput, { value: { start: rhs.start, end: rhs.end }, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date_range') : '' })), fieldType === 'TIME_ONLY' && (_jsx(TimeRangeInput, { mode: 'time', value: {
+        }, children: [_jsx(RhsModeSwitch, { parameters: parameters, fieldType: fieldType, comparator: comparator, rhs: rhs, onChange: onChange, mode: itemDirection === 'column' ? 'combo-box' : 'menu-button', validRhsTypes: validRhsTypes, dateFunctions: dateFunctions }), hasProp(rhs, 'field') && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(FieldSelector, { value: rhs.field, onChange: handleFieldChange, fields: fieldOptions, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : undefined, label: t('condition_builder_compare_with_another_field') }) })), hasProp(rhs, 'parameterId') && (_jsxs(Flex, { item: { grow: 1 }, children: [parameters.length === 1 && (_jsx(Input, { value: parameters[0].primary.toString(), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_empty_value_text') : undefined, name: 'rhs-text-parameter-input', label: t('condition_builder_value_label'), readOnly: true })), parameters.length > 1 && (_jsx(ValueSelector, { parameters: parameters, mode: 'single-select', values: rhs.parameterId.toString(), selectedField: matchingField, rhs: rhs, comparator: comparator, onChange: handleValueSelection, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_empty_selection_error_text') : undefined, label: t('condition_builder_value_label'), placeholder: t('condition_builder_single_selection_placeholder') }))] })), hasProp(rhs, 'value') && !hasProp(rhs, 'dateFunction') && (_jsxs(Flex, { item: { grow: 1 }, children: [fieldType === 'TEXT' && useValueSelector && (_jsx(ValueSelector, { parameters: parameters, mode: 'single-select', values: rhs.value.toString(), selectedField: matchingField, comparator: comparator, rhs: rhs, onChange: handleValueSelection, status: showError || apiError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : apiError, setApiError: setApiError, label: t('condition_builder_value_label'), placeholder: t('condition_builder_single_selection_placeholder') })), fieldType === 'TEXT' && !useValueSelector && (_jsx(Input, { value: rhs.value.toString(), onChange: handleValueChange, status: showError ? 'error' : undefined, info: showError ? t('empty_value') : undefined, name: 'rhs-text-literal-input', label: t('condition_builder_value_label') })), (fieldType === 'DECIMAL' || fieldType === 'INTEGER') && (_jsx(NumericInput, { rhs: rhs, onChange: onChange, allowDecimal: fieldType !== 'INTEGER', status: showError ? 'error' : undefined })), fieldType === 'TIME_ONLY' && (_jsx(TimeInput, { value: rhs.value === '' ? undefined : rhs.value, withSeconds: true, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_time') : '', label: t('condition_builder_value_label') })), fieldType === 'DATE_ONLY' && (_jsx(DateInput, { value: rhs.value, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date') : '', label: t('condition_builder_value_label') })), fieldType === 'DATE_TIME' && (_jsx(DateTimeInput, { value: rhs.value !== '' ? rhs.value : undefined, onChange: handleDateValueChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date') : '', label: t('condition_builder_value_label') }))] })), (fieldType === 'DATE_ONLY' || fieldType === 'DATE_TIME') &&
+                (hasProp(rhs, 'relativeDate') || hasProp(rhs, 'dateFunction')) && (_jsx(Flex, { item: { grow: 1 }, children: _jsx(TimePeriodComp, { rhs: rhs, fieldType: fieldType, onChange: onChange, dateFunctionsList: dateFunctions ? dateFunctions[fieldType] : [], status: showError ? 'error' : undefined }) })), hasProp(rhs, 'values') && (_jsxs(Flex, { item: { grow: 1 }, children: [useValueSelector && (_jsx(ValueSelector, { parameters: parameters, mode: 'multi-select', values: rhs.values.map(String), selectedField: matchingField, comparator: comparator, rhs: rhs, onChange: handleValueSelection, status: showError || apiError ? 'error' : undefined, info: showError ? t('condition_builder_no_selection') : apiError, setApiError: setApiError, label: t('condition_builder_value_label'), placeholder: t('condition_builder_multi_selection_placeholder') })), !useValueSelector && (_jsx(Input, { value: csvInput, onChange: handleCSVChange, status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_values') : undefined, label: t('condition_builder_value_label'), placeholder: t('condition_builder_enter_csv_placeholder') }))] })), hasProp(rhs, 'start') && (_jsxs(Flex, { item: { grow: 1 }, children: [(fieldType === 'DECIMAL' || fieldType === 'INTEGER') && (_jsx(NumberRangeInput, { value: { start: rhs.start.toString(), end: rhs.end.toString() }, onChange: handleNumberRangeValueChange, status: showError ? 'error' : undefined, label: t('condition_builder_value_label'), info: showError ? t('condition_builder_invalid_number_range') : undefined, handle: handle, numberOfDecimals: fieldType === 'INTEGER' ? 0 : undefined })), fieldType === 'DATE_ONLY' && (_jsx(DateRangeInput, { value: { start: rhs.start, end: rhs.end }, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date_range') : '' })), fieldType === 'TIME_ONLY' && (_jsx(TimeRangeInput, { mode: 'time', value: {
                             start: rhs.start === '' ? undefined : rhs.start,
                             end: rhs.end === '' ? undefined : rhs.end
-                        }, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_time_range') : '' })), fieldType === 'DATE_TIME' && (_jsx(TimeRangeInput, { mode: 'datetime', value: { start: rhs.start, end: rhs.end }, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date_range') : '' }))] }))] }));
+                        }, withSeconds: true, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_time_range') : '' })), fieldType === 'DATE_TIME' && (_jsx(TimeRangeInput, { mode: 'datetime', value: { start: rhs.start, end: rhs.end }, onChange: handleDateRangeValueChange, label: t('condition_builder_value_label'), status: showError ? 'error' : undefined, info: showError ? t('condition_builder_invalid_date_range') : '' }))] }))] }));
 };
 export default RhsControls;
 //# sourceMappingURL=index.js.map