@dropins/storefront-checkout 2.1.0-beta2 → 2.1.0-beta4

package/containers/EstimateShipping.js.map

@@ -1 +1 @@
-{"version":3,"file":"EstimateShipping.js","sources":["/@dropins/storefront-checkout/src/components/EstimateShipping/EstimateShippingSkeleton.tsx","/@dropins/storefront-checkout/src/components/EstimateShipping/EstimateShipping.tsx","/@dropins/storefront-checkout/src/containers/EstimateShipping/EstimateShipping.tsx"],"sourcesContent":["/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const EstimateShippingSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"estimate-shipping-skeleton\">\n      <SkeletonRow size=\"xsmall\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper';\nimport '@/checkout/components/EstimateShipping/EstimateShipping.css';\nimport { EstimateShippingSkeleton } from '@/checkout/components/EstimateShipping/EstimateShippingSkeleton';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { VComponent, classes } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface EstimateShippingProps {\n  label: VNode<HTMLAttributes<HTMLSpanElement>>;\n  price: VNode<HTMLAttributes<HTMLSpanElement>>;\n  priceExclTax?: VNode<HTMLAttributes<HTMLSpanElement>>;\n  taxExcluded?: boolean;\n  taxIncluded?: boolean;\n}\n\nconst EstimateShippingComponent: FunctionComponent<EstimateShippingProps> = ({\n  label,\n  price,\n  priceExclTax,\n  taxExcluded = false,\n  taxIncluded = false,\n}) => {\n  const translations = useText({\n    withTaxes: 'Checkout.EstimateShipping.withTaxes',\n    withoutTaxes: 'Checkout.EstimateShipping.withoutTaxes',\n  });\n\n  return (\n    <div className=\"checkout-estimate-shipping\" data-testid=\"estimate-shipping\">\n      <VComponent className=\"checkout-estimate-shipping__label\" node={label} />\n      <VComponent className=\"checkout-estimate-shipping__price\" node={price} />\n\n      {taxIncluded && (\n        <span\n          className={classes(['checkout-estimate-shipping__caption'])}\n          data-testid=\"shipping-tax-included\"\n        >\n          {translations.withTaxes}\n        </span>\n      )}\n\n      {taxExcluded && (\n        <span\n          className={classes(['checkout-estimate-shipping__caption'])}\n          data-testid=\"shipping-tax-included-excluded\"\n        >\n          {priceExclTax}&nbsp;\n          {translations.withoutTaxes}\n        </span>\n      )}\n    </div>\n  );\n};\n\nexport const EstimateShipping = WithConditionals(\n  EstimateShippingComponent,\n  EstimateShippingSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { EstimateShipping as EstimateShippingComponent } from '@/checkout/components';\nimport {\n  Cart,\n  Money as PriceModel,\n  ShippingEstimate,\n  TaxDisplay,\n} from '@/checkout/data/models';\nimport { getLatestCheckoutUpdate } from '@/checkout/lib';\nimport { state } from '@/checkout/lib/state';\nimport { Price } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\n\ninterface ShippingData {\n  estimated?: boolean;\n  amount: PriceModel;\n  amountExclTax?: PriceModel;\n  amountInclTax?: PriceModel;\n}\n\nexport interface EstimateShippingProps {\n  active?: boolean;\n}\n\nexport const EstimateShipping: Container<EstimateShippingProps> = ({\n  active = true,\n}) => {\n  const [data, setData] = useState<ShippingData | null | undefined>();\n\n  const isFreeShipping = data?.amount.value === 0;\n  const shippingDisplay = state.config?.shoppingCartDisplaySetting.shipping;\n  const taxExcluded = shippingDisplay === TaxDisplay.INCLUDING_EXCLUDING_TAX;\n  const taxIncluded = shippingDisplay === TaxDisplay.INCLUDING_TAX;\n\n  const translations = useText({\n    freeShipping: 'Checkout.EstimateShipping.freeShipping',\n    taxToBeDetermined: 'Checkout.EstimateShipping.taxToBeDetermined',\n    label: 'Checkout.EstimateShipping.label',\n    estimated: 'Checkout.EstimateShipping.estimated',\n  });\n\n  const handleCheckoutData = useCallback((data: Cart | null) => {\n    const isEmptyCart = !data || data.isEmpty;\n    const isVirtualCart = Boolean(data?.isVirtual);\n\n    if (isEmptyCart || isVirtualCart) {\n      setData(null);\n      return;\n    }\n\n    const primaryAddress = data.shippingAddresses?.[0];\n\n    if (!primaryAddress) {\n      return;\n    }\n\n    const shippingMethod = primaryAddress?.selectedShippingMethod;\n\n    if (!shippingMethod) {\n      setData(null);\n      return;\n    }\n\n    const { amount, amountExclTax, amountInclTax } = shippingMethod;\n    setData({ estimated: false, amount, amountExclTax, amountInclTax });\n  }, []);\n\n  const handleShippingEstimate = useCallback((estimation: ShippingEstimate) => {\n    let shippingData: ShippingData | null = null;\n\n    if (estimation.shippingMethod) {\n      const shippingMethod = estimation.shippingMethod;\n\n      shippingData = {\n        estimated: true,\n        amount: shippingMethod.amount,\n        amountExclTax: shippingMethod.amountExclTax,\n        amountInclTax: shippingMethod.amountInclTax,\n      };\n    }\n\n    setData(shippingData);\n  }, []);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onShippingEstimate = events.on(\n      'shipping/estimate',\n      handleShippingEstimate,\n      { eager: true }\n    );\n\n    return () => {\n      onShippingEstimate?.off();\n    };\n  }, [active, handleShippingEstimate]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      handleCheckoutData,\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const renderPrice = () => {\n    if (isFreeShipping) {\n      return (\n        <span data-testid=\"free-shipping\">{translations.freeShipping}</span>\n      );\n    }\n\n    if (taxIncluded && data?.amountInclTax) {\n      return (\n        <Price\n          amount={data.amountInclTax.value}\n          currency={data.amountInclTax.currency}\n          data-testid=\"shipping\"\n        />\n      );\n    }\n\n    return (\n      <Price\n        amount={data?.amount.value}\n        currency={data?.amount.currency}\n        data-testid=\"shipping\"\n      />\n    );\n  };\n\n  const renderPriceExclTax = () => {\n    if (!data?.amountExclTax)\n      return <span>{translations.taxToBeDetermined}</span>;\n\n    return (\n      <Price\n        amount={data.amountExclTax.value}\n        currency={data.amountExclTax.currency}\n        data-testid=\"shipping-excluding-tax\"\n      />\n    );\n  };\n\n  const renderLabel = () => {\n    const label = data?.estimated ? translations.estimated : translations.label;\n    return <span data-testid=\"estimate-shipping-label\">{label}</span>;\n  };\n\n  return (\n    <EstimateShippingComponent\n      initialized={data !== undefined}\n      label={renderLabel()}\n      price={renderPrice()}\n      priceExclTax={renderPriceExclTax()}\n      taxExcluded={taxExcluded && !isFreeShipping}\n      taxIncluded={taxIncluded && !isFreeShipping}\n      visible={active && data !== null}\n    />\n  );\n};\n"],"names":["EstimateShippingSkeleton","jsx","Skeleton","SkeletonRow","EstimateShippingComponent","label","price","priceExclTax","taxExcluded","taxIncluded","translations","useText","jsxs","VComponent","classes","EstimateShipping","WithConditionals","active","data","setData","useState","isFreeShipping","shippingDisplay","_a","state","TaxDisplay","handleCheckoutData","useCallback","isEmptyCart","isVirtualCart","primaryAddress","shippingMethod","amount","amountExclTax","amountInclTax","handleShippingEstimate","estimation","shippingData","useEffect","onShippingEstimate","events","pastUpdate","getLatestCheckoutUpdate","onCheckoutInit","onCheckoutUpdated","renderPrice","Price","renderPriceExclTax"],"mappings":"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"}
+{"version":3,"file":"EstimateShipping.js","sources":["/@dropins/storefront-checkout/src/components/EstimateShipping/EstimateShippingSkeleton.tsx","/@dropins/storefront-checkout/src/components/EstimateShipping/EstimateShipping.tsx","/@dropins/storefront-checkout/src/containers/EstimateShipping/EstimateShipping.tsx"],"sourcesContent":["/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const EstimateShippingSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"estimate-shipping-skeleton\">\n      <SkeletonRow size=\"xsmall\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper';\nimport '@/checkout/components/EstimateShipping/EstimateShipping.css';\nimport { EstimateShippingSkeleton } from '@/checkout/components/EstimateShipping/EstimateShippingSkeleton';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { VComponent, classes } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface EstimateShippingProps {\n  label: VNode<HTMLAttributes<HTMLSpanElement>>;\n  price: VNode<HTMLAttributes<HTMLSpanElement>>;\n  priceExclTax?: VNode<HTMLAttributes<HTMLSpanElement>>;\n  taxExcluded?: boolean;\n  taxIncluded?: boolean;\n}\n\nconst EstimateShippingComponent: FunctionComponent<EstimateShippingProps> = ({\n  label,\n  price,\n  priceExclTax,\n  taxExcluded = false,\n  taxIncluded = false,\n}) => {\n  const translations = useText({\n    withTaxes: 'Checkout.EstimateShipping.withTaxes',\n    withoutTaxes: 'Checkout.EstimateShipping.withoutTaxes',\n  });\n\n  return (\n    <div className=\"checkout-estimate-shipping\" data-testid=\"estimate-shipping\">\n      <VComponent className=\"checkout-estimate-shipping__label\" node={label} />\n      <VComponent className=\"checkout-estimate-shipping__price\" node={price} />\n\n      {taxIncluded && (\n        <span\n          className={classes(['checkout-estimate-shipping__caption'])}\n          data-testid=\"shipping-tax-included\"\n        >\n          {translations.withTaxes}\n        </span>\n      )}\n\n      {taxExcluded && (\n        <span\n          className={classes(['checkout-estimate-shipping__caption'])}\n          data-testid=\"shipping-tax-included-excluded\"\n        >\n          {priceExclTax}&nbsp;\n          {translations.withoutTaxes}\n        </span>\n      )}\n    </div>\n  );\n};\n\nexport const EstimateShipping = WithConditionals(\n  EstimateShippingComponent,\n  EstimateShippingSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { EstimateShipping as EstimateShippingComponent } from '@/checkout/components';\nimport {\n  Cart,\n  Money as PriceModel,\n  ShippingEstimate,\n  TaxDisplay,\n} from '@/checkout/data/models';\nimport { getLatestCheckoutUpdate } from '@/checkout/lib';\nimport { state } from '@/checkout/lib/state';\nimport { Price } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { useCallback, useEffect, useState } from 'preact/hooks';\n\ninterface ShippingData {\n  estimated?: boolean;\n  amount: PriceModel;\n  amountExclTax?: PriceModel;\n  amountInclTax?: PriceModel;\n}\n\nexport interface EstimateShippingProps {\n  active?: boolean;\n}\n\nexport const EstimateShipping: Container<EstimateShippingProps> = ({\n  active = true,\n}) => {\n  const [data, setData] = useState<ShippingData | null | undefined>();\n\n  const isFreeShipping = data?.amount.value === 0;\n  const shippingDisplay = state.config?.shoppingCartDisplaySetting.shipping;\n  const taxExcluded = shippingDisplay === TaxDisplay.INCLUDING_EXCLUDING_TAX;\n  const taxIncluded = shippingDisplay === TaxDisplay.INCLUDING_TAX;\n\n  const translations = useText({\n    freeShipping: 'Checkout.EstimateShipping.freeShipping',\n    taxToBeDetermined: 'Checkout.EstimateShipping.taxToBeDetermined',\n    label: 'Checkout.EstimateShipping.label',\n    estimated: 'Checkout.EstimateShipping.estimated',\n  });\n\n  const handleCheckoutData = useCallback((data: Cart | null) => {\n    const isEmptyCart = !data || data.isEmpty;\n    const isVirtualCart = Boolean(data?.isVirtual);\n\n    if (isEmptyCart || isVirtualCart) {\n      setData(null);\n      return;\n    }\n\n    const primaryAddress = data.shippingAddresses?.[0];\n\n    if (!primaryAddress) {\n      return;\n    }\n\n    const shippingMethod = primaryAddress?.selectedShippingMethod;\n\n    if (!shippingMethod) {\n      setData(null);\n      return;\n    }\n\n    const { amount, amountExclTax, amountInclTax } = shippingMethod;\n    setData({ estimated: false, amount, amountExclTax, amountInclTax });\n  }, []);\n\n  const handleShippingEstimate = useCallback((estimation: ShippingEstimate) => {\n    let shippingData: ShippingData | null = null;\n\n    if (estimation.shippingMethod) {\n      const shippingMethod = estimation.shippingMethod;\n\n      shippingData = {\n        estimated: true,\n        amount: shippingMethod.amount,\n        amountExclTax: shippingMethod.amountExclTax,\n        amountInclTax: shippingMethod.amountInclTax,\n      };\n    }\n\n    setData(shippingData);\n  }, []);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onShippingEstimate = events.on(\n      'shipping/estimate',\n      handleShippingEstimate,\n      { eager: true }\n    );\n\n    return () => {\n      onShippingEstimate?.off();\n    };\n  }, [active, handleShippingEstimate]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      handleCheckoutData,\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const renderPrice = () => {\n    if (isFreeShipping) {\n      return (\n        <span data-testid=\"free-shipping\">{translations.freeShipping}</span>\n      );\n    }\n\n    if (taxIncluded && data?.amountInclTax) {\n      return (\n        <Price\n          amount={data.amountInclTax.value}\n          currency={data.amountInclTax.currency}\n          data-testid=\"shipping\"\n        />\n      );\n    }\n\n    return (\n      <Price\n        amount={data?.amount.value}\n        currency={data?.amount.currency}\n        data-testid=\"shipping\"\n      />\n    );\n  };\n\n  const renderPriceExclTax = () => {\n    if (!data?.amountExclTax)\n      return <span>{translations.taxToBeDetermined}</span>;\n\n    return (\n      <Price\n        amount={data.amountExclTax.value}\n        currency={data.amountExclTax.currency}\n        data-testid=\"shipping-excluding-tax\"\n      />\n    );\n  };\n\n  const renderLabel = () => {\n    const label = data?.estimated ? translations.estimated : translations.label;\n    return <span data-testid=\"estimate-shipping-label\">{label}</span>;\n  };\n\n  return (\n    <EstimateShippingComponent\n      initialized={data !== undefined}\n      label={renderLabel()}\n      price={renderPrice()}\n      priceExclTax={renderPriceExclTax()}\n      taxExcluded={taxExcluded && !isFreeShipping}\n      taxIncluded={taxIncluded && !isFreeShipping}\n      visible={active && data !== null}\n    />\n  );\n};\n"],"names":["EstimateShippingSkeleton","jsx","Skeleton","SkeletonRow","EstimateShippingComponent","label","price","priceExclTax","taxExcluded","taxIncluded","translations","useText","jsxs","VComponent","classes","EstimateShipping","WithConditionals","active","data","setData","useState","isFreeShipping","shippingDisplay","_a","state","TaxDisplay","handleCheckoutData","useCallback","isEmptyCart","isVirtualCart","primaryAddress","shippingMethod","amount","amountExclTax","amountInclTax","handleShippingEstimate","estimation","shippingData","useEffect","onShippingEstimate","events","pastUpdate","getLatestCheckoutUpdate","onCheckoutInit","onCheckoutUpdated","renderPrice","Price","renderPriceExclTax"],"mappings":"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"}

package/containers/LoginForm/LoginForm.d.ts

@@ -1,4 +1,4 @@
-import { TitleProps } from '../../types/TitleProps';
+import { TitleProps } from '../../types';
 import { Container, SlotProps } from '@dropins/tools/types/elsie/src/lib';
 import { HTMLAttributes } from 'preact/compat';
 

package/containers/LoginForm.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsx as r,jsxs as u,Fragment as le}from"@dropins/tools/preact-jsx-runtime.js";import"../chunks/fetch-graphql.js";import{VComponent as G,classes as se,Slot as J}from"@dropins/tools/lib.js";import{W as ce,a as me,g as ue}from"../chunks/ConditionalWrapper.js";import{n as H,g as K}from"../chunks/values.js";import{events as M}from"@dropins/tools/event-bus.js";import{i as he,s as de,g as ge}from"../chunks/setGuestEmailOnCart.js";import{Field as fe,Input as pe,Skeleton as ke,SkeletonRow as Q}from"@dropins/tools/components.js";import{useText as I}from"@dropins/tools/i18n.js";/* empty css                             */import"../chunks/TermsAndConditions.js";/* empty css                      */import"@dropins/tools/preact-compat.js";/* empty css                  *//* empty css                       */import{useState as k,useRef as Le,useCallback as d,useEffect as $,useMemo as B}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const ve={EMAIL:/^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\.)+[a-z]{2,}$/i},D=n=>ve.EMAIL.test(n),Fe=({value:n,error:o,hint:a,onChange:g,onBlur:L,onInvalid:c})=>{const l=I({LoginFormLabel:"Checkout.LoginForm.ariaLabel",LoginFormFloatingLabel:"Checkout.LoginForm.floatingLabel",LoginFormPlaceholder:"Checkout.LoginForm.placeholder"});return r(fe,{error:o,hint:a,children:r(pe,{"aria-label":l.LoginFormLabel,"aria-required":!0,autocomplete:"email",floatingLabel:l.LoginFormFloatingLabel,id:"customer-email",name:"customer-email",placeholder:l.LoginFormPlaceholder,required:!0,type:"email",value:n,onBlur:L,onChange:g,onInvalid:c})})},_e=({onClick:n})=>{const o=I({account:"Checkout.LoginForm.account",signIn:"Checkout.LoginForm.signIn"});return u("div",{className:"checkout-login-form__sign-in",children:[o.account,r("a",{className:"checkout-login-form__link","data-testid":"sign-in-link",href:"#",rel:"noreferrer",target:"_blank",onClick:a=>{a.preventDefault(),n(a)},children:o.signIn})]})},Ee=()=>u(ke,{"data-testid":"login-form-skeleton",children:[r(Q,{fullWidth:!0,variant:"heading"}),r(Q,{fullWidth:!0,size:"medium"})]}),be=({className:n,customer:o,email:a,error:g,headingContent:L,hint:c,name:l,onEmailBlur:f,onEmailChange:m,onEmailInvalid:s,title:F,...A})=>u("div",{className:"checkout-login-form","data-testid":"checkout-login-form",children:[u("div",{className:"checkout-login-form__heading",children:[F&&r(G,{className:"checkout-login-form__title",node:F}),L&&r(G,{className:"checkout-login-form__heading-label",node:L})]}),o?u("div",{className:"checkout-login-form__customer-details",children:[r("div",{className:"checkout-login-form__customer-name",children:`${o.firstName} ${o.lastName}`}),r("div",{className:"checkout-login-form__customer-email",children:o.email})]}):r("div",{className:"checkout-login-form__content",children:u("form",{...A,noValidate:!0,className:se(["dropin-login-form__form",n]),name:l,children:[r("button",{disabled:!0,"aria-hidden":"true",style:"display: none",type:"submit"}),r(Fe,{error:g,hint:c,value:a,onBlur:f,onChange:m,onInvalid:s})]})})]}),Ce=ce(be,Ee),Ne=({onClick:n})=>{const o=I({switch:"Checkout.LoginForm.switch",signOut:"Checkout.LoginForm.signOut"});return u("p",{className:"checkout-login-form__sign-out",children:[o.switch,r("a",{className:"checkout-login-form__link",href:"#",rel:"noreferrer",target:"_blank",onClick:a=>{a.preventDefault(),n==null||n(a)},children:o.signOut})]})},Ie=1e3,Je=({active:n=!0,autoSync:o=!0,displayHeadingContent:a=!0,displayTitle:g=!0,initialData:L,onCartSyncError:c,onSignInClick:l,onSignOutClick:f,onValidationError:m,slots:s,...F})=>{const[A,X]=k(null),[Y,y]=k(""),[Z,p]=k(""),[z,S]=k(!1),[w,_]=k(!0),[ee,V]=k(!1),h=Le(null),{alreadyHaveAccountHint:W,cartSyncError:P,defaultTitle:j,fasterCheckoutHint:q,invalidEmailError:E,missingEmailError:b,signInLabel:O}=I({alreadyHaveAccountHint:"Checkout.LoginForm.emailExists.alreadyHaveAccount",cartSyncError:"Checkout.LoginForm.cartSyncError",defaultTitle:"Checkout.LoginForm.title",fasterCheckoutHint:"Checkout.LoginForm.emailExists.forFasterCheckout",invalidEmailError:"Checkout.LoginForm.invalidEmailError",missingEmailError:"Checkout.LoginForm.missingEmailError",signInLabel:"Checkout.LoginForm.emailExists.signInButton"}),C=d(e=>{!D(e)||e===me()||(he(e).then(t=>{_(t)}).catch(t=>{console.error(t),_(!0)}),o&&de(e).catch(t=>{c==null||c({email:e,error:t}),c||p(P)}))},[o,c,P]),te=d(e=>{const i=e.target.value;y(i),_(!0),p(""),h.current&&clearTimeout(h.current),h.current=setTimeout(()=>{C(i),H({email:i}),h.current=null},Ie)},[C]),ie=d(e=>{const t=e.target,i=t.value.trim();if(D(i)){if(p(""),t.setCustomValidity(""),!h.current)return;clearTimeout(h.current),h.current=null,C(i),H({email:i});return}const U=i===""?"missing":"invalid",T=U==="missing"?b:E;if(m){m({email:i,message:T,type:U});return}p(T),t.setCustomValidity(T)},[E,b,m,C]),re=d(e=>{const t=e.target,i=t.validity,x=i.valueMissing?b:E;if(!m){p(x);return}m({email:t.value,message:x,type:i.valueMissing?"missing":"invalid"})},[b,E,m]),N=d(()=>{const e=K("email")??"",t=D(e);l==null||l(t?e:"")},[l]),R=d(()=>{f==null||f()},[f]),v=d(e=>{const t=K("email")??"",i=(e==null?void 0:e.email)??"";i!==t&&(y(i),p(""),_(!0),H({email:i}))},[]);$(()=>{if(!n)return;const e=M.on("authenticated",t=>{S(t),ge().then(i=>{X(i)}).catch(console.error)},{eager:!0});return()=>{e==null||e.off()}},[n]),$(()=>{if(!n)return;const e=ue();if(e){V(!0);const i=e.email??"";i&&y(i),v(e);return}const t=M.on("checkout/initialized",i=>{V(!0),v(i)},{eager:!0});return()=>{t==null||t.off()}},[n,v]),$(()=>{if(!n)return;const e=M.on("checkout/updated",v,{eager:!1});return()=>{e==null||e.off()}},[n,v]);const ne=B(()=>{if(g)return r(J,{name:"checkout-login-form-title",slot:s==null?void 0:s.Title,children:r("h2",{children:j})})},[g,s,j]),oe=B(()=>{if(a)return r(J,{context:{authenticated:z},name:"checkout-login-form-heading-label",slot:s==null?void 0:s.Heading,children:z?r(Ne,{onClick:R}):r(_e,{onClick:N})})},[a,z,s,N,R]),ae=B(()=>w?"":u(le,{children:[W," ",r("a",{href:"#",onClick:N,children:O})," ",q]}),[w,W,O,q,N]);return r(Ce,{...F,customer:A,email:Y,error:Z,headingContent:oe,hint:ae,initialized:ee,title:ne,visible:n,onEmailBlur:ie,onEmailChange:te,onEmailInvalid:re})};export{Je as LoginForm,Je as default};
+import{jsx as r,jsxs as u,Fragment as le}from"@dropins/tools/preact-jsx-runtime.js";import"../chunks/fetch-graphql.js";import{VComponent as G,classes as se,Slot as J}from"@dropins/tools/lib.js";import{a as ce,g as me}from"../chunks/events.js";import{n as H,g as K}from"../chunks/values.js";import{events as M}from"@dropins/tools/event-bus.js";import{i as ue,s as he,g as de}from"../chunks/setGuestEmailOnCart.js";import{Field as ge,Input as fe,Skeleton as pe,SkeletonRow as Q}from"@dropins/tools/components.js";import{useText as I}from"@dropins/tools/i18n.js";import"../chunks/TermsAndConditions.js";/* empty css                             */import{W as ke}from"../chunks/ConditionalWrapper.js";/* empty css                      */import"@dropins/tools/preact-compat.js";/* empty css                  *//* empty css                       */import{useState as k,useRef as Le,useCallback as d,useEffect as $,useMemo as B}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";import"../chunks/transform-shipping-methods.js";const ve={EMAIL:/^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\.)+[a-z]{2,}$/i},D=o=>ve.EMAIL.test(o),Fe=({value:o,error:n,hint:a,onChange:g,onBlur:L,onInvalid:c})=>{const l=I({LoginFormLabel:"Checkout.LoginForm.ariaLabel",LoginFormFloatingLabel:"Checkout.LoginForm.floatingLabel",LoginFormPlaceholder:"Checkout.LoginForm.placeholder"});return r(ge,{error:n,hint:a,children:r(fe,{"aria-label":l.LoginFormLabel,"aria-required":!0,autocomplete:"email",floatingLabel:l.LoginFormFloatingLabel,id:"customer-email",name:"customer-email",placeholder:l.LoginFormPlaceholder,required:!0,type:"email",value:o,onBlur:L,onChange:g,onInvalid:c})})},_e=({onClick:o})=>{const n=I({account:"Checkout.LoginForm.account",signIn:"Checkout.LoginForm.signIn"});return u("div",{className:"checkout-login-form__sign-in",children:[n.account,r("a",{className:"checkout-login-form__link","data-testid":"sign-in-link",href:"#",rel:"noreferrer",target:"_blank",onClick:a=>{a.preventDefault(),o(a)},children:n.signIn})]})},Ee=()=>u(pe,{"data-testid":"login-form-skeleton",children:[r(Q,{fullWidth:!0,variant:"heading"}),r(Q,{fullWidth:!0,size:"medium"})]}),be=({className:o,customer:n,email:a,error:g,headingContent:L,hint:c,name:l,onEmailBlur:f,onEmailChange:m,onEmailInvalid:s,title:F,...A})=>u("div",{className:"checkout-login-form","data-testid":"checkout-login-form",children:[u("div",{className:"checkout-login-form__heading",children:[F&&r(G,{className:"checkout-login-form__title",node:F}),L&&r(G,{className:"checkout-login-form__heading-label",node:L})]}),n?u("div",{className:"checkout-login-form__customer-details",children:[r("div",{className:"checkout-login-form__customer-name",children:`${n.firstName} ${n.lastName}`}),r("div",{className:"checkout-login-form__customer-email",children:n.email})]}):r("div",{className:"checkout-login-form__content",children:u("form",{...A,noValidate:!0,className:se(["dropin-login-form__form",o]),name:l,children:[r("button",{disabled:!0,"aria-hidden":"true",style:"display: none",type:"submit"}),r(Fe,{error:g,hint:c,value:a,onBlur:f,onChange:m,onInvalid:s})]})})]}),Ce=ke(be,Ee),Ne=({onClick:o})=>{const n=I({switch:"Checkout.LoginForm.switch",signOut:"Checkout.LoginForm.signOut"});return u("p",{className:"checkout-login-form__sign-out",children:[n.switch,r("a",{className:"checkout-login-form__link",href:"#",rel:"noreferrer",target:"_blank",onClick:a=>{a.preventDefault(),o==null||o(a)},children:n.signOut})]})},Ie=1e3,Qe=({active:o=!0,autoSync:n=!0,displayHeadingContent:a=!0,displayTitle:g=!0,initialData:L,onCartSyncError:c,onSignInClick:l,onSignOutClick:f,onValidationError:m,slots:s,...F})=>{const[A,X]=k(null),[Y,y]=k(""),[Z,p]=k(""),[z,S]=k(!1),[w,_]=k(!0),[ee,V]=k(!1),h=Le(null),{alreadyHaveAccountHint:W,cartSyncError:P,defaultTitle:j,fasterCheckoutHint:q,invalidEmailError:E,missingEmailError:b,signInLabel:O}=I({alreadyHaveAccountHint:"Checkout.LoginForm.emailExists.alreadyHaveAccount",cartSyncError:"Checkout.LoginForm.cartSyncError",defaultTitle:"Checkout.LoginForm.title",fasterCheckoutHint:"Checkout.LoginForm.emailExists.forFasterCheckout",invalidEmailError:"Checkout.LoginForm.invalidEmailError",missingEmailError:"Checkout.LoginForm.missingEmailError",signInLabel:"Checkout.LoginForm.emailExists.signInButton"}),C=d(e=>{!D(e)||e===ce()||(ue(e).then(t=>{_(t)}).catch(t=>{console.error(t),_(!0)}),n&&he(e).catch(t=>{c==null||c({email:e,error:t}),c||p(P)}))},[n,c,P]),te=d(e=>{const i=e.target.value;y(i),_(!0),p(""),h.current&&clearTimeout(h.current),h.current=setTimeout(()=>{C(i),H({email:i}),h.current=null},Ie)},[C]),ie=d(e=>{const t=e.target,i=t.value.trim();if(D(i)){if(p(""),t.setCustomValidity(""),!h.current)return;clearTimeout(h.current),h.current=null,C(i),H({email:i});return}const U=i===""?"missing":"invalid",T=U==="missing"?b:E;if(m){m({email:i,message:T,type:U});return}p(T),t.setCustomValidity(T)},[E,b,m,C]),re=d(e=>{const t=e.target,i=t.validity,x=i.valueMissing?b:E;if(!m){p(x);return}m({email:t.value,message:x,type:i.valueMissing?"missing":"invalid"})},[b,E,m]),N=d(()=>{const e=K("email")??"",t=D(e);l==null||l(t?e:"")},[l]),R=d(()=>{f==null||f()},[f]),v=d(e=>{const t=K("email")??"",i=(e==null?void 0:e.email)??"";i!==t&&(y(i),p(""),_(!0),H({email:i}))},[]);$(()=>{if(!o)return;const e=M.on("authenticated",t=>{S(t),de().then(i=>{X(i)}).catch(console.error)},{eager:!0});return()=>{e==null||e.off()}},[o]),$(()=>{if(!o)return;const e=me();if(e){V(!0);const i=e.email??"";i&&y(i),v(e);return}const t=M.on("checkout/initialized",i=>{V(!0),v(i)},{eager:!0});return()=>{t==null||t.off()}},[o,v]),$(()=>{if(!o)return;const e=M.on("checkout/updated",v,{eager:!1});return()=>{e==null||e.off()}},[o,v]);const oe=B(()=>{if(g)return r(J,{name:"checkout-login-form-title",slot:s==null?void 0:s.Title,children:r("h2",{children:j})})},[g,s,j]),ne=B(()=>{if(a)return r(J,{context:{authenticated:z},name:"checkout-login-form-heading-label",slot:s==null?void 0:s.Heading,children:z?r(Ne,{onClick:R}):r(_e,{onClick:N})})},[a,z,s,N,R]),ae=B(()=>w?"":u(le,{children:[W," ",r("a",{href:"#",onClick:N,children:O})," ",q]}),[w,W,O,q,N]);return r(Ce,{...F,customer:A,email:Y,error:Z,headingContent:ne,hint:ae,initialized:ee,title:oe,visible:o,onEmailBlur:ie,onEmailChange:te,onEmailInvalid:re})};export{Qe as LoginForm,Qe as default};
 //# sourceMappingURL=LoginForm.js.map

package/containers/LoginForm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoginForm.js","sources":["/@dropins/storefront-checkout/src/lib/validation.ts","/@dropins/storefront-checkout/src/components/LoginForm/Email.tsx","/@dropins/storefront-checkout/src/components/LoginForm/SignIn.tsx","/@dropins/storefront-checkout/src/components/LoginForm/LoginFormSkeleton.tsx","/@dropins/storefront-checkout/src/components/LoginForm/LoginForm.tsx","/@dropins/storefront-checkout/src/components/LoginForm/SignOut.tsx","/@dropins/storefront-checkout/src/containers/LoginForm/LoginForm.tsx"],"sourcesContent":["export const validationPatterns = {\n  EMAIL:\n    /^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\\.)+[a-z]{2,}$/i,\n};\n\nexport const validateEmail = (email: string): boolean => {\n  return validationPatterns.EMAIL.test(email);\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Field, Input } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface LoginEmailProps extends HTMLAttributes<HTMLInputElement> {\n  value: string;\n  error: string;\n  hint: string;\n  onChange: (event: Event) => void;\n  onBlur: (event: Event) => void;\n  onInvalid: (event: Event) => void;\n}\n\nexport const Email: FunctionComponent<LoginEmailProps> = ({\n  value,\n  error,\n  hint,\n  onChange,\n  onBlur,\n  onInvalid,\n}) => {\n  const translations = useText({\n    LoginFormLabel: 'Checkout.LoginForm.ariaLabel',\n    LoginFormFloatingLabel: 'Checkout.LoginForm.floatingLabel',\n    LoginFormPlaceholder: 'Checkout.LoginForm.placeholder',\n  });\n\n  return (\n    <Field error={error} hint={hint}>\n      <Input\n        aria-label={translations.LoginFormLabel}\n        aria-required={true}\n        autocomplete=\"email\"\n        floatingLabel={translations.LoginFormFloatingLabel}\n        id=\"customer-email\"\n        name=\"customer-email\"\n        placeholder={translations.LoginFormPlaceholder}\n        required={true}\n        type=\"email\"\n        value={value}\n        onBlur={onBlur}\n        onChange={onChange}\n        onInvalid={onInvalid}\n      />\n    </Field>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\n\ninterface SignInProps {\n  onClick: (event: Event) => void;\n}\n\nexport const SignIn: FunctionComponent<SignInProps> = ({ onClick }) => {\n  const translations = useText({\n    account: 'Checkout.LoginForm.account',\n    signIn: 'Checkout.LoginForm.signIn'\n  });\n\n  return (\n    <div className=\"checkout-login-form__sign-in\">\n      {translations.account}\n\n      <a\n        className=\"checkout-login-form__link\"\n        data-testid=\"sign-in-link\"\n        href=\"#\"\n        rel=\"noreferrer\"\n        target=\"_blank\"\n        onClick={(event) => {\n          event.preventDefault();\n          onClick(event);\n        }}\n      >\n        {translations.signIn}\n      </a>\n    </div>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const LoginFormSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"login-form-skeleton\">\n      <SkeletonRow fullWidth={true} variant=\"heading\" />\n      <SkeletonRow fullWidth={true} size=\"medium\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Email } from '@/checkout/components';\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper/ConditionalWrapper';\nimport '@/checkout/components/LoginForm/LoginForm.css';\nimport { LoginFormSkeleton } from '@/checkout/components/LoginForm/LoginFormSkeleton';\nimport { Customer } from '@/checkout/data/models';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface LoginFormProps\n  extends Omit<HTMLAttributes<HTMLFormElement>, 'title'> {\n  customer: Customer | null;\n  email: string;\n  error: string;\n  headingContent?: VNode;\n  hint: string | VNode;\n  onEmailBlur: (event: Event) => void;\n  onEmailChange: (event: Event) => void;\n  onEmailInvalid: (event: Event) => void;\n  title?: VNode;\n}\n\nconst LoginFormComponent: FunctionComponent<LoginFormProps> = ({\n  className,\n  customer,\n  email,\n  error,\n  headingContent,\n  hint,\n  name,\n  onEmailBlur,\n  onEmailChange,\n  onEmailInvalid,\n  title,\n  ...props\n}) => {\n  return (\n    <div className=\"checkout-login-form\" data-testid=\"checkout-login-form\">\n      <div className=\"checkout-login-form__heading\">\n        {title && (\n          <VComponent className=\"checkout-login-form__title\" node={title} />\n        )}\n\n        {headingContent && (\n          <VComponent\n            className=\"checkout-login-form__heading-label\"\n            node={headingContent}\n          />\n        )}\n      </div>\n\n      {customer ? (\n        <div className=\"checkout-login-form__customer-details\">\n          <div className=\"checkout-login-form__customer-name\">\n            {`${customer.firstName} ${customer.lastName}`}\n          </div>\n\n          <div className=\"checkout-login-form__customer-email\">\n            {customer.email}\n          </div>\n        </div>\n      ) : (\n        <div className=\"checkout-login-form__content\">\n          <form\n            {...props}\n            noValidate\n            className={classes(['dropin-login-form__form', className])}\n            name={name}\n          >\n            {/* Prevent 'Enter' key press from submitting this form. */}\n            <button\n              disabled\n              aria-hidden=\"true\"\n              style=\"display: none\"\n              type=\"submit\"\n            />\n            <Email\n              error={error}\n              hint={hint as any}\n              value={email}\n              onBlur={onEmailBlur}\n              onChange={onEmailChange}\n              onInvalid={onEmailInvalid}\n            />\n          </form>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport const LoginForm = WithConditionals(\n  LoginFormComponent,\n  LoginFormSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\n\ninterface SignOutProps {\n  onClick: (event: Event) => void;\n}\n\nexport const SignOut: FunctionComponent<SignOutProps> = ({ onClick }) => {\n  const translations = useText({\n    switch: 'Checkout.LoginForm.switch',\n    signOut: 'Checkout.LoginForm.signOut'\n  });\n\n  return (\n    <p className=\"checkout-login-form__sign-out\">\n      {translations.switch}\n\n      <a\n        className=\"checkout-login-form__link\"\n        href=\"#\"\n        rel=\"noreferrer\"\n        target=\"_blank\"\n        onClick={(event) => {\n          event.preventDefault();\n          onClick?.(event);\n        }}\n      >\n        {translations.signOut}\n      </a>\n    </p>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport {\n  getCustomer,\n  isEmailAvailable,\n  setGuestEmailOnCart,\n} from '@/checkout/api';\nimport {\n  LoginForm as LoginFormComponent,\n  SignIn,\n  SignOut,\n} from '@/checkout/components/LoginForm';\nimport { Cart, Customer } from '@/checkout/data/models';\nimport {\n  getCartEmail,\n  getLatestCheckoutUpdate,\n  getValue,\n  notifyValues,\n  validateEmail,\n} from '@/checkout/lib';\nimport { TitleProps } from '@/checkout/types/TitleProps';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { HTMLAttributes } from 'preact/compat';\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'preact/hooks';\n\ninterface ValidationError {\n  email: string;\n  message: string;\n  type: 'missing' | 'invalid';\n}\n\ninterface CartSyncError {\n  email: string;\n  error: Error;\n}\n\nexport interface LoginFormProps\n  extends HTMLAttributes<HTMLFormElement>,\n    TitleProps {\n  active?: boolean;\n  autoSync?: boolean;\n  displayHeadingContent?: boolean;\n  onSignInClick?: (email: string) => void;\n  onSignOutClick?: () => void;\n  onCartSyncError?: (error: CartSyncError) => void;\n  onValidationError?: (error: ValidationError) => void;\n  slots?: {\n    Heading?: SlotProps<{\n      authenticated: boolean;\n    }>;\n  } & TitleProps['slots'];\n}\n\nconst DEBOUNCE_TIME = 1000;\n\nexport const LoginForm: Container<LoginFormProps> = ({\n  active = true,\n  autoSync = true,\n  displayHeadingContent = true,\n  displayTitle = true,\n  initialData,\n  onCartSyncError,\n  onSignInClick,\n  onSignOutClick,\n  onValidationError,\n  slots,\n  ...props\n}) => {\n  const [customer, setCustomer] = useState<Customer | null>(null);\n  const [email, setEmail] = useState<string>('');\n  const [error, setError] = useState<string>('');\n  const [isAuthenticated, setIsAuthenticated] = useState(false);\n  const [isAvailable, setIsAvailable] = useState<boolean>(true);\n  const [isInitialized, setIsInitialized] = useState<boolean>(false);\n\n  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const {\n    alreadyHaveAccountHint,\n    cartSyncError,\n    defaultTitle,\n    fasterCheckoutHint,\n    invalidEmailError,\n    missingEmailError,\n    signInLabel,\n  } = useText({\n    alreadyHaveAccountHint: 'Checkout.LoginForm.emailExists.alreadyHaveAccount',\n    cartSyncError: 'Checkout.LoginForm.cartSyncError',\n    defaultTitle: 'Checkout.LoginForm.title',\n    fasterCheckoutHint: 'Checkout.LoginForm.emailExists.forFasterCheckout',\n    invalidEmailError: 'Checkout.LoginForm.invalidEmailError',\n    missingEmailError: 'Checkout.LoginForm.missingEmailError',\n    signInLabel: 'Checkout.LoginForm.emailExists.signInButton',\n  });\n\n  const setEmailAndCheckAvailability = useCallback(\n    (email: string) => {\n      if (!validateEmail(email) || email === getCartEmail()) return;\n\n      isEmailAvailable(email)\n        .then((availability) => {\n          setIsAvailable(availability);\n        })\n        .catch((error) => {\n          console.error(error);\n          setIsAvailable(true);\n        });\n\n      if (!autoSync) return;\n\n      setGuestEmailOnCart(email).catch((error) => {\n        onCartSyncError?.({ email, error });\n\n        if (!onCartSyncError) {\n          setError(cartSyncError);\n        }\n      });\n    },\n    [autoSync, onCartSyncError, cartSyncError]\n  );\n\n  const handleChange = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const email = target.value;\n\n      setEmail(email);\n      setIsAvailable(true);\n      setError('');\n\n      if (debounceTimer.current) {\n        clearTimeout(debounceTimer.current);\n      }\n\n      debounceTimer.current = setTimeout(() => {\n        setEmailAndCheckAvailability(email);\n        notifyValues({ email });\n        debounceTimer.current = null;\n      }, DEBOUNCE_TIME);\n    },\n    [setEmailAndCheckAvailability]\n  );\n\n  const handleBlur = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const email = target.value.trim();\n      const isValid = validateEmail(email);\n\n      if (isValid) {\n        setError('');\n        target.setCustomValidity('');\n\n        if (!debounceTimer.current) return;\n\n        clearTimeout(debounceTimer.current);\n        debounceTimer.current = null;\n        setEmailAndCheckAvailability(email);\n        notifyValues({ email });\n        return;\n      }\n\n      const type = email === '' ? 'missing' : 'invalid';\n      const message =\n        type === 'missing' ? missingEmailError : invalidEmailError;\n\n      if (onValidationError) {\n        onValidationError({ email, message, type });\n        return;\n      }\n\n      setError(message);\n      target.setCustomValidity(message);\n    },\n    [\n      invalidEmailError,\n      missingEmailError,\n      onValidationError,\n      setEmailAndCheckAvailability,\n    ]\n  );\n\n  const handleInvalid = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const validity = target.validity;\n\n      const message = validity.valueMissing\n        ? missingEmailError\n        : invalidEmailError;\n\n      if (!onValidationError) {\n        setError(message);\n        return;\n      }\n\n      onValidationError({\n        email: target.value,\n        message,\n        type: validity.valueMissing ? 'missing' : 'invalid',\n      });\n    },\n    [missingEmailError, invalidEmailError, onValidationError]\n  );\n\n  const handleSignIn = useCallback(() => {\n    const email = getValue('email') ?? '';\n    const isValid = validateEmail(email);\n    onSignInClick?.(isValid ? email : '');\n  }, [onSignInClick]);\n\n  const handleSignOut = useCallback(() => {\n    onSignOutClick?.();\n  }, [onSignOutClick]);\n\n  const handleCheckoutData = useCallback((data: Cart | null) => {\n    const prevEmail = getValue('email') ?? '';\n    const email = data?.email ?? '';\n\n    if (email !== prevEmail) {\n      setEmail(email);\n      setError('');\n      setIsAvailable(true);\n      notifyValues({ email });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onAuthenticated = events.on(\n      'authenticated',\n      (authenticated) => {\n        setIsAuthenticated(authenticated);\n\n        getCustomer()\n          .then((customer) => {\n            setCustomer(customer);\n          })\n          .catch(console.error);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onAuthenticated?.off();\n    };\n  }, [active]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      setIsInitialized(true);\n      // When component becomes active, restore local state from checkout data\n      const checkoutEmail = pastUpdate.email ?? '';\n      if (checkoutEmail) {\n        setEmail(checkoutEmail);\n      }\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      (data) => {\n        setIsInitialized(true);\n        handleCheckoutData(data);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const titleContent = useMemo(() => {\n    if (!displayTitle) return undefined;\n\n    return (\n      <Slot name=\"checkout-login-form-title\" slot={slots?.Title}>\n        <h2>{defaultTitle}</h2>\n      </Slot>\n    );\n  }, [displayTitle, slots, defaultTitle]);\n\n  const headingContent = useMemo(() => {\n    if (!displayHeadingContent) return undefined;\n\n    return (\n      <Slot\n        context={{ authenticated: isAuthenticated }}\n        name=\"checkout-login-form-heading-label\"\n        slot={slots?.Heading}\n      >\n        {isAuthenticated ? (\n          <SignOut onClick={handleSignOut} />\n        ) : (\n          <SignIn onClick={handleSignIn} />\n        )}\n      </Slot>\n    );\n  }, [\n    displayHeadingContent,\n    isAuthenticated,\n    slots,\n    handleSignIn,\n    handleSignOut,\n  ]);\n\n  const hintContent = useMemo(() => {\n    if (isAvailable) return '';\n\n    return (\n      <>\n        {alreadyHaveAccountHint}{' '}\n        <a href=\"#\" onClick={handleSignIn}>\n          {signInLabel}\n        </a>{' '}\n        {fasterCheckoutHint}\n      </>\n    );\n  }, [\n    isAvailable,\n    alreadyHaveAccountHint,\n    signInLabel,\n    fasterCheckoutHint,\n    handleSignIn,\n  ]);\n\n  return (\n    <LoginFormComponent\n      {...props}\n      customer={customer}\n      email={email}\n      error={error}\n      headingContent={headingContent}\n      hint={hintContent}\n      initialized={isInitialized}\n      title={titleContent}\n      visible={active}\n      onEmailBlur={handleBlur}\n      onEmailChange={handleChange}\n      onEmailInvalid={handleInvalid}\n    />\n  );\n};\n"],"names":["validationPatterns","validateEmail","email","Email","value","error","hint","onChange","onBlur","onInvalid","translations","useText","jsx","Field","Input","SignIn","onClick","jsxs","event","LoginFormSkeleton","Skeleton","SkeletonRow","LoginFormComponent","className","customer","headingContent","name","onEmailBlur","onEmailChange","onEmailInvalid","title","props","VComponent","classes","LoginForm","WithConditionals","SignOut","DEBOUNCE_TIME","active","autoSync","displayHeadingContent","displayTitle","initialData","onCartSyncError","onSignInClick","onSignOutClick","onValidationError","slots","setCustomer","useState","setEmail","setError","isAuthenticated","setIsAuthenticated","isAvailable","setIsAvailable","isInitialized","setIsInitialized","debounceTimer","useRef","alreadyHaveAccountHint","cartSyncError","defaultTitle","fasterCheckoutHint","invalidEmailError","missingEmailError","signInLabel","setEmailAndCheckAvailability","useCallback","getCartEmail","isEmailAvailable","availability","setGuestEmailOnCart","handleChange","notifyValues","handleBlur","target","type","message","handleInvalid","validity","handleSignIn","getValue","isValid","handleSignOut","handleCheckoutData","data","prevEmail","useEffect","onAuthenticated","events","authenticated","getCustomer","pastUpdate","getLatestCheckoutUpdate","checkoutEmail","onCheckoutInit","onCheckoutUpdated","titleContent","useMemo","Slot","hintContent","Fragment"],"mappings":"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"}
+{"version":3,"file":"LoginForm.js","sources":["/@dropins/storefront-checkout/src/lib/validation.ts","/@dropins/storefront-checkout/src/components/LoginForm/Email.tsx","/@dropins/storefront-checkout/src/components/LoginForm/SignIn.tsx","/@dropins/storefront-checkout/src/components/LoginForm/LoginFormSkeleton.tsx","/@dropins/storefront-checkout/src/components/LoginForm/LoginForm.tsx","/@dropins/storefront-checkout/src/components/LoginForm/SignOut.tsx","/@dropins/storefront-checkout/src/containers/LoginForm/LoginForm.tsx"],"sourcesContent":["export const validationPatterns = {\n  EMAIL:\n    /^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\\.)+[a-z]{2,}$/i,\n};\n\nexport const validateEmail = (email: string): boolean => {\n  return validationPatterns.EMAIL.test(email);\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Field, Input } from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface LoginEmailProps extends HTMLAttributes<HTMLInputElement> {\n  value: string;\n  error: string;\n  hint: string;\n  onChange: (event: Event) => void;\n  onBlur: (event: Event) => void;\n  onInvalid: (event: Event) => void;\n}\n\nexport const Email: FunctionComponent<LoginEmailProps> = ({\n  value,\n  error,\n  hint,\n  onChange,\n  onBlur,\n  onInvalid,\n}) => {\n  const translations = useText({\n    LoginFormLabel: 'Checkout.LoginForm.ariaLabel',\n    LoginFormFloatingLabel: 'Checkout.LoginForm.floatingLabel',\n    LoginFormPlaceholder: 'Checkout.LoginForm.placeholder',\n  });\n\n  return (\n    <Field error={error} hint={hint}>\n      <Input\n        aria-label={translations.LoginFormLabel}\n        aria-required={true}\n        autocomplete=\"email\"\n        floatingLabel={translations.LoginFormFloatingLabel}\n        id=\"customer-email\"\n        name=\"customer-email\"\n        placeholder={translations.LoginFormPlaceholder}\n        required={true}\n        type=\"email\"\n        value={value}\n        onBlur={onBlur}\n        onChange={onChange}\n        onInvalid={onInvalid}\n      />\n    </Field>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\n\ninterface SignInProps {\n  onClick: (event: Event) => void;\n}\n\nexport const SignIn: FunctionComponent<SignInProps> = ({ onClick }) => {\n  const translations = useText({\n    account: 'Checkout.LoginForm.account',\n    signIn: 'Checkout.LoginForm.signIn'\n  });\n\n  return (\n    <div className=\"checkout-login-form__sign-in\">\n      {translations.account}\n\n      <a\n        className=\"checkout-login-form__link\"\n        data-testid=\"sign-in-link\"\n        href=\"#\"\n        rel=\"noreferrer\"\n        target=\"_blank\"\n        onClick={(event) => {\n          event.preventDefault();\n          onClick(event);\n        }}\n      >\n        {translations.signIn}\n      </a>\n    </div>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const LoginFormSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"login-form-skeleton\">\n      <SkeletonRow fullWidth={true} variant=\"heading\" />\n      <SkeletonRow fullWidth={true} size=\"medium\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Email } from '@/checkout/components';\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper/ConditionalWrapper';\nimport '@/checkout/components/LoginForm/LoginForm.css';\nimport { LoginFormSkeleton } from '@/checkout/components/LoginForm/LoginFormSkeleton';\nimport { Customer } from '@/checkout/data/models';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes } from 'preact/compat';\n\nexport interface LoginFormProps\n  extends Omit<HTMLAttributes<HTMLFormElement>, 'title'> {\n  customer: Customer | null;\n  email: string;\n  error: string;\n  headingContent?: VNode;\n  hint: string | VNode;\n  onEmailBlur: (event: Event) => void;\n  onEmailChange: (event: Event) => void;\n  onEmailInvalid: (event: Event) => void;\n  title?: VNode;\n}\n\nconst LoginFormComponent: FunctionComponent<LoginFormProps> = ({\n  className,\n  customer,\n  email,\n  error,\n  headingContent,\n  hint,\n  name,\n  onEmailBlur,\n  onEmailChange,\n  onEmailInvalid,\n  title,\n  ...props\n}) => {\n  return (\n    <div className=\"checkout-login-form\" data-testid=\"checkout-login-form\">\n      <div className=\"checkout-login-form__heading\">\n        {title && (\n          <VComponent className=\"checkout-login-form__title\" node={title} />\n        )}\n\n        {headingContent && (\n          <VComponent\n            className=\"checkout-login-form__heading-label\"\n            node={headingContent}\n          />\n        )}\n      </div>\n\n      {customer ? (\n        <div className=\"checkout-login-form__customer-details\">\n          <div className=\"checkout-login-form__customer-name\">\n            {`${customer.firstName} ${customer.lastName}`}\n          </div>\n\n          <div className=\"checkout-login-form__customer-email\">\n            {customer.email}\n          </div>\n        </div>\n      ) : (\n        <div className=\"checkout-login-form__content\">\n          <form\n            {...props}\n            noValidate\n            className={classes(['dropin-login-form__form', className])}\n            name={name}\n          >\n            {/* Prevent 'Enter' key press from submitting this form. */}\n            <button\n              disabled\n              aria-hidden=\"true\"\n              style=\"display: none\"\n              type=\"submit\"\n            />\n            <Email\n              error={error}\n              hint={hint as any}\n              value={email}\n              onBlur={onEmailBlur}\n              onChange={onEmailChange}\n              onInvalid={onEmailInvalid}\n            />\n          </form>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport const LoginForm = WithConditionals(\n  LoginFormComponent,\n  LoginFormSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { FunctionComponent } from 'preact';\n\ninterface SignOutProps {\n  onClick: (event: Event) => void;\n}\n\nexport const SignOut: FunctionComponent<SignOutProps> = ({ onClick }) => {\n  const translations = useText({\n    switch: 'Checkout.LoginForm.switch',\n    signOut: 'Checkout.LoginForm.signOut'\n  });\n\n  return (\n    <p className=\"checkout-login-form__sign-out\">\n      {translations.switch}\n\n      <a\n        className=\"checkout-login-form__link\"\n        href=\"#\"\n        rel=\"noreferrer\"\n        target=\"_blank\"\n        onClick={(event) => {\n          event.preventDefault();\n          onClick?.(event);\n        }}\n      >\n        {translations.signOut}\n      </a>\n    </p>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport {\n  getCustomer,\n  isEmailAvailable,\n  setGuestEmailOnCart,\n} from '@/checkout/api';\nimport {\n  LoginForm as LoginFormComponent,\n  SignIn,\n  SignOut,\n} from '@/checkout/components/LoginForm';\nimport { Cart, Customer } from '@/checkout/data/models';\nimport {\n  getCartEmail,\n  getLatestCheckoutUpdate,\n  getValue,\n  notifyValues,\n  validateEmail,\n} from '@/checkout/lib';\nimport { TitleProps } from '@/checkout/types';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { HTMLAttributes } from 'preact/compat';\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'preact/hooks';\n\ninterface ValidationError {\n  email: string;\n  message: string;\n  type: 'missing' | 'invalid';\n}\n\ninterface CartSyncError {\n  email: string;\n  error: Error;\n}\n\nexport interface LoginFormProps\n  extends HTMLAttributes<HTMLFormElement>,\n    TitleProps {\n  active?: boolean;\n  autoSync?: boolean;\n  displayHeadingContent?: boolean;\n  onSignInClick?: (email: string) => void;\n  onSignOutClick?: () => void;\n  onCartSyncError?: (error: CartSyncError) => void;\n  onValidationError?: (error: ValidationError) => void;\n  slots?: {\n    Heading?: SlotProps<{\n      authenticated: boolean;\n    }>;\n  } & TitleProps['slots'];\n}\n\nconst DEBOUNCE_TIME = 1000;\n\nexport const LoginForm: Container<LoginFormProps> = ({\n  active = true,\n  autoSync = true,\n  displayHeadingContent = true,\n  displayTitle = true,\n  initialData,\n  onCartSyncError,\n  onSignInClick,\n  onSignOutClick,\n  onValidationError,\n  slots,\n  ...props\n}) => {\n  const [customer, setCustomer] = useState<Customer | null>(null);\n  const [email, setEmail] = useState<string>('');\n  const [error, setError] = useState<string>('');\n  const [isAuthenticated, setIsAuthenticated] = useState(false);\n  const [isAvailable, setIsAvailable] = useState<boolean>(true);\n  const [isInitialized, setIsInitialized] = useState<boolean>(false);\n\n  const debounceTimer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  const {\n    alreadyHaveAccountHint,\n    cartSyncError,\n    defaultTitle,\n    fasterCheckoutHint,\n    invalidEmailError,\n    missingEmailError,\n    signInLabel,\n  } = useText({\n    alreadyHaveAccountHint: 'Checkout.LoginForm.emailExists.alreadyHaveAccount',\n    cartSyncError: 'Checkout.LoginForm.cartSyncError',\n    defaultTitle: 'Checkout.LoginForm.title',\n    fasterCheckoutHint: 'Checkout.LoginForm.emailExists.forFasterCheckout',\n    invalidEmailError: 'Checkout.LoginForm.invalidEmailError',\n    missingEmailError: 'Checkout.LoginForm.missingEmailError',\n    signInLabel: 'Checkout.LoginForm.emailExists.signInButton',\n  });\n\n  const setEmailAndCheckAvailability = useCallback(\n    (email: string) => {\n      if (!validateEmail(email) || email === getCartEmail()) return;\n\n      isEmailAvailable(email)\n        .then((availability) => {\n          setIsAvailable(availability);\n        })\n        .catch((error) => {\n          console.error(error);\n          setIsAvailable(true);\n        });\n\n      if (!autoSync) return;\n\n      setGuestEmailOnCart(email).catch((error) => {\n        onCartSyncError?.({ email, error });\n\n        if (!onCartSyncError) {\n          setError(cartSyncError);\n        }\n      });\n    },\n    [autoSync, onCartSyncError, cartSyncError]\n  );\n\n  const handleChange = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const email = target.value;\n\n      setEmail(email);\n      setIsAvailable(true);\n      setError('');\n\n      if (debounceTimer.current) {\n        clearTimeout(debounceTimer.current);\n      }\n\n      debounceTimer.current = setTimeout(() => {\n        setEmailAndCheckAvailability(email);\n        notifyValues({ email });\n        debounceTimer.current = null;\n      }, DEBOUNCE_TIME);\n    },\n    [setEmailAndCheckAvailability]\n  );\n\n  const handleBlur = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const email = target.value.trim();\n      const isValid = validateEmail(email);\n\n      if (isValid) {\n        setError('');\n        target.setCustomValidity('');\n\n        if (!debounceTimer.current) return;\n\n        clearTimeout(debounceTimer.current);\n        debounceTimer.current = null;\n        setEmailAndCheckAvailability(email);\n        notifyValues({ email });\n        return;\n      }\n\n      const type = email === '' ? 'missing' : 'invalid';\n      const message =\n        type === 'missing' ? missingEmailError : invalidEmailError;\n\n      if (onValidationError) {\n        onValidationError({ email, message, type });\n        return;\n      }\n\n      setError(message);\n      target.setCustomValidity(message);\n    },\n    [\n      invalidEmailError,\n      missingEmailError,\n      onValidationError,\n      setEmailAndCheckAvailability,\n    ]\n  );\n\n  const handleInvalid = useCallback(\n    (event: Event) => {\n      const target = event.target as HTMLInputElement;\n      const validity = target.validity;\n\n      const message = validity.valueMissing\n        ? missingEmailError\n        : invalidEmailError;\n\n      if (!onValidationError) {\n        setError(message);\n        return;\n      }\n\n      onValidationError({\n        email: target.value,\n        message,\n        type: validity.valueMissing ? 'missing' : 'invalid',\n      });\n    },\n    [missingEmailError, invalidEmailError, onValidationError]\n  );\n\n  const handleSignIn = useCallback(() => {\n    const email = getValue('email') ?? '';\n    const isValid = validateEmail(email);\n    onSignInClick?.(isValid ? email : '');\n  }, [onSignInClick]);\n\n  const handleSignOut = useCallback(() => {\n    onSignOutClick?.();\n  }, [onSignOutClick]);\n\n  const handleCheckoutData = useCallback((data: Cart | null) => {\n    const prevEmail = getValue('email') ?? '';\n    const email = data?.email ?? '';\n\n    if (email !== prevEmail) {\n      setEmail(email);\n      setError('');\n      setIsAvailable(true);\n      notifyValues({ email });\n    }\n  }, []);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onAuthenticated = events.on(\n      'authenticated',\n      (authenticated) => {\n        setIsAuthenticated(authenticated);\n\n        getCustomer()\n          .then((customer) => {\n            setCustomer(customer);\n          })\n          .catch(console.error);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onAuthenticated?.off();\n    };\n  }, [active]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      setIsInitialized(true);\n      // When component becomes active, restore local state from checkout data\n      const checkoutEmail = pastUpdate.email ?? '';\n      if (checkoutEmail) {\n        setEmail(checkoutEmail);\n      }\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      (data) => {\n        setIsInitialized(true);\n        handleCheckoutData(data);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const titleContent = useMemo(() => {\n    if (!displayTitle) return undefined;\n\n    return (\n      <Slot name=\"checkout-login-form-title\" slot={slots?.Title}>\n        <h2>{defaultTitle}</h2>\n      </Slot>\n    );\n  }, [displayTitle, slots, defaultTitle]);\n\n  const headingContent = useMemo(() => {\n    if (!displayHeadingContent) return undefined;\n\n    return (\n      <Slot\n        context={{ authenticated: isAuthenticated }}\n        name=\"checkout-login-form-heading-label\"\n        slot={slots?.Heading}\n      >\n        {isAuthenticated ? (\n          <SignOut onClick={handleSignOut} />\n        ) : (\n          <SignIn onClick={handleSignIn} />\n        )}\n      </Slot>\n    );\n  }, [\n    displayHeadingContent,\n    isAuthenticated,\n    slots,\n    handleSignIn,\n    handleSignOut,\n  ]);\n\n  const hintContent = useMemo(() => {\n    if (isAvailable) return '';\n\n    return (\n      <>\n        {alreadyHaveAccountHint}{' '}\n        <a href=\"#\" onClick={handleSignIn}>\n          {signInLabel}\n        </a>{' '}\n        {fasterCheckoutHint}\n      </>\n    );\n  }, [\n    isAvailable,\n    alreadyHaveAccountHint,\n    signInLabel,\n    fasterCheckoutHint,\n    handleSignIn,\n  ]);\n\n  return (\n    <LoginFormComponent\n      {...props}\n      customer={customer}\n      email={email}\n      error={error}\n      headingContent={headingContent}\n      hint={hintContent}\n      initialized={isInitialized}\n      title={titleContent}\n      visible={active}\n      onEmailBlur={handleBlur}\n      onEmailChange={handleChange}\n      onEmailInvalid={handleInvalid}\n    />\n  );\n};\n"],"names":["validationPatterns","validateEmail","email","Email","value","error","hint","onChange","onBlur","onInvalid","translations","useText","jsx","Field","Input","SignIn","onClick","jsxs","event","LoginFormSkeleton","Skeleton","SkeletonRow","LoginFormComponent","className","customer","headingContent","name","onEmailBlur","onEmailChange","onEmailInvalid","title","props","VComponent","classes","LoginForm","WithConditionals","SignOut","DEBOUNCE_TIME","active","autoSync","displayHeadingContent","displayTitle","initialData","onCartSyncError","onSignInClick","onSignOutClick","onValidationError","slots","setCustomer","useState","setEmail","setError","isAuthenticated","setIsAuthenticated","isAvailable","setIsAvailable","isInitialized","setIsInitialized","debounceTimer","useRef","alreadyHaveAccountHint","cartSyncError","defaultTitle","fasterCheckoutHint","invalidEmailError","missingEmailError","signInLabel","setEmailAndCheckAvailability","useCallback","getCartEmail","isEmailAvailable","availability","setGuestEmailOnCart","handleChange","notifyValues","handleBlur","target","type","message","handleInvalid","validity","handleSignIn","getValue","isValid","handleSignOut","handleCheckoutData","data","prevEmail","useEffect","onAuthenticated","events","authenticated","getCustomer","pastUpdate","getLatestCheckoutUpdate","checkoutEmail","onCheckoutInit","onCheckoutUpdated","titleContent","useMemo","Slot","hintContent","Fragment"],"mappings":"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"}

package/containers/OutOfStock.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsxs as n,jsx as o}from"@dropins/tools/preact-jsx-runtime.js";/* empty css                             */import{Card as l,Icon as h,Image as O}from"@dropins/tools/components.js";import"../chunks/TermsAndConditions.js";import{classes as d}from"@dropins/tools/lib.js";import{S as p}from"../chunks/OrderError.js";import{useText as S}from"@dropins/tools/i18n.js";/* empty css                      */import"../chunks/fetch-graphql.js";import{events as _}from"@dropins/tools/event-bus.js";import"@dropins/tools/preact-compat.js";/* empty css                  *//* empty css                       */import{useState as g,useCallback as v,useEffect as N}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";const w=({className:r,items:u,onRemoveOutOfStock:s,routeCart:t,...a})=>{const i=S({title:"Checkout.OutOfStock.title",message:"Checkout.OutOfStock.message",reviewCart:"Checkout.OutOfStock.actions.reviewCart",removeOutOfStock:"Checkout.OutOfStock.actions.removeOutOfStock"});return n(l,{className:d(["checkout-out-of-stock",r]),"data-testid":"checkout-out-of-stock",variant:"secondary",...a,children:[n("h4",{className:"checkout-out-of-stock__title",children:[o(h,{size:"16",source:p,stroke:"1"}),i.title]}),o("p",{className:"checkout-out-of-stock__message",children:i.message}),o("ol",{className:"checkout-out-of-stock__items",children:u.map(m=>o("li",{className:"checkout-out-of-stock__item","data-testid":"out-of-stock-item",children:o(O,{alt:m.image.alt,height:"100",loading:"eager",params:{width:100},src:m.image.src,width:"100"})},m.sku))}),n("div",{className:"checkout-out-of-stock__actions",children:[t&&o("a",{className:"checkout-out-of-stock__action","data-testid":"review-cart",href:t,children:i.reviewCart}),s&&o("button",{className:"checkout-out-of-stock__action","data-testid":"remove-out-of-stock",type:"button",onClick:s,children:i.removeOutOfStock})]})]})},G=({onCartProductsUpdate:r,routeCart:u,active:s=!0})=>{const[t,a]=g([]),i=v(()=>{if(!r)return;const e=t.filter(c=>c.outOfStock).map(c=>({uid:c.uid,quantity:0}));r(e)},[t,r]);if(N(()=>{if(!s)return;const e=_.on("cart/data",c=>{const k=(c==null?void 0:c.items)||[];a(k.filter(f=>f.outOfStock||f.insufficientQuantity))},{eager:!0});return()=>{e==null||e.off()}},[s]),!s||t.length===0)return null;const m=!t.some(e=>e.insufficientQuantity);return o(w,{items:t,routeCart:u==null?void 0:u(),onRemoveOutOfStock:m?i:void 0})};export{G as OutOfStock,G as default};
+import{jsxs as n,jsx as o}from"@dropins/tools/preact-jsx-runtime.js";import"../chunks/TermsAndConditions.js";import{classes as l}from"@dropins/tools/lib.js";import{Card as h,Icon as O,Image as d}from"@dropins/tools/components.js";/* empty css                             */import{S as p}from"../chunks/OrderError.js";import{useText as S}from"@dropins/tools/i18n.js";/* empty css                      */import"../chunks/fetch-graphql.js";import{events as _}from"@dropins/tools/event-bus.js";import"@dropins/tools/preact-compat.js";/* empty css                  *//* empty css                       */import{useState as g,useCallback as v,useEffect as N}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";const w=({className:r,items:u,onRemoveOutOfStock:s,routeCart:t,...a})=>{const i=S({title:"Checkout.OutOfStock.title",message:"Checkout.OutOfStock.message",reviewCart:"Checkout.OutOfStock.actions.reviewCart",removeOutOfStock:"Checkout.OutOfStock.actions.removeOutOfStock"});return n(h,{className:l(["checkout-out-of-stock",r]),"data-testid":"checkout-out-of-stock",variant:"secondary",...a,children:[n("h4",{className:"checkout-out-of-stock__title",children:[o(O,{size:"16",source:p,stroke:"1"}),i.title]}),o("p",{className:"checkout-out-of-stock__message",children:i.message}),o("ol",{className:"checkout-out-of-stock__items",children:u.map(m=>o("li",{className:"checkout-out-of-stock__item","data-testid":"out-of-stock-item",children:o(d,{alt:m.image.alt,height:"100",loading:"eager",params:{width:100},src:m.image.src,width:"100"})},m.sku))}),n("div",{className:"checkout-out-of-stock__actions",children:[t&&o("a",{className:"checkout-out-of-stock__action","data-testid":"review-cart",href:t,children:i.reviewCart}),s&&o("button",{className:"checkout-out-of-stock__action","data-testid":"remove-out-of-stock",type:"button",onClick:s,children:i.removeOutOfStock})]})]})},G=({onCartProductsUpdate:r,routeCart:u,active:s=!0})=>{const[t,a]=g([]),i=v(()=>{if(!r)return;const e=t.filter(c=>c.outOfStock).map(c=>({uid:c.uid,quantity:0}));r(e)},[t,r]);if(N(()=>{if(!s)return;const e=_.on("cart/data",c=>{const k=(c==null?void 0:c.items)||[];a(k.filter(f=>f.outOfStock||f.insufficientQuantity))},{eager:!0});return()=>{e==null||e.off()}},[s]),!s||t.length===0)return null;const m=!t.some(e=>e.insufficientQuantity);return o(w,{items:t,routeCart:u==null?void 0:u(),onRemoveOutOfStock:m?i:void 0})};export{G as OutOfStock,G as default};
 //# sourceMappingURL=OutOfStock.js.map

package/containers/PaymentMethods/PaymentMethods.d.ts

@@ -1,6 +1,5 @@
 import { PaymentMethod } from '../../data/models/payment-method';
-import { UIComponentType } from '../../types/ComponentTypes';
-import { TitleProps } from '../../types/TitleProps';
+import { TitleProps, UIComponentType } from '../../types';
 import { Container, SlotProps } from '@dropins/tools/types/elsie/src/lib';
 import { HTMLAttributes } from 'preact/compat';
 

package/containers/PaymentMethods.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsxs as W,jsx as t}from"@dropins/tools/preact-jsx-runtime.js";import{h as X,s as Y}from"../chunks/fetch-graphql.js";import{classes as L,VComponent as ee,Slot as j}from"@dropins/tools/lib.js";import{W as te,i as ne,h as oe,g as re}from"../chunks/ConditionalWrapper.js";import{n as ae,g as x}from"../chunks/values.js";import{events as A}from"@dropins/tools/event-bus.js";import{s as ce}from"../chunks/setPaymentMethod.js";/* empty css                      */import{Skeleton as se,SkeletonRow as E,IllustratedMessage as ie,Icon as D,InLineAlert as le,ToggleButton as de,RadioButton as me}from"@dropins/tools/components.js";import{s as ue}from"../chunks/dom.js";import*as T from"@dropins/tools/preact-compat.js";import{useRef as he,useEffect as pe}from"@dropins/tools/preact-compat.js";import{useText as Z}from"@dropins/tools/i18n.js";import{useState as _,useCallback as P,useEffect as R,useMemo as fe}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const ye=n=>T.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...n},T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.93 14.8V18.75H5.97C4.75 18.75 3.75 17.97 3.75 17V6.5M3.75 6.5C3.75 5.53 4.74 4.75 5.97 4.75H15.94V8.25H5.97C4.75 8.25 3.75 7.47 3.75 6.5Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.35 11.64H14.04V14.81H19.35V11.64Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.9304 11.64V8.25H15.1504",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),ke=()=>W(se,{"data-testid":"payment-methods-skeleton",children:[t(E,{size:"medium",variant:"heading"}),t(E,{size:"medium",variant:"empty"}),t(E,{fullWidth:!0,size:"xlarge"}),t(E,{fullWidth:!0,size:"xlarge"})]}),ge=({UIComponentType:n="ToggleButton",busy:r,code:s,icon:u,onSelectionChange:o,selected:a,title:i})=>{const h={busy:r,className:"checkout-payment-methods__method",label:i,name:"payment-method",onChange:()=>o({code:s,title:i}),value:s};return n==="ToggleButton"?t(de,{...h,icon:u?t(D,{source:u}):void 0,selected:a}):t(me,{...h,checked:a,icon:u??void 0})},ve=({className:n,error:r=null,busy:s=!1,onDismissError:u,onSelectionChange:o=()=>{},options:a,paymentMethodContent:i,selection:h,title:g,UIComponentType:w})=>{const C=Z({EmptyState:"Checkout.PaymentMethods.emptyState"}),k=r!==null,v=he(null);return pe(()=>{k&&v.current&&ue(v.current)},[k]),W("div",{className:L(["checkout-payment-methods",n]),"data-testid":"checkout-payment-methods",children:[g&&t(ee,{className:"checkout-payment-methods__title",node:g}),!s&&a.length===0&&t(ie,{"data-testid":"checkout-payment-methods-empty",icon:t(D,{source:ye}),message:t("p",{children:C.EmptyState})}),W("div",{className:L(["checkout-payment-methods__wrapper",["checkout-payment-methods__wrapper--busy",s]]),"data-testid":"checkout-payment-methods-wrapper",children:[t("div",{className:L(["checkout-payment-methods__methods",["checkout-payment-methods--full-width",a.length%2!==0]]),children:a==null?void 0:a.map(p=>t(ge,{UIComponentType:w,busy:s,code:p.code,icon:p.icon,selected:(h==null?void 0:h.code)===p.code,title:p.displayLabel??!0?p.title:"",onSelectionChange:o},p.code))}),i&&t("div",{className:"checkout-payment-methods__content",children:i})]}),k&&t("div",{ref:v,className:"checkout-payment-methods__error","data-testid":"checkout-payment-methods-alert",children:t(le,{heading:r,type:"error",variant:"primary",onDismiss:u})})]})},Me=te(ve,ke);function Se(n,r){return n?r.some(s=>s.code===n.code):!1}function Pe(n,r){return!n||!r?!1:n.code===r.code}function Ce(n){return n?!!n.code&&!!n.title:!1}const Ae=({UIComponentType:n="ToggleButton",active:r=!0,autoSync:s=!0,displayTitle:u=!0,slots:o,onCartSyncError:a,onSelectionChange:i})=>{var N,O;const[h,g]=_(null),[w,C]=_(!1),[k,v]=_(null),[p,b]=_([]),l=o==null?void 0:o.Methods,$=X.value,q=p.filter(e=>{var c;return((c=l==null?void 0:l[e.code])==null?void 0:c.enabled)!==!1}).map(e=>{const c=(l==null?void 0:l[e.code])||{};return{...e,...c}}),{cartSyncError:z,defaultTitle:H}=Z({cartSyncError:"Checkout.PaymentMethods.cartSyncError",defaultTitle:"Checkout.PaymentMethods.title"}),F=P(()=>{g(null)},[]),m=P(e=>{g(null),v(e),ae({selectedPaymentMethod:e})},[]),M=P(async(e,c)=>{if(!(ne()||oe()))return;const f=l==null?void 0:l[e.code];((f==null?void 0:f.autoSync)??s)&&ce({code:e.code}).catch(y=>{m(c??null),a==null||a({method:e,error:y}),a||g(z)})},[l,s,m,a,z]),G=P(async e=>{const c=x("selectedPaymentMethod");m(e),i==null||i(e),await M(e,c)},[i,m,M]),S=P(e=>{if(!e||e.isEmpty){m(null),b([]);return}const d=e.availablePaymentMethods??[];if(b(d),d.length===0){m(null);return}const f=e.selectedPaymentMethod??null,U=Ce(f),y=x("selectedPaymentMethod"),V=Se(y,d),Q=Pe(y,f);if(y&&V&&!Q){M(y,f);return}if((!y||!V)&&U){m(f);return}if((!y||!V)&&!U){const B=d[0];m(B),M(B)}},[m,M]);R(()=>{if(!r)return;const e=re();if(e){C(!0);const d=x("selectedPaymentMethod");d&&v(d),S(e);return}const c=A.on("checkout/initialized",d=>{C(!0),S(d)},{eager:!0});return()=>{c==null||c.off()}},[r,S]),R(()=>{if(!r)return;const e=A.on("checkout/updated",S,{eager:!1});return()=>{e==null||e.off()}},[r,S]);const I=k?(O=(N=o==null?void 0:o.Methods)==null?void 0:N[k.code])==null?void 0:O.render:null,J=I?t(j,{context:{cartId:Y.cartId??"",replaceHTML(e){this.replaceWith(e)}},name:"PaymentMethodContent",slot:I},I):void 0,K=fe(()=>{if(u)return t(j,{name:"checkout-payment-methods-title",slot:o==null?void 0:o.Title,children:t("h2",{children:H})})},[u,o==null?void 0:o.Title,H]);return t(Me,{UIComponentType:n,busy:$,error:h,initialized:w,options:q,paymentMethodContent:J,selection:k,title:K,visible:r,onDismissError:F,onSelectionChange:G})};export{Ae as PaymentMethods,Ae as default};
+import{jsxs as b,jsx as t}from"@dropins/tools/preact-jsx-runtime.js";import{h as Y,s as ee}from"../chunks/fetch-graphql.js";import{classes as L,VComponent as te,Slot as A}from"@dropins/tools/lib.js";import{i as ne}from"../chunks/events2.js";import{h as oe,g as re}from"../chunks/events.js";import{n as ae,g as x}from"../chunks/values.js";import{events as R}from"@dropins/tools/event-bus.js";import{s as ce}from"../chunks/setPaymentMethod.js";import{W as se}from"../chunks/ConditionalWrapper.js";/* empty css                      */import{Skeleton as ie,SkeletonRow as E,IllustratedMessage as me,Icon as Z,InLineAlert as le,ToggleButton as de,RadioButton as ue}from"@dropins/tools/components.js";import{s as he}from"../chunks/dom.js";import*as T from"@dropins/tools/preact-compat.js";import{useRef as pe,useEffect as fe}from"@dropins/tools/preact-compat.js";import{useText as $}from"@dropins/tools/i18n.js";import{useState as _,useCallback as P,useEffect as D,useMemo as ye}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";import"../fragments.js";import"../chunks/guards.js";import"../chunks/synchronizeCheckout.js";import"../chunks/transform-shipping-methods.js";const ke=n=>T.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...n},T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.93 14.8V18.75H5.97C4.75 18.75 3.75 17.97 3.75 17V6.5M3.75 6.5C3.75 5.53 4.74 4.75 5.97 4.75H15.94V8.25H5.97C4.75 8.25 3.75 7.47 3.75 6.5Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.35 11.64H14.04V14.81H19.35V11.64Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),T.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.9304 11.64V8.25H15.1504",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),ge=()=>b(ie,{"data-testid":"payment-methods-skeleton",children:[t(E,{size:"medium",variant:"heading"}),t(E,{size:"medium",variant:"empty"}),t(E,{fullWidth:!0,size:"xlarge"}),t(E,{fullWidth:!0,size:"xlarge"})]}),ve=({UIComponentType:n="ToggleButton",busy:r,code:i,icon:h,onSelectionChange:o,selected:a,title:m})=>{const p={busy:r,className:"checkout-payment-methods__method",label:m,name:"payment-method",onChange:()=>o({code:i,title:m}),value:i};return n==="ToggleButton"?t(de,{...p,icon:h?t(Z,{source:h}):void 0,selected:a}):t(ue,{...p,checked:a,icon:h??void 0})},Me=({className:n,error:r=null,busy:i=!1,onDismissError:h,onSelectionChange:o=()=>{},options:a,paymentMethodContent:m,selection:p,title:g,UIComponentType:w})=>{const C=$({EmptyState:"Checkout.PaymentMethods.emptyState"}),k=r!==null,v=pe(null);return fe(()=>{k&&v.current&&he(v.current)},[k]),b("div",{className:L(["checkout-payment-methods",n]),"data-testid":"checkout-payment-methods",children:[g&&t(te,{className:"checkout-payment-methods__title",node:g}),!i&&a.length===0&&t(me,{"data-testid":"checkout-payment-methods-empty",icon:t(Z,{source:ke}),message:t("p",{children:C.EmptyState})}),b("div",{className:L(["checkout-payment-methods__wrapper",["checkout-payment-methods__wrapper--busy",i]]),"data-testid":"checkout-payment-methods-wrapper",children:[t("div",{className:L(["checkout-payment-methods__methods",["checkout-payment-methods--full-width",a.length%2!==0]]),children:a==null?void 0:a.map(f=>t(ve,{UIComponentType:w,busy:i,code:f.code,icon:f.icon,selected:(p==null?void 0:p.code)===f.code,title:f.displayLabel??!0?f.title:"",onSelectionChange:o},f.code))}),m&&t("div",{className:"checkout-payment-methods__content",children:m})]}),k&&t("div",{ref:v,className:"checkout-payment-methods__error","data-testid":"checkout-payment-methods-alert",children:t(le,{heading:r,type:"error",variant:"primary",onDismiss:h})})]})},Se=se(Me,ge);function W(n,r){return n?r.some(i=>i.code===n.code):!1}function Pe(n,r){return!n||!r?!1:n.code===r.code}function Ce(n){return n?!!n.code&&!!n.title:!1}const $e=({UIComponentType:n="ToggleButton",active:r=!0,autoSync:i=!0,displayTitle:h=!0,slots:o,onCartSyncError:a,onSelectionChange:m})=>{var N,O;const[p,g]=_(null),[w,C]=_(!1),[k,v]=_(null),[f,z]=_([]),l=o==null?void 0:o.Methods,q=Y.value,F=f.filter(e=>{var c;return((c=l==null?void 0:l[e.code])==null?void 0:c.enabled)!==!1}).map(e=>{const c=(l==null?void 0:l[e.code])||{};return{...e,...c}}),{cartSyncError:H,defaultTitle:B}=$({cartSyncError:"Checkout.PaymentMethods.cartSyncError",defaultTitle:"Checkout.PaymentMethods.title"}),G=P(()=>{g(null)},[]),u=P(e=>{g(null),v(e),ae({selectedPaymentMethod:e})},[]),M=P(async(e,c)=>{if(!(ne()||oe()))return;const d=l==null?void 0:l[e.code];((d==null?void 0:d.autoSync)??i)&&ce({code:e.code}).catch(y=>{u(c??null),a==null||a({method:e,error:y}),a||g(H)})},[l,i,u,a,H]),J=P(async e=>{const c=x("selectedPaymentMethod");u(e),m==null||m(e),await M(e,c)},[m,u,M]),S=P(e=>{if(!e||e.isEmpty){u(null),z([]);return}const s=e.availablePaymentMethods??[];if(z(s),s.length===0){u(null);return}const d=e.selectedPaymentMethod??null,V=Ce(d),y=x("selectedPaymentMethod"),U=W(y,s),X=Pe(y,d);if(y&&U&&!X){M(y,d);return}if((!y||!U)&&V&&W(d,s)){u(d);return}if((!y||!U)&&(!V||!W(d,s))){const j=s[0];u(j),M(j)}},[u,M]);D(()=>{if(!r)return;const e=re();if(e){C(!0);const s=x("selectedPaymentMethod");s&&v(s),S(e);return}const c=R.on("checkout/initialized",s=>{C(!0),S(s)},{eager:!0});return()=>{c==null||c.off()}},[r,S]),D(()=>{if(!r)return;const e=R.on("checkout/updated",S,{eager:!1});return()=>{e==null||e.off()}},[r,S]);const I=k?(O=(N=o==null?void 0:o.Methods)==null?void 0:N[k.code])==null?void 0:O.render:null,K=I?t(A,{context:{cartId:ee.cartId??"",replaceHTML(e){this.replaceWith(e)}},name:"PaymentMethodContent",slot:I},I):void 0,Q=ye(()=>{if(h)return t(A,{name:"checkout-payment-methods-title",slot:o==null?void 0:o.Title,children:t("h2",{children:B})})},[h,o==null?void 0:o.Title,B]);return t(Se,{UIComponentType:n,busy:q,error:p,initialized:w,options:F,paymentMethodContent:K,selection:k,title:Q,visible:r,onDismissError:G,onSelectionChange:J})};export{$e as PaymentMethods,$e as default};
 //# sourceMappingURL=PaymentMethods.js.map

package/containers/PaymentMethods.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentMethods.js","sources":["../../node_modules/@adobe-commerce/elsie/src/icons/Wallet.svg","/@dropins/storefront-checkout/src/components/PaymentMethods/PaymentMethodsSkeleton.tsx","/@dropins/storefront-checkout/src/components/PaymentMethods/PaymentMethods.tsx","/@dropins/storefront-checkout/src/containers/PaymentMethods/PaymentMethods.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgWallet = (props) => /* @__PURE__ */ React.createElement(\"svg\", { width: 24, height: 24, viewBox: \"0 0 24 24\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M17.93 14.8V18.75H5.97C4.75 18.75 3.75 17.97 3.75 17V6.5M3.75 6.5C3.75 5.53 4.74 4.75 5.97 4.75H15.94V8.25H5.97C4.75 8.25 3.75 7.47 3.75 6.5Z\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }), /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M19.35 11.64H14.04V14.81H19.35V11.64Z\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }), /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M17.9304 11.64V8.25H15.1504\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgWallet;\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const PaymentMethodsSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"payment-methods-skeleton\">\n      <SkeletonRow size=\"medium\" variant=\"heading\" />\n      <SkeletonRow size=\"medium\" variant=\"empty\" />\n      <SkeletonRow fullWidth={true} size=\"xlarge\" />\n      <SkeletonRow fullWidth={true} size=\"xlarge\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper/ConditionalWrapper';\nimport '@/checkout/components/PaymentMethods/PaymentMethods.css';\nimport { PaymentMethodsSkeleton } from '@/checkout/components/PaymentMethods/PaymentMethodsSkeleton';\nimport { PaymentMethodConfig } from '@/checkout/containers';\nimport { PaymentMethod } from '@/checkout/data/models/payment-method';\nimport { scrollToElement } from '@/checkout/lib';\nimport { UIComponentType } from '@/checkout/types/ComponentTypes';\nimport {\n  Icon,\n  IllustratedMessage,\n  InLineAlert,\n  RadioButton,\n  ToggleButton,\n} from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Wallet } from '@adobe-commerce/elsie/icons';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useEffect, useRef } from 'preact/compat';\n\ninterface ExtendedPaymentMethod extends PaymentMethodConfig, PaymentMethod {}\n\nexport interface PaymentMethodsProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  error?: string | null;\n  busy?: boolean;\n  onDismissError?: () => void;\n  onSelectionChange?: (value: PaymentMethod) => void;\n  options?: ExtendedPaymentMethod[];\n  paymentMethodContent?: VNode;\n  selection: PaymentMethod | null;\n  title?: VNode;\n  UIComponentType?: UIComponentType;\n}\n\ninterface PaymentOptionProps {\n  UIComponentType?: UIComponentType;\n  busy?: boolean;\n  code: string;\n  icon?: string;\n  onSelectionChange: (value: PaymentMethod) => void;\n  selected: boolean;\n  title: string;\n}\n\nconst PaymentOption: FunctionComponent<PaymentOptionProps> = ({\n  UIComponentType = 'ToggleButton',\n  busy,\n  code,\n  icon,\n  onSelectionChange,\n  selected,\n  title,\n}) => {\n  const commonProps = {\n    busy,\n    className: 'checkout-payment-methods__method',\n    label: title,\n    name: 'payment-method',\n    onChange: () => onSelectionChange({ code, title }),\n    value: code,\n  };\n\n  return UIComponentType === 'ToggleButton' ? (\n    <ToggleButton\n      {...commonProps}\n      // @ts-ignore\n      icon={icon ? <Icon source={icon} /> : undefined}\n      selected={selected}\n    />\n  ) : (\n    <RadioButton {...commonProps} checked={selected} icon={icon ?? undefined} />\n  );\n};\n\nconst PaymentMethodsComponent: FunctionComponent<PaymentMethodsProps> = ({\n  className,\n  error = null,\n  busy = false,\n  onDismissError,\n  onSelectionChange = () => {},\n  options,\n  paymentMethodContent,\n  selection,\n  title,\n  UIComponentType,\n}) => {\n  const translations = useText({\n    EmptyState: 'Checkout.PaymentMethods.emptyState',\n  });\n\n  const hasError = error !== null;\n  const errorRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (hasError && errorRef.current) {\n      scrollToElement(errorRef.current);\n    }\n  }, [hasError]);\n\n  return (\n    <div\n      className={classes(['checkout-payment-methods', className])}\n      data-testid=\"checkout-payment-methods\"\n    >\n      {title && (\n        <VComponent className=\"checkout-payment-methods__title\" node={title} />\n      )}\n\n      {!busy && options!.length === 0 && (\n        <IllustratedMessage\n          data-testid=\"checkout-payment-methods-empty\"\n          icon={<Icon source={Wallet} />}\n          message={<p>{translations.EmptyState}</p>}\n        />\n      )}\n\n      <div\n        className={classes([\n          'checkout-payment-methods__wrapper',\n          ['checkout-payment-methods__wrapper--busy', busy],\n        ])}\n        data-testid=\"checkout-payment-methods-wrapper\"\n      >\n        <div\n          className={classes([\n            'checkout-payment-methods__methods',\n            ['checkout-payment-methods--full-width', options!.length % 2 !== 0],\n          ])}\n        >\n          {options?.map((method) => (\n            <PaymentOption\n              key={method.code}\n              UIComponentType={UIComponentType}\n              busy={busy}\n              code={method.code}\n              icon={method.icon}\n              selected={selection?.code === method.code}\n              title={method.displayLabel ?? true ? method.title : ''}\n              onSelectionChange={onSelectionChange}\n            />\n          ))}\n        </div>\n\n        {paymentMethodContent && (\n          <div className=\"checkout-payment-methods__content\">\n            {paymentMethodContent}\n          </div>\n        )}\n      </div>\n\n      {hasError && (\n        <div\n          ref={errorRef}\n          className=\"checkout-payment-methods__error\"\n          data-testid=\"checkout-payment-methods-alert\"\n        >\n          <InLineAlert\n            heading={error}\n            type=\"error\"\n            variant=\"primary\"\n            onDismiss={onDismissError}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport const PaymentMethods = WithConditionals(\n  PaymentMethodsComponent,\n  PaymentMethodsSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { setPaymentMethod } from '@/checkout/api';\nimport { PaymentMethods as PaymentMethodsComponent } from '@/checkout/components/PaymentMethods/PaymentMethods';\nimport { Cart } from '@/checkout/data/models/cart';\nimport { PaymentMethod } from '@/checkout/data/models/payment-method';\nimport {\n  getLatestCheckoutUpdate,\n  getValue,\n  hasShippingAddress,\n  isVirtualCart,\n  notifyValues,\n} from '@/checkout/lib';\nimport { hasPendingCartUpdates } from '@/checkout/lib/enqueueRequest';\nimport { state } from '@/checkout/lib/state';\nimport { UIComponentType } from '@/checkout/types/ComponentTypes';\nimport { TitleProps } from '@/checkout/types/TitleProps';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { HTMLAttributes } from 'preact/compat';\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\n\nexport interface PaymentMethodRenderCtx {\n  cartId: string;\n  replaceHTML: (domElement: HTMLElement) => void;\n}\n\nexport interface PaymentMethodConfig {\n  displayLabel?: boolean;\n  enabled?: boolean;\n  icon?: string;\n  autoSync?: boolean;\n  render?: SlotProps<PaymentMethodRenderCtx>;\n}\n\nexport interface PaymentMethodsSlot {\n  [code: string]: PaymentMethodConfig;\n}\n\ninterface CartSyncError {\n  method: PaymentMethod;\n  error: Error;\n}\n\nexport interface PaymentMethodsProps\n  extends HTMLAttributes<HTMLDivElement>,\n    TitleProps {\n  slots?: {\n    Methods?: PaymentMethodsSlot;\n  } & TitleProps['slots'];\n  UIComponentType?: UIComponentType;\n  active?: boolean;\n  autoSync?: boolean;\n  onCartSyncError?: (error: CartSyncError) => void;\n  onSelectionChange?: (method: PaymentMethod) => void;\n}\n\nfunction isValidSelection(\n  selection: PaymentMethod | null,\n  options: PaymentMethod[]\n) {\n  if (!selection) return false;\n  return options.some((option) => option.code === selection.code);\n}\n\nfunction isEqual(a: PaymentMethod | null, b: PaymentMethod | null) {\n  if (!a || !b) return false;\n  return a.code === b.code;\n}\n\nfunction isValidPaymentMethod(method: PaymentMethod | null) {\n  if (!method) return false;\n  return !!method.code && !!method.title;\n}\n\nexport const PaymentMethods: Container<PaymentMethodsProps> = ({\n  UIComponentType = 'ToggleButton',\n  active = true,\n  autoSync = true,\n  displayTitle = true,\n  slots,\n  onCartSyncError,\n  onSelectionChange,\n}) => {\n  const [error, setError] = useState<string | null>(null);\n  const [isInitialized, setIsInitialized] = useState(false);\n  const [selection, setSelection] = useState<PaymentMethod | null>(null);\n  const [options, setOptions] = useState<PaymentMethod[]>([]);\n  const slotMethods = slots?.Methods;\n  const hasPendingUpdates = hasPendingCartUpdates.value;\n\n  const enabledOptions = options\n    .filter((method) => {\n      return slotMethods?.[method.code]?.enabled !== false;\n    })\n    .map((method) => {\n      const slotMethod = slotMethods?.[method.code] || {};\n\n      return {\n        ...method,\n        ...slotMethod,\n      };\n    });\n\n  const { cartSyncError, defaultTitle } = useText({\n    cartSyncError: 'Checkout.PaymentMethods.cartSyncError',\n    defaultTitle: 'Checkout.PaymentMethods.title',\n  });\n\n  const handleDismissError = useCallback(() => {\n    setError(null);\n  }, []);\n\n  const setUserSelection = useCallback((selection: PaymentMethod | null) => {\n    setError(null);\n    setSelection(selection);\n    notifyValues({ selectedPaymentMethod: selection });\n  }, []);\n\n  const setUserSelectionOnCart = useCallback(\n    async (selection: PaymentMethod, fallback?: PaymentMethod | null) => {\n      const canSetUserSelectionOnCart = isVirtualCart() || hasShippingAddress();\n      if (!canSetUserSelectionOnCart) return;\n\n      const methodConfig = slotMethods?.[selection.code];\n      const shouldAutoSync = methodConfig?.autoSync ?? autoSync;\n\n      if (!shouldAutoSync) return;\n\n      setPaymentMethod({ code: selection.code }).catch((error) => {\n        setUserSelection(fallback ?? null);\n        onCartSyncError?.({ method: selection, error });\n\n        if (!onCartSyncError) {\n          setError(cartSyncError);\n        }\n      });\n    },\n    [slotMethods, autoSync, setUserSelection, onCartSyncError, cartSyncError]\n  );\n\n  const handleSelectionChange = useCallback(\n    async (selection: PaymentMethod) => {\n      const prevSelection = getValue('selectedPaymentMethod');\n\n      setUserSelection(selection);\n      onSelectionChange?.(selection);\n\n      await setUserSelectionOnCart(selection, prevSelection);\n    },\n    [onSelectionChange, setUserSelection, setUserSelectionOnCart]\n  );\n\n  const handleCheckoutData = useCallback(\n    (data: Cart | null) => {\n      const isEmptyCart = !data || data.isEmpty;\n\n      if (isEmptyCart) {\n        setUserSelection(null);\n        setOptions([]);\n        return;\n      }\n\n      const availableOptions = data.availablePaymentMethods ?? [];\n      setOptions(availableOptions);\n\n      if (availableOptions.length === 0) {\n        setUserSelection(null);\n        return;\n      }\n\n      const cartSelection = data.selectedPaymentMethod ?? null;\n      const hasCartSelection = isValidPaymentMethod(cartSelection);\n      const userSelection = getValue('selectedPaymentMethod');\n      const isAvailable = isValidSelection(userSelection, availableOptions);\n      const haveSameSelection = isEqual(userSelection, cartSelection);\n\n      // User has valid selection that differs from cart\n      if (userSelection && isAvailable && !haveSameSelection) {\n        setUserSelectionOnCart(userSelection, cartSelection);\n        return;\n      }\n\n      // User has invalid selection but cart has valid selection\n      if ((!userSelection || !isAvailable) && hasCartSelection) {\n        setUserSelection(cartSelection);\n        return;\n      }\n\n      // Neither user nor cart has valid selection\n      if ((!userSelection || !isAvailable) && !hasCartSelection) {\n        const newSelection = availableOptions[0];\n        setUserSelection(newSelection);\n        setUserSelectionOnCart(newSelection);\n      }\n    },\n    [setUserSelection, setUserSelectionOnCart]\n  );\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      setIsInitialized(true);\n      // When component becomes active, restore key state so handleCheckoutData can work properly\n      const userSelection = getValue('selectedPaymentMethod');\n      if (userSelection) {\n        setSelection(userSelection);\n      }\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      (data: Cart | null) => {\n        setIsInitialized(true);\n        handleCheckoutData(data);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const selectedPaymentMethodHandler = selection\n    ? slots?.Methods?.[selection.code]?.render\n    : null;\n\n  const paymentMethodContent = selectedPaymentMethodHandler ? (\n    <Slot\n      key={selectedPaymentMethodHandler}\n      context={{\n        cartId: state.cartId ?? '',\n        replaceHTML(domElement: HTMLElement) {\n          this.replaceWith(domElement);\n        },\n      }}\n      name=\"PaymentMethodContent\"\n      slot={selectedPaymentMethodHandler}\n    />\n  ) : undefined;\n\n  const titleContent = useMemo(() => {\n    if (!displayTitle) return undefined;\n\n    return (\n      <Slot name=\"checkout-payment-methods-title\" slot={slots?.Title}>\n        <h2>{defaultTitle}</h2>\n      </Slot>\n    );\n  }, [displayTitle, slots?.Title, defaultTitle]);\n\n  return (\n    <PaymentMethodsComponent\n      UIComponentType={UIComponentType}\n      busy={hasPendingUpdates}\n      error={error}\n      initialized={isInitialized}\n      options={enabledOptions}\n      paymentMethodContent={paymentMethodContent}\n      selection={selection}\n      title={titleContent}\n      visible={active}\n      onDismissError={handleDismissError}\n      onSelectionChange={handleSelectionChange}\n    />\n  );\n};\n"],"names":["SvgWallet","props","React","PaymentMethodsSkeleton","jsxs","Skeleton","jsx","SkeletonRow","PaymentOption","UIComponentType","busy","code","icon","onSelectionChange","selected","title","commonProps","ToggleButton","Icon","RadioButton","PaymentMethodsComponent","className","error","onDismissError","options","paymentMethodContent","selection","translations","useText","hasError","errorRef","useRef","useEffect","scrollToElement","classes","VComponent","IllustratedMessage","Wallet","method","InLineAlert","PaymentMethods","WithConditionals","isValidSelection","option","isEqual","a","b","isValidPaymentMethod","active","autoSync","displayTitle","slots","onCartSyncError","setError","useState","isInitialized","setIsInitialized","setSelection","setOptions","slotMethods","hasPendingUpdates","hasPendingCartUpdates","enabledOptions","_a","slotMethod","cartSyncError","defaultTitle","handleDismissError","useCallback","setUserSelection","notifyValues","setUserSelectionOnCart","fallback","isVirtualCart","hasShippingAddress","methodConfig","setPaymentMethod","handleSelectionChange","prevSelection","getValue","handleCheckoutData","data","availableOptions","cartSelection","hasCartSelection","userSelection","isAvailable","haveSameSelection","newSelection","pastUpdate","getLatestCheckoutUpdate","onCheckoutInit","events","onCheckoutUpdated","selectedPaymentMethodHandler","_b","Slot","state","domElement","titleContent","useMemo"],"mappings":"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","x_google_ignoreList":[0]}
+{"version":3,"file":"PaymentMethods.js","sources":["../../node_modules/@adobe-commerce/elsie/src/icons/Wallet.svg","/@dropins/storefront-checkout/src/components/PaymentMethods/PaymentMethodsSkeleton.tsx","/@dropins/storefront-checkout/src/components/PaymentMethods/PaymentMethods.tsx","/@dropins/storefront-checkout/src/containers/PaymentMethods/PaymentMethods.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgWallet = (props) => /* @__PURE__ */ React.createElement(\"svg\", { width: 24, height: 24, viewBox: \"0 0 24 24\", fill: \"none\", xmlns: \"http://www.w3.org/2000/svg\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M17.93 14.8V18.75H5.97C4.75 18.75 3.75 17.97 3.75 17V6.5M3.75 6.5C3.75 5.53 4.74 4.75 5.97 4.75H15.94V8.25H5.97C4.75 8.25 3.75 7.47 3.75 6.5Z\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }), /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M19.35 11.64H14.04V14.81H19.35V11.64Z\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }), /* @__PURE__ */ React.createElement(\"path\", { vectorEffect: \"non-scaling-stroke\", d: \"M17.9304 11.64V8.25H15.1504\", stroke: \"currentColor\", strokeWidth: 1, strokeLinecap: \"round\", strokeLinejoin: \"round\" }));\nexport default SvgWallet;\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { Skeleton, SkeletonRow } from '@adobe-commerce/elsie/components';\nimport { FunctionComponent } from 'preact';\n\nexport const PaymentMethodsSkeleton: FunctionComponent = () => {\n  return (\n    <Skeleton data-testid=\"payment-methods-skeleton\">\n      <SkeletonRow size=\"medium\" variant=\"heading\" />\n      <SkeletonRow size=\"medium\" variant=\"empty\" />\n      <SkeletonRow fullWidth={true} size=\"xlarge\" />\n      <SkeletonRow fullWidth={true} size=\"xlarge\" />\n    </Skeleton>\n  );\n};\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { WithConditionals } from '@/checkout/components/ConditionalWrapper/ConditionalWrapper';\nimport '@/checkout/components/PaymentMethods/PaymentMethods.css';\nimport { PaymentMethodsSkeleton } from '@/checkout/components/PaymentMethods/PaymentMethodsSkeleton';\nimport { PaymentMethodConfig } from '@/checkout/containers';\nimport { PaymentMethod } from '@/checkout/data/models/payment-method';\nimport { scrollToElement } from '@/checkout/lib';\nimport { UIComponentType } from '@/checkout/types';\nimport {\n  Icon,\n  IllustratedMessage,\n  InLineAlert,\n  RadioButton,\n  ToggleButton,\n} from '@adobe-commerce/elsie/components';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Wallet } from '@adobe-commerce/elsie/icons';\nimport { classes, VComponent } from '@adobe-commerce/elsie/lib';\nimport { FunctionComponent, VNode } from 'preact';\nimport { HTMLAttributes, useEffect, useRef } from 'preact/compat';\n\ninterface ExtendedPaymentMethod extends PaymentMethodConfig, PaymentMethod {}\n\nexport interface PaymentMethodsProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  error?: string | null;\n  busy?: boolean;\n  onDismissError?: () => void;\n  onSelectionChange?: (value: PaymentMethod) => void;\n  options?: ExtendedPaymentMethod[];\n  paymentMethodContent?: VNode;\n  selection: PaymentMethod | null;\n  title?: VNode;\n  UIComponentType?: UIComponentType;\n}\n\ninterface PaymentOptionProps {\n  UIComponentType?: UIComponentType;\n  busy?: boolean;\n  code: string;\n  icon?: string;\n  onSelectionChange: (value: PaymentMethod) => void;\n  selected: boolean;\n  title: string;\n}\n\nconst PaymentOption: FunctionComponent<PaymentOptionProps> = ({\n  UIComponentType = 'ToggleButton',\n  busy,\n  code,\n  icon,\n  onSelectionChange,\n  selected,\n  title,\n}) => {\n  const commonProps = {\n    busy,\n    className: 'checkout-payment-methods__method',\n    label: title,\n    name: 'payment-method',\n    onChange: () => onSelectionChange({ code, title }),\n    value: code,\n  };\n\n  return UIComponentType === 'ToggleButton' ? (\n    <ToggleButton\n      {...commonProps}\n      // @ts-ignore\n      icon={icon ? <Icon source={icon} /> : undefined}\n      selected={selected}\n    />\n  ) : (\n    <RadioButton {...commonProps} checked={selected} icon={icon ?? undefined} />\n  );\n};\n\nconst PaymentMethodsComponent: FunctionComponent<PaymentMethodsProps> = ({\n  className,\n  error = null,\n  busy = false,\n  onDismissError,\n  onSelectionChange = () => {},\n  options,\n  paymentMethodContent,\n  selection,\n  title,\n  UIComponentType,\n}) => {\n  const translations = useText({\n    EmptyState: 'Checkout.PaymentMethods.emptyState',\n  });\n\n  const hasError = error !== null;\n  const errorRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (hasError && errorRef.current) {\n      scrollToElement(errorRef.current);\n    }\n  }, [hasError]);\n\n  return (\n    <div\n      className={classes(['checkout-payment-methods', className])}\n      data-testid=\"checkout-payment-methods\"\n    >\n      {title && (\n        <VComponent className=\"checkout-payment-methods__title\" node={title} />\n      )}\n\n      {!busy && options!.length === 0 && (\n        <IllustratedMessage\n          data-testid=\"checkout-payment-methods-empty\"\n          icon={<Icon source={Wallet} />}\n          message={<p>{translations.EmptyState}</p>}\n        />\n      )}\n\n      <div\n        className={classes([\n          'checkout-payment-methods__wrapper',\n          ['checkout-payment-methods__wrapper--busy', busy],\n        ])}\n        data-testid=\"checkout-payment-methods-wrapper\"\n      >\n        <div\n          className={classes([\n            'checkout-payment-methods__methods',\n            ['checkout-payment-methods--full-width', options!.length % 2 !== 0],\n          ])}\n        >\n          {options?.map((method) => (\n            <PaymentOption\n              key={method.code}\n              UIComponentType={UIComponentType}\n              busy={busy}\n              code={method.code}\n              icon={method.icon}\n              selected={selection?.code === method.code}\n              title={method.displayLabel ?? true ? method.title : ''}\n              onSelectionChange={onSelectionChange}\n            />\n          ))}\n        </div>\n\n        {paymentMethodContent && (\n          <div className=\"checkout-payment-methods__content\">\n            {paymentMethodContent}\n          </div>\n        )}\n      </div>\n\n      {hasError && (\n        <div\n          ref={errorRef}\n          className=\"checkout-payment-methods__error\"\n          data-testid=\"checkout-payment-methods-alert\"\n        >\n          <InLineAlert\n            heading={error}\n            type=\"error\"\n            variant=\"primary\"\n            onDismiss={onDismissError}\n          />\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport const PaymentMethods = WithConditionals(\n  PaymentMethodsComponent,\n  PaymentMethodsSkeleton\n);\n","/********************************************************************\n * ADOBE CONFIDENTIAL\n * __________________\n *\n *  Copyright 2024 Adobe\n *  All Rights Reserved.\n *\n * NOTICE:  All information contained herein is, and remains\n * the property of Adobe and its suppliers, if any. The intellectual\n * and technical concepts contained herein are proprietary to Adobe\n * and its suppliers and are protected by all applicable intellectual\n * property laws, including trade secret and copyright laws.\n * Dissemination of this information or reproduction of this material\n * is strictly forbidden unless prior written permission is obtained\n * from Adobe.\n *******************************************************************/\n\nimport { setPaymentMethod } from '@/checkout/api';\nimport { PaymentMethods as PaymentMethodsComponent } from '@/checkout/components/PaymentMethods/PaymentMethods';\nimport { Cart } from '@/checkout/data/models/cart';\nimport { PaymentMethod } from '@/checkout/data/models/payment-method';\nimport { NegotiableQuote } from '@/checkout/data/models/quote';\nimport {\n  getLatestCheckoutUpdate,\n  getValue,\n  hasPendingUpdates,\n  hasShippingAddress,\n  isVirtualCart,\n  notifyValues,\n  state,\n} from '@/checkout/lib';\nimport { TitleProps, UIComponentType } from '@/checkout/types';\nimport { useText } from '@adobe-commerce/elsie/i18n';\nimport { Container, Slot, SlotProps } from '@adobe-commerce/elsie/lib';\nimport { events } from '@adobe-commerce/event-bus';\nimport { HTMLAttributes } from 'preact/compat';\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\n\nexport interface PaymentMethodRenderCtx {\n  cartId: string;\n  replaceHTML: (domElement: HTMLElement) => void;\n}\n\nexport interface PaymentMethodConfig {\n  displayLabel?: boolean;\n  enabled?: boolean;\n  icon?: string;\n  autoSync?: boolean;\n  render?: SlotProps<PaymentMethodRenderCtx>;\n}\n\nexport interface PaymentMethodsSlot {\n  [code: string]: PaymentMethodConfig;\n}\n\ninterface CartSyncError {\n  method: PaymentMethod;\n  error: Error;\n}\n\nexport interface PaymentMethodsProps\n  extends HTMLAttributes<HTMLDivElement>,\n    TitleProps {\n  slots?: {\n    Methods?: PaymentMethodsSlot;\n  } & TitleProps['slots'];\n  UIComponentType?: UIComponentType;\n  active?: boolean;\n  autoSync?: boolean;\n  onCartSyncError?: (error: CartSyncError) => void;\n  onSelectionChange?: (method: PaymentMethod) => void;\n}\n\nfunction isValidSelection(\n  selection: PaymentMethod | null,\n  options: PaymentMethod[]\n) {\n  if (!selection) return false;\n  return options.some((option) => option.code === selection.code);\n}\n\nfunction isEqual(a: PaymentMethod | null, b: PaymentMethod | null) {\n  if (!a || !b) return false;\n  return a.code === b.code;\n}\n\nfunction isValidPaymentMethod(method: PaymentMethod | null) {\n  if (!method) return false;\n  return !!method.code && !!method.title;\n}\n\nexport const PaymentMethods: Container<PaymentMethodsProps> = ({\n  UIComponentType = 'ToggleButton',\n  active = true,\n  autoSync = true,\n  displayTitle = true,\n  slots,\n  onCartSyncError,\n  onSelectionChange,\n}) => {\n  const [error, setError] = useState<string | null>(null);\n  const [isInitialized, setIsInitialized] = useState(false);\n  const [selection, setSelection] = useState<PaymentMethod | null>(null);\n  const [options, setOptions] = useState<PaymentMethod[]>([]);\n  const slotMethods = slots?.Methods;\n  const isBusy = hasPendingUpdates.value;\n\n  const enabledOptions = options\n    .filter((method) => {\n      return slotMethods?.[method.code]?.enabled !== false;\n    })\n    .map((method) => {\n      const slotMethod = slotMethods?.[method.code] || {};\n\n      return {\n        ...method,\n        ...slotMethod,\n      };\n    });\n\n  const { cartSyncError, defaultTitle } = useText({\n    cartSyncError: 'Checkout.PaymentMethods.cartSyncError',\n    defaultTitle: 'Checkout.PaymentMethods.title',\n  });\n\n  const handleDismissError = useCallback(() => {\n    setError(null);\n  }, []);\n\n  const setUserSelection = useCallback((selection: PaymentMethod | null) => {\n    setError(null);\n    setSelection(selection);\n    notifyValues({ selectedPaymentMethod: selection });\n  }, []);\n\n  const setUserSelectionOnCart = useCallback(\n    async (selection: PaymentMethod, fallback?: PaymentMethod | null) => {\n      const canSetUserSelectionOnCart = isVirtualCart() || hasShippingAddress();\n      if (!canSetUserSelectionOnCart) return;\n\n      const methodConfig = slotMethods?.[selection.code];\n      const shouldAutoSync = methodConfig?.autoSync ?? autoSync;\n\n      if (!shouldAutoSync) return;\n\n      setPaymentMethod({ code: selection.code }).catch((error) => {\n        setUserSelection(fallback ?? null);\n        onCartSyncError?.({ method: selection, error });\n\n        if (!onCartSyncError) {\n          setError(cartSyncError);\n        }\n      });\n    },\n    [slotMethods, autoSync, setUserSelection, onCartSyncError, cartSyncError]\n  );\n\n  const handleSelectionChange = useCallback(\n    async (selection: PaymentMethod) => {\n      const prevSelection = getValue('selectedPaymentMethod');\n\n      setUserSelection(selection);\n      onSelectionChange?.(selection);\n\n      await setUserSelectionOnCart(selection, prevSelection);\n    },\n    [onSelectionChange, setUserSelection, setUserSelectionOnCart]\n  );\n\n  const handleCheckoutData = useCallback(\n    (data: Cart | NegotiableQuote | null) => {\n      const isEmptyCart = !data || data.isEmpty;\n\n      if (isEmptyCart) {\n        setUserSelection(null);\n        setOptions([]);\n        return;\n      }\n\n      const availableOptions = data.availablePaymentMethods ?? [];\n      setOptions(availableOptions);\n\n      if (availableOptions.length === 0) {\n        setUserSelection(null);\n        return;\n      }\n\n      const cartSelection = data.selectedPaymentMethod ?? null;\n      const hasCartSelection = isValidPaymentMethod(cartSelection);\n      const userSelection = getValue('selectedPaymentMethod');\n      const isAvailable = isValidSelection(userSelection, availableOptions);\n      const haveSameSelection = isEqual(userSelection, cartSelection);\n\n      // User has valid selection that differs from cart\n      if (userSelection && isAvailable && !haveSameSelection) {\n        setUserSelectionOnCart(userSelection, cartSelection);\n        return;\n      }\n\n      // User has invalid selection but cart has valid selection\n      if (\n        (!userSelection || !isAvailable) &&\n        hasCartSelection &&\n        isValidSelection(cartSelection, availableOptions)\n      ) {\n        setUserSelection(cartSelection);\n        return;\n      }\n\n      // Neither user nor cart has valid selection (or both selections are unavailable)\n      if (\n        (!userSelection || !isAvailable) &&\n        (!hasCartSelection ||\n          !isValidSelection(cartSelection, availableOptions))\n      ) {\n        const newSelection = availableOptions[0];\n        setUserSelection(newSelection);\n        setUserSelectionOnCart(newSelection);\n      }\n    },\n    [setUserSelection, setUserSelectionOnCart]\n  );\n\n  useEffect(() => {\n    if (!active) return;\n\n    const pastUpdate = getLatestCheckoutUpdate();\n\n    if (pastUpdate) {\n      setIsInitialized(true);\n      // When component becomes active, restore key state so handleCheckoutData can work properly\n      const userSelection = getValue('selectedPaymentMethod');\n      if (userSelection) {\n        setSelection(userSelection);\n      }\n      handleCheckoutData(pastUpdate);\n      return;\n    }\n\n    const onCheckoutInit = events.on(\n      'checkout/initialized',\n      (data: Cart | NegotiableQuote | null) => {\n        setIsInitialized(true);\n        handleCheckoutData(data);\n      },\n      { eager: true }\n    );\n\n    return () => {\n      onCheckoutInit?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  useEffect(() => {\n    if (!active) return;\n\n    const onCheckoutUpdated = events.on(\n      'checkout/updated',\n      handleCheckoutData,\n      { eager: false }\n    );\n\n    return () => {\n      onCheckoutUpdated?.off();\n    };\n  }, [active, handleCheckoutData]);\n\n  const selectedPaymentMethodHandler = selection\n    ? slots?.Methods?.[selection.code]?.render\n    : null;\n\n  const paymentMethodContent = selectedPaymentMethodHandler ? (\n    <Slot\n      key={selectedPaymentMethodHandler}\n      context={{\n        cartId: state.cartId ?? '',\n        replaceHTML(domElement: HTMLElement) {\n          this.replaceWith(domElement);\n        },\n      }}\n      name=\"PaymentMethodContent\"\n      slot={selectedPaymentMethodHandler}\n    />\n  ) : undefined;\n\n  const titleContent = useMemo(() => {\n    if (!displayTitle) return undefined;\n\n    return (\n      <Slot name=\"checkout-payment-methods-title\" slot={slots?.Title}>\n        <h2>{defaultTitle}</h2>\n      </Slot>\n    );\n  }, [displayTitle, slots?.Title, defaultTitle]);\n\n  return (\n    <PaymentMethodsComponent\n      UIComponentType={UIComponentType}\n      busy={isBusy}\n      error={error}\n      initialized={isInitialized}\n      options={enabledOptions}\n      paymentMethodContent={paymentMethodContent}\n      selection={selection}\n      title={titleContent}\n      visible={active}\n      onDismissError={handleDismissError}\n      onSelectionChange={handleSelectionChange}\n    />\n  );\n};\n"],"names":["SvgWallet","props","React","PaymentMethodsSkeleton","jsxs","Skeleton","jsx","SkeletonRow","PaymentOption","UIComponentType","busy","code","icon","onSelectionChange","selected","title","commonProps","ToggleButton","Icon","RadioButton","PaymentMethodsComponent","className","error","onDismissError","options","paymentMethodContent","selection","translations","useText","hasError","errorRef","useRef","useEffect","scrollToElement","classes","VComponent","IllustratedMessage","Wallet","method","InLineAlert","PaymentMethods","WithConditionals","isValidSelection","option","isEqual","a","b","isValidPaymentMethod","active","autoSync","displayTitle","slots","onCartSyncError","setError","useState","isInitialized","setIsInitialized","setSelection","setOptions","slotMethods","isBusy","hasPendingUpdates","enabledOptions","_a","slotMethod","cartSyncError","defaultTitle","handleDismissError","useCallback","setUserSelection","notifyValues","setUserSelectionOnCart","fallback","isVirtualCart","hasShippingAddress","methodConfig","setPaymentMethod","handleSelectionChange","prevSelection","getValue","handleCheckoutData","data","availableOptions","cartSelection","hasCartSelection","userSelection","isAvailable","haveSameSelection","newSelection","pastUpdate","getLatestCheckoutUpdate","onCheckoutInit","events","onCheckoutUpdated","selectedPaymentMethodHandler","_b","Slot","state","domElement","titleContent","useMemo"],"mappings":"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","x_google_ignoreList":[0]}

package/containers/PlaceOrder/PlaceOrder.d.ts

@@ -6,7 +6,8 @@ export interface ContentSlotContext {
 }
 export interface HandlePlaceOrderContext {
     code: string;
-    cartId: string;
+    cartId?: string | null;
+    quoteId?: string | null;
 }
 export interface PlaceOrderProps extends HTMLAttributes<HTMLDivElement> {
     disabled?: boolean;

package/containers/PlaceOrder.js

@@ -1,4 +1,4 @@
 /*! Copyright 2025 Adobe
 All Rights Reserved. */
-import{jsxs as g,jsx as o}from"@dropins/tools/preact-jsx-runtime.js";import{W as y,g as b}from"../chunks/ConditionalWrapper.js";/* empty css                  */import{Skeleton as A,SkeletonRow as I,Button as x}from"@dropins/tools/components.js";import{classes as z,Slot as W}from"@dropins/tools/lib.js";import{I as D,U as V,h as K,s as H}from"../chunks/fetch-graphql.js";import{events as u}from"@dropins/tools/event-bus.js";import{g as U}from"../chunks/values.js";import{useState as k,useCallback as m,useEffect as f}from"@dropins/tools/preact-hooks.js";import{useText as L}from"@dropins/tools/i18n.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";var p=(e=>(e.INVALID_INPUT="INVALID_INPUT",e.SERVER_ERROR="SERVER_ERROR",e.UNAUTHENTICATED="UNAUTHENTICATED",e.UNKNOWN_ERROR="UNKNOWN_ERROR",e))(p||{});const j=["PlaceOrderError"],v=[{code:"INVALID_INPUT",matches:e=>e instanceof D},{code:"UNAUTHENTICATED",matches:e=>e instanceof V},{code:"SERVER_ERROR",matches:e=>!e||typeof e!="object"||!("name"in e)?!1:j.includes(e.name)}];function B(e){const n=v.find(s=>s.matches(e));return n?n.code:p.UNKNOWN_ERROR}const w=()=>g(A,{"data-testid":"place-order-skeleton",children:[o(I,{size:"small",variant:"empty"}),o(I,{size:"small"})]}),M=({children:e,className:n,disabled:s=!1,onClick:i})=>o("div",{className:z(["checkout-place-order",n]),children:o(x,{className:"checkout-place-order__button","data-testid":"place-order-button",disabled:s,size:"medium",type:"submit",variant:"primary",onClick:i,children:e},"placeOrder")}),Q=y(M,w),se=({disabled:e=!1,active:n=!0,handleValidation:s,handlePlaceOrder:i,slots:l,...C})=>{var h;const[S,R]=k(!1),[T,E]=k(!1),_=K.value,d=L({CheckoutUnexpectedError:"Checkout.ServerError.unexpected",placeOrderButton:"Checkout.PlaceOrder.button"}),N=m(t=>{const r=B(t),a=r===p.UNKNOWN_ERROR?d.CheckoutUnexpectedError:t.message;u.emit("checkout/error",{message:a,code:r})},[d]),P=m(async()=>{var t;try{if(s&&!s())return;await i({cartId:H.cartId,code:((t=U("selectedPaymentMethod"))==null?void 0:t.code)??""})}catch(r){N(r)}},[s,i,N]),c=m(t=>{(!t||t.isEmpty)&&E(!1)},[]);return f(()=>{if(n===!1)return;const t=u.on("cart/initialized",r=>{const a=(r==null?void 0:r.items)||[];E(a.some(O=>O.outOfStock||O.insufficientQuantity))},{eager:!0});return()=>{t==null||t.off()}},[n]),f(()=>{if(!n)return;const t=b();if(t){R(!0),c(t);return}const r=u.on("checkout/initialized",a=>{R(!0),c(a)},{eager:!0});return()=>{r==null||r.off()}},[n,c]),f(()=>{if(!n)return;const t=u.on("checkout/updated",r=>{c(r)},{eager:!1});return()=>{t==null||t.off()}},[n,c]),o(Q,{...C,disabled:e||T||_,initialized:S,visible:n,onClick:P,children:o(W,{context:{code:((h=U("selectedPaymentMethod"))==null?void 0:h.code)??""},name:"Content",slot:l==null?void 0:l.Content,children:d.placeOrderButton})})};export{se as PlaceOrder,se as default};
+import{jsxs as g,jsx as s}from"@dropins/tools/preact-jsx-runtime.js";import{W as b}from"../chunks/ConditionalWrapper.js";/* empty css                  */import{Skeleton as A,SkeletonRow as I,Button as x}from"@dropins/tools/components.js";import{classes as z,Slot as W}from"@dropins/tools/lib.js";import{I as D,U as V,h as K,s as U}from"../chunks/fetch-graphql.js";import{events as u}from"@dropins/tools/event-bus.js";import{g as H}from"../chunks/events.js";import{g as k}from"../chunks/values.js";import{useState as C,useCallback as m,useEffect as f}from"@dropins/tools/preact-hooks.js";import{useText as L}from"@dropins/tools/i18n.js";import"@dropins/tools/signals.js";import"@dropins/tools/fetch-graphql.js";var p=(e=>(e.INVALID_INPUT="INVALID_INPUT",e.SERVER_ERROR="SERVER_ERROR",e.UNAUTHENTICATED="UNAUTHENTICATED",e.UNKNOWN_ERROR="UNKNOWN_ERROR",e))(p||{});const j=["PlaceOrderError"],v=[{code:"INVALID_INPUT",matches:e=>e instanceof D},{code:"UNAUTHENTICATED",matches:e=>e instanceof V},{code:"SERVER_ERROR",matches:e=>!e||typeof e!="object"||!("name"in e)?!1:j.includes(e.name)}];function B(e){const o=v.find(n=>n.matches(e));return o?o.code:p.UNKNOWN_ERROR}const q=()=>g(A,{"data-testid":"place-order-skeleton",children:[s(I,{size:"small",variant:"empty"}),s(I,{size:"small"})]}),w=({children:e,className:o,disabled:n=!1,onClick:i})=>s("div",{className:z(["checkout-place-order",o]),children:s(x,{className:"checkout-place-order__button","data-testid":"place-order-button",disabled:n,size:"medium",type:"button",variant:"primary",onClick:i,children:e},"placeOrder")}),M=b(w,q),se=({disabled:e=!1,active:o=!0,handleValidation:n,handlePlaceOrder:i,slots:l,...S})=>{var h;const[T,R]=C(!1),[_,E]=C(!1),y=K.value,d=L({CheckoutUnexpectedError:"Checkout.ServerError.unexpected",placeOrderButton:"Checkout.PlaceOrder.button"}),N=m(t=>{const r=B(t),a=r===p.UNKNOWN_ERROR?d.CheckoutUnexpectedError:t.message;u.emit("checkout/error",{message:a,code:r})},[d]),P=m(async()=>{var t;try{if(n&&!n())return;await i({cartId:U.cartId,quoteId:U.quoteId,code:((t=k("selectedPaymentMethod"))==null?void 0:t.code)??""})}catch(r){N(r)}},[n,i,N]),c=m(t=>{(!t||"isEmpty"in t&&t.isEmpty)&&E(!1)},[]);return f(()=>{if(o===!1)return;const t=u.on("cart/initialized",r=>{const a=(r==null?void 0:r.items)||[];E(a.some(O=>O.outOfStock||O.insufficientQuantity))},{eager:!0});return()=>{t==null||t.off()}},[o]),f(()=>{if(!o)return;const t=H();if(t){R(!0),c(t);return}const r=u.on("checkout/initialized",a=>{R(!0),c(a)},{eager:!0});return()=>{r==null||r.off()}},[o,c]),f(()=>{if(!o)return;const t=u.on("checkout/updated",r=>{c(r)},{eager:!1});return()=>{t==null||t.off()}},[o,c]),s(M,{...S,disabled:e||_||y,initialized:T,visible:o,onClick:P,children:s(W,{context:{code:((h=k("selectedPaymentMethod"))==null?void 0:h.code)??""},name:"Content",slot:l==null?void 0:l.Content,children:d.placeOrderButton})})};export{se as PlaceOrder,se as default};
 //# sourceMappingURL=PlaceOrder.js.map