{"version":3,"file":"ContactQuestion.cjs","sources":["../../../../../src/components/feedback/questions/ContactQuestion.tsx"],"sourcesContent":["import React, {\n    type ChangeEvent,\n    type FC,\n    useCallback,\n    useEffect,\n    useRef,\n    useState,\n} from \"react\";\nimport { isValidEpost } from \"../../../utilities/validators/isValidEpost/isValidEpost.js\";\nimport { isValidTelefonnummer } from \"../../../utilities/validators/isValidTelefonnummer/isValidTelefonnummer.js\";\nimport { PrimaryButton, TertiaryButton } from \"../../button/Button.js\";\nimport { TextInput } from \"../../text-input/TextInput.js\";\nimport { FeedbackSuccess } from \"../FeedbackSuccess.js\";\nimport { useFeedbackContext } from \"../feedbackContext.js\";\nimport type { ContactQuestionProps } from \"../types.js\";\n\nconst validateEmail = (email?: string) => {\n    if (!email || email === \"\") {\n        return \"Du må oppgi e-postadresse for at vi kan kontakte deg\";\n    }\n    if (!isValidEpost(email)) {\n        return \"Skriv inn en gyldig e-postadresse\";\n    }\n    return;\n};\n\nconst validatePhone = (phone?: string) => {\n    if (!phone || phone === \"\") {\n        return \"Du må oppgi telefonnummer for at vi kan kontakte deg\";\n    }\n    if (!isValidTelefonnummer(phone)) {\n        return \"Skriv inn et gyldig telefonnummer\";\n    }\n    return;\n};\n\nconst defaultSuccessMessage = {\n    title: \"Takk for tiden din!\",\n    children:\n        \"Neste gang vi gjennomfører intervjuer og tester kan det hende vi tar kontakt med deg. Dine innspill hjelper oss med å gjøre nettsidene bedre for deg og alle andre som bruker dem.\",\n};\n\nexport const ContactQuestion: FC<ContactQuestionProps> = ({\n    label = \"Kan vi kontakte deg for flere innspill?\",\n    sendButtonLabel = \"Sett meg på lista!\",\n    withPhone = false,\n    onSubmit,\n    successMessage = defaultSuccessMessage,\n    children,\n}) => {\n    const [email, setEmail] = useState(\"\");\n    const [phone, setPhone] = useState(\"\");\n    const [errors, setErrors] = useState<{ email?: string; phone?: string }>(\n        {},\n    );\n    const emailRef = useRef<HTMLInputElement>(null);\n    const phoneRef = useRef<HTMLInputElement>(null);\n    const [shouldValidate, setShouldValidate] = useState(false);\n\n    const [noThanks, setNoThanks] = useState(false);\n    const { contactSubmitted, setContactSubmitted, landmarkLabel } =\n        useFeedbackContext();\n\n    const ChildrenWrapper = typeof children === \"string\" ? \"p\" : \"div\";\n\n    const validate = useCallback((email: string, phone: string) => {\n        const emailError = validateEmail(email);\n        const phoneError = validatePhone(phone);\n        setErrors({ email: emailError, phone: phoneError });\n        return { emailError, phoneError };\n    }, []);\n\n    useEffect(() => {\n        if (shouldValidate) {\n            const { emailError, phoneError } = validate(email, phone);\n\n            if (!emailError && (!withPhone || !phoneError)) {\n                setShouldValidate(false);\n            }\n        }\n    }, [email, phone, shouldValidate, withPhone, validate]);\n\n    const handleChange =\n        (consumer: (value: string) => void) =>\n        (e: ChangeEvent<HTMLInputElement>) =>\n            consumer(e.target.value);\n\n    const handleSubmit: React.FormEventHandler = (e) => {\n        e.preventDefault();\n\n        const { emailError, phoneError } = validate(email, phone);\n        if (emailError) {\n            setShouldValidate(true);\n            emailRef.current?.focus();\n            return;\n        }\n        if (withPhone && phoneError) {\n            setShouldValidate(true);\n            phoneRef.current?.focus();\n            return;\n        }\n\n        onSubmit({ email, phone: withPhone ? phone : undefined });\n        setContactSubmitted(true);\n    };\n\n    if (noThanks) {\n        return null;\n    }\n\n    if (contactSubmitted) {\n        return <FeedbackSuccess {...successMessage} />;\n    }\n\n    return (\n        <form\n            className=\"jkl-spacing-40--top\"\n            onSubmit={handleSubmit}\n            aria-label={landmarkLabel}\n        >\n            <p className=\"jkl-heading-4 jkl-spacing-8--bottom\">{label}</p>\n            {children && (\n                <ChildrenWrapper className=\"jkl-body\">\n                    {children}\n                </ChildrenWrapper>\n            )}\n\n            <TextInput\n                ref={emailRef}\n                className=\"jkl-spacing-24--top\"\n                label=\"E-post\"\n                labelProps={{ variant: \"small\" }}\n                autoComplete=\"email\"\n                name=\"email\"\n                value={email}\n                onChange={handleChange(setEmail)}\n                errorLabel={errors.email}\n            />\n            {withPhone && (\n                <TextInput\n                    ref={phoneRef}\n                    className=\"jkl-spacing-24--top\"\n                    label=\"Telefonnummer\"\n                    labelProps={{ variant: \"small\" }}\n                    autoComplete=\"tel\"\n                    name=\"phone\"\n                    value={phone}\n                    onChange={handleChange(setPhone)}\n                    errorLabel={errors.phone}\n                />\n            )}\n\n            <div className=\"jkl-spacing-40--top\">\n                <PrimaryButton type=\"submit\" className=\"jkl-spacing-40--right\">\n                    {sendButtonLabel}\n                </PrimaryButton>\n                <TertiaryButton onClick={() => setNoThanks(true)}>\n                    Nei takk\n                </TertiaryButton>\n            </div>\n        </form>\n    );\n};\n"],"names":["defaultSuccessMessage","title","children","label","sendButtonLabel","withPhone","onSubmit","successMessage","email","setEmail","useState","phone","setPhone","errors","setErrors","emailRef","useRef","phoneRef","shouldValidate","setShouldValidate","noThanks","setNoThanks","contactSubmitted","setContactSubmitted","landmarkLabel","useFeedbackContext","ChildrenWrapper","validate","useCallback","emailError","isValidEpost","validateEmail","phoneError","isValidTelefonnummer","validatePhone","useEffect","handleChange","consumer","e","target","value","jsx","FeedbackSuccess","jsxs","className","preventDefault","current","focus","TextInput","ref","labelProps","variant","autoComplete","name","onChange","errorLabel","PrimaryButton","type","TertiaryButton","onClick"],"mappings":"mcAoCMA,EAAwB,CAC1BC,MAAO,sBACPC,SACI,8MAGiD,EACrDC,MAAAA,EAAQ,0CACRC,gBAAAA,EAAkB,qBAClBC,UAAAA,GAAY,EACZC,SAAAA,EACAC,eAAAA,EAAiBP,EACjBE,SAAAA,MAEA,MAAOM,EAAOC,GAAYC,EAAAA,SAAS,KAC5BC,EAAOC,GAAYF,EAAAA,SAAS,KAC5BG,EAAQC,GAAaJ,EAAAA,SACxB,CAAA,GAEEK,EAAWC,EAAAA,OAAyB,MACpCC,EAAWD,EAAAA,OAAyB,OACnCE,EAAgBC,GAAqBT,EAAAA,UAAS,IAE9CU,EAAUC,GAAeX,EAAAA,UAAS,IACjCY,iBAAAA,EAAkBC,oBAAAA,EAAqBC,cAAAA,GAC3CC,EAAAA,qBAEEC,EAAsC,iBAAbxB,EAAwB,IAAM,MAEvDyB,EAAWC,EAAAA,YAAY,CAACpB,EAAeG,KACzC,MAAMkB,EAlDSrB,IACdA,GAAmB,KAAVA,EAGTsB,EAAAA,aAAatB,QAAlB,EACW,oCAHA,uDAgDYuB,CAAcvB,GAC3BwB,EAzCSrB,IACdA,GAAmB,KAAVA,EAGTsB,EAAAA,qBAAqBtB,QAA1B,EACW,oCAHA,uDAuCYuB,CAAcvB,GACjC,OAAAG,EAAU,CAAEN,MAAOqB,EAAYlB,MAAOqB,IAC/B,CAAEH,WAAAA,EAAYG,WAAAA,IACtB,IAEHG,EAAAA,UAAU,KACN,GAAIjB,EAAgB,CAChB,MAAQW,WAAAA,EAAYG,WAAAA,GAAeL,EAASnB,EAAOG,IAE9CkB,KAAgBxB,IAAc2B,IAC/Bb,GAAkB,EAE1B,GACD,CAACX,EAAOG,EAAOO,EAAgBb,EAAWsB,IAE7C,MAAMS,EACDC,GACAC,GACGD,EAASC,EAAEC,OAAOC,OAqB1B,OAAIpB,EACO,KAGPE,EACOmB,MAACC,EAAAA,gBAAA,IAAoBnC,IAI5BoC,EAAAA,KAAC,OAAA,CACGC,UAAU,sBACVtC,SA9BsCgC,IAC1CA,EAAEO,iBAEF,MAAQhB,WAAAA,EAAYG,WAAAA,GAAeL,EAASnB,EAAOG,GACnD,OAAIkB,GACAV,GAAkB,QAClBJ,EAAS+B,SAASC,SAGlB1C,GAAa2B,GACbb,GAAkB,QAClBF,EAAS6B,SAASC,UAItBzC,EAAS,CAAEE,MAAAA,EAAOG,MAAON,EAAYM,OAAQ,SAC7CY,GAAoB,KAehB,aAAYC,EAEZtB,SAAA,CAAAuC,EAAAA,IAAC,IAAA,CAAEG,UAAU,sCAAuC1C,SAAAC,IACnDD,GACGuC,EAAAA,IAACf,EAAA,CAAgBkB,UAAU,WACtB1C,SAAAA,IAITuC,EAAAA,IAACO,EAAAA,UAAA,CACGC,IAAKlC,EACL6B,UAAU,sBACVzC,MAAM,SACN+C,WAAY,CAAEC,QAAS,SACvBC,aAAa,QACbC,KAAK,QACLb,MAAOhC,EACP8C,SAAUlB,EAAa3B,GACvB8C,WAAY1C,EAAOL,QAEtBH,GACGoC,EAAAA,IAACO,EAAAA,UAAA,CACGC,IAAKhC,EACL2B,UAAU,sBACVzC,MAAM,gBACN+C,WAAY,CAAEC,QAAS,SACvBC,aAAa,MACbC,KAAK,QACLb,MAAO7B,EACP2C,SAAUlB,EAAaxB,GACvB2C,WAAY1C,EAAOF,QAI3BgC,EAAAA,KAAC,MAAA,CAAIC,UAAU,sBACX1C,SAAA,CAAAuC,MAACe,EAAAA,cAAA,CAAcC,KAAK,SAASb,UAAU,wBAClC1C,SAAAE,UAEJsD,EAAAA,eAAA,CAAeC,QAAS,IAAMtC,GAAY,GAAOnB,SAAA"}