{"version":3,"file":"3da8db8a.js","sources":["../../../src/components/globals/cart/CartTwoHourDelivery.client.tsx"],"sourcesContent":["import {\n  DeliveryTruckIcon,\n  CheckmarkWhite,\n  Checkmark,\n  ArrowRightIcon,\n  ChevronIcon,\n} from '@base/icon';\nimport {useCart} from '@shopify/hydrogen';\nimport clsx from 'clsx';\nimport useIpStackLocation from 'Js/hooks/useIpStackLocation';\nimport {useEffect, useState} from 'react';\n\nimport styles from '../../views/product/product-two-hour-delivery/ProductTwoHourDelivery.module.scss';\n\ntype TwoHourDeliveryOnChangeValue = {\n  ShipFromStore?: string;\n  IfNotHome?: string;\n};\n\ntype CartTwoHourDeliveryProps = {\n  onChange: (val: TwoHourDeliveryOnChangeValue) => void;\n  twoHourDeliveryData: any;\n};\n\nexport default function CartTwoHourDelivery({\n  onChange,\n  twoHourDeliveryData,\n}: CartTwoHourDeliveryProps) {\n  const twoHourAttrKey = '2 Hour Delivery';\n  const {lines, linesUpdate, attributes} = useCart();\n  const {ipStackData} = useIpStackLocation();\n  const {zip} = ipStackData || {};\n\n  const cartHasTwoHourItem = !!lines.find(\n    (line) => !!line.attributes.find((attr) => attr.key === twoHourAttrKey),\n  );\n  const isEachCartItemTwoHour = lines.every(\n    (line) => !!line.attributes.find((attr) => attr.key === twoHourAttrKey),\n  );\n\n  const {\n    apiUrl: checkAvailabilityApiUrl,\n    errorNonQualifiedZip,\n    cartTerms,\n    widgetTitle,\n    widgetErrorTitle,\n    homeOptionLabel,\n    homeOptionDefault,\n    homeOptionOne,\n    homeOptionTwo,\n    homeNoteLabel,\n    homeNotePlaceholder,\n  } = twoHourDeliveryData;\n\n  const [checked, setChecked] = useState<boolean>(true);\n  const [lastZipEntered, setLastZipEntered] = useState<string>('');\n  const [zipcode, setZipcode] = useState<string>('');\n  const [zipcodeErrorMessage, setZipcodeErrorMessage] = useState<string | null>(\n    null,\n  );\n  const [notHomeInstructions, setNotHomeInstructions] = useState<string | null>(\n    null,\n  );\n  const [storeName, setStoreName] = useState<string | null>(null);\n\n  // Autofill zipcode from ipstack\n  useEffect(() => {\n    if (zip && !zipcode) {\n      setZipcode(zip);\n    }\n  }, [zip]);\n\n  // Check if not home instructions already set on cart\n  useEffect(() => {\n    const notHomeAttribute = attributes.find(\n      (attr) => attr.key === 'IfNotHome',\n    );\n    if (notHomeAttribute && notHomeAttribute.value) {\n      setNotHomeInstructions(notHomeAttribute.value);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (notHomeInstructions && storeName) {\n      onChange({\n        ShipFromStore: storeName,\n        IfNotHome: notHomeInstructions,\n      });\n    }\n  }, [notHomeInstructions, storeName]);\n\n  /**\n   * Checks for current variant availibility in customer's zone\n   * @param variant\n   * @param postalCode\n   */\n  const checkVariantAvailaibility = (cartItem: any, postalCode: string) => {\n    const {merchandise} = cartItem;\n    if (zipcodeErrorMessage) setZipcodeErrorMessage(null);\n    setLastZipEntered(postalCode);\n\n    const data = {\n      products: [\n        {\n          sku: merchandise.sku,\n          quantity: 1,\n        },\n      ],\n      address: {\n        postalCode,\n      },\n    };\n    fetch(checkAvailabilityApiUrl, {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json',\n      },\n      body: JSON.stringify(data),\n    })\n      .then((res) => res.json())\n      .then((data) => {\n        if (data === 'Zone not Found') {\n          throw new Error(errorNonQualifiedZip);\n        }\n        if (data === 'No stores available') {\n          throw new Error('No stores available');\n        }\n\n        if (data[0].Stores[0].StoreName) {\n          setStoreName(data[0].Stores[0].StoreName);\n        }\n      })\n      .catch((error) => {\n        setZipcodeErrorMessage(error.message);\n      });\n  };\n\n  // Toggle Checked\n  const handleToggleChecked = () => {\n    // REMOVE 2 Hr Attribute from all items in cart and hide widget\n    const linesToUpdate: any[] = lines.map((line) => {\n      const filterdAttributes = line.attributes.filter((attr) => {\n        return attr.key !== '2 Hour Delivery';\n      });\n      return {\n        id: line.id,\n        merchandiseId: line.merchandise.id,\n        attributes: filterdAttributes,\n      };\n    });\n\n    linesUpdate(linesToUpdate);\n    setChecked(!checked);\n  };\n\n  if (!cartHasTwoHourItem) return null;\n\n  return (\n    <div className={styles['two-hour-delivery']}>\n      <div className={styles['two-hour-delivery__container']}>\n        <section className={styles['two-hour-delivery__header']}>\n          <div className={styles['two-hour-delivery__heading']}>\n            <DeliveryTruckIcon />\n            <p className={styles['two-hour-delivery__title']}>\n              {cartHasTwoHourItem && !isEachCartItemTwoHour\n                ? widgetErrorTitle\n                : widgetTitle}\n            </p>\n          </div>\n          {cartHasTwoHourItem && isEachCartItemTwoHour && (\n            <>\n              <label\n                htmlFor=\"twoHourDelivery\"\n                className={styles['two-hour-delivery__checkbox']}\n              >\n                <input\n                  id=\"twoHourDelivery\"\n                  type=\"checkbox\"\n                  checked={checked}\n                  onChange={handleToggleChecked}\n                />\n                <CheckmarkWhite\n                  className={styles['two-hour-delivery--checked']}\n                />\n              </label>\n            </>\n          )}\n        </section>\n        {checked && cartHasTwoHourItem && isEachCartItemTwoHour && (\n          <section className={styles['two-hour-delivery__inner-cart']}>\n            <p className={styles['two-hour-delivery__inner-title']}>\n              DELIVER TO:\n            </p>\n            <label\n              htmlFor=\"zipcode\"\n              className={styles['two-hour-delivery__label']}\n            >\n              Zip\n            </label>\n            <input\n              id=\"zipcode\"\n              type=\"text\"\n              className={styles['two-hour-delivery__input']}\n              placeholder=\"zipcode\"\n              name=\"zipcode\"\n              value={zipcode}\n              onChange={(e) => setZipcode(e.target.value)}\n              onKeyUp={(e) =>\n                e.key === 'Enter' &&\n                checkVariantAvailaibility(lines[0], zipcode)\n              }\n            />\n            {zipcode === lastZipEntered && !zipcodeErrorMessage ? (\n              <Checkmark\n                className={clsx([\n                  'text-brown-1',\n                  styles['two-hour-delivery__inner--isvalid'],\n                  'block',\n                ])}\n              />\n            ) : (\n              <button\n                type=\"button\"\n                onClick={() => checkVariantAvailaibility(lines[0], zipcode)}\n              >\n                <ArrowRightIcon\n                  className={clsx([\n                    'text-brown-1',\n                    styles['two-hour-delivery__inner--invalid'],\n                    'block',\n                  ])}\n                />\n              </button>\n            )}\n            {zipcodeErrorMessage && (\n              <p className={styles['two-hour-delivery__error']}>\n                {zipcodeErrorMessage}\n              </p>\n            )}\n            {!storeName && !zipcodeErrorMessage && (\n              <p className={styles['two-hour-delivery__error']}>\n                Please validate your zip code\n              </p>\n            )}\n            <p className={styles['two-hour-delivery__terms']}>{cartTerms}</p>\n            <TwoHourHomeDeliverySelect\n              label={homeOptionLabel}\n              placeholder={homeOptionDefault}\n              options={[homeOptionOne, homeOptionTwo]}\n              selectedOption={notHomeInstructions}\n              onChange={(val) => setNotHomeInstructions(val)}\n            />\n            <div className={styles['two-hour-elivery__note']}>\n              <div className={styles['two-hour-delivery__note-inner']}>\n                <label\n                  htmlFor=\"twoHourDeliveryNote\"\n                  className={styles['two-hour-delivery__inner-title']}\n                >\n                  {homeNoteLabel}\n                </label>\n                <textarea\n                  name=\"note\"\n                  id=\"twoHourDeliveryNote\"\n                  placeholder={homeNotePlaceholder}\n                  className={styles['two-hour-delivery__note-content']}\n                ></textarea>\n              </div>\n            </div>\n          </section>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction TwoHourHomeDeliverySelect({\n  label,\n  placeholder,\n  options,\n  selectedOption,\n  onChange,\n}: {\n  label: string;\n  placeholder: string;\n  options: string[];\n  selectedOption: string | null;\n  onChange: (value: string) => void;\n}) {\n  const [open, setOpen] = useState(false);\n\n  function handleSelect(value: string) {\n    onChange(value);\n    setOpen(false);\n  }\n\n  return (\n    <>\n      <p className={styles['two-hour-delivery__inner-title']}>{label}</p>\n      <div className={styles['two-hour-delivery__inner-select--cart']}>\n        <button\n          type=\"button\"\n          onClick={() => setOpen(!open)}\n          className={styles['two-hour-delivery__inner-select--cart-default']}\n        >\n          <span>{selectedOption || placeholder}</span>\n          <ChevronIcon\n            className={clsx([\n              styles['two-hour-delivery__inner-select--cart-icon'],\n              open && 'rotate-180',\n            ])}\n          />\n        </button>\n        {open &&\n          options.map((option) => (\n            <button\n              type=\"button\"\n              key={option}\n              onClick={() => handleSelect(option)}\n              className={styles['two-hour-delivery__inner-select--cart-option']}\n            >\n              {option}\n            </button>\n          ))}\n        {!selectedOption && (\n          <p className={styles['two-hour-delivery__inner-select--cart-error']}>\n            This field is required\n          </p>\n        )}\n      </div>\n    </>\n  );\n}\n"],"names":["CartTwoHourDelivery","onChange","twoHourDeliveryData","twoHourAttrKey","lines","linesUpdate","attributes","useCart","ipStackData","useIpStackLocation","zip","cartHasTwoHourItem","find","line","attr","key","isEachCartItemTwoHour","every","apiUrl","checkAvailabilityApiUrl","errorNonQualifiedZip","cartTerms","widgetTitle","widgetErrorTitle","homeOptionLabel","homeOptionDefault","homeOptionOne","homeOptionTwo","homeNoteLabel","homeNotePlaceholder","checked","setChecked","useState","lastZipEntered","setLastZipEntered","zipcode","setZipcode","zipcodeErrorMessage","setZipcodeErrorMessage","notHomeInstructions","setNotHomeInstructions","storeName","setStoreName","useEffect","notHomeAttribute","value","ShipFromStore","IfNotHome","checkVariantAvailaibility","cartItem","postalCode","merchandise","data","products","sku","quantity","address","fetch","method","headers","body","JSON","stringify","then","res","json","Error","Stores","StoreName","catch","error","message","handleToggleChecked","linesToUpdate","map","filterdAttributes","filter","id","merchandiseId","styles","_jsxs","_jsx","DeliveryTruckIcon","_Fragment","CheckmarkWhite","e","target","Checkmark","clsx","ArrowRightIcon","TwoHourHomeDeliverySelect","val","label","placeholder","options","selectedOption","open","setOpen","handleSelect","ChevronIcon","option"],"mappings":"siBAwBA,SAAwBA,GAAoB,CAC1CC,SAAAA,EACAC,oBAAAA,CACwB,EAAG,CAC3B,MAAMC,EAAiB,kBACjB,CAACC,MAAAA,EAAOC,YAAAA,EAAaC,WAAAA,GAAcC,EAAS,EAC5C,CAACC,YAAAA,GAAeC,EAAoB,EACpC,CAACC,IAAAA,CAAAA,EAAOF,GAAe,CAAA,EAEvBG,EAAqB,CAAC,CAACP,EAAMQ,KACvBC,GAAA,CAAC,CAACA,EAAKP,WAAWM,KAAME,GAASA,EAAKC,MAAQZ,CAAc,CAAC,EAEnEa,EAAwBZ,EAAMa,MACjCJ,GAAS,CAAC,CAACA,EAAKP,WAAWM,KAAME,GAASA,EAAKC,MAAQZ,CAAc,CAAC,EAGnE,CACJe,OAAQC,EACRC,qBAAAA,EACAC,UAAAA,EACAC,YAAAA,EACAC,iBAAAA,EACAC,gBAAAA,EACAC,kBAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,cAAAA,EACAC,oBAAAA,CACE3B,EAAAA,EAEE,CAAC4B,EAASC,CAAU,EAAIC,mBAAkB,EAAI,EAC9C,CAACC,EAAgBC,CAAiB,EAAIF,mBAAiB,EAAE,EACzD,CAACG,EAASC,CAAU,EAAIJ,mBAAiB,EAAE,EAC3C,CAACK,EAAqBC,CAAsB,EAAIN,mBACpD,IAAI,EAEA,CAACO,EAAqBC,CAAsB,EAAIR,mBACpD,IAAI,EAEA,CAACS,EAAWC,CAAY,EAAIV,mBAAwB,IAAI,EAG9DW,EAAAA,QAAAA,UAAU,IAAM,CACVjC,GAAO,CAACyB,GACVC,EAAW1B,CAAG,CAChB,EACC,CAACA,CAAG,CAAC,EAGRiC,EAAAA,QAAAA,UAAU,IAAM,CACd,MAAMC,EAAmBtC,EAAWM,KACxBE,GAAAA,EAAKC,MAAQ,WAAW,EAEhC6B,GAAoBA,EAAiBC,OACvCL,EAAuBI,EAAiBC,KAAK,CAEjD,EAAG,CAAE,CAAA,EAELF,EAAAA,QAAAA,UAAU,IAAM,CACVJ,GAAuBE,GAChBxC,EAAA,CACP6C,cAAeL,EACfM,UAAWR,CAAAA,CACZ,CACH,EACC,CAACA,EAAqBE,CAAS,CAAC,EAO7BO,MAAAA,EAA4B,CAACC,EAAeC,IAAuB,CACjE,KAAA,CAACC,YAAAA,CAAeF,EAAAA,EAClBZ,GAAqBC,EAAuB,IAAI,EACpDJ,EAAkBgB,CAAU,EAE5B,MAAME,EAAO,CACXC,SAAU,CACR,CACEC,IAAKH,EAAYG,IACjBC,SAAU,CAAA,CACX,EAEHC,QAAS,CACPN,WAAAA,CACF,CAAA,EAEFO,MAAMtC,EAAyB,CAC7BuC,OAAQ,OACRC,QAAS,CACP,eAAgB,kBAClB,EACAC,KAAMC,KAAKC,UAAUV,CAAI,CAAA,CAC1B,EACEW,KAAcC,GAAAA,EAAIC,MAAM,EACxBF,KAAMX,GAAS,CACd,GAAIA,IAAS,iBACL,MAAA,IAAIc,MAAM9C,CAAoB,EAEtC,GAAIgC,IAAS,sBACL,MAAA,IAAIc,MAAM,qBAAqB,EAGnCd,EAAK,GAAGe,OAAO,GAAGC,WACpB1B,EAAaU,EAAK,GAAGe,OAAO,GAAGC,SAAS,CAC1C,CACD,EACAC,MAAiBC,GAAA,CAChBhC,EAAuBgC,EAAMC,OAAO,CAAA,CACrC,CAAA,EAICC,EAAsB,IAAM,CAE1BC,MAAAA,EAAuBrE,EAAMsE,IAAc7D,GAAA,CAC/C,MAAM8D,EAAoB9D,EAAKP,WAAWsE,OAAiB9D,GAClDA,EAAKC,MAAQ,iBACrB,EACM,MAAA,CACL8D,GAAIhE,EAAKgE,GACTC,cAAejE,EAAKsC,YAAY0B,GAChCvE,WAAYqE,CAAAA,CACd,CACD,EAEDtE,EAAYoE,CAAa,EACzB1C,EAAW,CAACD,CAAO,CAAA,EAGrB,OAAKnB,IAGH,MAAA,CAAK,UAAWoE,EAAO,qBAAqB,WAC1C,MAAA,CAAK,UAAWA,EAAO,gCAAgC,SACrD,CAAAC,EAAA,UAAA,CAAS,UAAWD,EAAO,6BAA6B,SACtD,CAAAC,EAAA,MAAA,CAAK,UAAWD,EAAO,8BAA8B,SACnD,CAACE,EAAAC,EAAiB,CAAA,CAAA,IAClB,IAAA,CAAG,UAAWH,EAAO,4BAA4B,SAC9CpE,GAAsB,CAACK,EACpBO,EACAD,CAAAA,CACF,CAAA,CAAA,CAAA,EAELX,GAAsBK,KACrBmE,EAAA,CAAA,WACE,QAAA,CACE,QAAQ,kBACR,UAAWJ,EAAO,+BAA+B,SAEjD,CAAAE,EAAA,QAAA,CACE,GAAG,kBACH,KAAK,WACL,QAAAnD,EACA,SAAU0C,CAAAA,CACV,EACFS,EAACG,EAAc,CACb,UAAWL,EAAO,6BAAA,CAClB,CAAA,CAAA,CAAA,CAAA,CAGP,CAAA,CAAA,CAAA,EAEFjD,GAAWnB,GAAsBK,KAChC,UAAA,CAAS,UAAW+D,EAAO,iCAAiC,SAC1D,CAAAE,EAAA,IAAA,CAAG,UAAWF,EAAO,kCAAkC,SAAA,aAAA,CAAA,EAGvDE,EAAA,QAAA,CACE,QAAQ,UACR,UAAWF,EAAO,4BAA4B,SAAA,KAAA,CAAA,EAIhDE,EAAA,QAAA,CACE,GAAG,UACH,KAAK,OACL,UAAWF,EAAO,4BAClB,YAAY,UACZ,KAAK,UACL,MAAO5C,EACP,SAAWkD,GAAMjD,EAAWiD,EAAEC,OAAOzC,KAAK,EAC1C,WACEwC,EAAEtE,MAAQ,SACViC,EAA0B5C,EAAM,GAAI+B,CAAO,CAAA,CAE7C,EACDA,IAAYF,GAAkB,CAACI,IAC7BkD,EAAS,CACR,UAAWC,EAAK,CACd,eACAT,EAAO,qCACP,OAAO,CACR,CAAA,CAAE,EAGLE,EAAA,SAAA,CACE,KAAK,SACL,QAAS,IAAMjC,EAA0B5C,EAAM,GAAI+B,CAAO,EAAE,WAE3DsD,EAAc,CACb,UAAWD,EAAK,CACd,eACAT,EAAO,qCACP,OAAO,CACR,CAAA,CAAE,CAAA,CAGR,EACA1C,GACC4C,EAAA,IAAA,CAAG,UAAWF,EAAO,4BAA4B,SAC9C1C,CAAmB,CAAA,EAGvB,CAACI,GAAa,CAACJ,KACd,IAAA,CAAG,UAAW0C,EAAO,4BAA4B,SAAA,+BAAA,CAAA,EAInDE,EAAA,IAAA,CAAG,UAAWF,EAAO,4BAA4B,SAAE1D,CAAAA,CAAc,EACjE4D,EAACS,EAAyB,CACxB,MAAOlE,EACP,YAAaC,EACb,QAAS,CAACC,EAAeC,CAAa,EACtC,eAAgBY,EAChB,SAAmBC,GAAAA,EAAuBmD,CAAG,CAAA,CAAE,EAEjDV,EAAA,MAAA,CAAK,UAAWF,EAAO,0BAA0B,WAC/C,MAAA,CAAK,UAAWA,EAAO,iCAAiC,SACtD,CAAAE,EAAA,QAAA,CACE,QAAQ,sBACR,UAAWF,EAAO,kCAAkC,SAEnDnD,CAAAA,CAAa,EAEhBqD,EAAA,WAAA,CACE,KAAK,OACL,GAAG,sBACH,YAAapD,EACb,UAAWkD,EAAO,kCAAA,CACR,CAAA,CAAA,CAAA,CAAA,CAEV,CAAA,CAAA,CAET,CAAA,CAAA,CAAA,CAAA,CAEC,EApHwB,IAsHlC,CAEA,SAASW,EAA0B,CACjCE,MAAAA,EACAC,YAAAA,EACAC,QAAAA,EACAC,eAAAA,EACA9F,SAAAA,CAOF,EAAG,CACD,KAAM,CAAC+F,EAAMC,CAAO,EAAIjE,mBAAS,EAAK,EAEtC,SAASkE,EAAarD,EAAe,CACnC5C,EAAS4C,CAAK,EACdoD,EAAQ,EAAK,CACf,CAEA,SACEd,EAAA,CAAA,SACE,CAAAF,EAAA,IAAA,CAAG,UAAWF,EAAO,kCAAkC,SAAEa,CAAAA,CAAK,EAC9DZ,EAAA,MAAA,CAAK,UAAWD,EAAO,yCAAyC,SAC9D,CAAAC,EAAA,SAAA,CACE,KAAK,SACL,QAAS,IAAMiB,EAAQ,CAACD,CAAI,EAC5B,UAAWjB,EAAO,iDAAiD,SAEnE,CAAAE,EAAA,OAAA,CAAA,SAAOc,GAAkBF,CAAAA,CAAmB,EAC5CZ,EAACkB,EAAW,CACV,UAAWX,EAAK,CACdT,EAAO,8CACPiB,GAAQ,YAAY,CACrB,CAAA,CACD,CAAA,CAAA,CACK,EACRA,GACCF,EAAQpB,IAAK0B,KACX,SAAA,CACE,KAAK,SAEL,QAAS,IAAMF,EAAaE,CAAM,EAClC,UAAWrB,EAAO,gDAAgD,SAEjEqB,GAJIA,CAAM,CAMd,EACF,CAACL,KACA,IAAA,CAAG,UAAWhB,EAAO,+CAA+C,SAAA,wBAAA,CAGrE,CAAA,CAAA,CACG,CAAA,CAAA,CACL,CAEP"}