{"version":3,"file":"components-ui-builder-footer-51c61fbbd23c67373096.js","mappings":"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","sources":["webpack://www-differentdog-com/./src/components/ui-builder/footer/index.tsx"],"sourcesContent":["import ErrorToast from 'components/ui/toast/ErrorToast'\nimport Toast from 'components/ui/toast/Toast'\nimport { Link } from 'gatsby'\nimport React, { useState } from 'react'\nimport Api from 'state/apis/api'\n\nenum SocialPlatform {\n  Facebook = 'Facebook',\n  Instagram = 'Instagram',\n  Twitter = 'Twitter'\n}\n\ninterface Item {\n  itemText: string\n  itemUrl: string\n  itemColor: string\n}\n\ninterface Section {\n  sectionHeading: string\n  sectionHeadingColor: string\n  items: Item[]\n}\n\ninterface SocialItem {\n  type: SocialPlatform\n  href: string\n}\n\ninterface Props {\n  backgroundColor: string\n  backgroundImage: any\n  logo: any\n  footerText: string\n  ownerText: string\n  sections: Section[]\n  newsLetterButtonBackgroundColor: string\n  newsLetterButtonTextColor: string\n  newsLetterButtonText: string\n  socials: SocialItem[]\n  socialIconColor: string\n  overallTextColor: string\n  borderColor: string\n  isLastName: boolean\n  isFirstName: boolean\n  newsletterHeading: string\n  newsletterDescription: string\n  newsletterDescriptionColor: string\n  newsletterHeadingColor: string\n  formFieldbg: string\n  formFieldTextColor: string\n}\n\nexport const Footer = ({\n  backgroundColor,\n  backgroundImage = '',\n  logo,\n  footerText,\n  ownerText,\n  sections,\n  newsLetterButtonBackgroundColor,\n  newsLetterButtonTextColor,\n  newsLetterButtonText,\n  socials,\n  socialIconColor,\n  overallTextColor,\n  borderColor,\n  isFirstName,\n  isLastName,\n  newsletterHeading,\n  newsletterDescription,\n  newsletterDescriptionColor,\n  newsletterHeadingColor,\n  formFieldbg,\n  formFieldTextColor\n}: Props) => {\n  const [formData, setFormData] = useState({\n    email: '',\n    firstName: '',\n    lastName: ''\n  })\n  const [errorToast, setErrorToast] = useState(false)\n  const [showToast, setShowToast] = useState(false)\n\n  const handleSetErrorToast = (show: boolean) => {\n    setErrorToast(show)\n  }\n\n  const handleSetShowToast = (show: boolean) => {\n    setShowToast(show)\n  }\n\n  const handleSubmit = (e: any) => {\n    e.preventDefault()\n    const { email, firstName: name, lastName: surname } = formData\n    Api.post('wwwREST', '/v1/public/email/signup', {\n      body: {\n        email,\n        name,\n        surname\n      }\n    })\n      .then(() => {\n        setFormData({\n          email: '',\n          firstName: '',\n          lastName: ''\n        })\n        setShowToast(true)\n      })\n      .catch(() => {\n        setErrorToast(true)\n      })\n  }\n  console.log('== footer basic info', sections, socials)\n  const mapColOne = sections[0]\n  const mapColTwo = sections[1]\n  const mapColThree = sections[2]\n  const mapColFour = sections[3]\n\n  const getSocialIcon = (item: SocialItem) => {\n    if (item.type === SocialPlatform.Facebook) {\n      return (\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" className=\"h-6 w-6\" style={{ color: socialIconColor }}>\n          <path\n            fillRule=\"evenodd\"\n            d=\"M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z\"\n            clipRule=\"evenodd\"\n          />\n        </svg>\n      )\n    }\n\n    if (item.type === SocialPlatform.Instagram) {\n      return (\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" className=\"h-6 w-6\" style={{ color: socialIconColor }}>\n          <path\n            fillRule=\"evenodd\"\n            d=\"M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z\"\n            clipRule=\"evenodd\"\n          />\n        </svg>\n      )\n    }\n\n    if (item.type === SocialPlatform.Twitter) {\n      return (\n        <svg fill=\"currentColor\" viewBox=\"0 0 24 24\" className=\"h-6 w-6\" style={{ color: socialIconColor }}>\n          <path d=\"M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84\" />\n        </svg>\n      )\n    }\n  }\n\n  const FirstNameComp = () => {\n    if (!isFirstName) return null\n    return (\n      <>\n        <label htmlFor=\"first-name\" className=\"sr-only\">\n          First Name\n        </label>\n        <input\n          type=\"text\"\n          name=\"first-name\"\n          id=\"first-name\"\n          required\n          className=\"w-full min-w-0 appearance-none rounded-full bg-white py-2 px-4 text-base text-gray-900 placeholder-gray-500 focus:outline-none sm:max-w-xs\"\n          style={{ backgroundColor: formFieldbg, color: formFieldTextColor }}\n          placeholder=\"First Name\"\n          value={formData.firstName}\n          onChange={e => {\n            setFormData({ ...formData, firstName: e.target.value })\n          }}\n        />\n      </>\n    )\n  }\n\n  const LastNameComp = () => {\n    if (!isLastName) return null\n    return (\n      <>\n        <label htmlFor=\"last-name\" className=\"sr-only\">\n          Last Name\n        </label>\n        <input\n          type=\"text\"\n          name=\"last-name\"\n          id=\"last-name\"\n          required\n          className=\"mt-6 w-full min-w-0 appearance-none rounded-full bg-white py-2 px-4 text-base text-gray-900 placeholder-gray-500 focus:outline-none sm:mt-0 sm:max-w-xs\"\n          style={{ backgroundColor: formFieldbg, color: formFieldTextColor }}\n          placeholder=\"Last Name\"\n          value={formData.lastName}\n          onChange={e => {\n            setFormData({ ...formData, lastName: e.target.value })\n          }}\n        />\n      </>\n    )\n  }\n\n  return (\n    <footer\n      className=\"bg-white\"\n      aria-labelledby=\"footer-heading\"\n      style={{\n        backgroundColor,\n        backgroundImage: backgroundImage ? `url(${backgroundImage ?? ''})` : 'none',\n        backgroundRepeat: 'no-repeat',\n        backgroundSize: 'cover',\n        backgroundPosition: 'center'\n      }}\n    >\n      <h2 id=\"footer-heading\" className=\"sr-only\">\n        Footer\n      </h2>\n      <div className=\"mx-auto max-w-7xl py-12 px-4 sm:px-6 lg:py-16 lg:px-8\">\n        {/* xl:grid xl:grid-cols-3 xl:gap-8 */}\n        <div className=\"sm:grid sm:grid-cols-2 sm:gap-8\">\n          <div className=\"mx-auto w-full max-w-md space-y-8 xl:col-span-1\">\n            <img\n              className=\"h-full max-h-20\"\n              src={logo || 'https://tailwindui.com/img/logos/workflow-mark-gray-300.svg'}\n              alt=\"Different Dog\"\n            />\n\n            {/* { newsletter row } */}\n            <div\n              className=\"border-t border-gray-200 pt-8 lg:flex lg:items-center lg:justify-between xl:mt-0\"\n              style={{ borderColor: borderColor }}\n            >\n              <div>\n                <h3 className=\"text-base tracking-wider text-gray-400\" style={{ color: newsletterHeadingColor }}>\n                  {newsletterHeading}\n                </h3>\n                <p className=\"mt-2 text-sm text-gray-500\" style={{ color: newsletterDescriptionColor }}>\n                  {newsletterDescription}\n                </p>\n              </div>\n            </div>\n\n            {/* sm:flex sm:max-w-md */}\n            <form className=\"mt-4 lg:mt-0\" onSubmit={handleSubmit}>\n              <div className=\"sm:flex sm:gap-8\">\n                {FirstNameComp()}\n                {LastNameComp()}\n              </div>\n              <div className=\"mt-6 w-full\">\n                <label htmlFor=\"email-address\" className=\"sr-only\">\n                  Email address\n                </label>\n                <input\n                  type=\"email\"\n                  name=\"email-address\"\n                  id=\"email-address\"\n                  autoComplete=\"email\"\n                  required\n                  className=\"w-full min-w-0 appearance-none rounded-full bg-white py-2 px-4 text-base text-gray-900 placeholder-gray-500 focus:outline-none\"\n                  placeholder=\"Enter your email\"\n                  value={formData.email}\n                  style={{ backgroundColor: formFieldbg, color: formFieldTextColor }}\n                  onChange={e => {\n                    setFormData({ ...formData, email: e.target.value })\n                  }}\n                />\n              </div>\n              {/* sm:ml-3 */}\n              <div className=\"mt-6 w-3/4 rounded-full sm:flex-shrink-0\">\n                <button\n                  type=\"submit\"\n                  // rounded-full\n                  className=\"flex items-center justify-center rounded-full border border-transparent bg-indigo-600 py-2 px-4 text-base font-medium text-white hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2\"\n                  style={{ backgroundColor: newsLetterButtonBackgroundColor, color: newsLetterButtonTextColor }}\n                >\n                  {newsLetterButtonText}\n                </button>\n              </div>\n            </form>\n\n            <div className=\"flex space-x-6\">\n              {socials?.map((item, i) => (\n                <Link key={i} to={item.href} className=\"text-gray-400 hover:text-gray-500\">\n                  <span className=\"sr-only\">{item.type}</span>\n                  {getSocialIcon(item)}\n                </Link>\n              ))}\n            </div>\n\n            <div\n              className=\"mt-12 mb-8 hidden border-t border-gray-200 pt-8 sm:block\"\n              style={{ borderColor: borderColor }}\n            >\n              <p className=\"text-base text-gray-400 xl:text-center\" style={{ color: overallTextColor }}>\n                {ownerText}\n              </p>\n            </div>\n          </div>\n          {/* xl:col-span-2 */}\n          <div className=\"mx-auto mt-12 grid w-full max-w-md grid-cols-1 gap-8 justify-self-end xl:mt-0\">\n            <div className=\"grid grid-cols-2 gap-8\">\n              <div>\n                <h3\n                  className=\"text-sm font-semibold tracking-wider text-gray-400\"\n                  style={{ color: mapColOne?.sectionHeadingColor }}\n                >\n                  {mapColOne?.sectionHeading}\n                </h3>\n                <ul role=\"list\" className=\"mt-4 space-y-4\">\n                  {mapColOne?.items?.map((item, i) => (\n                    <li key={i}>\n                      <Link\n                        to={item.itemUrl}\n                        className=\"text-base text-gray-500 hover:text-gray-900\"\n                        style={{ color: item.itemColor }}\n                      >\n                        {item.itemText}\n                      </Link>\n                    </li>\n                  ))}\n                </ul>\n              </div>\n              {/* className=\"mt-12 md:mt-0\" */}\n              <div>\n                <h3\n                  className=\"text-sm font-semibold tracking-wider text-gray-400\"\n                  style={{ color: mapColTwo?.sectionHeadingColor }}\n                >\n                  {mapColTwo?.sectionHeading}\n                </h3>\n                <ul role=\"list\" className=\"mt-4 space-y-4\">\n                  {mapColTwo?.items?.map((item, i) => (\n                    <li key={i}>\n                      <Link\n                        to={item.itemUrl}\n                        className=\"text-base text-gray-500 hover:text-gray-900\"\n                        style={{ color: item.itemColor }}\n                      >\n                        {item.itemText}\n                      </Link>\n                    </li>\n                  ))}\n                </ul>\n              </div>\n            </div>\n            <div className=\"grid grid-cols-2 gap-8\">\n              <div>\n                <h3\n                  className=\"text-sm font-semibold tracking-wider text-gray-400\"\n                  style={{ color: mapColThree?.sectionHeadingColor }}\n                >\n                  {mapColThree?.sectionHeading}\n                </h3>\n                <ul role=\"list\" className=\"mt-4 space-y-4\">\n                  {mapColThree?.items?.map((item, i) => (\n                    <li key={i}>\n                      <Link\n                        to={item.itemUrl}\n                        className=\"text-base text-gray-500 hover:text-gray-900\"\n                        style={{ color: item.itemColor }}\n                      >\n                        {item.itemText}\n                      </Link>\n                    </li>\n                  ))}\n                </ul>\n                <p className=\"mt-4 text-base text-gray-500\" style={{ color: overallTextColor }}>\n                  {footerText}\n                </p>\n              </div>\n              {/* className=\"mt-12 md:mt-0\" */}\n              <div>\n                <h3\n                  className=\"text-sm font-semibold tracking-wider text-gray-400\"\n                  style={{ color: mapColFour?.sectionHeadingColor }}\n                >\n                  {mapColFour?.sectionHeading}\n                </h3>\n                <ul role=\"list\" className=\"mt-4 space-y-4\">\n                  {mapColFour?.items?.map((item, i) => (\n                    <li key={i}>\n                      <Link\n                        to={item.itemUrl}\n                        className=\"text-base text-gray-500 hover:text-gray-900\"\n                        style={{ color: item.itemColor }}\n                      >\n                        {item.itemText}\n                      </Link>\n                    </li>\n                  ))}\n                </ul>\n              </div>\n            </div>\n          </div>\n        </div>\n\n        <div\n          className=\"mt-12 mb-4 block border-t border-gray-200 pt-8 text-center sm:hidden\"\n          style={{ borderColor: borderColor }}\n        >\n          <p className=\"text-center text-base text-gray-400\" style={{ color: overallTextColor }}>\n            {ownerText}\n          </p>\n          {/* <div className=\"mx-auto mt-4 w-full max-w-[4rem]\">\n            <img className=\"mx-auto\" src={Visa} alt=\"Visa payment\" />\n          </div> */}\n        </div>\n\n        <ErrorToast\n          showToast={errorToast}\n          msg={'Please enter valid email address'}\n          handleSetShowToast={handleSetErrorToast}\n          handleOnClick={() => {}}\n        />\n        <Toast showToast={showToast} msg={'Thank you for subscribing'} handleSetShowToast={handleSetShowToast} />\n      </div>\n    </footer>\n  )\n}\n\nexport default Footer\n"],"names":["SocialPlatform","Footer","_ref","_mapColOne$items","_mapColTwo$items","_mapColThree$items","_mapColFour$items","backgroundColor","_ref$backgroundImage","backgroundImage","logo","footerText","ownerText","sections","newsLetterButtonBackgroundColor","newsLetterButtonTextColor","newsLetterButtonText","socials","socialIconColor","overallTextColor","borderColor","isFirstName","isLastName","newsletterHeading","newsletterDescription","newsletterDescriptionColor","newsletterHeadingColor","formFieldbg","formFieldTextColor","_useState","useState","email","firstName","lastName","formData","setFormData","_useState2","errorToast","setErrorToast","_useState3","showToast","setShowToast","mapColOne","mapColTwo","mapColThree","mapColFour","React","className","style","backgroundRepeat","backgroundSize","backgroundPosition","id","src","alt","color","onSubmit","e","preventDefault","name","surname","Api","post","body","then","catch","htmlFor","type","required","placeholder","value","onChange","Object","assign","target","autoComplete","map","item","i","Link","key","to","href","Facebook","fill","viewBox","fillRule","d","clipRule","Instagram","Twitter","getSocialIcon","sectionHeadingColor","sectionHeading","role","items","itemUrl","itemColor","itemText","ErrorToast","msg","handleSetShowToast","show","handleOnClick","Toast"],"sourceRoot":""}