@clikvn/agent-widget-embedded 1.1.5-dev-19 → 1.1.5-dev-21

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/UserContactForm.js

@@ -1,19 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { motion } from 'framer-motion';
 import { useConfiguration } from 'hooks/useConfiguration';
-import { useEffect, useState } from 'react';
-import { isEmptyString, validateEmail } from 'utils/functionUtils';
+import { useState } from 'react';
 import { isValidPhoneNumber, parsePhoneNumber, } from 'react-phone-number-input';
-import { generateUUID } from 'utils/commonUtils';
+import { createUserContact, getUserContact, } from 'services/userContact.service';
+import { isEmptyString, validateEmail } from 'utils/functionUtils';
 import { FacebookMessageIcon, ZaloIcon } from './Icons';
 import PhoneNumberInput from './ui/PhoneNumberInput';
 import Spinner from './ui/Spinner';
-import { createUserContact, getUserContact, } from 'services/userContact.service';
 const UserContactForm = () => {
     const { theme, apiHost } = useConfiguration();
     const [formData, setFormData] = useState({
         name: '',
-        contact: undefined,
+        contact: '',
         email: '',
     });
     const [loading, setLoading] = useState(false);
@@ -59,11 +58,33 @@ const UserContactForm = () => {
             return undefined;
         const phoneNumberData = parsePhoneNumber(value);
         return {
-            primaryPhoneNumber: phoneNumberData?.number,
+            primaryPhoneNumber: phoneNumberData?.nationalNumber,
             primaryPhoneCountryCode: phoneNumberData?.country,
-            primaryPhoneCallingCode: phoneNumberData?.countryCallingCode,
+            primaryPhoneCallingCode: `+${phoneNumberData?.countryCallingCode}`,
         };
     };
+    const getUserContactExisted = async () => {
+        const params = {};
+        if (formData?.email) {
+            params.email = formData?.email;
+        }
+        if (formData?.contact) {
+            params.contact = getPhoneData(formData?.contact)?.primaryPhoneNumber;
+        }
+        const res = await getUserContact(apiHost, { ...params });
+        if (res && res?.length) {
+            return res[0];
+        }
+        return undefined;
+    };
+    const handleSubmitSuccess = (id) => {
+        localStorage.setItem('userId', id);
+        setDisabled(true);
+        setStatusSubmit({
+            message: theme?.userContactForm?.messages?.submitSuccess || 'Submit successful',
+            status: 200,
+        });
+    };
     const handleSubmit = async (e) => {
         e.preventDefault();
         setLoading(true);
@@ -74,8 +95,21 @@ const UserContactForm = () => {
                 return;
             }
             setErrors({});
+            const userContactExisted = await getUserContactExisted();
+            if (userContactExisted && userContactExisted?.id) {
+                const contact = userContactExisted?.phones?.primaryPhoneNumber
+                    ? `${userContactExisted?.phones?.primaryPhoneCallingCode}${userContactExisted?.phones?.primaryPhoneNumber}`
+                    : '';
+                setFormData((prevData) => ({
+                    ...prevData,
+                    name: userContactExisted?.name?.firstName || '',
+                    contact: contact,
+                    email: userContactExisted?.emails?.primaryEmail || '',
+                }));
+                handleSubmitSuccess(userContactExisted.id);
+                return;
+            }
             const requestData = {
-                sessionId: `${formData?.email || formData?.contact}-${generateUUID()}`,
                 name: {
                     firstName: formData.name,
                     lastName: '',
@@ -86,14 +120,8 @@ const UserContactForm = () => {
                 },
             };
             const res = await createUserContact(requestData, apiHost);
-            if (res?.sessionId) {
-                localStorage.setItem('sessionId', res.sessionId);
-                setDisabled(true);
-                setStatusSubmit({
-                    message: theme?.userContactForm?.messages?.submitSuccess ||
-                        'Submit successful',
-                    status: 200,
-                });
+            if (res?.id) {
+                handleSubmitSuccess(res.id);
             }
         }
         catch (error) {
@@ -113,27 +141,7 @@ const UserContactForm = () => {
             contact: val,
         }));
     };
-    const getUserContactData = async () => {
-        const sessionId = localStorage.getItem('sessionId');
-        if (sessionId) {
-            const res = await getUserContact(apiHost, { sessionId });
-            const contact = `+${res?.phones?.primaryPhoneCallingCode}${res?.phones?.primaryPhoneNumber}`;
-            setFormData((prevData) => ({
-                ...prevData,
-                name: res?.name?.firstName,
-                contact: contact,
-                email: res?.emails?.primaryEmail,
-            }));
-            setDisabled(true);
-        }
-    };
-    useEffect(() => {
-        const sessionId = localStorage.getItem('sessionId');
-        if (sessionId) {
-            getUserContactData();
-        }
-    }, []);
-    return (_jsx(motion.div, { className: "w-full mx-auto max-w-[358px] px-4 group/message", initial: { y: 5, opacity: 0 }, animate: { y: 0, opacity: 1 }, children: _jsxs("form", { className: "flex flex-col gap-3 bg-white px-3 py-3 pb-4 rounded-lg w-full", onSubmit: handleSubmit, children: [_jsx("div", { className: "text-[#18181B] font-semibold text-base", children: theme?.userContactForm?.title || 'Your contact' }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-full-name", children: theme?.userContactForm?.labelName || 'Name' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx("input", { className: `rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.name ? 'border-red-500' : 'border-[#E2E8F0]'}`, id: "name", name: "name", type: "text", placeholder: theme?.userContactForm?.labelName || 'Name', onChange: handleChange, value: formData?.name || '', disabled: disabled }), !!errors?.name && (_jsx("span", { className: "text-red-500 text-sm mt-1", children: errors.name }))] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-contact", children: theme?.userContactForm?.labelContact || 'Contact' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx(PhoneNumberInput, { onChange: handleChangeContact, placeholder: theme?.userContactForm?.labelContact || 'Contact', value: formData?.contact, disabled: disabled }), !!errors?.contact && (_jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.contact }))] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-email", children: theme?.userContactForm?.labelEmail || 'Email' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx("input", { className: `rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.host ? 'border-red-500' : 'border-[#E2E8F0]'}`, id: "email", name: "email", placeholder: theme?.userContactForm?.labelContact || 'Email', onChange: handleChange, value: formData?.email || '', type: "email", disabled: disabled }), !!errors?.host && (_jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.host }))] })] })] }), statusSubmit && (_jsx("div", { className: "flex items-center w-full justify-center", children: _jsx("p", { className: `text-green-500 text-sm mt-1 ${statusSubmit?.status === 200 ? 'text-green-500' : 'text-red-500'}`, children: statusSubmit.message }) })), _jsx("div", { className: "flex items-center", children: _jsx("div", { className: "w-full", children: _jsx("button", { className: `shadow bg-[#1E6EB4] hover:bg-[#4096ff] focus:shadow-outline focus:outline-none text-white font-bold py-2 px-8 rounded-lg w-full h-[40px] disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${loading ? 'flex items-center justify-center' : ''}`, type: "submit", disabled: disabled, children: loading ? (_jsx(Spinner, {})) : (`${theme?.buttons?.textBtnSubmit || 'Submit'}`) }) }) }), _jsxs("div", { className: "flex flex-col gap-3 items-center", children: [_jsx("div", { className: "font-medium text-[14px] leading-[14px] text-[#18181B]", children: theme?.userContactForm?.orConnect || 'Or connect with' }), _jsxs("div", { className: "flex gap-4", children: [_jsx(ZaloIcon, {}), _jsx(FacebookMessageIcon, {})] })] })] }) }));
+    return (_jsx(motion.div, { className: "w-full mx-auto max-w-[358px] px-4 group/message", initial: { y: 5, opacity: 0 }, animate: { y: 0, opacity: 1 }, children: _jsxs("form", { className: "flex flex-col gap-3 bg-white px-3 py-3 pb-4 rounded-lg w-full", onSubmit: handleSubmit, children: [_jsx("div", { className: "text-[#18181B] font-semibold text-base", children: theme?.userContactForm?.title || 'Your contact' }), _jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-full-name", children: theme?.userContactForm?.labelName || 'Name' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx("input", { className: `rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.name ? 'border-red-500' : 'border-[#E2E8F0]'}`, id: "name", name: "name", type: "text", placeholder: theme?.userContactForm?.labelName || 'Name', onChange: handleChange, value: formData?.name || '', disabled: disabled }), !!errors?.name && (_jsx("span", { className: "text-red-500 text-sm mt-1", children: errors.name }))] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-contact", children: theme?.userContactForm?.labelContact || 'Contact' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx(PhoneNumberInput, { onChange: handleChangeContact, placeholder: theme?.userContactForm?.labelContact || 'Contact', value: formData?.contact, disabled: disabled }), !!errors?.contact && (_jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.contact }))] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("label", { className: "w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]", htmlFor: "inline-email", children: theme?.userContactForm?.labelEmail || 'Email' }), _jsxs("div", { className: "flex flex-col gap-3 w-full", children: [_jsx("input", { className: `rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.host ? 'border-red-500' : 'border-[#E2E8F0]'}`, id: "email", name: "email", placeholder: theme?.userContactForm?.labelContact || 'Email', onChange: handleChange, value: formData?.email || '', type: "email", disabled: disabled }), !!errors?.host && (_jsx("p", { className: "text-red-500 text-sm mt-1", children: errors.host }))] })] })] }), statusSubmit && (_jsx("div", { className: "flex items-center w-full justify-center", children: _jsx("p", { className: `text-green-500 text-sm mt-1 ${statusSubmit?.status === 200 ? 'text-green-500' : 'text-red-500'}`, children: statusSubmit.message }) })), _jsx("div", { className: "flex items-center", children: _jsx("div", { className: "w-full", children: _jsx("button", { className: `shadow bg-[#1E6EB4] hover:bg-[#4096ff] focus:shadow-outline focus:outline-none text-white font-bold py-2 px-8 rounded-lg w-full h-[40px] disabled:text-[#00000040] disabled:cursor-not-allowed disabled:bg-[#0000000a] ${loading ? 'flex items-center justify-center' : ''}`, type: "submit", disabled: disabled, children: loading ? (_jsx(Spinner, {})) : (`${theme?.buttons?.textBtnSubmit || 'Submit'}`) }) }) }), _jsxs("div", { className: "flex flex-col gap-3 items-center", children: [_jsx("div", { className: "font-medium text-[14px] leading-[14px] text-[#18181B]", children: theme?.userContactForm?.orConnect || 'Or connect with' }), _jsxs("div", { className: "flex gap-4", children: [_jsx(ZaloIcon, {}), _jsx(FacebookMessageIcon, {})] })] })] }) }));
 };
 export default UserContactForm;
 //# sourceMappingURL=UserContactForm.js.map

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/UserContactForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserContactForm.js","sourceRoot":"","sources":["../../../src/components/Chat/UserContactForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { motion } from 'framer-motion';\nimport { useConfiguration } from 'hooks/useConfiguration';\nimport { FC, useEffect, useState } from 'react';\nimport { isEmptyString, validateEmail } from 'utils/functionUtils';\n\nimport {\n  isValidPhoneNumber,\n  parsePhoneNumber,\n  Value,\n} from 'react-phone-number-input';\nimport { UserContactType } from 'types/userContact.type';\nimport { generateUUID } from 'utils/commonUtils';\nimport { FacebookMessageIcon, ZaloIcon } from './Icons';\nimport PhoneNumberInput from './ui/PhoneNumberInput';\nimport Spinner from './ui/Spinner';\nimport {\n  createUserContact,\n  getUserContact,\n} from 'services/userContact.service';\nimport { FormErrors, StatusSubmitType } from 'constants/form';\n\ntype UserContactFormPropsType = {\n  theme?: Record<string, unknown>;\n};\n\ntype FormDataType = {\n  name: string;\n  contact: Value | undefined;\n  email: string;\n};\n\nconst UserContactForm: FC<UserContactFormPropsType> = () => {\n  const { theme, apiHost } = useConfiguration();\n  const [formData, setFormData] = useState<FormDataType>({\n    name: '',\n    contact: undefined,\n    email: '',\n  });\n  const [loading, setLoading] = useState(false);\n  const [statusSubmit, setStatusSubmit] = useState<StatusSubmitType>();\n  const [errors, setErrors] = useState<FormErrors>({});\n  const [disabled, setDisabled] = useState(false);\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const { name, value } = e.target;\n    setFormData((prevData) => ({\n      ...prevData,\n      [name]: value,\n    }));\n  };\n\n  const validateForm = () => {\n    const errors: FormErrors = {};\n    const messages = theme?.userContactForm?.messages;\n\n    if (isEmptyString(formData.name)) {\n      errors.name = messages?.nameError || 'Name is required';\n    }\n\n    const hasContact = !isEmptyString(formData.contact);\n    const hasEmail = !isEmptyString(formData.email);\n\n    if (!hasContact && !hasEmail) {\n      const message =\n        theme?.userContactForm?.messages?.needFillContactOrEmail ||\n        'You need to fill either contact or email';\n      errors.contact = message;\n      errors.host = message;\n      return errors;\n    }\n\n    if (hasContact && !isValidPhoneNumber(formData.contact!)) {\n      errors.contact =\n        theme?.userContactForm?.messages?.invalidContact ||\n        'Invalid contact number';\n    }\n\n    if (hasEmail && !validateEmail(formData.email!)) {\n      errors.host =\n        theme?.userContactForm?.messages?.invalidEmail ||\n        'Invalid email format';\n    }\n\n    return errors;\n  };\n\n  const getPhoneData = (value?: Value) => {\n    if (!value) return undefined;\n    const phoneNumberData = parsePhoneNumber(value as string);\n\n    return {\n      primaryPhoneNumber: phoneNumberData?.number,\n      primaryPhoneCountryCode: phoneNumberData?.country,\n      primaryPhoneCallingCode: phoneNumberData?.countryCallingCode,\n    };\n  };\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setLoading(true);\n    try {\n      const validationErrors = validateForm();\n      if (Object.keys(validationErrors)?.length) {\n        setErrors(validationErrors);\n        return;\n      }\n      setErrors({});\n\n      const requestData: UserContactType = {\n        sessionId: `${formData?.email || formData?.contact}-${generateUUID()}`,\n        name: {\n          firstName: formData.name,\n          lastName: '',\n        },\n        phones: getPhoneData(formData?.contact),\n        emails: {\n          primaryEmail: formData?.email || undefined,\n        },\n      };\n\n      const res = await createUserContact(requestData, apiHost);\n      if (res?.sessionId) {\n        localStorage.setItem('sessionId', res.sessionId);\n\n        setDisabled(true);\n        setStatusSubmit({\n          message:\n            theme?.userContactForm?.messages?.submitSuccess ||\n            'Submit successful',\n          status: 200,\n        });\n      }\n    } catch (error) {\n      console.error(error);\n      setStatusSubmit({\n        message:\n          theme?.userContactForm?.messages?.submitError || 'Failed to submit',\n        status: 500,\n      });\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const handleChangeContact = (val?: Value | undefined) => {\n    setFormData((prevData) => ({\n      ...prevData,\n      contact: val,\n    }));\n  };\n\n  const getUserContactData = async () => {\n    const sessionId = localStorage.getItem('sessionId');\n    if (sessionId) {\n      const res = await getUserContact(apiHost, { sessionId });\n      const contact = `+${res?.phones?.primaryPhoneCallingCode}${res?.phones?.primaryPhoneNumber}`;\n\n      setFormData((prevData) => ({\n        ...prevData,\n        name: res?.name?.firstName,\n        contact: contact as Value,\n        email: res?.emails?.primaryEmail,\n      }));\n      setDisabled(true);\n    }\n  };\n\n  useEffect(() => {\n    const sessionId = localStorage.getItem('sessionId');\n    if (sessionId) {\n      getUserContactData();\n    }\n  }, []);\n\n  return (\n    <motion.div\n      className=\"w-full mx-auto max-w-[358px] px-4 group/message\"\n      initial={{ y: 5, opacity: 0 }}\n      animate={{ y: 0, opacity: 1 }}\n    >\n      <form\n        className=\"flex flex-col gap-3 bg-white px-3 py-3 pb-4 rounded-lg w-full\"\n        onSubmit={handleSubmit}\n      >\n        <div className=\"text-[#18181B] font-semibold text-base\">\n          {theme?.userContactForm?.title || 'Your contact'}\n        </div>\n\n        <div className=\"flex flex-col gap-3\">\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-full-name\"\n            >\n              {theme?.userContactForm?.labelName || 'Name'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <input\n                className={`rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.name ? 'border-red-500' : 'border-[#E2E8F0]'}`}\n                id=\"name\"\n                name=\"name\"\n                type=\"text\"\n                placeholder={theme?.userContactForm?.labelName || 'Name'}\n                onChange={handleChange}\n                value={formData?.name || ''}\n                disabled={disabled}\n              />\n              {!!errors?.name && (\n                <span className=\"text-red-500 text-sm mt-1\">{errors.name}</span>\n              )}\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-contact\"\n            >\n              {theme?.userContactForm?.labelContact || 'Contact'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <PhoneNumberInput\n                onChange={handleChangeContact}\n                placeholder={theme?.userContactForm?.labelContact || 'Contact'}\n                value={formData?.contact}\n                disabled={disabled}\n              />\n              {!!errors?.contact && (\n                <p className=\"text-red-500 text-sm mt-1\">{errors.contact}</p>\n              )}\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-email\"\n            >\n              {theme?.userContactForm?.labelEmail || 'Email'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <input\n                className={`rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.host ? 'border-red-500' : 'border-[#E2E8F0]'}`}\n                id=\"email\"\n                name=\"email\"\n                placeholder={theme?.userContactForm?.labelContact || 'Email'}\n                onChange={handleChange}\n                value={formData?.email || ''}\n                type=\"email\"\n                disabled={disabled}\n              />\n              {!!errors?.host && (\n                <p className=\"text-red-500 text-sm mt-1\">{errors.host}</p>\n              )}\n            </div>\n          </div>\n        </div>\n\n        {statusSubmit && (\n          <div className=\"flex items-center w-full justify-center\">\n            <p\n              className={`text-green-500 text-sm mt-1 ${statusSubmit?.status === 200 ? 'text-green-500' : 'text-red-500'}`}\n            >\n              {statusSubmit.message}\n            </p>\n          </div>\n        )}\n\n        <div className=\"flex items-center\">\n          <div className=\"w-full\">\n            <button\n              className={`shadow bg-[#1E6EB4] hover:bg-[#4096ff] focus:shadow-outline focus:outline-none text-white font-bold py-2 px-8 rounded-lg w-full h-[40px] disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${loading ? 'flex items-center justify-center' : ''}`}\n              type=\"submit\"\n              disabled={disabled}\n            >\n              {loading ? (\n                <Spinner />\n              ) : (\n                `${theme?.buttons?.textBtnSubmit || 'Submit'}`\n              )}\n            </button>\n          </div>\n        </div>\n\n        <div className=\"flex flex-col gap-3 items-center\">\n          <div className=\"font-medium text-[14px] leading-[14px] text-[#18181B]\">\n            {theme?.userContactForm?.orConnect || 'Or connect with'}\n          </div>\n\n          <div className=\"flex gap-4\">\n            <ZaloIcon />\n            <FacebookMessageIcon />\n          </div>\n        </div>\n      </form>\n    </motion.div>\n  );\n};\n\nexport default UserContactForm;\n"]}
+{"version":3,"file":"UserContactForm.js","sourceRoot":"","sources":["../../../src/components/Chat/UserContactForm.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FormErrors, StatusSubmitType } from 'constants/form';\nimport { motion } from 'framer-motion';\nimport { useConfiguration } from 'hooks/useConfiguration';\nimport { FC, useState } from 'react';\nimport {\n  isValidPhoneNumber,\n  parsePhoneNumber,\n  Value,\n} from 'react-phone-number-input';\nimport {\n  createUserContact,\n  getUserContact,\n} from 'services/userContact.service';\nimport { UserContactType } from 'types/userContact.type';\nimport { isEmptyString, validateEmail } from 'utils/functionUtils';\nimport { FacebookMessageIcon, ZaloIcon } from './Icons';\nimport PhoneNumberInput from './ui/PhoneNumberInput';\nimport Spinner from './ui/Spinner';\n\ntype UserContactFormPropsType = {\n  theme?: Record<string, unknown>;\n};\n\ntype FormDataType = {\n  name: string;\n  contact: Value;\n  email: string;\n};\n\nconst UserContactForm: FC<UserContactFormPropsType> = () => {\n  const { theme, apiHost } = useConfiguration();\n  const [formData, setFormData] = useState<FormDataType>({\n    name: '',\n    contact: '' as Value,\n    email: '',\n  });\n  const [loading, setLoading] = useState(false);\n  const [statusSubmit, setStatusSubmit] = useState<StatusSubmitType>();\n  const [errors, setErrors] = useState<FormErrors>({});\n  const [disabled, setDisabled] = useState(false);\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    const { name, value } = e.target;\n    setFormData((prevData) => ({\n      ...prevData,\n      [name]: value,\n    }));\n  };\n\n  const validateForm = () => {\n    const errors: FormErrors = {};\n    const messages = theme?.userContactForm?.messages;\n\n    if (isEmptyString(formData.name)) {\n      errors.name = messages?.nameError || 'Name is required';\n    }\n\n    const hasContact = !isEmptyString(formData.contact);\n    const hasEmail = !isEmptyString(formData.email);\n\n    if (!hasContact && !hasEmail) {\n      const message =\n        theme?.userContactForm?.messages?.needFillContactOrEmail ||\n        'You need to fill either contact or email';\n      errors.contact = message;\n      errors.host = message;\n      return errors;\n    }\n\n    if (hasContact && !isValidPhoneNumber(formData.contact!)) {\n      errors.contact =\n        theme?.userContactForm?.messages?.invalidContact ||\n        'Invalid contact number';\n    }\n\n    if (hasEmail && !validateEmail(formData.email!)) {\n      errors.host =\n        theme?.userContactForm?.messages?.invalidEmail ||\n        'Invalid email format';\n    }\n\n    return errors;\n  };\n\n  const getPhoneData = (value?: Value) => {\n    if (!value) return undefined;\n    const phoneNumberData = parsePhoneNumber(value as string);\n\n    return {\n      primaryPhoneNumber: phoneNumberData?.nationalNumber,\n      primaryPhoneCountryCode: phoneNumberData?.country,\n      primaryPhoneCallingCode: `+${phoneNumberData?.countryCallingCode}`,\n    };\n  };\n\n  const getUserContactExisted = async () => {\n    const params: { email?: string; contact?: string } = {};\n\n    if (formData?.email) {\n      params.email = formData?.email;\n    }\n    if (formData?.contact) {\n      params.contact = getPhoneData(formData?.contact)?.primaryPhoneNumber;\n    }\n\n    const res = await getUserContact(apiHost, { ...params });\n    if (res && res?.length) {\n      return res[0];\n    }\n\n    return undefined;\n  };\n\n  const handleSubmitSuccess = (id: string) => {\n    localStorage.setItem('userId', id);\n    setDisabled(true);\n    setStatusSubmit({\n      message:\n        theme?.userContactForm?.messages?.submitSuccess || 'Submit successful',\n      status: 200,\n    });\n  };\n\n  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    setLoading(true);\n    try {\n      const validationErrors = validateForm();\n      if (Object.keys(validationErrors)?.length) {\n        setErrors(validationErrors);\n        return;\n      }\n      setErrors({});\n\n      const userContactExisted = await getUserContactExisted();\n      if (userContactExisted && userContactExisted?.id) {\n        const contact = userContactExisted?.phones?.primaryPhoneNumber\n          ? `${userContactExisted?.phones?.primaryPhoneCallingCode}${userContactExisted?.phones?.primaryPhoneNumber}`\n          : '';\n\n        setFormData((prevData) => ({\n          ...prevData,\n          name: userContactExisted?.name?.firstName || '',\n          contact: contact as Value,\n          email: userContactExisted?.emails?.primaryEmail || '',\n        }));\n        handleSubmitSuccess(userContactExisted.id);\n        return;\n      }\n\n      const requestData: UserContactType = {\n        name: {\n          firstName: formData.name,\n          lastName: '',\n        },\n        phones: getPhoneData(formData?.contact),\n        emails: {\n          primaryEmail: formData?.email || undefined,\n        },\n      };\n\n      const res = await createUserContact(requestData, apiHost);\n      if (res?.id) {\n        handleSubmitSuccess(res.id);\n      }\n    } catch (error) {\n      console.error(error);\n      setStatusSubmit({\n        message:\n          theme?.userContactForm?.messages?.submitError || 'Failed to submit',\n        status: 500,\n      });\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  const handleChangeContact = (val: Value) => {\n    setFormData((prevData) => ({\n      ...prevData,\n      contact: val,\n    }));\n  };\n\n  return (\n    <motion.div\n      className=\"w-full mx-auto max-w-[358px] px-4 group/message\"\n      initial={{ y: 5, opacity: 0 }}\n      animate={{ y: 0, opacity: 1 }}\n    >\n      <form\n        className=\"flex flex-col gap-3 bg-white px-3 py-3 pb-4 rounded-lg w-full\"\n        onSubmit={handleSubmit}\n      >\n        <div className=\"text-[#18181B] font-semibold text-base\">\n          {theme?.userContactForm?.title || 'Your contact'}\n        </div>\n\n        <div className=\"flex flex-col gap-3\">\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-full-name\"\n            >\n              {theme?.userContactForm?.labelName || 'Name'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <input\n                className={`rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.name ? 'border-red-500' : 'border-[#E2E8F0]'}`}\n                id=\"name\"\n                name=\"name\"\n                type=\"text\"\n                placeholder={theme?.userContactForm?.labelName || 'Name'}\n                onChange={handleChange}\n                value={formData?.name || ''}\n                disabled={disabled}\n              />\n              {!!errors?.name && (\n                <span className=\"text-red-500 text-sm mt-1\">{errors.name}</span>\n              )}\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-contact\"\n            >\n              {theme?.userContactForm?.labelContact || 'Contact'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <PhoneNumberInput\n                onChange={handleChangeContact}\n                placeholder={theme?.userContactForm?.labelContact || 'Contact'}\n                value={formData?.contact}\n                disabled={disabled}\n              />\n              {!!errors?.contact && (\n                <p className=\"text-red-500 text-sm mt-1\">{errors.contact}</p>\n              )}\n            </div>\n          </div>\n\n          <div className=\"flex items-center gap-2\">\n            <label\n              className=\"w-1/4 text-[#18181B] font-medium text-[14px] leading-[14px]\"\n              htmlFor=\"inline-email\"\n            >\n              {theme?.userContactForm?.labelEmail || 'Email'}\n            </label>\n\n            <div className=\"flex flex-col gap-3 w-full\">\n              <input\n                className={`rounded-lg border-solid border h-[40px] pt-2 pr-2 pb-2 pl-3 disabled:text-gray-500 disabled:cursor-not-allowed disabled:bg-gray-100 ${errors?.host ? 'border-red-500' : 'border-[#E2E8F0]'}`}\n                id=\"email\"\n                name=\"email\"\n                placeholder={theme?.userContactForm?.labelContact || 'Email'}\n                onChange={handleChange}\n                value={formData?.email || ''}\n                type=\"email\"\n                disabled={disabled}\n              />\n              {!!errors?.host && (\n                <p className=\"text-red-500 text-sm mt-1\">{errors.host}</p>\n              )}\n            </div>\n          </div>\n        </div>\n\n        {statusSubmit && (\n          <div className=\"flex items-center w-full justify-center\">\n            <p\n              className={`text-green-500 text-sm mt-1 ${statusSubmit?.status === 200 ? 'text-green-500' : 'text-red-500'}`}\n            >\n              {statusSubmit.message}\n            </p>\n          </div>\n        )}\n\n        <div className=\"flex items-center\">\n          <div className=\"w-full\">\n            <button\n              className={`shadow bg-[#1E6EB4] hover:bg-[#4096ff] focus:shadow-outline focus:outline-none text-white font-bold py-2 px-8 rounded-lg w-full h-[40px] disabled:text-[#00000040] disabled:cursor-not-allowed disabled:bg-[#0000000a] ${loading ? 'flex items-center justify-center' : ''}`}\n              type=\"submit\"\n              disabled={disabled}\n            >\n              {loading ? (\n                <Spinner />\n              ) : (\n                `${theme?.buttons?.textBtnSubmit || 'Submit'}`\n              )}\n            </button>\n          </div>\n        </div>\n\n        <div className=\"flex flex-col gap-3 items-center\">\n          <div className=\"font-medium text-[14px] leading-[14px] text-[#18181B]\">\n            {theme?.userContactForm?.orConnect || 'Or connect with'}\n          </div>\n\n          <div className=\"flex gap-4\">\n            <ZaloIcon />\n            <FacebookMessageIcon />\n          </div>\n        </div>\n      </form>\n    </motion.div>\n  );\n};\n\nexport default UserContactForm;\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/DataPickerCustom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataPickerCustom.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/DataPickerCustom.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACrB,CAAC;AAyDF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,KAAK,CAe/B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"DataPickerCustom.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/DataPickerCustom.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAI3B,KAAK,KAAK,GAAG;IACX,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACrB,CAAC;AAyDF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,KAAK,CAkB/B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/DataPickerCustom.js

@@ -26,7 +26,7 @@ const CustomHeader = ({ date, decreaseMonth, increaseMonth, prevMonthButtonDisab
 };
 const DataPickerCustom = (props) => {
     const { onChange, disabled, value } = props;
-    return (_jsx(DatePicker, { minDate: new Date(), dateFormat: "dd MMMM YYYY", className: "w-full rounded-lg border border-[#e0e0e0] bg-white pt-2 pr-[8px] pb-2 pl-3 text-base font-medium text-[#18181B] outline-none \n                h-[40px] disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500", disabled: disabled, onChange: onChange, selected: value, renderCustomHeader: CustomHeader }));
+    return (_jsx("div", { className: "custom-datepicker", children: _jsx(DatePicker, { minDate: new Date(), dateFormat: "dd MMMM YYYY", className: "w-full rounded-lg border border-[#e0e0e0] bg-white pt-2 pr-[8px] pb-2 pl-3 text-base font-medium text-[#18181B] \n                h-[40px] disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500", disabled: disabled, onChange: onChange, selected: value, renderCustomHeader: CustomHeader, showPopperArrow: false }) }));
 };
 export default DataPickerCustom;
 //# sourceMappingURL=DataPickerCustom.js.map

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/DataPickerCustom.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataPickerCustom.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/DataPickerCustom.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAE7C,OAAO,UAAgD,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAQrD,MAAM,MAAM,GAAG;IACb,SAAS;IACT,UAAU;IACV,OAAO;IACP,OAAO;IACP,KAAK;IACL,MAAM;IACN,MAAM;IACN,QAAQ;IACR,WAAW;IACX,SAAS;IACT,UAAU;IACV,UAAU;CACF,CAAC;AAEX,MAAM,YAAY,GAAG,CAAC,EACpB,IAAI,EACJ,aAAa,EACb,aAAa,EACb,uBAAuB,EACvB,uBAAuB,GACU,EAAE,EAAE;IACrC,OAAO,CACL,eACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,cAAc,EAAE,eAAe;YAC/B,MAAM,EAAE,MAAM;YACd,MAAM,EAAE,QAAQ;SACjB,aAED,iBACE,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,uBAAuB,EACjC,SAAS,EAAE,oOAAoO,YAE/O,KAAC,WAAW,IAAC,IAAI,EAAE,EAAE,GAAI,GAClB,EAET,eAAK,SAAS,EAAC,iFAAiF,aAC9F,yBAAO,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAQ,EACrC,yBAAO,OAAO,CAAC,IAAI,CAAC,GAAQ,IACxB,EAEN,iBACE,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,uBAAuB,EACjC,SAAS,EAAC,0JAA0J,YAEpK,KAAC,YAAY,IAAC,IAAI,EAAE,EAAE,GAAI,GACnB,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAc,CAAC,KAAY,EAAE,EAAE;IACnD,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAE5C,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,IAAI,IAAI,EAAE,EACnB,UAAU,EAAC,cAAc,EACzB,SAAS,EAAC,mOACmF,EAC7F,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,KAAK,EACf,kBAAkB,EAAE,YAAY,GAChC,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { getMonth, getYear } from 'date-fns';\nimport { FC } from 'react';\nimport DatePicker, { ReactDatePickerCustomHeaderProps } from 'react-datepicker';\nimport { ChevronLeft, ChevronRight } from '../Icons';\n\ntype Props = {\n  onChange: (date: Date | null) => void;\n  disabled?: boolean;\n  value?: Date | null;\n};\n\nconst MONTHS = [\n  'January',\n  'February',\n  'March',\n  'April',\n  'May',\n  'June',\n  'July',\n  'August',\n  'September',\n  'October',\n  'November',\n  'December',\n] as const;\n\nconst CustomHeader = ({\n  date,\n  decreaseMonth,\n  increaseMonth,\n  prevMonthButtonDisabled,\n  nextMonthButtonDisabled,\n}: ReactDatePickerCustomHeaderProps) => {\n  return (\n    <div\n      style={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        height: '32px',\n        margin: '0 12px',\n      }}\n    >\n      <button\n        onClick={decreaseMonth}\n        disabled={prevMonthButtonDisabled}\n        className={`border rounded-full bg-[#F8FAFC] border-[#E2E8F0] w-8 h-8 flex items-center justify-center hover:!bg-[#1E6EB4] hover:!border-[#1E6EB4] hover:!text-white disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500`}\n      >\n        <ChevronLeft size={24} />\n      </button>\n\n      <div className=\"flex items-center gap-2 text-[#18181B] font-semibold text-[17px] leading-[22px]\">\n        <span>{MONTHS[getMonth(date)]}</span>\n        <span>{getYear(date)}</span>\n      </div>\n\n      <button\n        onClick={increaseMonth}\n        disabled={nextMonthButtonDisabled}\n        className=\"border rounded-full bg-[#F8FAFC] border-[#E2E8F0] w-8 h-8 flex items-center justify-center hover:!bg-[#1E6EB4] hover:!border-[#1E6EB4] hover:!text-white\"\n      >\n        <ChevronRight size={24} />\n      </button>\n    </div>\n  );\n};\n\nconst DataPickerCustom: FC<Props> = (props: Props) => {\n  const { onChange, disabled, value } = props;\n\n  return (\n    <DatePicker\n      minDate={new Date()}\n      dateFormat=\"dd MMMM YYYY\"\n      className=\"w-full rounded-lg border border-[#e0e0e0] bg-white pt-2 pr-[8px] pb-2 pl-3 text-base font-medium text-[#18181B] outline-none \n                h-[40px] disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500\"\n      disabled={disabled}\n      onChange={onChange}\n      selected={value}\n      renderCustomHeader={CustomHeader}\n    />\n  );\n};\n\nexport default DataPickerCustom;\n"]}
+{"version":3,"file":"DataPickerCustom.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/DataPickerCustom.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAE7C,OAAO,UAAgD,MAAM,kBAAkB,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAQrD,MAAM,MAAM,GAAG;IACb,SAAS;IACT,UAAU;IACV,OAAO;IACP,OAAO;IACP,KAAK;IACL,MAAM;IACN,MAAM;IACN,QAAQ;IACR,WAAW;IACX,SAAS;IACT,UAAU;IACV,UAAU;CACF,CAAC;AAEX,MAAM,YAAY,GAAG,CAAC,EACpB,IAAI,EACJ,aAAa,EACb,aAAa,EACb,uBAAuB,EACvB,uBAAuB,GACU,EAAE,EAAE;IACrC,OAAO,CACL,eACE,KAAK,EAAE;YACL,OAAO,EAAE,MAAM;YACf,cAAc,EAAE,eAAe;YAC/B,MAAM,EAAE,MAAM;YACd,MAAM,EAAE,QAAQ;SACjB,aAED,iBACE,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,uBAAuB,EACjC,SAAS,EAAE,oOAAoO,YAE/O,KAAC,WAAW,IAAC,IAAI,EAAE,EAAE,GAAI,GAClB,EAET,eAAK,SAAS,EAAC,iFAAiF,aAC9F,yBAAO,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,GAAQ,EACrC,yBAAO,OAAO,CAAC,IAAI,CAAC,GAAQ,IACxB,EAEN,iBACE,OAAO,EAAE,aAAa,EACtB,QAAQ,EAAE,uBAAuB,EACjC,SAAS,EAAC,0JAA0J,YAEpK,KAAC,YAAY,IAAC,IAAI,EAAE,EAAE,GAAI,GACnB,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAc,CAAC,KAAY,EAAE,EAAE;IACnD,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAE5C,OAAO,CACL,cAAK,SAAS,EAAC,mBAAmB,YAChC,KAAC,UAAU,IACT,OAAO,EAAE,IAAI,IAAI,EAAE,EACnB,UAAU,EAAC,cAAc,EACzB,SAAS,EAAC,sNACiF,EAC3F,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,KAAK,EACf,kBAAkB,EAAE,YAAY,EAChC,eAAe,EAAE,KAAK,GACtB,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { getMonth, getYear } from 'date-fns';\nimport { FC } from 'react';\nimport DatePicker, { ReactDatePickerCustomHeaderProps } from 'react-datepicker';\nimport { ChevronLeft, ChevronRight } from '../Icons';\n\ntype Props = {\n  onChange: (date: Date | null) => void;\n  disabled?: boolean;\n  value?: Date | null;\n};\n\nconst MONTHS = [\n  'January',\n  'February',\n  'March',\n  'April',\n  'May',\n  'June',\n  'July',\n  'August',\n  'September',\n  'October',\n  'November',\n  'December',\n] as const;\n\nconst CustomHeader = ({\n  date,\n  decreaseMonth,\n  increaseMonth,\n  prevMonthButtonDisabled,\n  nextMonthButtonDisabled,\n}: ReactDatePickerCustomHeaderProps) => {\n  return (\n    <div\n      style={{\n        display: 'flex',\n        justifyContent: 'space-between',\n        height: '32px',\n        margin: '0 12px',\n      }}\n    >\n      <button\n        onClick={decreaseMonth}\n        disabled={prevMonthButtonDisabled}\n        className={`border rounded-full bg-[#F8FAFC] border-[#E2E8F0] w-8 h-8 flex items-center justify-center hover:!bg-[#1E6EB4] hover:!border-[#1E6EB4] hover:!text-white disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500`}\n      >\n        <ChevronLeft size={24} />\n      </button>\n\n      <div className=\"flex items-center gap-2 text-[#18181B] font-semibold text-[17px] leading-[22px]\">\n        <span>{MONTHS[getMonth(date)]}</span>\n        <span>{getYear(date)}</span>\n      </div>\n\n      <button\n        onClick={increaseMonth}\n        disabled={nextMonthButtonDisabled}\n        className=\"border rounded-full bg-[#F8FAFC] border-[#E2E8F0] w-8 h-8 flex items-center justify-center hover:!bg-[#1E6EB4] hover:!border-[#1E6EB4] hover:!text-white\"\n      >\n        <ChevronRight size={24} />\n      </button>\n    </div>\n  );\n};\n\nconst DataPickerCustom: FC<Props> = (props: Props) => {\n  const { onChange, disabled, value } = props;\n\n  return (\n    <div className=\"custom-datepicker\">\n      <DatePicker\n        minDate={new Date()}\n        dateFormat=\"dd MMMM YYYY\"\n        className=\"w-full rounded-lg border border-[#e0e0e0] bg-white pt-2 pr-[8px] pb-2 pl-3 text-base font-medium text-[#18181B] \n                h-[40px] disabled:cursor-not-allowed disabled:!bg-gray-100 disabled:!text-gray-500\"\n        disabled={disabled}\n        onChange={onChange}\n        selected={value}\n        renderCustomHeader={CustomHeader}\n        showPopperArrow={false}\n      />\n    </div>\n  );\n};\n\nexport default DataPickerCustom;\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/PhoneNumberInput.d.ts

@@ -1,8 +1,8 @@
 import { FC } from 'react';
 import { Value } from 'react-phone-number-input';
 type Props = {
-    value?: Value;
-    onChange?: (val?: Value | undefined) => void;
+    value: Value;
+    onChange?: (val: Value) => void;
     placeholder?: string;
     disabled?: boolean;
 };

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/PhoneNumberInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumberInput.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/PhoneNumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3B,OAAmB,EAEjB,KAAK,EACN,MAAM,0BAA0B,CAAC;AAElC,KAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,GAAG,SAAS,KAAK,IAAI,CAAC;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,KAAK,CAY/B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"PhoneNumberInput.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/PhoneNumberInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAC3B,OAAmB,EAEjB,KAAK,EACN,MAAM,0BAA0B,CAAC;AAElC,KAAK,KAAK,GAAG;IACX,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,IAAI,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,QAAA,MAAM,gBAAgB,EAAE,EAAE,CAAC,KAAK,CAY/B,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/PhoneNumberInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PhoneNumberInput.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/PhoneNumberInput.tsx"],"names":[],"mappings":";AACA,OAAO,UAAU,EAAE,EACjB,qBAAqB,GAEtB,MAAM,0BAA0B,CAAC;AASlC,MAAM,gBAAgB,GAAc,CAAC,KAAY,EAAE,EAAE;IACnD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAEjE,OAAO,CACL,KAAC,UAAU,IACT,cAAc,EAAC,IAAI,EACnB,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,qBAAqB,CAAC,KAAuB,CAAC,EACrD,QAAQ,EAAE,QAA+C,EACzD,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FC } from 'react';\nimport PhoneInput, {\n  formatPhoneNumberIntl,\n  Value,\n} from 'react-phone-number-input';\n\ntype Props = {\n  value?: Value;\n  onChange?: (val?: Value | undefined) => void;\n  placeholder?: string;\n  disabled?: boolean;\n};\n\nconst PhoneNumberInput: FC<Props> = (props: Props) => {\n  const { value, onChange, placeholder, disabled = false } = props;\n\n  return (\n    <PhoneInput\n      defaultCountry=\"VN\"\n      placeholder={placeholder}\n      value={formatPhoneNumberIntl(value as string | Value)}\n      onChange={onChange as (value?: Value | undefined) => void}\n      disabled={disabled}\n    />\n  );\n};\n\nexport default PhoneNumberInput;\n"]}
+{"version":3,"file":"PhoneNumberInput.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/PhoneNumberInput.tsx"],"names":[],"mappings":";AACA,OAAO,UAAU,EAAE,EACjB,qBAAqB,GAEtB,MAAM,0BAA0B,CAAC;AASlC,MAAM,gBAAgB,GAAc,CAAC,KAAY,EAAE,EAAE;IACnD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,QAAQ,GAAG,KAAK,EAAE,GAAG,KAAK,CAAC;IAEjE,OAAO,CACL,KAAC,UAAU,IACT,cAAc,EAAC,IAAI,EACnB,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,qBAAqB,CAAC,KAAK,CAAC,EACnC,QAAQ,EAAE,QAA+C,EACzD,QAAQ,EAAE,QAAQ,GAClB,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { FC } from 'react';\nimport PhoneInput, {\n  formatPhoneNumberIntl,\n  Value,\n} from 'react-phone-number-input';\n\ntype Props = {\n  value: Value;\n  onChange?: (val: Value) => void;\n  placeholder?: string;\n  disabled?: boolean;\n};\n\nconst PhoneNumberInput: FC<Props> = (props: Props) => {\n  const { value, onChange, placeholder, disabled = false } = props;\n\n  return (\n    <PhoneInput\n      defaultCountry=\"VN\"\n      placeholder={placeholder}\n      value={formatPhoneNumberIntl(value)}\n      onChange={onChange as (value?: Value | undefined) => void}\n      disabled={disabled}\n    />\n  );\n};\n\nexport default PhoneNumberInput;\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectBox.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AAGxD,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAyExC,CAAC"}
+{"version":3,"file":"SelectBox.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AAGxD,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,UAAU,cAAc;IACtB,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAsExC,CAAC"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBox.js

@@ -22,12 +22,12 @@ export const SelectBox = ({ options, defaultValue = '', onChange, className = ''
     };
     const selectedLabel = options.find((option) => option.value === selectedValue)?.label ||
         placeholder;
-    return (_jsxs("div", { className: `relative inline-block w-full ${className}`, ref: selectRef, children: [_jsxs("div", { className: `flex items-center justify-between w-full py-2 pr-2 pl-3 text-[#18181B] bg-white border border-[#E2E8F0] 
+    return (_jsxs("div", { className: "relative inline-block w-full", ref: selectRef, children: [_jsxs("div", { className: `flex items-center justify-between w-full py-2 pr-2 pl-3 text-[#18181B] bg-white border border-[#E2E8F0] 
           rounded-lg cursor-pointer focus:outline-none focus:ring-2 focus:ring-blue-500 hover:border-blue-400 transition-colors 
-          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''}`, onClick: () => {
+          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''} ${className}`, onClick: () => {
                     if (!disabled) {
                         setIsOpen(!isOpen);
                     }
-                }, children: [_jsx("span", { children: selectedLabel }), _jsx(ChevronDownIcon, {})] }), isOpen && (_jsx("ul", { className: `absolute z-10 w-full mt-1 bg-white border border-[#E2E8F0] rounded-md max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden flex flex-col gap-2 ${optionContainerClassName}`, children: options.map((option) => (_jsx("li", { className: `px-4 py-2 text-[#18181B] hover:bg-[#1E6EB4] hover:text-[#F8FAFC] cursor-pointer transition-colors h-[40px] font-normal text-sm leading-6  ${optionClassName}`, onClick: () => handleSelect(option.value), children: option.label }, option.value))) }))] }));
+                }, children: [_jsx("span", { children: selectedLabel }), _jsx(ChevronDownIcon, {})] }), isOpen && (_jsx("ul", { className: `absolute z-10 w-full mt-1 bg-white border border-[#E2E8F0] rounded-md max-h-36 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden flex flex-col gap-2 ${optionContainerClassName}`, children: options.map((option) => (_jsx("li", { className: `px-4 py-2 text-[#18181B] hover:bg-[#1E6EB4] hover:text-[#F8FAFC] cursor-pointer transition-colors h-[40px] font-normal text-sm leading-6  ${optionClassName}`, onClick: () => handleSelect(option.value), children: option.label }, option.value))) }))] }));
 };
 //# sourceMappingURL=SelectBox.js.map

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAmB3C,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAC5C,OAAO,EACP,YAAY,GAAG,EAAE,EACjB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,eAAe,GAAG,EAAE,EACpB,wBAAwB,GAAG,EAAE,EAC7B,WAAW,GAAG,kBAAkB,EAChC,IAAI,EACJ,QAAQ,GAAG,KAAK,GACD,EAAE,EAAE;IACnB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IACjE,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,kBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IACE,SAAS,CAAC,OAAO;gBACjB,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EACjD,CAAC;gBACD,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;QACF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAC3D,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;IAC7E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,YAAY,GAAG,CAAC,KAAa,EAAE,EAAE;QACrC,gBAAgB,CAAC,KAAK,CAAC,CAAC;QACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QACxB,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,MAAM,aAAa,GACjB,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,KAAK,aAAa,CAAC,EAAE,KAAK;QAC/D,WAAW,CAAC;IAEd,OAAO,CACL,eACE,SAAS,EAAE,gCAAgC,SAAS,EAAE,EACtD,GAAG,EAAE,SAAS,aAEd,eACE,SAAS,EAAE;;YAEP,QAAQ,CAAC,CAAC,CAAC,wEAAwE,CAAC,CAAC,CAAC,EAAE,EAAE,EAC9F,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,QAAQ,EAAE,CAAC;wBACd,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;oBACrB,CAAC;gBACH,CAAC,aAED,yBAAO,aAAa,GAAQ,EAC5B,KAAC,eAAe,KAAG,IACf,EACL,MAAM,IAAI,CACT,aACE,SAAS,EAAE,qMAAqM,wBAAwB,EAAE,YAEzO,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,aAEE,SAAS,EAAE,6IAA6I,eAAe,EAAE,EACzK,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,YAExC,MAAM,CAAC,KAAK,IAJR,MAAM,CAAC,KAAK,CAKd,CACN,CAAC,GACC,CACN,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon } from '../Icons';\n\ninterface Option {\n  value: string;\n  label: string;\n}\n\ninterface SelectBoxProps {\n  options: Option[];\n  defaultValue?: string;\n  onChange?: (value: string, name: string) => void;\n  className?: string;\n  optionClassName?: string;\n  name: string;\n  optionContainerClassName?: string;\n  placeholder?: string;\n  disabled?: boolean;\n}\n\nexport const SelectBox: FC<SelectBoxProps> = ({\n  options,\n  defaultValue = '',\n  onChange,\n  className = '',\n  optionClassName = '',\n  optionContainerClassName = '',\n  placeholder = 'Select an option',\n  name,\n  disabled = false,\n}: SelectBoxProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedValue, setSelectedValue] = useState(defaultValue);\n  const selectRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        selectRef.current &&\n        !selectRef.current.contains(event.target as Node)\n      ) {\n        setIsOpen(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleSelect = (value: string) => {\n    setSelectedValue(value);\n    onChange?.(value, name);\n    setIsOpen(false);\n  };\n\n  const selectedLabel =\n    options.find((option) => option.value === selectedValue)?.label ||\n    placeholder;\n\n  return (\n    <div\n      className={`relative inline-block w-full ${className}`}\n      ref={selectRef}\n    >\n      <div\n        className={`flex items-center justify-between w-full py-2 pr-2 pl-3 text-[#18181B] bg-white border border-[#E2E8F0] \n          rounded-lg cursor-pointer focus:outline-none focus:ring-2 focus:ring-blue-500 hover:border-blue-400 transition-colors \n          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''}`}\n        onClick={() => {\n          if (!disabled) {\n            setIsOpen(!isOpen);\n          }\n        }}\n      >\n        <span>{selectedLabel}</span>\n        <ChevronDownIcon />\n      </div>\n      {isOpen && (\n        <ul\n          className={`absolute z-10 w-full mt-1 bg-white border border-[#E2E8F0] rounded-md max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden flex flex-col gap-2 ${optionContainerClassName}`}\n        >\n          {options.map((option) => (\n            <li\n              key={option.value}\n              className={`px-4 py-2 text-[#18181B] hover:bg-[#1E6EB4] hover:text-[#F8FAFC] cursor-pointer transition-colors h-[40px] font-normal text-sm leading-6  ${optionClassName}`}\n              onClick={() => handleSelect(option.value)}\n            >\n              {option.label}\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"SelectBox.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBox.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAM,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxD,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAmB3C,MAAM,CAAC,MAAM,SAAS,GAAuB,CAAC,EAC5C,OAAO,EACP,YAAY,GAAG,EAAE,EACjB,QAAQ,EACR,SAAS,GAAG,EAAE,EACd,eAAe,GAAG,EAAE,EACpB,wBAAwB,GAAG,EAAE,EAC7B,WAAW,GAAG,kBAAkB,EAChC,IAAI,EACJ,QAAQ,GAAG,KAAK,GACD,EAAE,EAAE;IACnB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IACjE,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,kBAAkB,GAAG,CAAC,KAAiB,EAAE,EAAE;YAC/C,IACE,SAAS,CAAC,OAAO;gBACjB,CAAC,SAAS,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAc,CAAC,EACjD,CAAC;gBACD,SAAS,CAAC,KAAK,CAAC,CAAC;YACnB,CAAC;QACH,CAAC,CAAC;QACF,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;QAC3D,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC;IAC7E,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,YAAY,GAAG,CAAC,KAAa,EAAE,EAAE;QACrC,gBAAgB,CAAC,KAAK,CAAC,CAAC;QACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QACxB,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,MAAM,aAAa,GACjB,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,KAAK,aAAa,CAAC,EAAE,KAAK;QAC/D,WAAW,CAAC;IAEd,OAAO,CACL,eAAK,SAAS,EAAC,8BAA8B,EAAC,GAAG,EAAE,SAAS,aAC1D,eACE,SAAS,EAAE;;YAEP,QAAQ,CAAC,CAAC,CAAC,wEAAwE,CAAC,CAAC,CAAC,EAAE,IAAI,SAAS,EAAE,EAC3G,OAAO,EAAE,GAAG,EAAE;oBACZ,IAAI,CAAC,QAAQ,EAAE,CAAC;wBACd,SAAS,CAAC,CAAC,MAAM,CAAC,CAAC;oBACrB,CAAC;gBACH,CAAC,aAED,yBAAO,aAAa,GAAQ,EAC5B,KAAC,eAAe,KAAG,IACf,EACL,MAAM,IAAI,CACT,aACE,SAAS,EAAE,qMAAqM,wBAAwB,EAAE,YAEzO,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,aAEE,SAAS,EAAE,6IAA6I,eAAe,EAAE,EACzK,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,KAAK,CAAC,YAExC,MAAM,CAAC,KAAK,IAJR,MAAM,CAAC,KAAK,CAKd,CACN,CAAC,GACC,CACN,IACG,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { FC, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon } from '../Icons';\n\ninterface Option {\n  value: string;\n  label: string;\n}\n\ninterface SelectBoxProps {\n  options: Option[];\n  defaultValue?: string;\n  onChange?: (value: string, name: string) => void;\n  className?: string;\n  optionClassName?: string;\n  name: string;\n  optionContainerClassName?: string;\n  placeholder?: string;\n  disabled?: boolean;\n}\n\nexport const SelectBox: FC<SelectBoxProps> = ({\n  options,\n  defaultValue = '',\n  onChange,\n  className = '',\n  optionClassName = '',\n  optionContainerClassName = '',\n  placeholder = 'Select an option',\n  name,\n  disabled = false,\n}: SelectBoxProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedValue, setSelectedValue] = useState(defaultValue);\n  const selectRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        selectRef.current &&\n        !selectRef.current.contains(event.target as Node)\n      ) {\n        setIsOpen(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleSelect = (value: string) => {\n    setSelectedValue(value);\n    onChange?.(value, name);\n    setIsOpen(false);\n  };\n\n  const selectedLabel =\n    options.find((option) => option.value === selectedValue)?.label ||\n    placeholder;\n\n  return (\n    <div className=\"relative inline-block w-full\" ref={selectRef}>\n      <div\n        className={`flex items-center justify-between w-full py-2 pr-2 pl-3 text-[#18181B] bg-white border border-[#E2E8F0] \n          rounded-lg cursor-pointer focus:outline-none focus:ring-2 focus:ring-blue-500 hover:border-blue-400 transition-colors \n          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''} ${className}`}\n        onClick={() => {\n          if (!disabled) {\n            setIsOpen(!isOpen);\n          }\n        }}\n      >\n        <span>{selectedLabel}</span>\n        <ChevronDownIcon />\n      </div>\n      {isOpen && (\n        <ul\n          className={`absolute z-10 w-full mt-1 bg-white border border-[#E2E8F0] rounded-md max-h-36 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden flex flex-col gap-2 ${optionContainerClassName}`}\n        >\n          {options.map((option) => (\n            <li\n              key={option.value}\n              className={`px-4 py-2 text-[#18181B] hover:bg-[#1E6EB4] hover:text-[#F8FAFC] cursor-pointer transition-colors h-[40px] font-normal text-sm leading-6  ${optionClassName}`}\n              onClick={() => handleSelect(option.value)}\n            >\n              {option.label}\n            </li>\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n};\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBoxWithIcon.d.ts

@@ -8,6 +8,7 @@ interface SelectBoxWithIconProps {
     optionContainerClassName?: string;
     name: string;
     disabled?: boolean;
+    className?: string;
 }
 interface Option {
     value: string;

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBoxWithIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectBoxWithIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBoxWithIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,EAAE,EAA+B,MAAM,OAAO,CAAC;AAGtE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB;AAED,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CA+IxD,CAAC"}
+{"version":3,"file":"SelectBoxWithIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBoxWithIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,EAAE,EAA+B,MAAM,OAAO,CAAC;AAGtE,UAAU,sBAAsB;IAC9B,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB;AAED,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,sBAAsB,CAgJxD,CAAC"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBoxWithIcon.js

@@ -1,7 +1,7 @@
 import { Fragment as _Fragment, jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 import { cloneElement, useEffect, useRef, useState } from 'react';
 import { ChevronDownIcon } from '../Icons';
-export const SelectBoxWithIcon = ({ options, defaultValue, onChange, placeholder = 'Select an option', optionClassName = '', optionContainerClassName = '', name, disabled = false, }) => {
+export const SelectBoxWithIcon = ({ options, defaultValue, onChange, placeholder = 'Select an option', optionClassName = '', optionContainerClassName = '', name, disabled = false, className, }) => {
     const [isOpen, setIsOpen] = useState(false);
     const [selectedOption, setSelectedOption] = useState(options.find((opt) => opt.value === defaultValue) || null);
     const wrapperRef = useRef(null);
@@ -64,7 +64,7 @@ export const SelectBoxWithIcon = ({ options, defaultValue, onChange, placeholder
         }
     };
     return (_jsxs("div", { className: "relative w-full", role: "combobox", "aria-expanded": isOpen, "aria-haspopup": "listbox", tabIndex: 0, ref: wrapperRef, onKeyDown: handleKeyDown, children: [_jsxs("div", { className: `flex justify-between items-center p-2 border rounded-lg bg-white cursor-pointer focus:outline focus:outline-2 focus:outline-blue-500 h-[40px] 
-          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''}`, role: "button", "aria-label": "Select an option", onClick: toggleDropdown, children: [_jsx("span", { className: "selected-text flex items-center gap-2", children: selectedOption ? (_jsxs(_Fragment, { children: [selectedOption.icon, selectedOption.label] })) : (placeholder) }), _jsx(ChevronDownIcon, {})] }), _jsx("ul", { className: `absolute w-full mt-1 border rounded-md bg-white shadow-lg z-10 max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden bottom-11 flex flex-col gap-2 ${isOpen ? 'block' : 'hidden'} ${optionContainerClassName}`, role: "listbox", "aria-labelledby": "selected-text", children: options.map((option, index) => (_jsxs("li", { className: `flex items-center gap-2 text-[#18181B] font-normal text-sm leading-6 h-[40px] py-2 pr-2 pl-3 border rounded-lg bg-white hover:bg-[#1E6EB4] hover:text-[#F8FAFC] focus:bg-gray-100 focus:outline focus:outline-2 focus:outline-blue-500  ${selectedOption?.value === option.value ? '!bg-[#1E6EB4] !text-[#F8FAFC]' : ''} ${optionClassName}`, role: "option", "aria-selected": selectedOption?.value === option.value, tabIndex: -1, ref: index === 0 ? firstOptionRef : null, onClick: () => selectOption(option), onKeyDown: (e) => handleOptionKeyDown(e, option), children: [cloneElement(option.icon, {
+          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''} ${className}`, role: "button", "aria-label": "Select an option", onClick: toggleDropdown, children: [_jsx("span", { className: "selected-text flex items-center gap-2", children: selectedOption ? (_jsxs(_Fragment, { children: [selectedOption.icon, selectedOption.label] })) : (placeholder) }), _jsx(ChevronDownIcon, {})] }), _jsx("ul", { className: `absolute w-full mt-1 border rounded-md bg-white shadow-lg z-10 max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden bottom-11 flex flex-col gap-2 ${isOpen ? 'block' : 'hidden'} ${optionContainerClassName}`, role: "listbox", "aria-labelledby": "selected-text", children: options.map((option, index) => (_jsxs("li", { className: `flex items-center gap-2 text-[#18181B] font-normal text-sm leading-6 h-[40px] py-2 pr-2 pl-3 border rounded-lg bg-white hover:bg-[#1E6EB4] hover:text-[#F8FAFC] focus:bg-gray-100 focus:outline focus:outline-2 focus:outline-blue-500  ${selectedOption?.value === option.value ? '!bg-[#1E6EB4] !text-[#F8FAFC]' : ''} ${optionClassName}`, role: "option", "aria-selected": selectedOption?.value === option.value, tabIndex: -1, ref: index === 0 ? firstOptionRef : null, onClick: () => selectOption(option), onKeyDown: (e) => handleOptionKeyDown(e, option), children: [cloneElement(option.icon, {
                             color: selectedOption?.value === option.value ? '#F8FAFC' : '#18181B',
                         }), _jsx("span", { children: option.label })] }, option.value))) }), _jsx("input", { type: "hidden", name: "selected_option", value: selectedOption?.value || '' })] }));
 };

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/components/Chat/ui/SelectBoxWithIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectBoxWithIcon.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBoxWithIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cloneElement, FC, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon } from '../Icons';\n\ninterface SelectBoxWithIconProps {\n  options: Option[];\n  defaultValue?: string;\n  onChange?: (value: string, name: string) => void;\n  placeholder?: string;\n  optionClassName?: string;\n  optionContainerClassName?: string;\n  name: string;\n  disabled?: boolean;\n}\n\ninterface Option {\n  value: string;\n  label: string;\n  icon: React.ReactNode;\n}\n\nexport const SelectBoxWithIcon: FC<SelectBoxWithIconProps> = ({\n  options,\n  defaultValue,\n  onChange,\n  placeholder = 'Select an option',\n  optionClassName = '',\n  optionContainerClassName = '',\n  name,\n  disabled = false,\n}: SelectBoxWithIconProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<Option | null>(\n    options.find((opt) => opt.value === defaultValue) || null\n  );\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const firstOptionRef = useRef<HTMLLIElement>(null);\n\n  const toggleDropdown = () => {\n    if (disabled) return;\n\n    setIsOpen(!isOpen);\n    if (!isOpen && firstOptionRef.current) {\n      firstOptionRef.current.focus();\n    }\n  };\n\n  const selectOption = (option: Option) => {\n    setSelectedOption(option);\n    setIsOpen(false);\n    onChange?.(option.value, name);\n  };\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        wrapperRef.current &&\n        !wrapperRef.current.contains(event.target as Node)\n      ) {\n        setIsOpen(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      toggleDropdown();\n    } else if (e.key === 'Escape' && isOpen) {\n      e.preventDefault();\n      setIsOpen(false);\n      wrapperRef.current?.focus();\n    }\n  };\n\n  const handleOptionKeyDown = (\n    e: React.KeyboardEvent<HTMLLIElement>,\n    option: Option\n  ) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      selectOption(option);\n    } else if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      const nextOption = e.currentTarget.nextElementSibling as HTMLLIElement;\n      if (nextOption) nextOption.focus();\n      else\n        (\n          e.currentTarget.parentElement?.firstElementChild as HTMLLIElement\n        )?.focus();\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      const prevOption = e.currentTarget\n        .previousElementSibling as HTMLLIElement;\n      if (prevOption) prevOption.focus();\n      else\n        (\n          e.currentTarget.parentElement?.lastElementChild as HTMLLIElement\n        )?.focus();\n    }\n  };\n\n  return (\n    <div\n      className=\"relative w-full\"\n      role=\"combobox\"\n      aria-expanded={isOpen}\n      aria-haspopup=\"listbox\"\n      tabIndex={0}\n      ref={wrapperRef}\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        className={`flex justify-between items-center p-2 border rounded-lg bg-white cursor-pointer focus:outline focus:outline-2 focus:outline-blue-500 h-[40px] \n          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''}`}\n        role=\"button\"\n        aria-label=\"Select an option\"\n        onClick={toggleDropdown}\n      >\n        <span className=\"selected-text flex items-center gap-2\">\n          {selectedOption ? (\n            <>\n              {selectedOption.icon}\n              {selectedOption.label}\n            </>\n          ) : (\n            placeholder\n          )}\n        </span>\n        <ChevronDownIcon />\n      </div>\n      <ul\n        className={`absolute w-full mt-1 border rounded-md bg-white shadow-lg z-10 max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden bottom-11 flex flex-col gap-2 ${isOpen ? 'block' : 'hidden'} ${optionContainerClassName}`}\n        role=\"listbox\"\n        aria-labelledby=\"selected-text\"\n      >\n        {options.map((option, index) => (\n          <li\n            key={option.value}\n            className={`flex items-center gap-2 text-[#18181B] font-normal text-sm leading-6 h-[40px] py-2 pr-2 pl-3 border rounded-lg bg-white hover:bg-[#1E6EB4] hover:text-[#F8FAFC] focus:bg-gray-100 focus:outline focus:outline-2 focus:outline-blue-500  ${selectedOption?.value === option.value ? '!bg-[#1E6EB4] !text-[#F8FAFC]' : ''} ${optionClassName}`}\n            role=\"option\"\n            aria-selected={selectedOption?.value === option.value}\n            tabIndex={-1}\n            ref={index === 0 ? firstOptionRef : null}\n            onClick={() => selectOption(option)}\n            onKeyDown={(e) => handleOptionKeyDown(e, option)}\n          >\n            {cloneElement(option.icon as React.ReactElement, {\n              color:\n                selectedOption?.value === option.value ? '#F8FAFC' : '#18181B',\n            })}\n            <span>{option.label}</span>\n          </li>\n        ))}\n      </ul>\n      <input\n        type=\"hidden\"\n        name=\"selected_option\"\n        value={selectedOption?.value || ''}\n      />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"SelectBoxWithIcon.js","sourceRoot":"","sources":["../../../../src/components/Chat/ui/SelectBoxWithIcon.tsx"],"names":[],"mappings":"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","sourcesContent":["import { cloneElement, FC, useEffect, useRef, useState } from 'react';\nimport { ChevronDownIcon } from '../Icons';\n\ninterface SelectBoxWithIconProps {\n  options: Option[];\n  defaultValue?: string;\n  onChange?: (value: string, name: string) => void;\n  placeholder?: string;\n  optionClassName?: string;\n  optionContainerClassName?: string;\n  name: string;\n  disabled?: boolean;\n  className?: string;\n}\n\ninterface Option {\n  value: string;\n  label: string;\n  icon: React.ReactNode;\n}\n\nexport const SelectBoxWithIcon: FC<SelectBoxWithIconProps> = ({\n  options,\n  defaultValue,\n  onChange,\n  placeholder = 'Select an option',\n  optionClassName = '',\n  optionContainerClassName = '',\n  name,\n  disabled = false,\n  className,\n}: SelectBoxWithIconProps) => {\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<Option | null>(\n    options.find((opt) => opt.value === defaultValue) || null\n  );\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const firstOptionRef = useRef<HTMLLIElement>(null);\n\n  const toggleDropdown = () => {\n    if (disabled) return;\n\n    setIsOpen(!isOpen);\n    if (!isOpen && firstOptionRef.current) {\n      firstOptionRef.current.focus();\n    }\n  };\n\n  const selectOption = (option: Option) => {\n    setSelectedOption(option);\n    setIsOpen(false);\n    onChange?.(option.value, name);\n  };\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        wrapperRef.current &&\n        !wrapperRef.current.contains(event.target as Node)\n      ) {\n        setIsOpen(false);\n      }\n    };\n    document.addEventListener('mousedown', handleClickOutside);\n    return () => document.removeEventListener('mousedown', handleClickOutside);\n  }, []);\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      toggleDropdown();\n    } else if (e.key === 'Escape' && isOpen) {\n      e.preventDefault();\n      setIsOpen(false);\n      wrapperRef.current?.focus();\n    }\n  };\n\n  const handleOptionKeyDown = (\n    e: React.KeyboardEvent<HTMLLIElement>,\n    option: Option\n  ) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      selectOption(option);\n    } else if (e.key === 'ArrowDown') {\n      e.preventDefault();\n      const nextOption = e.currentTarget.nextElementSibling as HTMLLIElement;\n      if (nextOption) nextOption.focus();\n      else\n        (\n          e.currentTarget.parentElement?.firstElementChild as HTMLLIElement\n        )?.focus();\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault();\n      const prevOption = e.currentTarget\n        .previousElementSibling as HTMLLIElement;\n      if (prevOption) prevOption.focus();\n      else\n        (\n          e.currentTarget.parentElement?.lastElementChild as HTMLLIElement\n        )?.focus();\n    }\n  };\n\n  return (\n    <div\n      className=\"relative w-full\"\n      role=\"combobox\"\n      aria-expanded={isOpen}\n      aria-haspopup=\"listbox\"\n      tabIndex={0}\n      ref={wrapperRef}\n      onKeyDown={handleKeyDown}\n    >\n      <div\n        className={`flex justify-between items-center p-2 border rounded-lg bg-white cursor-pointer focus:outline focus:outline-2 focus:outline-blue-500 h-[40px] \n          ${disabled ? '!cursor-not-allowed !bg-gray-100 !text-gray-500 hover:!border-gray-300' : ''} ${className}`}\n        role=\"button\"\n        aria-label=\"Select an option\"\n        onClick={toggleDropdown}\n      >\n        <span className=\"selected-text flex items-center gap-2\">\n          {selectedOption ? (\n            <>\n              {selectedOption.icon}\n              {selectedOption.label}\n            </>\n          ) : (\n            placeholder\n          )}\n        </span>\n        <ChevronDownIcon />\n      </div>\n      <ul\n        className={`absolute w-full mt-1 border rounded-md bg-white shadow-lg z-10 max-h-48 overflow-auto py-4 px-3 overflow-y-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden bottom-11 flex flex-col gap-2 ${isOpen ? 'block' : 'hidden'} ${optionContainerClassName}`}\n        role=\"listbox\"\n        aria-labelledby=\"selected-text\"\n      >\n        {options.map((option, index) => (\n          <li\n            key={option.value}\n            className={`flex items-center gap-2 text-[#18181B] font-normal text-sm leading-6 h-[40px] py-2 pr-2 pl-3 border rounded-lg bg-white hover:bg-[#1E6EB4] hover:text-[#F8FAFC] focus:bg-gray-100 focus:outline focus:outline-2 focus:outline-blue-500  ${selectedOption?.value === option.value ? '!bg-[#1E6EB4] !text-[#F8FAFC]' : ''} ${optionClassName}`}\n            role=\"option\"\n            aria-selected={selectedOption?.value === option.value}\n            tabIndex={-1}\n            ref={index === 0 ? firstOptionRef : null}\n            onClick={() => selectOption(option)}\n            onKeyDown={(e) => handleOptionKeyDown(e, option)}\n          >\n            {cloneElement(option.icon as React.ReactElement, {\n              color:\n                selectedOption?.value === option.value ? '#F8FAFC' : '#18181B',\n            })}\n            <span>{option.label}</span>\n          </li>\n        ))}\n      </ul>\n      <input\n        type=\"hidden\"\n        name=\"selected_option\"\n        value={selectedOption?.value || ''}\n      />\n    </div>\n  );\n};\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/constants/toolNames.d.ts

@@ -20,6 +20,9 @@ export declare const DISPLAY_BOOKING_FORM_TOOL_PREFIXES: {
 export declare const DISPLAY_CONTACT_FORM_TOOL_PREFIXES: {
     readonly DISPLAY_CONTACT_FORM: "display_contact_form";
 };
+export declare const DISPLAY_BOOKING_LIST_TOOL_PREFIXES: {
+    readonly DISPLAY_BOOKINGS: "display_meeting_booking";
+};
 declare const PRODUCT_COMMAND_TOOLS: {
     readonly SHOW_HOTSPOT_GUIDED_TOUR: "show_hotspot_guided_tour";
     readonly SHOW_PRODUCT_AR: "show_product_AR";
@@ -78,7 +81,8 @@ export declare enum UNIT {
     CENTIMETER = "cm",
     GRAM = "g",
     LITER = "l",
-    METER = "m"
+    METER = "m",
+    PIECE = "piece"
 }
 export declare enum GALLERY_TYPE {
     IMAGE = "IMAGE",

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/constants/toolNames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toolNames.d.ts","sourceRoot":"","sources":["../../src/constants/toolNames.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;;CAEhB,CAAC;AAGX,eAAO,MAAM,cAAc;;;CAGjB,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,oCAAoC;;CAEvC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,QAAA,MAAM,qBAAqB;;;;;;CAMjB,CAAC;AAcX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;CAYhB,CAAC;AAGX,eAAO,MAAM,mBAAmB,gBAA+B,CAAC;AAChE,eAAO,MAAM,oBAAoB,gEAAgC,CAAC;AAClE,eAAO,MAAM,mBAAmB,UAA+B,CAAC;AAChE,eAAO,MAAM,2BAA2B,oIAAuC,CAAC;AAGhF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;CAKZ,CAAC;AAGX,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,OAAO,aAAa,CAAC,CAAC;AAC7E,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,OAAO,cAAc,CAAC,CAAC;AAChF,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,OAAO,aAAa,CAAC,CAAC;AAC7E,MAAM,MAAM,kBAAkB,GAC5B,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,OAAO,qBAAqB,CAAC,CAAC;AACrE,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,OAAO,SAAS,CAAC,CAAC;AAElE,oBAAY,IAAI;IACd,YAAY,WAAW;IACvB,WAAW,WAAW;IACtB,QAAQ,OAAO;IACf,UAAU,OAAO;IACjB,IAAI,MAAM;IACV,KAAK,MAAM;IACX,KAAK,MAAM;CACZ;AAED,oBAAY,YAAY;IACtB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,EAAE,OAAO;CACV"}
+{"version":3,"file":"toolNames.d.ts","sourceRoot":"","sources":["../../src/constants/toolNames.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa;;CAEhB,CAAC;AAGX,eAAO,MAAM,cAAc;;;CAGjB,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,oCAAoC;;CAEvC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAEX,eAAO,MAAM,kCAAkC;;CAErC,CAAC;AAGX,QAAA,MAAM,qBAAqB;;;;;;CAMjB,CAAC;AAcX,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;CAYhB,CAAC;AAGX,eAAO,MAAM,mBAAmB,gBAA+B,CAAC;AAChE,eAAO,MAAM,oBAAoB,gEAAgC,CAAC;AAClE,eAAO,MAAM,mBAAmB,UAA+B,CAAC;AAChE,eAAO,MAAM,2BAA2B,oIAAuC,CAAC;AAGhF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;CAKZ,CAAC;AAGX,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,OAAO,aAAa,CAAC,CAAC;AAC7E,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,OAAO,cAAc,CAAC,CAAC;AAChF,MAAM,MAAM,WAAW,GAAG,CAAC,OAAO,aAAa,CAAC,CAAC,MAAM,OAAO,aAAa,CAAC,CAAC;AAC7E,MAAM,MAAM,kBAAkB,GAC5B,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,OAAO,qBAAqB,CAAC,CAAC;AACrE,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,SAAS,CAAC,CAAC,MAAM,OAAO,SAAS,CAAC,CAAC;AAElE,oBAAY,IAAI;IACd,YAAY,WAAW;IACvB,WAAW,WAAW;IACtB,QAAQ,OAAO;IACf,UAAU,OAAO;IACjB,IAAI,MAAM;IACV,KAAK,MAAM;IACX,KAAK,MAAM;IACX,KAAK,UAAU;CAChB;AAED,oBAAY,YAAY;IACtB,KAAK,UAAU;IACf,KAAK,UAAU;IACf,UAAU,eAAe;IACzB,EAAE,OAAO;CACV"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/constants/toolNames.js

@@ -28,6 +28,9 @@ export const DISPLAY_BOOKING_FORM_TOOL_PREFIXES = {
 export const DISPLAY_CONTACT_FORM_TOOL_PREFIXES = {
     DISPLAY_CONTACT_FORM: 'display_contact_form',
 };
+export const DISPLAY_BOOKING_LIST_TOOL_PREFIXES = {
+    DISPLAY_BOOKINGS: 'display_meeting_booking',
+};
 // Product command Tools
 const PRODUCT_COMMAND_TOOLS = {
     SHOW_HOTSPOT_GUIDED_TOUR: 'show_hotspot_guided_tour',
@@ -78,6 +81,7 @@ export var UNIT;
     UNIT["GRAM"] = "g";
     UNIT["LITER"] = "l";
     UNIT["METER"] = "m";
+    UNIT["PIECE"] = "piece";
 })(UNIT || (UNIT = {}));
 export var GALLERY_TYPE;
 (function (GALLERY_TYPE) {

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/constants/toolNames.js.map

@@ -1 +1 @@
-{"version":3,"file":"toolNames.js","sourceRoot":"","sources":["../../src/constants/toolNames.ts"],"names":[],"mappings":"AAAA,6DAA6D;AAE7D,gBAAgB;AAChB,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,WAAW,EAAE,YAAY;CACjB,CAAC;AAEX,iBAAiB;AACjB,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,4BAA4B,EAAE,8BAA8B;IAC5D,uBAAuB,EAAE,yBAAyB;CAC1C,CAAC;AAEX,wDAAwD;AACxD,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,gBAAgB,EAAE,kBAAkB;CAC5B,CAAC;AAEX,0DAA0D;AAC1D,MAAM,CAAC,MAAM,oCAAoC,GAAG;IAClD,eAAe,EAAE,iBAAiB;CAC1B,CAAC;AAEX,iBAAiB;AACjB,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,6BAA6B;AAC7B,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,6BAA6B;AAC7B,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,wBAAwB;AACxB,MAAM,qBAAqB,GAAG;IAC5B,wBAAwB,EAAE,0BAA0B;IACpD,eAAe,EAAE,iBAAiB;IAClC,sBAAsB,EAAE,wBAAwB;IAChD,0BAA0B,EAAE,4BAA4B;IACxD,iBAAiB,EAAE,mBAAmB;CAC9B,CAAC;AAEX,0BAA0B;AAC1B,MAAM,mBAAmB,GAAG;IAC1B,iBAAiB,EAAE,mBAAmB;IACtC,iBAAiB,EAAE,mBAAmB;IACtC,qBAAqB,EAAE,uBAAuB;IAC9C,eAAe,EAAE,iBAAiB;IAClC,oBAAoB,EAAE,sBAAsB;IAC5C,uBAAuB,EAAE,yBAAyB;IAClD,sBAAsB,EAAE,wBAAwB;CACjD,CAAC;AAEF,gBAAgB;AAChB,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,gBAAgB;IAChB,iBAAiB,EAAE,mBAAmB;IAEtC,kBAAkB;IAClB,eAAe,EAAE,iBAAiB;IAElC,wBAAwB;IACxB,GAAG,qBAAqB;IAExB,0BAA0B;IAC1B,GAAG,mBAAmB;CACd,CAAC;AAEX,qCAAqC;AACrC,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;AAChE,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;AAClE,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;AAChE,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;AAEhF,0BAA0B;AAC1B,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,GAAG,aAAa;IAChB,GAAG,cAAc;IACjB,GAAG,aAAa;IAChB,GAAG,qBAAqB;CAChB,CAAC;AAUX,MAAM,CAAN,IAAY,IAQX;AARD,WAAY,IAAI;IACd,+BAAuB,CAAA;IACvB,8BAAsB,CAAA;IACtB,uBAAe,CAAA;IACf,yBAAiB,CAAA;IACjB,kBAAU,CAAA;IACV,mBAAW,CAAA;IACX,mBAAW,CAAA;AACb,CAAC,EARW,IAAI,KAAJ,IAAI,QAQf;AAED,MAAM,CAAN,IAAY,YAKX;AALD,WAAY,YAAY;IACtB,+BAAe,CAAA;IACf,+BAAe,CAAA;IACf,yCAAyB,CAAA;IACzB,yBAAS,CAAA;AACX,CAAC,EALW,YAAY,KAAZ,YAAY,QAKvB","sourcesContent":["// Tool name constants for easier maintenance and type safety\n\n// Weather Tools\nexport const WEATHER_TOOLS = {\n  GET_WEATHER: 'getWeather',\n} as const;\n\n// Location Tools\nexport const LOCATION_TOOLS = {\n  GET_ASSIGNED_LOCATION_DETAIL: 'get_assigned_location_detail',\n  SEARCH_TRAVELING_PLACES: 'search-traveling-places',\n} as const;\n\n// Product list tool name prefixes for flexible matching\nexport const DISPLAY_PRODUCT_LIST_TOOL_PREFIXES = {\n  DISPLAY_PRODUCTS: 'display_products',\n} as const;\n\n// Product detail tool name prefixes for flexible matching\nexport const DISPLAY_PRODUCT_DETAIL_TOOL_PREFIXES = {\n  DISPLAY_PRODUCT: 'display_product',\n} as const;\n\n// Scenario Tools\nexport const DISPLAY_GUIDED_TOURS_TOOL_PREFIXES = {\n  DISPLAY_GUIDED_TOURS: 'display_guided_tours',\n} as const;\n\n// Display booking form Tools\nexport const DISPLAY_BOOKING_FORM_TOOL_PREFIXES = {\n  DISPLAY_BOOKING_FORM: 'display_booking_form',\n} as const;\n\n// display contact form Tools\nexport const DISPLAY_CONTACT_FORM_TOOL_PREFIXES = {\n  DISPLAY_CONTACT_FORM: 'display_contact_form',\n} as const;\n\n// Product command Tools\nconst PRODUCT_COMMAND_TOOLS = {\n  SHOW_HOTSPOT_GUIDED_TOUR: 'show_hotspot_guided_tour',\n  SHOW_PRODUCT_AR: 'show_product_AR',\n  SHOW_PRODUCT_360_IMAGE: 'show_product_360_image',\n  SHOW_PRODUCT_IMAGE_GALLERY: 'show_product_image_gallery',\n  SHOW_PRODUCT_INFO: 'show_product_info',\n} as const;\n\n// Scene Interaction Tools\nconst SCENE_COMMAND_TOOLS = {\n  UPDATE_SCENE_VIEW: 'update_scene_view',\n  CHANGE_ROOM_STYLE: 'change_room_style',\n  SWAP_PRODUCT_MATERIAL: 'swap_product_material',\n  OPEN_CLOSE_DOOR: 'open_close_door',\n  CHANGE_ROOM_LIGHTING: 'change_room_lighting',\n  OPEN_SCENE_PRODUCT_LIST: 'open_scene_product_list',\n  PLAY_SCENE_GUIDED_TOUR: 'play_scene_guided_tour',\n};\n\n// Command Tools\nexport const COMMAND_TOOLS = {\n  // play scenario\n  START_GUIDED_TOUR: 'start_guided_tour',\n\n  // move to hotspot\n  MOVE_TO_HOTSPOT: 'move_to_hotspot',\n\n  // Product Display Tools\n  ...PRODUCT_COMMAND_TOOLS,\n\n  // Scene Interaction Tools\n  ...SCENE_COMMAND_TOOLS,\n} as const;\n\n// Helper arrays for easier iteration\nexport const WEATHER_TOOL_VALUES = Object.values(WEATHER_TOOLS);\nexport const LOCATION_TOOL_VALUES = Object.values(LOCATION_TOOLS);\nexport const COMMAND_TOOL_VALUES = Object.values(COMMAND_TOOLS);\nexport const PRODUCT_COMMAND_TOOL_VALUES = Object.values(PRODUCT_COMMAND_TOOLS);\n\n// All tool names combined\nexport const ALL_TOOLS = {\n  ...WEATHER_TOOLS,\n  ...LOCATION_TOOLS,\n  ...COMMAND_TOOLS,\n  ...PRODUCT_COMMAND_TOOLS,\n} as const;\n\n// Type definitions for better TypeScript support\nexport type WeatherTool = (typeof WEATHER_TOOLS)[keyof typeof WEATHER_TOOLS];\nexport type LocationTool = (typeof LOCATION_TOOLS)[keyof typeof LOCATION_TOOLS];\nexport type CommandTool = (typeof COMMAND_TOOLS)[keyof typeof COMMAND_TOOLS];\nexport type ProductCommandTool =\n  (typeof PRODUCT_COMMAND_TOOLS)[keyof typeof PRODUCT_COMMAND_TOOLS];\nexport type AllTools = (typeof ALL_TOOLS)[keyof typeof ALL_TOOLS];\n\nexport enum UNIT {\n  SQUARE_METER = '\\u33A1',\n  CUBIC_METER = '\\u33A5',\n  KILOGRAM = 'kg',\n  CENTIMETER = 'cm',\n  GRAM = 'g',\n  LITER = 'l',\n  METER = 'm',\n}\n\nexport enum GALLERY_TYPE {\n  IMAGE = 'IMAGE',\n  VIDEO = 'VIDEO',\n  WEB_ROTATE = 'WEB_ROTATE',\n  AR = 'AR',\n}\n"]}
+{"version":3,"file":"toolNames.js","sourceRoot":"","sources":["../../src/constants/toolNames.ts"],"names":[],"mappings":"AAAA,6DAA6D;AAE7D,gBAAgB;AAChB,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,WAAW,EAAE,YAAY;CACjB,CAAC;AAEX,iBAAiB;AACjB,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,4BAA4B,EAAE,8BAA8B;IAC5D,uBAAuB,EAAE,yBAAyB;CAC1C,CAAC;AAEX,wDAAwD;AACxD,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,gBAAgB,EAAE,kBAAkB;CAC5B,CAAC;AAEX,0DAA0D;AAC1D,MAAM,CAAC,MAAM,oCAAoC,GAAG;IAClD,eAAe,EAAE,iBAAiB;CAC1B,CAAC;AAEX,iBAAiB;AACjB,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,6BAA6B;AAC7B,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,6BAA6B;AAC7B,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,oBAAoB,EAAE,sBAAsB;CACpC,CAAC;AAEX,MAAM,CAAC,MAAM,kCAAkC,GAAG;IAChD,gBAAgB,EAAE,yBAAyB;CACnC,CAAC;AAEX,wBAAwB;AACxB,MAAM,qBAAqB,GAAG;IAC5B,wBAAwB,EAAE,0BAA0B;IACpD,eAAe,EAAE,iBAAiB;IAClC,sBAAsB,EAAE,wBAAwB;IAChD,0BAA0B,EAAE,4BAA4B;IACxD,iBAAiB,EAAE,mBAAmB;CAC9B,CAAC;AAEX,0BAA0B;AAC1B,MAAM,mBAAmB,GAAG;IAC1B,iBAAiB,EAAE,mBAAmB;IACtC,iBAAiB,EAAE,mBAAmB;IACtC,qBAAqB,EAAE,uBAAuB;IAC9C,eAAe,EAAE,iBAAiB;IAClC,oBAAoB,EAAE,sBAAsB;IAC5C,uBAAuB,EAAE,yBAAyB;IAClD,sBAAsB,EAAE,wBAAwB;CACjD,CAAC;AAEF,gBAAgB;AAChB,MAAM,CAAC,MAAM,aAAa,GAAG;IAC3B,gBAAgB;IAChB,iBAAiB,EAAE,mBAAmB;IAEtC,kBAAkB;IAClB,eAAe,EAAE,iBAAiB;IAElC,wBAAwB;IACxB,GAAG,qBAAqB;IAExB,0BAA0B;IAC1B,GAAG,mBAAmB;CACd,CAAC;AAEX,qCAAqC;AACrC,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;AAChE,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;AAClE,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,CAAC;AAChE,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,MAAM,CAAC,qBAAqB,CAAC,CAAC;AAEhF,0BAA0B;AAC1B,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,GAAG,aAAa;IAChB,GAAG,cAAc;IACjB,GAAG,aAAa;IAChB,GAAG,qBAAqB;CAChB,CAAC;AAUX,MAAM,CAAN,IAAY,IASX;AATD,WAAY,IAAI;IACd,+BAAuB,CAAA;IACvB,8BAAsB,CAAA;IACtB,uBAAe,CAAA;IACf,yBAAiB,CAAA;IACjB,kBAAU,CAAA;IACV,mBAAW,CAAA;IACX,mBAAW,CAAA;IACX,uBAAe,CAAA;AACjB,CAAC,EATW,IAAI,KAAJ,IAAI,QASf;AAED,MAAM,CAAN,IAAY,YAKX;AALD,WAAY,YAAY;IACtB,+BAAe,CAAA;IACf,+BAAe,CAAA;IACf,yCAAyB,CAAA;IACzB,yBAAS,CAAA;AACX,CAAC,EALW,YAAY,KAAZ,YAAY,QAKvB","sourcesContent":["// Tool name constants for easier maintenance and type safety\n\n// Weather Tools\nexport const WEATHER_TOOLS = {\n  GET_WEATHER: 'getWeather',\n} as const;\n\n// Location Tools\nexport const LOCATION_TOOLS = {\n  GET_ASSIGNED_LOCATION_DETAIL: 'get_assigned_location_detail',\n  SEARCH_TRAVELING_PLACES: 'search-traveling-places',\n} as const;\n\n// Product list tool name prefixes for flexible matching\nexport const DISPLAY_PRODUCT_LIST_TOOL_PREFIXES = {\n  DISPLAY_PRODUCTS: 'display_products',\n} as const;\n\n// Product detail tool name prefixes for flexible matching\nexport const DISPLAY_PRODUCT_DETAIL_TOOL_PREFIXES = {\n  DISPLAY_PRODUCT: 'display_product',\n} as const;\n\n// Scenario Tools\nexport const DISPLAY_GUIDED_TOURS_TOOL_PREFIXES = {\n  DISPLAY_GUIDED_TOURS: 'display_guided_tours',\n} as const;\n\n// Display booking form Tools\nexport const DISPLAY_BOOKING_FORM_TOOL_PREFIXES = {\n  DISPLAY_BOOKING_FORM: 'display_booking_form',\n} as const;\n\n// display contact form Tools\nexport const DISPLAY_CONTACT_FORM_TOOL_PREFIXES = {\n  DISPLAY_CONTACT_FORM: 'display_contact_form',\n} as const;\n\nexport const DISPLAY_BOOKING_LIST_TOOL_PREFIXES = {\n  DISPLAY_BOOKINGS: 'display_meeting_booking',\n} as const;\n\n// Product command Tools\nconst PRODUCT_COMMAND_TOOLS = {\n  SHOW_HOTSPOT_GUIDED_TOUR: 'show_hotspot_guided_tour',\n  SHOW_PRODUCT_AR: 'show_product_AR',\n  SHOW_PRODUCT_360_IMAGE: 'show_product_360_image',\n  SHOW_PRODUCT_IMAGE_GALLERY: 'show_product_image_gallery',\n  SHOW_PRODUCT_INFO: 'show_product_info',\n} as const;\n\n// Scene Interaction Tools\nconst SCENE_COMMAND_TOOLS = {\n  UPDATE_SCENE_VIEW: 'update_scene_view',\n  CHANGE_ROOM_STYLE: 'change_room_style',\n  SWAP_PRODUCT_MATERIAL: 'swap_product_material',\n  OPEN_CLOSE_DOOR: 'open_close_door',\n  CHANGE_ROOM_LIGHTING: 'change_room_lighting',\n  OPEN_SCENE_PRODUCT_LIST: 'open_scene_product_list',\n  PLAY_SCENE_GUIDED_TOUR: 'play_scene_guided_tour',\n};\n\n// Command Tools\nexport const COMMAND_TOOLS = {\n  // play scenario\n  START_GUIDED_TOUR: 'start_guided_tour',\n\n  // move to hotspot\n  MOVE_TO_HOTSPOT: 'move_to_hotspot',\n\n  // Product Display Tools\n  ...PRODUCT_COMMAND_TOOLS,\n\n  // Scene Interaction Tools\n  ...SCENE_COMMAND_TOOLS,\n} as const;\n\n// Helper arrays for easier iteration\nexport const WEATHER_TOOL_VALUES = Object.values(WEATHER_TOOLS);\nexport const LOCATION_TOOL_VALUES = Object.values(LOCATION_TOOLS);\nexport const COMMAND_TOOL_VALUES = Object.values(COMMAND_TOOLS);\nexport const PRODUCT_COMMAND_TOOL_VALUES = Object.values(PRODUCT_COMMAND_TOOLS);\n\n// All tool names combined\nexport const ALL_TOOLS = {\n  ...WEATHER_TOOLS,\n  ...LOCATION_TOOLS,\n  ...COMMAND_TOOLS,\n  ...PRODUCT_COMMAND_TOOLS,\n} as const;\n\n// Type definitions for better TypeScript support\nexport type WeatherTool = (typeof WEATHER_TOOLS)[keyof typeof WEATHER_TOOLS];\nexport type LocationTool = (typeof LOCATION_TOOLS)[keyof typeof LOCATION_TOOLS];\nexport type CommandTool = (typeof COMMAND_TOOLS)[keyof typeof COMMAND_TOOLS];\nexport type ProductCommandTool =\n  (typeof PRODUCT_COMMAND_TOOLS)[keyof typeof PRODUCT_COMMAND_TOOLS];\nexport type AllTools = (typeof ALL_TOOLS)[keyof typeof ALL_TOOLS];\n\nexport enum UNIT {\n  SQUARE_METER = '\\u33A1',\n  CUBIC_METER = '\\u33A5',\n  KILOGRAM = 'kg',\n  CENTIMETER = 'cm',\n  GRAM = 'g',\n  LITER = 'l',\n  METER = 'm',\n  PIECE = 'piece',\n}\n\nexport enum GALLERY_TYPE {\n  IMAGE = 'IMAGE',\n  VIDEO = 'VIDEO',\n  WEB_ROTATE = 'WEB_ROTATE',\n  AR = 'AR',\n}\n"]}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/hooks/useConfiguration.d.ts

@@ -73,12 +73,16 @@ type ConfigurationData = {
             labelDuration?: string;
             labelChannel?: string;
             labelHost?: string;
+            labelBookingList?: string;
+            labelBrand?: string;
             messages?: {
                 submitError?: string;
                 submitSuccess?: string;
                 startTimeError?: string;
                 durationError?: string;
                 channelError?: string;
+                hostNotFound?: string;
+                startTimeInThePast?: string;
             };
         };
     } & Record<string, unknown>;

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/hooks/useConfiguration.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"useConfiguration.d.ts","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":"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"}

package/.rollup.cache/Users/tungthai/Desktop/Develop/clik-ai-chatbot-embedded/dist/hooks/useConfiguration.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConfiguration.js","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAyFlE,MAAM,oBAAoB,GAAG,aAAa,CACxC,SAAS,CACV,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EACpC,QAAQ,EACR,MAAM,GAIP,EAAE,EAAE;IACH,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAoB;QACpE,GAAG,MAAM;KACV,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;YACpB,MAAM,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;QACzC,CAAC;QACD,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,KAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAChD,QAAQ,GACqB,CACjC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACvD,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CACb,8DAA8D,CAC/D,CAAC;IACJ,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC","sourcesContent":["import React, { createContext, useEffect, useState } from 'react';\nimport { ConfigMessageType } from 'types/common.type';\nimport { ToolType } from '../features/AgentWidget';\n\ntype ConfigurationData = {\n  apiHost: string;\n  agentId: string;\n  voice?: {\n    enable?: boolean;\n    livekitUrl: string;\n  };\n  overrideConfig?: Record<string, any>;\n  theme?: {\n    simplified?: boolean;\n    modeButtonChat?: boolean;\n    gapInput?: number;\n    welcomeMessage?: string;\n    noAutoplayMessage?: boolean;\n    autoCloseAudioPlayer?: boolean;\n    hideAudioMetadata?: boolean;\n    suggestion?: {\n      defaultRows?: number; // only for scroll mode\n      expandedRows?: number; // only for scroll mode\n      layoutMode?: 'grid' | 'scroll';\n    };\n    botMessage?: ConfigMessageType;\n    userMessage?: ConfigMessageType;\n    input?: {\n      placeholder?: string;\n      recordingPlaceholder?: string;\n      transcribingPlaceholder?: string;\n    };\n    overview?: {\n      title: string;\n      description?: string;\n    };\n    buttons?: {\n      textBtnSpeak?: string;\n      textBtnTalk?: string;\n      textBtnSubmit?: string;\n    };\n    header?: {\n      title?: string;\n    };\n    language?: {\n      code?: string;\n      options?: {\n        code?: string;\n        name?: string;\n        icon?: string;\n      }[];\n    };\n    userContactForm?: {\n      title?: string;\n      labelName?: string;\n      labelContact?: string;\n      labelEmail?: string;\n      orConnect?: string;\n      messages?: {\n        submitError?: string;\n        submitSuccess?: string;\n        nameError?: string;\n        contactError?: string;\n        invalidContact?: string;\n        emailError?: string;\n        invalidEmail?: string;\n        needFillContactOrEmail?: string;\n      };\n    };\n    bookMeetingForm?: {\n      title?: string;\n      labelDate?: string;\n      labelTime?: string;\n      labelDuration?: string;\n      labelChannel?: string;\n      labelHost?: string;\n      messages?: {\n        submitError?: string;\n        submitSuccess?: string;\n        startTimeError?: string;\n        durationError?: string;\n        channelError?: string;\n      };\n    };\n  } & Record<string, unknown>;\n  skipSuggestion?: boolean;\n  onLoaded?: (tool: ToolType) => void;\n};\n\nconst ConfigurationContext = createContext<ConfigurationData | undefined>(\n  undefined\n);\n\nexport const ConfigurationProvider = ({\n  children,\n  config,\n}: {\n  children: React.ReactNode;\n  config: ConfigurationData;\n}) => {\n  const [configuration, setConfiguration] = useState<ConfigurationData>({\n    ...config,\n  });\n\n  useEffect(() => {\n    if (!config.apiHost) {\n      throw new Error('apiHost is required');\n    }\n    setConfiguration(config);\n  }, [config]);\n\n  return (\n    <ConfigurationContext.Provider value={configuration}>\n      {children}\n    </ConfigurationContext.Provider>\n  );\n};\n\nexport const useConfiguration = () => {\n  const context = React.useContext(ConfigurationContext);\n  if (context === undefined) {\n    throw new Error(\n      'useConfiguration must be used within a ConfigurationProvider'\n    );\n  }\n  return context;\n};\n"]}
+{"version":3,"file":"useConfiguration.js","sourceRoot":"","sources":["../../src/hooks/useConfiguration.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AA6FlE,MAAM,oBAAoB,GAAG,aAAa,CACxC,SAAS,CACV,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,EACpC,QAAQ,EACR,MAAM,GAIP,EAAE,EAAE;IACH,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAoB;QACpE,GAAG,MAAM;KACV,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,CAAC;YACpB,MAAM,IAAI,KAAK,CAAC,qBAAqB,CAAC,CAAC;QACzC,CAAC;QACD,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,KAAC,oBAAoB,CAAC,QAAQ,IAAC,KAAK,EAAE,aAAa,YAChD,QAAQ,GACqB,CACjC,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,oBAAoB,CAAC,CAAC;IACvD,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CACb,8DAA8D,CAC/D,CAAC;IACJ,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC","sourcesContent":["import React, { createContext, useEffect, useState } from 'react';\nimport { ConfigMessageType } from 'types/common.type';\nimport { ToolType } from '../features/AgentWidget';\n\ntype ConfigurationData = {\n  apiHost: string;\n  agentId: string;\n  voice?: {\n    enable?: boolean;\n    livekitUrl: string;\n  };\n  overrideConfig?: Record<string, any>;\n  theme?: {\n    simplified?: boolean;\n    modeButtonChat?: boolean;\n    gapInput?: number;\n    welcomeMessage?: string;\n    noAutoplayMessage?: boolean;\n    autoCloseAudioPlayer?: boolean;\n    hideAudioMetadata?: boolean;\n    suggestion?: {\n      defaultRows?: number; // only for scroll mode\n      expandedRows?: number; // only for scroll mode\n      layoutMode?: 'grid' | 'scroll';\n    };\n    botMessage?: ConfigMessageType;\n    userMessage?: ConfigMessageType;\n    input?: {\n      placeholder?: string;\n      recordingPlaceholder?: string;\n      transcribingPlaceholder?: string;\n    };\n    overview?: {\n      title: string;\n      description?: string;\n    };\n    buttons?: {\n      textBtnSpeak?: string;\n      textBtnTalk?: string;\n      textBtnSubmit?: string;\n    };\n    header?: {\n      title?: string;\n    };\n    language?: {\n      code?: string;\n      options?: {\n        code?: string;\n        name?: string;\n        icon?: string;\n      }[];\n    };\n    userContactForm?: {\n      title?: string;\n      labelName?: string;\n      labelContact?: string;\n      labelEmail?: string;\n      orConnect?: string;\n      messages?: {\n        submitError?: string;\n        submitSuccess?: string;\n        nameError?: string;\n        contactError?: string;\n        invalidContact?: string;\n        emailError?: string;\n        invalidEmail?: string;\n        needFillContactOrEmail?: string;\n      };\n    };\n    bookMeetingForm?: {\n      title?: string;\n      labelDate?: string;\n      labelTime?: string;\n      labelDuration?: string;\n      labelChannel?: string;\n      labelHost?: string;\n      labelBookingList?: string;\n      labelBrand?: string;\n      messages?: {\n        submitError?: string;\n        submitSuccess?: string;\n        startTimeError?: string;\n        durationError?: string;\n        channelError?: string;\n        hostNotFound?: string;\n        startTimeInThePast?: string;\n      };\n    };\n  } & Record<string, unknown>;\n  skipSuggestion?: boolean;\n  onLoaded?: (tool: ToolType) => void;\n};\n\nconst ConfigurationContext = createContext<ConfigurationData | undefined>(\n  undefined\n);\n\nexport const ConfigurationProvider = ({\n  children,\n  config,\n}: {\n  children: React.ReactNode;\n  config: ConfigurationData;\n}) => {\n  const [configuration, setConfiguration] = useState<ConfigurationData>({\n    ...config,\n  });\n\n  useEffect(() => {\n    if (!config.apiHost) {\n      throw new Error('apiHost is required');\n    }\n    setConfiguration(config);\n  }, [config]);\n\n  return (\n    <ConfigurationContext.Provider value={configuration}>\n      {children}\n    </ConfigurationContext.Provider>\n  );\n};\n\nexport const useConfiguration = () => {\n  const context = React.useContext(ConfigurationContext);\n  if (context === undefined) {\n    throw new Error(\n      'useConfiguration must be used within a ConfigurationProvider'\n    );\n  }\n  return context;\n};\n"]}