{"version":3,"file":"NewsletterSignup-Ds94n1Jd-chunk.js","sources":["../../../GSDClient/Scripts/Components/NewsLetterBlock/NewsLetterInputField.tsx","../../../GSDClient/Scripts/Blocks/NewsletterSignup.tsx"],"sourcesContent":["import { useDispatch } from 'react-redux';\n\nimport { IFieldValue, updateFieldValue } from 'Scripts/Slices/newsletter';\nimport { ITextModel } from 'Scripts/Types/Litium';\n\nimport { ValidationSchemaItem } from '../Forms/RenderFormField';\n\nconst NewsLetterInputField = ({\n    field,\n    loading,\n    error,\n}: {\n    field: ITextModel;\n    loading: boolean;\n    error: ValidationSchemaItem;\n}) => {\n    const dispatch = useDispatch();\n    if (!field) return;\n\n    const handleInputChange = (data: IFieldValue) => {\n        dispatch(updateFieldValue({ data }));\n    };\n\n    const hasError =\n        error &&\n        'isValid' in error &&\n        (!error?.isValid || !error?.isRequiredCriteriaMet);\n\n    return (\n        <div className=\"relative mb-0 flex flex-1 flex-col px-[1px]\">\n            <input\n                data-invalid={hasError}\n                className={`peer mb-4 block w-full basis-full scroll-m-6 appearance-none rounded-none border border-solid bg-white px-4 pb-1 pt-4 font-roboto text-base font-normal text-ironSideGray placeholder-opacity-0 transition-[outline,_border,_box-shadow,_border-color] duration-layout ease-in-out placeholder:opacity-0 read-only:bg-silver focus:border-black [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none [&:invalid:not(:focus):not(:placeholder-shown)]:border-errorRed [&:invalid:not(:focus):not(:placeholder-shown)]:text-errorRed  [&:invalid:not(:focus):not(:placeholder-shown)]:outline-errorRed [&:placeholder-show:not(required)]:border-transparent [&[type=\"number\"]]:[appearance:textfield] ${\n                    hasError\n                        ? 'border-errorRed text-errorRed outline-errorRed'\n                        : 'border-dawn'\n                }`}\n                type={field.type}\n                value={field.value}\n                onChange={event =>\n                    handleInputChange({\n                        value: event.target.value,\n                        type: field.type,\n                        name: field.name,\n                    })\n                }\n                placeholder={field.label}\n                autoComplete={\n                    field.autocomplete.length > 0\n                        ? field.autocomplete\n                        : undefined\n                }\n                maxLength={field.maxLength ? +field.maxLength : null}\n                required={field.required || undefined}\n                readOnly={field.disabled || loading}\n                name={field.name}\n                id={field.name}\n            />\n\n            <label\n                className=\"pointer-events-none absolute flex w-full whitespace-nowrap pb-3 pl-4.5 pr-4.5 pt-3 font-roboto text-base font-light text-ironSideGray opacity-100 transition-all peer-focus:top-0 peer-focus:pl-4.5 peer-focus:pt-1.5 peer-focus:text-xs peer-focus:opacity-100 peer-[&:focus:not(:placeholder-shown)]:top-0 peer-[:not(:placeholder-shown)]:top-0 peer-[&:focus:not(:placeholder-shown)]:pr-4.5 peer-[&:focus:not(:placeholder-shown)]:pt-1.5 peer-[:not(:placeholder-shown)]:pr-4.5 peer-[:not(:placeholder-shown)]:pt-1.5 peer-[&:focus:not(:placeholder-shown)]:text-xs peer-[:not(:placeholder-shown)]:text-xs peer-[&:invalid:not(:focus):not(:placeholder-shown)]:text-errorRed peer-[&:focus:not(:placeholder-shown)]:opacity-100\"\n                htmlFor={field.name}\n            >\n                <span className=\"overflow-hidden text-ellipsis\">\n                    {field.label}\n                </span>\n                {field.required && <span className=\"pl-1\">*</span>}\n            </label>\n            {error &&\n                'isValid' in error &&\n                (!error?.isValid || !error?.isRequiredCriteriaMet) && (\n                    <span className=\"-mt-2.5 text-xs text-errorRed\">\n                        {field.validationMessage}\n                    </span>\n                )}\n        </div>\n    );\n};\n\nexport default NewsLetterInputField;\n","import { useEffect, useState } from 'react';\nimport { toast } from 'react-hot-toast';\nimport { useDispatch, useSelector } from 'react-redux';\n\nimport { populateInputFields } from 'Scripts/Slices/newsletter';\nimport { IRootState } from 'Scripts/store';\n\nimport { useNewsletterSignupMutation } from 'Services/newsletterApi';\nimport { newsletterSignupDataLayerPush } from 'Utils/dataLayerPushService';\n\nimport { INewsletterSignupBlockViewModel } from 'Types/Litium';\nimport CtaButton from 'Components/CtaButton';\nimport {\n    handleFormPost,\n    validateFormFields,\n    ValidationSchema,\n} from 'Components/Forms/RenderFormField';\nimport Markup from 'Components/Markup';\nimport NewsLetterInputField from 'Components/NewsLetterBlock/NewsLetterInputField';\nimport { setVoyadoContactId } from 'Services/voyadoApi';\n\nconst NewsletterSignup = ({\n    header,\n    backgroundImage,\n    termsAndConditionText,\n    inputFields,\n    submitText,\n    confirmationText,\n}: INewsletterSignupBlockViewModel) => {\n    const [formValidation, setFormValidation] = useState<ValidationSchema>([]);\n    const dispatch = useDispatch();\n\n    const [\n        newsletterSignup,\n        {\n            isLoading: newsletterSignupResultIsLoading,\n            error: newsletterSignupResultError,\n            data: newsletterSignupResultData,\n            isSuccess: newsletterSignupResultIsSuccess,\n        },\n    ] = useNewsletterSignupMutation();\n    const handleOnsubmit = (e: React.FormEvent<HTMLFormElement>) => {\n        e.preventDefault();\n        if (\n            validateFormFields(\n                newsletterSignupInputFields.filter(\n                    x => x.name === inputFields[0].name\n                ),\n                setFormValidation\n            )\n        ) {\n            newsletterSignup({ form: e.currentTarget });\n            newsletterSignupDataLayerPush(\n                window.__litium.dataLayerEvents.newsletterSignupEventTrigger\n            );\n        }\n    };\n    const newsletterSignupInputFields = useSelector(\n        (state: IRootState) => state.newsletter.inputFields\n    );\n\n    useEffect(() => {\n        dispatch(populateInputFields(inputFields[0]));\n    }, []);\n\n    useEffect(() => {\n        handleFormPost(newsletterSignupResultData, newsletterSignupResultError);\n\n        if (newsletterSignupResultIsSuccess) {\n            toast.success(confirmationText);\n\n            if(newsletterSignupResultData && newsletterSignupResultData.contactId) {\n                setVoyadoContactId(newsletterSignupResultData.contactId);\n            }\n        }\n    }, [newsletterSignupResultData, newsletterSignupResultError]);\n\n    const error = formValidation.find(\n        element => element.name === inputFields[0].name\n    );\n\n    return (\n        <div\n            style={{\n                backgroundImage:\n                    backgroundImage?.src &&\n                    `url(${backgroundImage.src}?format=webp)`,\n            }}\n            className=\"flex h-auto w-full bg-white bg-cover bg-center bg-no-repeat py-8\"\n        >\n            <div className=\"flex w-full justify-center px-4\">\n                <form onSubmit={handleOnsubmit}>\n                    <fieldset className=\"flex w-full flex-col items-center\">\n                        <legend className=\"mb-3 w-full font-montserrat text-xl lg:w-[36rem] lg:text-2xl\">\n                            {header}\n                        </legend>\n                        <div className=\"w-full lg:w-[36rem]\">\n                            <div className=\"flex w-full flex-col lg:flex-row lg:gap-4\">\n                                <NewsLetterInputField\n                                    field={\n                                        newsletterSignupInputFields.find(\n                                            x => x.name === inputFields[0].name\n                                        ) || inputFields[0]\n                                    }\n                                    loading={newsletterSignupResultIsLoading}\n                                    error={error}\n                                />\n                                <div className=\"w-full lg:w-auto\">\n                                    <CtaButton\n                                        className=\"mb-2 h-[46px] w-full border-0 bg-woodland text-lg lg:mb-0 lg:w-auto\"\n                                        type=\"submit\"\n                                    >\n                                        {submitText}\n                                    </CtaButton>\n                                </div>\n                            </div>\n\n                            <Markup\n                                html={termsAndConditionText?.value}\n                                cssClass=\"m-0\"\n                            />\n                        </div>\n                    </fieldset>\n                </form>\n            </div>\n        </div>\n    );\n};\n\nexport default NewsletterSignup;\n"],"names":["NewsLetterInputField","field","loading","error","dispatch","useDispatch","handleInputChange","data","updateFieldValue","hasError","jsxs","jsx","event","NewsletterSignup","header","backgroundImage","termsAndConditionText","inputFields","submitText","confirmationText","formValidation","setFormValidation","useState","newsletterSignup","newsletterSignupResultIsLoading","newsletterSignupResultError","newsletterSignupResultData","newsletterSignupResultIsSuccess","useNewsletterSignupMutation","handleOnsubmit","e","validateFormFields","newsletterSignupInputFields","x","newsletterSignupDataLayerPush","useSelector","state","useEffect","populateInputFields","handleFormPost","toast","setVoyadoContactId","element","CtaButton","Markup"],"mappings":"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"}