impact-chatbot 2.3.42 → 2.3.43

package/dist/index.cjs.js

@@ -5790,6 +5790,15 @@ const SliderContent = ({ bodyText, isFormDisabled = false, messageIndex }) => {
     return (jsxRuntime.jsx("div", { style: { width: "100%", marginTop: "10px" }, children: jsxRuntime.jsx(impactUiV3.Slider, { header: header, headerOrientation: headerOrentiation, inputPosition: inputPosition, label: label, max: max, min: min, required: required, disabled: disabled || isFormDisabled, onChange: (e) => handleChange(e), value: sliderValue }) }));
 };
 
+const INITIAL_DISPLAY_COUNT = 100;
+const LOAD_MORE_COUNT = 100;
+const formatOption = (option) => ({
+    ...option,
+    label: replaceSpecialCharacter(option.label.toString()),
+});
+const formatSlice = (options, start, end) => {
+    return options.slice(start, end).map(formatOption);
+};
 const SelectContent = ({ bodyText, isFormDisabled = false, messageIndex }) => {
     const formKey = `${messageIndex}_${bodyText?.paramName}`;
     const { header, inputPosition, labelOrientation, label, options, isRequired, isDisabled, isMulti, paramName } = bodyText;
@@ -5799,6 +5808,7 @@ const SelectContent = ({ bodyText, isFormDisabled = false, messageIndex }) => {
     const [currentSelectedOptions, setCurrentSelectedOptions] = React.useState(persistedFormValues?.[formKey] || []);
     const [isAllSelected, setIsAllSelected] = React.useState(false);
     const [initialOptions, setInitialOptions] = React.useState([]);
+    const allOptionsRef = React.useRef([]);
     const chatbotContext = reactRedux.useSelector((state) => state.smartBotReducer.chatbotContext);
     const heirarchyKeyValuePairs = reactRedux.useSelector((state) => state.smartBotReducer.heirarchyKeyValuePairs);
     const dispatch = reactRedux.useDispatch();
@@ -5837,19 +5847,46 @@ const SelectContent = ({ bodyText, isFormDisabled = false, messageIndex }) => {
         }
     }, [persistedFormValues, formKey]);
     React.useEffect(() => {
-        let formattedOptions = options.map((option) => {
-            return {
-                ...option,
-                label: replaceSpecialCharacter(option.label.toString()),
-            };
-        });
-        setInitialOptions(formattedOptions);
-        setCurrentOptions(formattedOptions);
+        allOptionsRef.current = options;
+        const initialSlice = formatSlice(options, 0, INITIAL_DISPLAY_COUNT);
+        setInitialOptions(initialSlice);
+        setCurrentOptions(initialSlice);
     }, []);
     return (jsxRuntime.jsx("div", { style: { width: "100%", marginTop: "10px" }, children: jsxRuntime.jsx(impactUiV3.Select, { currentOptions: currentOptions, setCurrentOptions: setCurrentOptions, label: heirarchyKeyValuePairs[paramName] || label, labelOrientation: labelOrientation, 
             // inputPosition={inputPosition}
             // header={header}
-            isRequired: isRequired, isDisabled: isDisabled || isFormDisabled, handleChange: (selected) => onChange(selected), isCloseWhenClickOutside: true, setIsOpen: setIsOpen, isOpen: isOpen, selectedOptions: currentSelectedOptions, setSelectedOptions: setCurrentSelectedOptions, initialOptions: initialOptions, isMulti: isMulti, isSelectAll: isAllSelected, setIsSelectAll: setIsAllSelected, toggleSelectAll: true, isWithSearch: isMulti ? true : false }) }));
+            isRequired: isRequired, isDisabled: isDisabled || isFormDisabled, handleChange: (selected) => onChange(selected), isCloseWhenClickOutside: true, setIsOpen: setIsOpen, isOpen: isOpen, selectedOptions: currentSelectedOptions, setSelectedOptions: setCurrentSelectedOptions, initialOptions: initialOptions, isMulti: isMulti, isSelectAll: isAllSelected, setIsSelectAll: setIsAllSelected, toggleSelectAll: true, isWithSearch: isMulti ? true : false, onMenuScrollToBottom: () => {
+                const allRaw = allOptionsRef.current;
+                if (allRaw.length > 0 && currentOptions.length < allRaw.length) {
+                    const nextCount = Math.min(currentOptions.length + LOAD_MORE_COUNT, allRaw.length);
+                    const newBatch = formatSlice(allRaw, currentOptions.length, nextCount);
+                    const nextOptions = [...currentOptions, ...newBatch];
+                    setCurrentOptions(nextOptions);
+                    setInitialOptions(nextOptions);
+                    if (isAllSelected) {
+                        setCurrentSelectedOptions(nextOptions);
+                    }
+                }
+            }, onSelectAll: (e) => {
+                if (e && e.target.checked) {
+                    setCurrentSelectedOptions([...currentOptions]);
+                    setIsAllSelected(true);
+                    const allValues = allOptionsRef.current.map((opt) => opt.value);
+                    chatbotContext[bodyText?.paramName] = {
+                        ...chatbotContext?.[bodyText?.paramName],
+                        [bodyText?.paramName]: allValues,
+                        updated: true,
+                    };
+                    dispatch(smartBotActions.setChatbotContext(chatbotContext));
+                    dispatch(smartBotActions.setPersistedFormValues({ [formKey]: currentOptions }));
+                }
+                else {
+                    setCurrentSelectedOptions([]);
+                    setIsAllSelected(false);
+                }
+            }, customPlaceholderAfterSelect: isAllSelected && allOptionsRef.current.length > 0
+                ? allOptionsRef.current.length
+                : null }) }));
 };
 
 const DatePickerContent = ({ bodyText, isFormDisabled = false, messageIndex }) => {
@@ -7003,7 +7040,7 @@ const StreamedContent = ({ botData }) => {
                                 widgets: [...formWidgetData, stepFormSubmitButton],
                                 showSavedFilters: data.show_saved_filters !== false,
                             };
-                            setStepFormDataMap(lodash.cloneDeep(stepFormDataMapRef.current));
+                            setStepFormDataMap({ ...stepFormDataMapRef.current });
                         }
                         setStepChange((prev) => !prev);
                         // Persist IDs immediately when step_form arrives (AxiosEventSource already set them)
@@ -7242,7 +7279,7 @@ const StreamedContent = ({ botData }) => {
                     currentTabValue: stepsDone ? "agent_response" : undefined,
                     questions: lodash.cloneDeep(questionsRef.current),
                     questionsStepsMap: lodash.cloneDeep(questionsStepsMapRef.current),
-                    stepFormDataMap: lodash.cloneDeep(stepFormDataMapRef.current),
+                    stepFormDataMap: { ...stepFormDataMapRef.current },
                 }, activeConversationId);
                 // [
                 //   {
@@ -7328,7 +7365,7 @@ const StreamedContent = ({ botData }) => {
                     currentTabValue: stepsDone ? "agent_response" : undefined,
                     questions: lodash.cloneDeep(questionsRef.current),
                     questionsStepsMap: lodash.cloneDeep(questionsStepsMapRef.current),
-                    stepFormDataMap: lodash.cloneDeep(stepFormDataMapRef.current),
+                    stepFormDataMap: { ...stepFormDataMapRef.current },
                 }, activeConversationId);
             }
             // Clean up module-level Map entry - stream is fully processed