{"version":3,"file":"zip-form-7e5f9a89.js","sources":["../../../../src/scripts/react-components/zip-form.tsx"],"sourcesContent":["import React, { useRef, useId, useState, useEffect } from 'react';\nimport { ExtendedWindowType } from '../coveo/engine';\nimport { INVALID_GOOGLE_ZIP_EVENT } from '../helpers/geolocation';\n\ntype ZipFormProps = {\n  defaultZipValue?: string;\n  defaultCountryValue: string;\n  invalidZipMessage: string;\n  onSubmit: (zip: string, country: string) => void;\n  zipRegex: {\n    [key: string]: string;\n  };\n  zipPlaceholders: { [key: string]: string };\n  onError?: (error: string) => void;\n  onInput?: (event: React.FormEvent<HTMLInputElement>) => void;\n  whiteBox?: boolean;\n  onClear?: () => void;\n  withSubmitButton?: boolean;\n  submitLabel?: string;\n  alternativeOptions?: boolean;\n  disabled?: boolean;\n  hideCountry?: boolean;\n};\n\nconst ZIP_CODE_PLACEHOLDER = '{{zipCode}}';\nconst COUNTRY_VALUES = ['ca', 'us', 'can', 'usa'];\n\nfunction ZipForm({\n  defaultZipValue,\n  invalidZipMessage,\n  onSubmit,\n  defaultCountryValue,\n  zipRegex,\n  zipPlaceholders,\n  onError,\n  onInput,\n  whiteBox,\n  onClear,\n  withSubmitButton,\n  submitLabel,\n  alternativeOptions,\n  disabled,\n  hideCountry\n}: ZipFormProps) {\n  const id = useId();\n  const zipRef = useRef<HTMLInputElement>(null);\n  const [country, setCountry] = useState(\n    COUNTRY_VALUES.includes(defaultCountryValue) ? defaultCountryValue : 'us'\n  );\n  const [modified, setModified] = useState(defaultZipValue ? true : false);\n  const [invalidMessage, setInvalidMessage] = useState('');\n  const [zipValue, setZipValue] = useState(defaultZipValue);\n  const [ready, setReady] = useState(defaultZipValue ? true : false);\n\n  const handleInvalidZip = () => {\n    const error = invalidZipMessage.replace(\n      ZIP_CODE_PLACEHOLDER,\n      zipRef.current?.value || ''\n    );\n    setInvalidMessage(error);\n    if (onError) onError(error);\n  };\n\n  const checkZipValidity = () => {\n    if (zipRef.current?.checkValidity()) {\n      setReady(true);\n      setInvalidMessage('');\n    } else {\n      const error = invalidZipMessage.replace(\n        ZIP_CODE_PLACEHOLDER,\n        zipRef.current?.value || ''\n      );\n      setInvalidMessage(error);\n      if (onError) onError(error);\n    }\n  };\n\n  const handleFormSubmit = (event: React.FormEvent<HTMLFormElement>) => {\n    event.preventDefault();\n    if (ready && modified) {\n      setModified(false);\n      zipRef.current?.parentElement?.classList.remove('field--error');\n      if (zipValue) {\n        let _zipValue = zipValue;\n        if (country.toLowerCase().includes('ca')) {\n          const cleaned = _zipValue.replace(/\\s/g, '');\n          _zipValue = `${cleaned.substring(0, 3)} ${cleaned.substring(3)}`;\n        }\n        onSubmit(_zipValue, country);\n\n        const global = window as ExtendedWindowType;\n        global.dataLayer?.push({\n          event: 'zip_code',\n          event_action: 'zip code updated',\n          event_category: 'geo info',\n          event_attributes: {\n            zip_code: _zipValue,\n            zip_code_country: country.toLowerCase()\n          }\n        });\n      }\n    }\n  };\n\n  const handleCountryChange = (event: React.ChangeEvent<HTMLSelectElement>) => {\n    setCountry(event.target.value);\n    setZipValue('');\n    setReady(false);\n    setInvalidMessage('');\n  };\n\n  const handleInput = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const newValue = event.target.value;\n    setModified(true);\n    setZipValue(newValue);\n    setInvalidMessage('');\n    setReady(false);\n\n    if (onInput) onInput(event);\n\n    if (newValue.length >= 5) {\n      checkZipValidity();\n    }\n  };\n\n  const handleClear = () => {\n    setInvalidMessage('');\n    setZipValue('');\n    setReady(false);\n    if (onClear) onClear();\n  };\n\n  useEffect(() => {\n    window.addEventListener(INVALID_GOOGLE_ZIP_EVENT, handleInvalidZip);\n\n    return () => {\n      window.removeEventListener(INVALID_GOOGLE_ZIP_EVENT, handleInvalidZip);\n    };\n  }, []);\n\n  return (\n    <>\n      <form\n        action=\"\"\n        onSubmit={handleFormSubmit}\n        className={`zip-form ${whiteBox ? 'zip-form--white-box' : ''} ${\n          withSubmitButton ? 'zip-form--with-cta' : ''\n        }`}\n        noValidate\n      >\n        {!hideCountry && (\n          <div\n            className={`field field--select zip-form__country zip-form__country--${country}`}\n          >\n            <label\n              htmlFor={`select-country${id}`}\n              className=\"field__label sr-only\"\n            >\n              Country\n            </label>\n            <select\n              value={country}\n              name={`select-country${id}`}\n              id={`select-country${id}`}\n              className=\"field__select zip-form__country-select\"\n              onChange={handleCountryChange}\n              disabled={disabled}\n            >\n              {alternativeOptions ? (\n                <>\n                  <option value=\"can\">CA</option>\n                  <option value=\"usa\">US</option>\n                </>\n              ) : (\n                <>\n                  <option value=\"ca\">CA</option>\n                  <option value=\"us\">US</option>\n                </>\n              )}\n            </select>\n          </div>\n        )}\n\n        <div\n          data-module=\"input\"\n          className=\"field field--required zip-form__zip\"\n        >\n          <label\n            className=\"field__label sr-only\"\n            htmlFor={`select-country${id}`}\n          >\n            Zip\n          </label>\n          <input\n            value={zipValue}\n            ref={zipRef}\n            className=\"field__input zip-form__zip-input\"\n            id={`select-country${id}`}\n            name={`select-zip${id}`}\n            placeholder={zipPlaceholders[country]}\n            required={true}\n            pattern={zipRegex[country]}\n            onInput={handleInput}\n            disabled={disabled}\n          />\n          {zipValue && (\n            <button\n              className=\"field__input-close\"\n              type=\"button\"\n              title=\"Clear\"\n              onClick={handleClear}\n            >\n              <span className=\"sr-only\">Clear</span>\n            </button>\n          )}\n          {!withSubmitButton && (\n            <button\n              className=\"field__input-search\"\n              type=\"submit\"\n              title=\"Submit\"\n              disabled={!ready}\n            >\n              <span className=\"sr-only\">\n                {submitLabel ? submitLabel : 'Submit'}\n              </span>\n            </button>\n          )}\n        </div>\n        {withSubmitButton && (\n          <div className=\"zip-form__submit-wrapper\">\n            <button\n              type=\"submit\"\n              className=\"btn btn--primary zip-form__submit-btn\"\n              disabled={!ready}\n              data-layer='[{\"event\":\"find_a_contractor_button\",\"event_category\":\"find a contractor\",\"event_action\":\"find a contractor button\",\"event_label\":\"\",\"event_attributes\":{\"zip_code\":null}}]'\n            >\n              {submitLabel ? submitLabel : 'Submit'}\n            </button>\n          </div>\n        )}\n      </form>\n      {invalidMessage && (\n        <div className=\"zip-form__error-message\">\n          <p className=\"error-message__error \">{invalidMessage}</p>\n        </div>\n      )}\n    </>\n  );\n}\n\nexport default ZipForm;\n"],"names":["ZIP_CODE_PLACEHOLDER","COUNTRY_VALUES","ZipForm","defaultZipValue","invalidZipMessage","onSubmit","defaultCountryValue","zipRegex","zipPlaceholders","onError","onInput","whiteBox","onClear","withSubmitButton","submitLabel","alternativeOptions","disabled","hideCountry","id","useId","zipRef","useRef","country","setCountry","useState","modified","setModified","invalidMessage","setInvalidMessage","zipValue","setZipValue","ready","setReady","handleInvalidZip","error","_a","checkZipValidity","_b","handleFormSubmit","event","_zipValue","cleaned","_c","handleCountryChange","handleInput","newValue","handleClear","useEffect","INVALID_GOOGLE_ZIP_EVENT","React"],"mappings":"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"}