diff --git a/blocks/commerce-checkout/commerce-checkout.css b/blocks/commerce-checkout/commerce-checkout.css index 65e2001f95..2a4f361d75 100644 --- a/blocks/commerce-checkout/commerce-checkout.css +++ b/blocks/commerce-checkout/commerce-checkout.css @@ -1,39 +1,39 @@ /* stylelint-disable selector-class-pattern */ .checkout__content { - display: grid; - grid-template-columns: 1fr; - gap: var(--spacing-big) 0; + display: grid; + grid-template-columns: 1fr; + gap: var(--spacing-big) 0; } .checkout__main { - display: grid; - row-gap: var(--spacing-xbig); - margin-top: var(--spacing-medium); + display: grid; + row-gap: var(--spacing-xbig); + margin-top: var(--spacing-medium); } .checkout__aside { - display: grid; - gap: var(--spacing-xbig); + display: grid; + gap: var(--spacing-xbig); } /* Block dividers */ .checkout__block.checkout__heading .dropin-header-container { - gap: var(--spacing-xsmall); + gap: var(--spacing-xsmall); } .checkout__shipping-form { - padding-top: var(--spacing-xbig); - border-top: var(--shape-border-width-3) solid var(--color-neutral-400); + padding-top: var(--spacing-xbig); + border-top: var(--shape-border-width-3) solid var(--color-neutral-400); } .checkout__payment-methods { - padding-top: var(--spacing-xbig); - border-top: var(--shape-border-width-3) solid var(--color-neutral-400); + padding-top: var(--spacing-xbig); + border-top: var(--shape-border-width-3) solid var(--color-neutral-400); } /* Hide empty blocks */ .checkout__block:empty { - display: none; + display: none; } /* Hide blocks with empty divs */ @@ -41,7 +41,7 @@ .checkout__out-of-stock:has(> :empty), .checkout__delivery:has(> :empty), .checkout__bill-to-shipping:has(> :empty) { - display: none; + display: none; } /* Hide main containers when the cart is empty or there is a server error */ @@ -60,124 +60,124 @@ .checkout__content--empty .checkout__delivery, .checkout__content--empty .checkout__payment-methods, .checkout__content--empty .checkout__billing-form { - display: none !important; + display: none !important; } /* Hide aside containers when the cart is empty or there is a server error */ .checkout__content--error .checkout__aside, .checkout__content--empty .checkout__aside { - display: none; + display: none; } /* Integrate place order button into Order Summary - mobile */ .checkout__place-order { - grid-column: unset; - justify-items: unset; - margin-top: calc(var(--spacing-big) * -1); + grid-column: unset; + justify-items: unset; + margin-top: calc(var(--spacing-big) * -1); } /* Hide the place order button when the cart is empty or there is a server error */ .checkout__content--error .checkout__place-order, .checkout__content--empty .checkout__place-order { - display: none; + display: none; } .checkout__loader { - align-items: center; - background: var(--color-neutral-50); - display: flex; - height: 100vh; - justify-content: center; - left: 0; - opacity: 0.5; - position: fixed; - top: 0; - width: 100%; - z-index: 9999; + align-items: center; + background: var(--color-neutral-50); + display: flex; + height: 100vh; + justify-content: center; + left: 0; + opacity: 0.5; + position: fixed; + top: 0; + width: 100%; + z-index: 9999; } .checkout__loader:empty { - display: none; + display: none; } .checkout__error-banner, .checkout__merged-cart-banner { - grid-column: 1; + grid-column: 1; } /* remove margin from the heading divider */ .checkout__heading .dropin-divider { - margin: 0; + margin: 0; } /* Cart Summary */ .checkout__block .cart-cart-summary-list { - padding: var(--spacing-medium); + padding: var(--spacing-medium); } /* Order Summary Coupon */ .dropin-accordion-section__heading { - margin: var(--spacing-medium) auto; + margin: var(--spacing-medium) auto; } .cart-coupons__accordion { - margin-top: var(--spacing-xsmall); + margin-top: var(--spacing-xsmall); } /* temporary fix to hide the default cart heading */ [data-testid='default-cart-heading'] { - display: none; + display: none; } .cart-summary-list__heading { - display: flex; - justify-content: space-between; + display: flex; + justify-content: space-between; } .cart-summary-list__heading-text { - font: var(--type-headline-2-strong-font); - letter-spacing: var(--type-headline-2-strong-letter-spacing); - color: var(--color-neutral-800); + font: var(--type-headline-2-strong-font); + letter-spacing: var(--type-headline-2-strong-letter-spacing); + color: var(--color-neutral-800); } .cart-cart-summary-list__heading { - row-gap: var(--spacing-small); - padding-top: 0; + row-gap: var(--spacing-small); + padding-top: 0; } .cart-cart-summary-list__heading-text { - font: var(--type-headline-2-strong-font); - letter-spacing: var(--type-headline-2-strong-letter-spacing); - color: var(--color-neutral-800); + font: var(--type-headline-2-strong-font); + letter-spacing: var(--type-headline-2-strong-letter-spacing); + color: var(--color-neutral-800); } .cart-summary-list__edit { - font: var(--type-body-2-strong-font); - letter-spacing: var(--type-body-2-strong-letter-spacing); + font: var(--type-body-2-strong-font); + letter-spacing: var(--type-body-2-strong-letter-spacing); } .checkout__block -.cart-cart-summary-list -.cart-cart-summary-list__footer-divider { - margin: var(--spacing-small) 0; + .cart-cart-summary-list + .cart-cart-summary-list__footer-divider { + margin: var(--spacing-small) 0; } /* Sign-in modal */ #modal { - position: fixed; - top: 0; - left: 0; - width: 100%; - height: 100%; - background-color: rgb(0 0 0 / 50%); - display: flex; - justify-content: center; - align-items: center; - z-index: 2; + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: rgb(0 0 0 / 50%); + display: flex; + justify-content: center; + align-items: center; + z-index: 2; } #modal-form { - width: 800px; + width: 800px; } /* Address form */ @@ -185,127 +185,127 @@ .checkout__shipping-form .dropin-header-container__title, .checkout__billing-form .account-address-form-wrapper__title, .checkout__billing-form .dropin-header-container__title { - font: var(--type-headline-2-default-font); - letter-spacing: var(--type-headline-2-default-letter-spacing); - color: var(--color-neutral-800); - margin: 0 0 var(--spacing-medium) 0; + font: var(--type-headline-2-default-font); + letter-spacing: var(--type-headline-2-default-letter-spacing); + color: var(--color-neutral-800); + margin: 0 0 var(--spacing-medium) 0; } .checkout__shipping-form .dropin-header-container .dropin-divider, .checkout__billing-form .dropin-header-container .dropin-divider { - display: none; + display: none; } /* Order confirmation */ .order-confirmation { - display: grid; - align-items: start; - grid-template-columns: repeat(var(--grid-4-columns), 1fr); - grid-template-areas: 'main aside'; - grid-column-gap: var(--grid-4-gutters); - margin-bottom: var(--spacing-xbig); - padding-top: var(--spacing-xxlarge); + display: grid; + align-items: start; + grid-template-columns: repeat(var(--grid-4-columns), 1fr); + grid-template-areas: 'main aside'; + grid-column-gap: var(--grid-4-gutters); + margin-bottom: var(--spacing-xbig); + padding-top: var(--spacing-xxlarge); } .order-confirmation__main { - display: grid; - grid-row-gap: var(--spacing-xbig); - grid-column: 1 / span 7; + display: grid; + grid-row-gap: var(--spacing-xbig); + grid-column: 1 / span 7; } .order-confirmation__aside { - display: grid; - grid-row-gap: var(--spacing-xbig); - grid-column: 9 / span 4; + display: grid; + grid-row-gap: var(--spacing-xbig); + grid-column: 9 / span 4; } .order-confirmation__footer { - display: grid; - gap: var(--spacing-small); - text-align: center; + display: grid; + gap: var(--spacing-small); + text-align: center; } .order-confirmation__footer p { - margin: 0; + margin: 0; } .order-confirmation__footer .order-confirmation-footer__continue-button { - margin: 0 auto; - text-align: center; - display: inline-block; + margin: 0 auto; + text-align: center; + display: inline-block; } .order-confirmation-footer__contact-support { - font: var(--type-body-2-default-font); - letter-spacing: var(--type-body-2-default-letter-spacing); - color: var(--color-neutral-700); + font: var(--type-body-2-default-font); + letter-spacing: var(--type-body-2-default-letter-spacing); + color: var(--color-neutral-700); } .order-confirmation-footer__contact-support a { - font: var(--type-body-2-strong-font); - letter-spacing: var(--type-body-2-strong-letter-spacing); - color: var(--color-brand-500); - cursor: pointer; + font: var(--type-body-2-strong-font); + letter-spacing: var(--type-body-2-strong-letter-spacing); + color: var(--color-brand-500); + cursor: pointer; } /* Hide empty blocks */ .order-confirmation__block:empty { - display: none; + display: none; } @media only screen and (width >= 320px) and (width <= 768px) { - .order-confirmation { - grid-template-columns: repeat(var(--grid-1-columns), 1fr); - padding-top: 0; - } + .order-confirmation { + grid-template-columns: repeat(var(--grid-1-columns), 1fr); + padding-top: 0; + } - .order-confirmation__main, - .order-confirmation__aside { - grid-row-gap: var(--spacing-medium); - } + .order-confirmation__main, + .order-confirmation__aside { + grid-row-gap: var(--spacing-medium); + } - .order-confirmation > div { - grid-column: 1 / span 4; - } + .order-confirmation > div { + grid-column: 1 / span 4; + } - .order-confirmation__block .dropin-card { - border: 0; - } + .order-confirmation__block .dropin-card { + border: 0; + } } @media only screen and (width >= 768px) { - .checkout__content { - display: grid; - align-items: start; - grid-template-columns: repeat(var(--grid-4-columns), 1fr); - gap: var(--spacing-big) var(--grid-4-gutters); - } - - .checkout__content--error, - .checkout__content--empty { - display: grid; - grid-template-columns: 1fr; - } - - .checkout__main { - grid-column: 1 / span 7; - row-gap: var(--spacing-xbig); - } - - .checkout__aside { - grid-column: 9 / span 4; - gap: var(--spacing-xbig); - } - - .checkout__error-banner, - .checkout__merged-cart-banner { - display: grid; - grid-column: 1 / span 12; - } - - .checkout__place-order { - display: grid; - grid-column: 1 / span 7; - margin-top: 0; - } + .checkout__content { + display: grid; + align-items: start; + grid-template-columns: repeat(var(--grid-4-columns), 1fr); + gap: var(--spacing-big) var(--grid-4-gutters); + } + + .checkout__content--error, + .checkout__content--empty { + display: grid; + grid-template-columns: 1fr; + } + + .checkout__main { + grid-column: 1 / span 7; + row-gap: var(--spacing-xbig); + } + + .checkout__aside { + grid-column: 9 / span 4; + gap: var(--spacing-xbig); + } + + .checkout__error-banner, + .checkout__merged-cart-banner { + display: grid; + grid-column: 1 / span 12; + } + + .checkout__place-order { + display: grid; + grid-column: 1 / span 7; + margin-top: 0; + } } diff --git a/blocks/commerce-checkout/commerce-checkout.js b/blocks/commerce-checkout/commerce-checkout.js index fdad61cc5f..6db82342a8 100644 --- a/blocks/commerce-checkout/commerce-checkout.js +++ b/blocks/commerce-checkout/commerce-checkout.js @@ -7,7 +7,6 @@ // Dropin Tools import { events } from '@dropins/tools/event-bus.js'; import { initializers } from '@dropins/tools/initializer.js'; -import { debounce } from '@dropins/tools/lib.js'; // Dropin Components import { @@ -65,16 +64,57 @@ import { getUserTokenCookie } from '../../scripts/initializers/index.js'; import createModal from '../modal/modal.js'; import { - getCartAddress, + estimateShippingCost, getCartAddress, scrollToElement, setAddressOnCart, } from '../../scripts/checkout.js'; +function createMetaTag(property, content, type) { + if (!property || !type) { + return; + } + let meta = document.head.querySelector(`meta[${type}="${property}"]`); + if (meta) { + if (!content) { + meta.remove(); + return; + } + meta.setAttribute(type, property); + meta.setAttribute('content', content); + return; + } + if (!content) { + return; + } + meta = document.createElement('meta'); + meta.setAttribute(type, property); + meta.setAttribute('content', content); + document.head.appendChild(meta); +} + +function setMetaTags(dropin) { + createMetaTag('title', dropin); + createMetaTag('description', dropin); + createMetaTag('keywords', dropin); + + createMetaTag('og:description', dropin); + createMetaTag('og:title', dropin); + createMetaTag('og:url', window.location.href, 'property'); +} + export default async function decorate(block) { // Initializers import('../../scripts/initializers/account.js'); import('../../scripts/initializers/checkout.js'); + setMetaTags('Checkout'); + document.title = 'Checkout'; + + events.on('checkout/order', () => { + setMetaTags('Order Confirmation'); + document.title = 'Order Confirmation'; + }); + const DEBOUNCE_TIME = 1000; const LOGIN_FORM_NAME = 'login-form'; const SHIPPING_FORM_NAME = 'selectedShippingAddress'; @@ -194,7 +234,7 @@ export default async function decorate(block) { billingFormSkeleton, _orderSummary, _cartSummary, - _placeOrder, + placeOrder, ] = await Promise.all([ CheckoutProvider.render(MergedCartBanner)($mergedCartBanner), @@ -423,21 +463,22 @@ export default async function decorate(block) { sessionStorage.removeItem(SHIPPING_ADDRESS_DATA_KEY); } - // when shipping address form is empty - if (!cartShippingAddress) { - checkoutApi.estimateShippingMethods(); - - events.emit('checkout/estimate-shipping-address', { - address: {}, - isValid: false, - }); - } - shippingFormSkeleton.remove(); - let prevEstimateShippingData = {}; let isFirstRenderShipping = true; const hasCartShippingAddress = Boolean(data.shippingAddresses?.[0]); + + const setShippingAddressOnCart = setAddressOnCart({ + api: checkoutApi.setShippingAddress, + debounceMs: DEBOUNCE_TIME, + placeOrderBtn: placeOrder, + }); + + const estimateShippingCostOnCart = estimateShippingCost({ + api: checkoutApi.estimateShippingMethods, + debounceMs: DEBOUNCE_TIME, + }); + shippingForm = await AccountProvider.render(AddressForm, { addressesFormTitle: 'Shipping address', className: 'checkout-shipping-form__address-form', @@ -448,50 +489,12 @@ export default async function decorate(block) { countryCode: storeConfig.defaultCountry, }, isOpen: true, - onChange: debounce((values) => { - if (!isFirstRenderShipping || !hasCartShippingAddress) { - setAddressOnCart(values, checkoutApi.setShippingAddress); - } - - const { data, isDataValid } = values; - + onChange: (values) => { + const syncAddress = !isFirstRenderShipping || !hasCartShippingAddress; + if (syncAddress) setShippingAddressOnCart(values); + if (!hasCartShippingAddress) estimateShippingCostOnCart(values); if (isFirstRenderShipping) isFirstRenderShipping = false; - - if (hasCartShippingAddress || isDataValid) return; - - if ( - prevEstimateShippingData.countryCode === data.countryCode - && prevEstimateShippingData.regionCode === data.region.regionCode - && prevEstimateShippingData.regionId === data.region.regionId - && prevEstimateShippingData.postcode === data.postcode - ) { - return; - } - - const criteria = { - country_code: data.countryCode, - region_name: String(data.region.regionCode || ''), - region_id: String(data.region.regionId || ''), - }; - checkoutApi.estimateShippingMethods({ criteria }); - - events.emit('checkout/estimate-shipping-address', { - address: { - country_id: data.countryCode, - region: String(data.region.regionCode || ''), - region_id: String(data.region.regionId || ''), - postcode: data.postcode, - }, - isValid: isDataValid, - }); - - prevEstimateShippingData = { - countryCode: data.countryCode, - regionCode: data.region.regionCode, - regionId: data.region.regionId, - postcode: data.postcode, - }; - }, DEBOUNCE_TIME), + }, showBillingCheckBox: false, showFormLoader: false, showShippingCheckBox: false, @@ -514,6 +517,12 @@ export default async function decorate(block) { let isFirstRenderBilling = true; const hasCartBillingAddress = Boolean(data.billingAddress); + const setBillingAddressOnCart = setAddressOnCart({ + api: checkoutApi.setBillingAddress, + debounceMs: DEBOUNCE_TIME, + placeOrderBtn: placeOrder, + }); + billingForm = await AccountProvider.render(AddressForm, { addressesFormTitle: 'Billing address', className: 'checkout-billing-form__address-form', @@ -524,13 +533,11 @@ export default async function decorate(block) { countryCode: storeConfig.defaultCountry, }, isOpen: true, - onChange: debounce((values) => { - if (!isFirstRenderBilling || !hasCartBillingAddress) { - setAddressOnCart(values, checkoutApi.setBillingAddress); - } - + onChange: (values) => { + const canSetBillingAddressOnCart = !isFirstRenderBilling || !hasCartBillingAddress; + if (canSetBillingAddressOnCart) setBillingAddressOnCart(values); if (isFirstRenderBilling) isFirstRenderBilling = false; - }, DEBOUNCE_TIME), + }, showBillingCheckBox: false, showFormLoader: false, showShippingCheckBox: false, @@ -581,6 +588,12 @@ export default async function decorate(block) { const hasCartShippingAddress = Boolean(data.shippingAddresses?.[0]); let isFirstRenderShipping = true; + const setShippingAddressOnCart = setAddressOnCart({ + api: checkoutApi.setShippingAddress, + debounceMs: DEBOUNCE_TIME, + placeOrderBtn: placeOrder, + }); + shippingAddresses = await AccountProvider.render(Addresses, { addressFormTitle: 'Deliver to new address', defaultSelectAddressId: shippingAddressId, @@ -588,13 +601,11 @@ export default async function decorate(block) { forwardFormRef: shippingFormRef, inputsDefaultValueSet, minifiedView: false, - onAddressData: debounce((values) => { - if (!isFirstRenderShipping || !hasCartShippingAddress) { - setAddressOnCart(values, checkoutApi.setShippingAddress); - } - + onAddressData: (values) => { + const canSetShippingAddressOnCart = !isFirstRenderShipping || !hasCartShippingAddress; + if (canSetShippingAddressOnCart) setShippingAddressOnCart(values); if (isFirstRenderShipping) isFirstRenderShipping = false; - }, DEBOUNCE_TIME), + }, selectable: true, selectShipping: true, showBillingCheckBox: false, @@ -631,6 +642,12 @@ export default async function decorate(block) { const hasCartBillingAddress = Boolean(data.billingAddress); let isFirstRenderBilling = true; + const setBillingAddressOnCart = setAddressOnCart({ + api: checkoutApi.setBillingAddress, + debounceMs: DEBOUNCE_TIME, + placeOrderBtn: placeOrder, + }); + billingAddresses = await AccountProvider.render(Addresses, { addressFormTitle: 'Bill to new address', defaultSelectAddressId: billingAddressId, @@ -638,13 +655,11 @@ export default async function decorate(block) { forwardFormRef: billingFormRef, inputsDefaultValueSet, minifiedView: false, - onAddressData: debounce((values) => { - if (!isFirstRenderBilling || !hasCartBillingAddress) { - setAddressOnCart(values, checkoutApi.setBillingAddress); - } - + onAddressData: (values) => { + const canSetBillingAddressOnCart = !isFirstRenderBilling || !hasCartBillingAddress; + if (canSetBillingAddressOnCart) setBillingAddressOnCart(values); if (isFirstRenderBilling) isFirstRenderBilling = false; - }, DEBOUNCE_TIME), + }, selectable: true, selectBilling: true, showBillingCheckBox: false, @@ -657,6 +672,9 @@ export default async function decorate(block) { // Define the Layout for the Order Confirmation const displayOrderConfirmation = async (orderData) => { + // Scroll to the top of the page + window.scrollTo(0, 0); + const orderConfirmationFragment = document.createRange() .createContextualFragment(`
diff --git a/package-lock.json b/package-lock.json index b38cd605a9..9dd8e1bcba 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,7 @@ "@dropins/storefront-account": "0.1.0-alpha20", "@dropins/storefront-auth": "0.0.1-alpha25", "@dropins/storefront-cart": "0.10.0", - "@dropins/storefront-checkout": "0.1.0-alpha57", + "@dropins/storefront-checkout": "0.1.0-alpha58", "@dropins/storefront-order": "0.1.0-alpha24", "@dropins/storefront-pdp": "1.0.0-beta1", "@dropins/tools": "^0.36.0" @@ -774,7 +774,9 @@ "version": "0.10.0" }, "node_modules/@dropins/storefront-checkout": { - "version": "0.1.0-alpha57" + "version": "0.1.0-alpha58", + "resolved": "https://registry.npmjs.org/@dropins/storefront-checkout/-/storefront-checkout-0.1.0-alpha58.tgz", + "integrity": "sha512-xWtgOQ7Ulv2r/dRlo5DLKbygqvV3Ay1Kj4YRbopmDytPdOFg+j8+EGI2SpIo9fz8mTniSWVjPcMSb/awiLuo+Q==" }, "node_modules/@dropins/storefront-order": { "version": "0.1.0-alpha24" diff --git a/package.json b/package.json index 98c312b5e6..ed580e45d0 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,7 @@ "@dropins/storefront-account": "0.1.0-alpha20", "@dropins/storefront-auth": "0.0.1-alpha25", "@dropins/storefront-cart": "0.10.0", - "@dropins/storefront-checkout": "0.1.0-alpha57", + "@dropins/storefront-checkout": "0.1.0-alpha58", "@dropins/storefront-order": "0.1.0-alpha24", "@dropins/storefront-pdp": "1.0.0-beta1", "@dropins/tools": "^0.36.0" diff --git a/scripts/__dropins__/storefront-checkout/chunks/Heading.js b/scripts/__dropins__/storefront-checkout/chunks/Heading.js deleted file mode 100644 index 67e4595820..0000000000 --- a/scripts/__dropins__/storefront-checkout/chunks/Heading.js +++ /dev/null @@ -1,3 +0,0 @@ -/*! Copyright 2024 Adobe -All Rights Reserved. */ -import{jsx as i}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */const m=({className:r,children:t,level:o=2})=>{const n=o>=1&&o<=6?`h${o}`:"h2";return i(n,{className:r,children:t})};export{m as H}; diff --git a/scripts/__dropins__/storefront-checkout/components/Heading/Heading.d.ts b/scripts/__dropins__/storefront-checkout/components/Heading/Heading.d.ts deleted file mode 100644 index 733c4c6602..0000000000 --- a/scripts/__dropins__/storefront-checkout/components/Heading/Heading.d.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { FunctionComponent } from 'preact'; -import { HTMLAttributes } from 'preact/compat'; - -export interface HeadingProps extends Omit, 'level'> { - level?: 1 | 2 | 3 | 4 | 5 | 6; -} -export declare const Heading: FunctionComponent; -//# sourceMappingURL=Heading.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/components/Heading/index.d.ts b/scripts/__dropins__/storefront-checkout/components/Heading/index.d.ts deleted file mode 100644 index 0ffaf58121..0000000000 --- a/scripts/__dropins__/storefront-checkout/components/Heading/index.d.ts +++ /dev/null @@ -1,19 +0,0 @@ -/******************************************************************** -* ADOBE CONFIDENTIAL -* __________________ -* -* Copyright 2024 Adobe -* All Rights Reserved. -* -* NOTICE: All information contained herein is, and remains -* the property of Adobe and its suppliers, if any. The intellectual -* and technical concepts contained herein are proprietary to Adobe -* and its suppliers and are protected by all applicable intellectual -* property laws, including trade secret and copyright laws. -* Dissemination of this information or reproduction of this material -* is strictly forbidden unless prior written permission is obtained -* from Adobe. -*******************************************************************/ -export * from './Heading'; -export { Heading as default } from './Heading'; -//# sourceMappingURL=index.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/components/OverlayLoader/OverlayLoader.d.ts b/scripts/__dropins__/storefront-checkout/components/OverlayLoader/OverlayLoader.d.ts deleted file mode 100644 index 5b5ee94199..0000000000 --- a/scripts/__dropins__/storefront-checkout/components/OverlayLoader/OverlayLoader.d.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { FunctionComponent } from 'preact'; - -export declare const OverlayLoader: FunctionComponent<{ - className?: string; -}>; -//# sourceMappingURL=OverlayLoader.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/components/OverlayLoader/index.d.ts b/scripts/__dropins__/storefront-checkout/components/OverlayLoader/index.d.ts deleted file mode 100644 index 4aa4d0433a..0000000000 --- a/scripts/__dropins__/storefront-checkout/components/OverlayLoader/index.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -/******************************************************************** -* ADOBE CONFIDENTIAL -* __________________ -* -* Copyright 2024 Adobe -* All Rights Reserved. -* -* NOTICE: All information contained herein is, and remains -* the property of Adobe and its suppliers, if any. The intellectual -* and technical concepts contained herein are proprietary to Adobe -* and its suppliers and are protected by all applicable intellectual -* property laws, including trade secret and copyright laws. -* Dissemination of this information or reproduction of this material -* is strictly forbidden unless prior written permission is obtained -* from Adobe. -*******************************************************************/ -export * from './OverlayLoader'; -//# sourceMappingURL=index.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/components/PlaceOrder/PlaceOrder.d.ts b/scripts/__dropins__/storefront-checkout/components/PlaceOrder/PlaceOrder.d.ts index 4ebcf7c808..c30c42a66f 100644 --- a/scripts/__dropins__/storefront-checkout/components/PlaceOrder/PlaceOrder.d.ts +++ b/scripts/__dropins__/storefront-checkout/components/PlaceOrder/PlaceOrder.d.ts @@ -1,7 +1,7 @@ import { FunctionComponent } from 'preact'; import { HTMLAttributes } from 'preact/compat'; -export interface PlaceOrderProps extends HTMLAttributes { +export interface PlaceOrderProps extends HTMLAttributes { disabled?: boolean; onClick: (event: Event) => Promise; } diff --git a/scripts/__dropins__/storefront-checkout/components/index.d.ts b/scripts/__dropins__/storefront-checkout/components/index.d.ts index eaa0a9574f..1d47efa409 100644 --- a/scripts/__dropins__/storefront-checkout/components/index.d.ts +++ b/scripts/__dropins__/storefront-checkout/components/index.d.ts @@ -16,13 +16,11 @@ *******************************************************************/ export * from './BillToShippingAddress'; export * from './EstimateShipping'; -export * from './Heading'; export * from './LoginForm'; +export * from './OrderConfirmationHeader'; export * from './OutOfStock'; -export * from './OverlayLoader'; export * from './PaymentMethods'; export * from './PlaceOrder'; export * from './ServerError'; export * from './ShippingMethods'; -export * from './OrderConfirmationHeader'; //# sourceMappingURL=index.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/containers/EstimateShipping.js b/scripts/__dropins__/storefront-checkout/containers/EstimateShipping.js index e7470ae97b..a81765621c 100644 --- a/scripts/__dropins__/storefront-checkout/containers/EstimateShipping.js +++ b/scripts/__dropins__/storefront-checkout/containers/EstimateShipping.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsxs as k,Fragment as M,jsx as t}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Skeleton as A,SkeletonRow as L,Price as g}from"@dropins/tools/components.js";/* empty css */import{VComponent as w,classes as I}from"@dropins/tools/lib.js";import{Text as l,useText as z}from"@dropins/tools/i18n.js";import{useState as B,useEffect as x}from"@dropins/tools/preact-hooks.js";/* empty css */import{a as G,T as C}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import{events as f}from"@dropins/tools/event-bus.js";import"@dropins/tools/signals.js";const P=({estimated:e=!1,price:o,priceExclTax:d,taxExcluded:p=!1,taxIncluded:a=!1})=>k(M,{children:[t("span",{className:"checkout-estimate-shipping__label",children:e?t(l,{id:"Checkout.EstimateShipping.estimated"}):t(l,{id:"Checkout.EstimateShipping.label"})}),t(w,{node:o,className:"checkout-estimate-shipping__price"}),a&&t("span",{"data-testid":"shipping-tax-included",className:I(["checkout-estimate-shipping__caption"]),children:t(l,{id:"Checkout.EstimateShipping.withTaxes"})}),p&&k("span",{"data-testid":"shipping-tax-included-excluded",className:I(["checkout-estimate-shipping__caption"]),children:[d," ",t(l,{id:"Checkout.EstimateShipping.withoutTaxes"})]})]}),U=()=>t(A,{"data-testid":"estimate-shipping-skeleton",children:t(L,{size:"xsmall"})}),W=()=>{const[e,o]=B(),d=e!==void 0,p=(e==null?void 0:e.amount.value)===0,{data:a,pending:_}=G.value,D=_||a===void 0,T=a==null?void 0:a.shoppingCartDisplaySetting.shipping,N=T===C.INCLUDING_EXCLUDING_TAX,E=T===C.INCLUDING_TAX,S=z({freeShipping:"Checkout.EstimateShipping.freeShipping",taxToBeDetermined:"Checkout.EstimateShipping.taxToBeDetermined"});x(()=>{const i=f.on("shipping/estimate",n=>{const s=n.shippingMethod,{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!0,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]),x(()=>{const i=f.on("checkout/initialized",n=>{var u,h;const s=(h=(u=n==null?void 0:n.shippingAddresses)==null?void 0:u[0])==null?void 0:h.selectedShippingMethod;if(!s)return;const{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!1,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]),x(()=>{const i=f.on("checkout/updated",n=>{var u,h;const s=(h=(u=n==null?void 0:n.shippingAddresses)==null?void 0:u[0])==null?void 0:h.selectedShippingMethod;if(!s)return;const{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!1,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]);const v=()=>p?t("span",{"data-testId":"free-shipping",children:S.freeShipping}):E&&(e!=null&&e.amountInclTax)?t(g,{"data-testid":"shipping",amount:e.amountInclTax.value,currency:e.amountInclTax.currency}):t(g,{"data-testid":"shipping",amount:e==null?void 0:e.amount.value,currency:e==null?void 0:e.amount.currency}),y=()=>e!=null&&e.amountExclTax?t(g,{"data-testid":"shipping-excluding-tax",amount:e.amountExclTax.value,currency:e.amountExclTax.currency}):t("span",{children:S.taxToBeDetermined});return t("div",{"data-testid":"estimate-shipping",className:"checkout-estimate-shipping",children:!d||D?t(U,{}):t(P,{estimated:e.estimated,price:v(),taxExcluded:N&&!p,taxIncluded:E&&!p,priceExclTax:y()})})};export{W as EstimateShipping,W as default}; +import{jsxs as k,Fragment as M,jsx as t}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Skeleton as A,SkeletonRow as L,Price as g}from"@dropins/tools/components.js";/* empty css */import{VComponent as w,classes as I}from"@dropins/tools/lib.js";import{Text as l,useText as z}from"@dropins/tools/i18n.js";/* empty css *//* empty css *//* empty css */import{a as B,T as C}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import{events as x}from"@dropins/tools/event-bus.js";import{useState as G,useEffect as f}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/signals.js";const P=({estimated:e=!1,price:o,priceExclTax:d,taxExcluded:p=!1,taxIncluded:a=!1})=>k(M,{children:[t("span",{className:"checkout-estimate-shipping__label",children:e?t(l,{id:"Checkout.EstimateShipping.estimated"}):t(l,{id:"Checkout.EstimateShipping.label"})}),t(w,{node:o,className:"checkout-estimate-shipping__price"}),a&&t("span",{"data-testid":"shipping-tax-included",className:I(["checkout-estimate-shipping__caption"]),children:t(l,{id:"Checkout.EstimateShipping.withTaxes"})}),p&&k("span",{"data-testid":"shipping-tax-included-excluded",className:I(["checkout-estimate-shipping__caption"]),children:[d," ",t(l,{id:"Checkout.EstimateShipping.withoutTaxes"})]})]}),U=()=>t(A,{"data-testid":"estimate-shipping-skeleton",children:t(L,{size:"xsmall"})}),Z=()=>{const[e,o]=G(),d=e!==void 0,p=(e==null?void 0:e.amount.value)===0,{data:a,pending:_}=B.value,D=_||a===void 0,T=a==null?void 0:a.shoppingCartDisplaySetting.shipping,N=T===C.INCLUDING_EXCLUDING_TAX,E=T===C.INCLUDING_TAX,S=z({freeShipping:"Checkout.EstimateShipping.freeShipping",taxToBeDetermined:"Checkout.EstimateShipping.taxToBeDetermined"});f(()=>{const i=x.on("shipping/estimate",n=>{const s=n.shippingMethod,{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!0,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]),f(()=>{const i=x.on("checkout/initialized",n=>{var u,h;const s=(h=(u=n==null?void 0:n.shippingAddresses)==null?void 0:u[0])==null?void 0:h.selectedShippingMethod;if(!s)return;const{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!1,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]),f(()=>{const i=x.on("checkout/updated",n=>{var u,h;const s=(h=(u=n==null?void 0:n.shippingAddresses)==null?void 0:u[0])==null?void 0:h.selectedShippingMethod;if(!s)return;const{amount:c,amountExclTax:r,amountInclTax:m}=s;o({estimated:!1,amount:c,amountExclTax:r,amountInclTax:m})},{eager:!0});return()=>{i==null||i.off()}},[]);const v=()=>p?t("span",{"data-testId":"free-shipping",children:S.freeShipping}):E&&(e!=null&&e.amountInclTax)?t(g,{"data-testid":"shipping",amount:e.amountInclTax.value,currency:e.amountInclTax.currency}):t(g,{"data-testid":"shipping",amount:e==null?void 0:e.amount.value,currency:e==null?void 0:e.amount.currency}),y=()=>e!=null&&e.amountExclTax?t(g,{"data-testid":"shipping-excluding-tax",amount:e.amountExclTax.value,currency:e.amountExclTax.currency}):t("span",{children:S.taxToBeDetermined});return t("div",{"data-testid":"estimate-shipping",className:"checkout-estimate-shipping",children:!d||D?t(U,{}):t(P,{estimated:e.estimated,price:v(),taxExcluded:N&&!p,taxIncluded:E&&!p,priceExclTax:y()})})};export{Z as EstimateShipping,Z as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/LoginForm.js b/scripts/__dropins__/storefront-checkout/containers/LoginForm.js index 7f6cf78a2d..66ee4978ca 100644 --- a/scripts/__dropins__/storefront-checkout/containers/LoginForm.js +++ b/scripts/__dropins__/storefront-checkout/containers/LoginForm.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as e,jsxs as s,Fragment as P}from"@dropins/tools/preact-jsx-runtime.js";import{s as w}from"../chunks/fetch-graphql.js";import{c as R,b as V}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{classes as j}from"@dropins/tools/lib.js";import{i as q}from"../chunks/isEmailAvailable.js";import{s as D}from"../chunks/setGuestEmailOnCart.js";import{Field as W,Input as G,Skeleton as U,SkeletonRow as x}from"@dropins/tools/components.js";/* empty css *//* empty css */import{H as J}from"../chunks/Heading.js";import{useText as b,Text as _}from"@dropins/tools/i18n.js";import{useState as p,useRef as K,useEffect as C}from"@dropins/tools/preact-hooks.js";/* empty css */import{w as O}from"../chunks/withConditionalRendering.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const Q=({value:t,error:i,hint:g,onChange:h,onBlur:o,onInvalid:u})=>{const m=b({LoginFormLabel:"Checkout.LoginForm.ariaLabel",LoginFormFloatingLabel:"Checkout.LoginForm.floatingLabel",LoginFormPlaceholder:"Checkout.LoginForm.placeholder"});return e(W,{size:"medium",error:i,hint:g,children:e(G,{"aria-label":m.LoginFormLabel,"aria-required":!0,autocomplete:"email",floatingLabel:m.LoginFormFloatingLabel,id:"customer-email",name:"customer-email",onBlur:o,onChange:h,onInvalid:u,placeholder:m.LoginFormPlaceholder,required:!0,type:"email",value:t})})},X=({onClick:t})=>s("div",{className:"checkout-login-form__sign-in",children:[e(_,{id:"Checkout.LoginForm.account"}),e("a",{"data-testid":"sign-in-link",className:"checkout-login-form__link",href:"#",target:"_blank",rel:"noreferrer",onClick:t,children:e(_,{id:"Checkout.LoginForm.signIn"})})]}),Y=({className:t,customerDetails:i,email:g,error:h,hint:o,loading:u=!1,name:m,onEmailBlur:f,onEmailChange:k,onEmailInvalid:E,onSignInClick:a,onSignOutClick:F,...L})=>{const l=b({Title:"Checkout.LoginForm.title"});return u?e(Z,{}):s("div",{className:"checkout-login-form","data-testid":"checkout-login-form",children:[s("div",{className:"checkout-login-form__heading",children:[e(J,{level:2,className:"checkout-login-form__title",children:l.Title}),i?e(S,{onClick:d=>{d.preventDefault(),F==null||F()}}):e(X,{onClick:d=>{d.preventDefault(),a==null||a(g)}})]}),i?s("div",{className:"checkout-login-form__customer-details",children:[e("div",{className:"checkout-login-form__customer-name",children:`${i.firstName} ${i.lastName}`}),e("div",{className:"checkout-login-form__customer-email",children:i.email})]}):e("div",{className:"checkout-login-form__content",children:s("form",{...L,className:j(["dropin-login-form__form",t]),name:m,noValidate:!0,children:[e("button",{type:"submit",disabled:!0,style:"display: none","aria-hidden":"true"}),e(Q,{value:g,error:h,hint:o,onChange:k,onBlur:f,onInvalid:E})]})})]})},Z=()=>s(U,{"data-testid":"login-form-skeleton",children:[e(x,{variant:"heading",fullWidth:!0}),e(x,{size:"medium",fullWidth:!0})]}),S=({onClick:t})=>s("p",{className:"checkout-login-form__sign-out",children:[e(_,{id:"Checkout.LoginForm.switch"}),e("a",{className:"checkout-login-form__link",href:"#",target:"_blank",rel:"noreferrer",onClick:t,children:e(_,{id:"Checkout.LoginForm.signOut"})})]}),ee={EMAIL:/^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\.)+[a-z]{2,}$/i},N=t=>ee.EMAIL.test(t),re=1e3,y=({onSignInClick:t,onSignOutClick:i,initialData:g,...h})=>{const[o,u]=p(""),[m,f]=p(""),[k,E]=p(!0),[a,F]=p(!0),L=K(""),l=R.value.data,d=(l==null?void 0:l.email)||"",v=V.value.data,c=b({LoginFormInvalidEmailError:"Checkout.LoginForm.invalidEmailError",LoginFormMissingEmailError:"Checkout.LoginForm.missingEmailError",LoginFormEmailExistsAlreadyHaveAccount:"Checkout.LoginForm.emailExists.alreadyHaveAccount",LoginFormEmailExistsSignInButton:"Checkout.LoginForm.emailExists.signInButton",LoginFormEmailExistsForFasterCheckout:"Checkout.LoginForm.emailExists.forFasterCheckout"}),A=r=>r.valid?"":r.valueMissing?c.LoginFormMissingEmailError:c.LoginFormInvalidEmailError,B=r=>N(r)?"":r===""?c.LoginFormMissingEmailError:c.LoginFormInvalidEmailError,M=r=>{const n=r.target;u(n.value),f(""),E(!0)},T=r=>{const n=r.target;f(B(n.value))},z=r=>{const n=r.target;f(A(n.validity))};C(()=>{!a||!l||(F(!1),u(l.email||""))},[l,a]),C(()=>{if(a||w.authenticated)return;const r=setTimeout(()=>{!N(o)||o===L.current||(L.current=o,q(o).then(n=>{E(n),d!==o&&D(o).catch(console.error)}).catch(n=>{console.error(n),E(!0)}))},re);return()=>{r&&clearTimeout(r)}},[d,o,a]);const I=k?"":s(P,{children:[c.LoginFormEmailExistsAlreadyHaveAccount," ",e("a",{href:"#",onClick:r=>{r.preventDefault(),t==null||t(o)},children:c.LoginFormEmailExistsSignInButton})," ",c.LoginFormEmailExistsForFasterCheckout]}),$=r=>{t==null||t(N(r)?r:"")},H=v?{firstName:v.firstName,lastName:v.lastName,email:v.email}:void 0;return e(Y,{...h,customerDetails:H,email:o,error:m,hint:I,loading:a,onEmailBlur:T,onEmailChange:M,onEmailInvalid:z,onSignInClick:$,onSignOutClick:i})};y.displayName="LoginFormContainer";const ke=O(y);export{ke as LoginForm,ke as default}; +import{jsx as r,jsxs as s,Fragment as w}from"@dropins/tools/preact-jsx-runtime.js";import{s as H}from"../chunks/fetch-graphql.js";import{c as R,b as V}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{classes as j}from"@dropins/tools/lib.js";import{i as q}from"../chunks/isEmailAvailable.js";import{s as D}from"../chunks/setGuestEmailOnCart.js";import{Field as W,Input as G,Skeleton as U,SkeletonRow as x}from"@dropins/tools/components.js";/* empty css *//* empty css */import{useText as b,Text as _}from"@dropins/tools/i18n.js";/* empty css *//* empty css *//* empty css */import{w as J}from"../chunks/withConditionalRendering.js";import{useState as v,useRef as K,useEffect as C}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const O=({value:t,error:i,hint:g,onChange:h,onBlur:o,onInvalid:u})=>{const m=b({LoginFormLabel:"Checkout.LoginForm.ariaLabel",LoginFormFloatingLabel:"Checkout.LoginForm.floatingLabel",LoginFormPlaceholder:"Checkout.LoginForm.placeholder"});return r(W,{size:"medium",error:i,hint:g,children:r(G,{"aria-label":m.LoginFormLabel,"aria-required":!0,autocomplete:"email",floatingLabel:m.LoginFormFloatingLabel,id:"customer-email",name:"customer-email",onBlur:o,onChange:h,onInvalid:u,placeholder:m.LoginFormPlaceholder,required:!0,type:"email",value:t})})},Q=({onClick:t})=>s("div",{className:"checkout-login-form__sign-in",children:[r(_,{id:"Checkout.LoginForm.account"}),r("a",{"data-testid":"sign-in-link",className:"checkout-login-form__link",href:"#",target:"_blank",rel:"noreferrer",onClick:t,children:r(_,{id:"Checkout.LoginForm.signIn"})})]}),X=({className:t,customerDetails:i,email:g,error:h,hint:o,loading:u=!1,name:m,onEmailBlur:f,onEmailChange:k,onEmailInvalid:E,onSignInClick:a,onSignOutClick:F,...L})=>{const l=b({Title:"Checkout.LoginForm.title"});return u?r(Y,{}):s("div",{className:"checkout-login-form","data-testid":"checkout-login-form",children:[s("div",{className:"checkout-login-form__heading",children:[r("h2",{className:"checkout-login-form__title",children:l.Title}),i?r(Z,{onClick:d=>{d.preventDefault(),F==null||F()}}):r(Q,{onClick:d=>{d.preventDefault(),a==null||a(g)}})]}),i?s("div",{className:"checkout-login-form__customer-details",children:[r("div",{className:"checkout-login-form__customer-name",children:`${i.firstName} ${i.lastName}`}),r("div",{className:"checkout-login-form__customer-email",children:i.email})]}):r("div",{className:"checkout-login-form__content",children:s("form",{...L,className:j(["dropin-login-form__form",t]),name:m,noValidate:!0,children:[r("button",{type:"submit",disabled:!0,style:"display: none","aria-hidden":"true"}),r(O,{value:g,error:h,hint:o,onChange:k,onBlur:f,onInvalid:E})]})})]})},Y=()=>s(U,{"data-testid":"login-form-skeleton",children:[r(x,{variant:"heading",fullWidth:!0}),r(x,{size:"medium",fullWidth:!0})]}),Z=({onClick:t})=>s("p",{className:"checkout-login-form__sign-out",children:[r(_,{id:"Checkout.LoginForm.switch"}),r("a",{className:"checkout-login-form__link",href:"#",target:"_blank",rel:"noreferrer",onClick:t,children:r(_,{id:"Checkout.LoginForm.signOut"})})]}),S={EMAIL:/^[a-z0-9,!#$%&'*+/=?^_`{|}~-]+(\.[a-z0-9,!#$%&'*+/=?^_`{|}~-]+)*@([a-z0-9-]+\.)+[a-z]{2,}$/i},N=t=>S.EMAIL.test(t),rr=1e3,y=({onSignInClick:t,onSignOutClick:i,initialData:g,...h})=>{const[o,u]=v(""),[m,f]=v(""),[k,E]=v(!0),[a,F]=v(!0),L=K(""),l=R.value.data,d=(l==null?void 0:l.email)||"",p=V.value.data,c=b({LoginFormInvalidEmailError:"Checkout.LoginForm.invalidEmailError",LoginFormMissingEmailError:"Checkout.LoginForm.missingEmailError",LoginFormEmailExistsAlreadyHaveAccount:"Checkout.LoginForm.emailExists.alreadyHaveAccount",LoginFormEmailExistsSignInButton:"Checkout.LoginForm.emailExists.signInButton",LoginFormEmailExistsForFasterCheckout:"Checkout.LoginForm.emailExists.forFasterCheckout"}),A=e=>e.valid?"":e.valueMissing?c.LoginFormMissingEmailError:c.LoginFormInvalidEmailError,B=e=>N(e)?"":e===""?c.LoginFormMissingEmailError:c.LoginFormInvalidEmailError,M=e=>{const n=e.target;u(n.value),f(""),E(!0)},T=e=>{const n=e.target;f(B(n.value))},z=e=>{const n=e.target;f(A(n.validity))};C(()=>{!a||!l||(F(!1),u(l.email||""))},[l,a]),C(()=>{if(a||H.authenticated)return;const e=setTimeout(()=>{!N(o)||o===L.current||(L.current=o,q(o).then(n=>{E(n),d!==o&&D(o).catch(console.error)}).catch(n=>{console.error(n),E(!0)}))},rr);return()=>{e&&clearTimeout(e)}},[d,o,a]);const I=k?"":s(w,{children:[c.LoginFormEmailExistsAlreadyHaveAccount," ",r("a",{href:"#",onClick:e=>{e.preventDefault(),t==null||t(o)},children:c.LoginFormEmailExistsSignInButton})," ",c.LoginFormEmailExistsForFasterCheckout]}),$=e=>{t==null||t(N(e)?e:"")},P=p?{firstName:p.firstName,lastName:p.lastName,email:p.email}:void 0;return r(X,{...h,customerDetails:P,email:o,error:m,hint:I,loading:a,onEmailBlur:T,onEmailChange:M,onEmailInvalid:z,onSignInClick:$,onSignOutClick:i})};y.displayName="LoginFormContainer";const kr=J(y);export{kr as LoginForm,kr as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/OrderConfirmationHeader.js b/scripts/__dropins__/storefront-checkout/containers/OrderConfirmationHeader.js index f474c76133..84e921117e 100644 --- a/scripts/__dropins__/storefront-checkout/containers/OrderConfirmationHeader.js +++ b/scripts/__dropins__/storefront-checkout/containers/OrderConfirmationHeader.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as t,jsxs as s}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Icon as A,Button as E,Skeleton as y,SkeletonRow as n}from"@dropins/tools/components.js";/* empty css */import"@dropins/tools/lib.js";import"@dropins/tools/preact-hooks.js";/* empty css */import{H as N}from"../chunks/Heading.js";import*as o from"@dropins/tools/preact-compat.js";import{useState as C,useEffect as b}from"@dropins/tools/preact-compat.js";import{useText as H,Text as v}from"@dropins/tools/i18n.js";import{s as f}from"../chunks/fetch-graphql.js";import"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{i as z}from"../chunks/isEmailAvailable.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";function p(e){var r;return{region:{region_id:e!=null&&e.regionId?Number(e==null?void 0:e.regionId):null,region:e==null?void 0:e.region},city:e==null?void 0:e.city,company:e==null?void 0:e.company,country_code:e==null?void 0:e.country,firstname:e==null?void 0:e.firstName,lastname:e==null?void 0:e.lastName,middlename:e==null?void 0:e.middleName,postcode:e==null?void 0:e.postCode,street:e==null?void 0:e.street,telephone:e==null?void 0:e.telephone,custom_attributesV2:((r=e==null?void 0:e.customAttributes)==null?void 0:r.map(c=>({attribute_code:c.code,value:c.value})))||[]}}const V=e=>o.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},o.createElement("g",{clipPath:"url(#clip0_4797_15077)"},o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M10.15 20.85L1.5 17.53V6.63L10.15 10V20.85Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M1.5 6.63001L10.15 3.20001L18.8 6.63001L10.15 10L1.5 6.63001Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M6.17969 4.77002L14.8297 8.15002V11.47",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.7896 12.64V6.63L10.1396 10V20.85L14.8296 19.05",stroke:"currentColor",strokeLinejoin:"round"}),o.createElement("path",{className:"success-icon",vectorEffect:"non-scaling-stroke",d:"M15.71 17.26C15.71 15.38 17.23 13.86 19.11 13.86C20.99 13.86 22.51 15.38 22.51 17.26C22.51 19.14 20.99 20.66 19.11 20.66C17.23 20.66 15.71 19.14 15.71 17.26Z",stroke:"currentColor"}),o.createElement("path",{className:"success-icon",vectorEffect:"non-scaling-stroke",d:"M17.4805 17.49L18.5605 18.41L20.7205 16.33",stroke:"currentColor",strokeLinecap:"square",strokeLinejoin:"round"})),o.createElement("defs",null,o.createElement("clipPath",{id:"clip0_4797_15077"},o.createElement("rect",{width:22,height:18.65,fill:"white",transform:"translate(1 2.70001)"})))),w=({customerName:e,isLoading:r,orderNumber:c,onSignUpClick:a})=>{const l=H({title:t(v,{id:"Checkout.OrderConfirmationHeader.title",fields:{name:e}}),defaultTitle:"Checkout.OrderConfirmationHeader.defaultTitle",order:t(v,{id:"Checkout.OrderConfirmationHeader.order",fields:{order:c}}),createAccountMessage:"Checkout.OrderConfirmationHeader.CreateAccount.message",createAccountButton:"Checkout.OrderConfirmationHeader.CreateAccount.button"});return r?t(x,{}):s("div",{className:"order-confirmation-header order-confirmation__card",children:[t(A,{source:V,size:"64",className:"order-confirmation-header__icon"}),t(N,{level:1,className:"order-confirmation-header__title",children:e?l.title:l.defaultTitle}),c&&t("p",{className:"order-confirmation-header__order",children:l.order}),a&&s("div",{className:"order-confirmation-create-account",children:[t("p",{className:"order-confirmation-create-account__message",children:l.createAccountMessage}),t(E,{"data-testid":"create-account-button",className:"order-confirmation-create-account__button",size:"medium",variant:"secondary",type:"submit",onClick:a,children:l.createAccountButton})]})]})},x=()=>s(y,{"data-testid":"order-confirmation-header-skeleton",className:"order-confirmation-header",children:[t(n,{variant:"empty",size:"xlarge",fullWidth:!0}),t(n,{variant:"empty",size:"medium"}),t(n,{variant:"empty",size:"medium"}),t(n,{variant:"empty",size:"medium"}),t(n,{variant:"empty",size:"medium"}),t(n,{variant:"empty",size:"medium"}),t(n,{size:"small",fullWidth:!0}),t(n,{variant:"heading",size:"xsmall",fullWidth:!0})]}),U=({orderData:e,onSignUpClick:r})=>{var g;const[c,a]=C(!f.authenticated),[l,h]=C();b(()=>{f.authenticated||z(e.email).then(m=>h(!m)).catch(()=>h(!0)).finally(()=>a(!1))},[e.email]);const _=r&&!f.authenticated&&l===!1?()=>{const m=e.shippingAddress,i=e.billingAddress,L=[{code:"firstname",defaultValue:(i==null?void 0:i.firstName)||""},{code:"lastname",defaultValue:(i==null?void 0:i.lastName)||""},{code:"email",defaultValue:e.email||""}];let u;if(m){const k={...p(m),default_shipping:!0};u=[{...p(i),default_billing:!0},k]}else u=[{...p(i),default_billing:!0,default_shipping:!0}];r({inputsDefaultValueSet:L,addressesData:u})}:void 0;return t("div",{children:t(w,{customerName:(g=e.billingAddress)==null?void 0:g.firstName,isLoading:c,onSignUpClick:_,orderNumber:e.number})})};export{U as OrderConfirmationHeader,U as default}; +import{jsx as t,jsxs as s}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Icon as A,Header as E,Button as y,Skeleton as N,SkeletonRow as r}from"@dropins/tools/components.js";/* empty css */import"@dropins/tools/lib.js";/* empty css *//* empty css *//* empty css */import*as o from"@dropins/tools/preact-compat.js";import{useState as C,useEffect as b}from"@dropins/tools/preact-compat.js";import{useText as z,Text as v}from"@dropins/tools/i18n.js";import{s as f}from"../chunks/fetch-graphql.js";import"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{i as H}from"../chunks/isEmailAvailable.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";function p(e){var c;return{region:{region_id:e!=null&&e.regionId?Number(e==null?void 0:e.regionId):null,region:e==null?void 0:e.region},city:e==null?void 0:e.city,company:e==null?void 0:e.company,country_code:e==null?void 0:e.country,firstname:e==null?void 0:e.firstName,lastname:e==null?void 0:e.lastName,middlename:e==null?void 0:e.middleName,postcode:e==null?void 0:e.postCode,street:e==null?void 0:e.street,telephone:e==null?void 0:e.telephone,custom_attributesV2:((c=e==null?void 0:e.customAttributes)==null?void 0:c.map(l=>({attribute_code:l.code,value:l.value})))||[]}}const V=e=>o.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},o.createElement("g",{clipPath:"url(#clip0_4797_15077)"},o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M10.15 20.85L1.5 17.53V6.63L10.15 10V20.85Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M1.5 6.63001L10.15 3.20001L18.8 6.63001L10.15 10L1.5 6.63001Z",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M6.17969 4.77002L14.8297 8.15002V11.47",stroke:"currentColor",strokeLinecap:"round",strokeLinejoin:"round"}),o.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M18.7896 12.64V6.63L10.1396 10V20.85L14.8296 19.05",stroke:"currentColor",strokeLinejoin:"round"}),o.createElement("path",{className:"success-icon",vectorEffect:"non-scaling-stroke",d:"M15.71 17.26C15.71 15.38 17.23 13.86 19.11 13.86C20.99 13.86 22.51 15.38 22.51 17.26C22.51 19.14 20.99 20.66 19.11 20.66C17.23 20.66 15.71 19.14 15.71 17.26Z",stroke:"currentColor"}),o.createElement("path",{className:"success-icon",vectorEffect:"non-scaling-stroke",d:"M17.4805 17.49L18.5605 18.41L20.7205 16.33",stroke:"currentColor",strokeLinecap:"square",strokeLinejoin:"round"})),o.createElement("defs",null,o.createElement("clipPath",{id:"clip0_4797_15077"},o.createElement("rect",{width:22,height:18.65,fill:"white",transform:"translate(1 2.70001)"})))),d=({customerName:e,isLoading:c,orderNumber:l,onSignUpClick:a})=>{const i=z({title:t(v,{id:"Checkout.OrderConfirmationHeader.title",fields:{name:e}}),defaultTitle:"Checkout.OrderConfirmationHeader.defaultTitle",order:t(v,{id:"Checkout.OrderConfirmationHeader.order",fields:{order:l}}),createAccountMessage:"Checkout.OrderConfirmationHeader.CreateAccount.message",createAccountButton:"Checkout.OrderConfirmationHeader.CreateAccount.button"});return c?t(w,{}):s("div",{className:"order-confirmation-header order-confirmation__card",children:[t(A,{source:V,size:"64",className:"order-confirmation-header__icon"}),t(E,{className:"order-confirmation-header__title",title:i.title,size:"large",divider:!1,children:e?i.title:i.defaultTitle}),l&&t("p",{className:"order-confirmation-header__order",children:i.order}),a&&s("div",{className:"order-confirmation-create-account",children:[t("p",{className:"order-confirmation-create-account__message",children:i.createAccountMessage}),t(y,{"data-testid":"create-account-button",className:"order-confirmation-create-account__button",size:"medium",variant:"secondary",type:"submit",onClick:a,children:i.createAccountButton})]})]})},w=()=>s(N,{"data-testid":"order-confirmation-header-skeleton",className:"order-confirmation-header",children:[t(r,{variant:"empty",size:"xlarge",fullWidth:!0}),t(r,{variant:"empty",size:"medium"}),t(r,{variant:"empty",size:"medium"}),t(r,{variant:"empty",size:"medium"}),t(r,{variant:"empty",size:"medium"}),t(r,{variant:"empty",size:"medium"}),t(r,{size:"small",fullWidth:!0}),t(r,{variant:"heading",size:"xsmall",fullWidth:!0})]}),U=({orderData:e,onSignUpClick:c})=>{var g;const[l,a]=C(!f.authenticated),[i,h]=C();b(()=>{f.authenticated||H(e.email).then(m=>h(!m)).catch(()=>h(!0)).finally(()=>a(!1))},[e.email]);const _=c&&!f.authenticated&&i===!1?()=>{const m=e.shippingAddress,n=e.billingAddress,L=[{code:"firstname",defaultValue:(n==null?void 0:n.firstName)||""},{code:"lastname",defaultValue:(n==null?void 0:n.lastName)||""},{code:"email",defaultValue:e.email||""}];let u;if(m){const k={...p(m),default_shipping:!0};u=[{...p(n),default_billing:!0},k]}else u=[{...p(n),default_billing:!0,default_shipping:!0}];c({inputsDefaultValueSet:L,addressesData:u})}:void 0;return t("div",{children:t(d,{customerName:(g=e.billingAddress)==null?void 0:g.firstName,isLoading:l,onSignUpClick:_,orderNumber:e.number})})};export{U as OrderConfirmationHeader,U as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/OutOfStock.js b/scripts/__dropins__/storefront-checkout/containers/OutOfStock.js index d3cb768909..fc6e5bc825 100644 --- a/scripts/__dropins__/storefront-checkout/containers/OutOfStock.js +++ b/scripts/__dropins__/storefront-checkout/containers/OutOfStock.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsxs as n,jsx as e}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Card as k,Icon as l,Image as h}from"@dropins/tools/components.js";/* empty css */import{classes as O}from"@dropins/tools/lib.js";import{H as d}from"../chunks/Heading.js";import"@dropins/tools/preact-hooks.js";/* empty css */import{S as p}from"../chunks/OrderError.js";import{useText as S}from"@dropins/tools/i18n.js";import{events as v}from"@dropins/tools/event-bus.js";import{useState as g,useCallback as _,useEffect as N}from"@dropins/tools/preact-compat.js";const w=({className:i,items:r,onRemoveOutOfStock:o,routeCart:a,...m})=>{const s=S({title:"Checkout.OutOfStock.title",message:"Checkout.OutOfStock.message",reviewCart:"Checkout.OutOfStock.actions.reviewCart",removeOutOfStock:"Checkout.OutOfStock.actions.removeOutOfStock"});return n(k,{className:O(["checkout-out-of-stock",i]),"data-testid":"checkout-out-of-stock",variant:"secondary",...m,children:[n(d,{level:4,className:"checkout-out-of-stock__title",children:[e(l,{source:p,size:"16",stroke:"1"}),s.title]}),e("p",{className:"checkout-out-of-stock__message",children:s.message}),e("ol",{className:"checkout-out-of-stock__items",children:r.map(u=>e("li",{"data-testid":"out-of-stock-item",className:"checkout-out-of-stock__item",children:e(h,{loading:"eager",src:u.image.src,alt:u.image.alt,width:"100",height:"100",params:{width:100}})},u.sku))}),n("div",{className:"checkout-out-of-stock__actions",children:[a&&e("a",{"data-testid":"review-cart",className:"checkout-out-of-stock__action",href:a,children:s.reviewCart}),o&&e("button",{className:"checkout-out-of-stock__action","data-testid":"remove-out-of-stock",type:"button",onClick:o,children:s.removeOutOfStock})]})]})},T=({onCartProductsUpdate:i,routeCart:r})=>{const[o,a]=g([]),m=t=>t.outOfStock||t.insufficientQuantity,s=_(()=>{if(!i)return;const t=o.filter(c=>c.outOfStock).map(c=>({uid:c.uid,quantity:0}));i(t)},[o,i]);if(N(()=>{const t=v.on("cart/data",c=>{const f=(c==null?void 0:c.items)||[];a(f.filter(m))},{eager:!0});return()=>{t==null||t.off()}},[]),o.length===0)return null;const u=!o.some(t=>t.insufficientQuantity);return e(w,{items:o,onRemoveOutOfStock:u?s:void 0,routeCart:r==null?void 0:r()})};export{T as OutOfStock,T as default}; +import{jsxs as n,jsx as e}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{Card as k,Icon as l,Image as h}from"@dropins/tools/components.js";/* empty css */import{classes as O}from"@dropins/tools/lib.js";import{S as d}from"../chunks/OrderError.js";import{useText as p}from"@dropins/tools/i18n.js";/* empty css *//* empty css *//* empty css */import{events as S}from"@dropins/tools/event-bus.js";import{useState as v,useCallback as _,useEffect as g}from"@dropins/tools/preact-compat.js";const N=({className:i,items:r,onRemoveOutOfStock:o,routeCart:a,...m})=>{const s=p({title:"Checkout.OutOfStock.title",message:"Checkout.OutOfStock.message",reviewCart:"Checkout.OutOfStock.actions.reviewCart",removeOutOfStock:"Checkout.OutOfStock.actions.removeOutOfStock"});return n(k,{className:O(["checkout-out-of-stock",i]),"data-testid":"checkout-out-of-stock",variant:"secondary",...m,children:[n("h4",{className:"checkout-out-of-stock__title",children:[e(l,{source:d,size:"16",stroke:"1"}),s.title]}),e("p",{className:"checkout-out-of-stock__message",children:s.message}),e("ol",{className:"checkout-out-of-stock__items",children:r.map(u=>e("li",{"data-testid":"out-of-stock-item",className:"checkout-out-of-stock__item",children:e(h,{loading:"eager",src:u.image.src,alt:u.image.alt,width:"100",height:"100",params:{width:100}})},u.sku))}),n("div",{className:"checkout-out-of-stock__actions",children:[a&&e("a",{"data-testid":"review-cart",className:"checkout-out-of-stock__action",href:a,children:s.reviewCart}),o&&e("button",{className:"checkout-out-of-stock__action","data-testid":"remove-out-of-stock",type:"button",onClick:o,children:s.removeOutOfStock})]})]})},T=({onCartProductsUpdate:i,routeCart:r})=>{const[o,a]=v([]),m=t=>t.outOfStock||t.insufficientQuantity,s=_(()=>{if(!i)return;const t=o.filter(c=>c.outOfStock).map(c=>({uid:c.uid,quantity:0}));i(t)},[o,i]);if(g(()=>{const t=S.on("cart/data",c=>{const f=(c==null?void 0:c.items)||[];a(f.filter(m))},{eager:!0});return()=>{t==null||t.off()}},[]),o.length===0)return null;const u=!o.some(t=>t.insufficientQuantity);return e(N,{items:o,onRemoveOutOfStock:u?s:void 0,routeCart:r==null?void 0:r()})};export{T as OutOfStock,T as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/PaymentMethods.js b/scripts/__dropins__/storefront-checkout/containers/PaymentMethods.js index cdb8709842..fe5f580b93 100644 --- a/scripts/__dropins__/storefront-checkout/containers/PaymentMethods.js +++ b/scripts/__dropins__/storefront-checkout/containers/PaymentMethods.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as n,jsxs as M,Fragment as R}from"@dropins/tools/preact-jsx-runtime.js";import{s as D}from"../chunks/fetch-graphql.js";import{c as C}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{classes as H,Slot as L}from"@dropins/tools/lib.js";import{s as $}from"../chunks/setPaymentMethod.js";/* empty css */import{IllustratedMessage as B,Icon as U,ProgressSpinner as Z,ToggleButton as F,Skeleton as q,SkeletonRow as y}from"@dropins/tools/components.js";/* empty css */import{H as G}from"../chunks/Heading.js";import{useRef as J}from"@dropins/tools/preact-hooks.js";/* empty css */import*as g from"@dropins/tools/preact-compat.js";import{useState as S,useCallback as T,useEffect as w}from"@dropins/tools/preact-compat.js";import{useText as K}from"@dropins/tools/i18n.js";import{w as Q}from"../chunks/withConditionalRendering.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const X=e=>g.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},g.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"}),g.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.35 11.64H14.04V14.81H19.35V11.64Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),g.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.9304 11.64V8.25H15.1504",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),Y=({code:e,loading:a,selected:r,onChange:d,title:h})=>n(F,{className:"checkout-payment-methods__method",label:h,name:"payment-method",value:e,selected:r,onChange:d,busy:a}),ee=({className:e,paymentMethodContent:a,loading:r=!1,initializing:d=!1,onChange:h=()=>{},options:c,selection:k})=>{const o=K({Title:"Checkout.PaymentMethods.title",EmptyState:"Checkout.PaymentMethods.emptyState"});return d?n(te,{}):M("div",{className:H(["checkout-payment-methods",e]),children:[n(G,{level:2,className:"checkout-payment-methods__title",children:o.Title}),!r&&c.length===0&&n(B,{icon:n(U,{source:X}),message:n("p",{children:o.EmptyState})}),M("div",{className:H(["checkout-payment-methods__wrapper"]),children:[r&&n(Z,{className:"checkout-payment-methods__spinner"}),n("div",{className:H(["checkout-payment-methods__methods",["checkout-payment-methods--loading",r],["checkout-payment-methods--full-width",c.length%2!==0]]),children:c==null?void 0:c.map(i=>n(Y,{code:i.code,onChange:h,selected:i.code===k,title:i.title},i.code))}),a&&n("div",{className:"checkout-payment-methods__content",children:a})]})]})},te=()=>M(q,{"data-testid":"payment-methods-skeleton",children:[n(y,{variant:"heading",size:"medium"}),n(y,{variant:"empty",size:"medium"}),n(y,{size:"xlarge",fullWidth:!0}),n(y,{size:"xlarge",fullWidth:!0})]}),N={free:e=>{const a=document.createElement("div");a.innerText="",e.replaceHTML(a)},checkmo:e=>{const a=document.createElement("div");a.innerText="",e.replaceHTML(a)}},ne=(e,a)=>{const r=J(e);return a(r.current,e)||(r.current=e),r.current},V=({slots:e})=>{var x,_;const[a,r]=S(),[d,h]=S(N),[c,k]=S(!0),o=C.value.data,i=!!C.value.data,W=C.value.pending,j=(o==null?void 0:o.isVirtual)??!1,z=(x=o==null?void 0:o.shippingAddresses)==null?void 0:x[0],A=(o==null?void 0:o.availablePaymentMethods)||[],l=(_=o==null?void 0:o.selectedPaymentMethod)==null?void 0:_.code,E=j?!0:!!z,m=ne(A,(t,s)=>t.length!==s.length?!1:t.every((p,v)=>p.code===s[v].code)),u=T(t=>{r(t),!(!t||!E)&&t!==l&&$(t).catch(console.error)},[E,l]);w(()=>{if(!i)return;if(!!!(m!=null&&m.length)){u(void 0);return}const s=m[0].code;if(!l){u(s);return}const p=m.some(v=>v.code===l);u(p?l:s)},[m,i,l,u]);const I=t=>{u(t)},b=T((t,s)=>{if(!t){console.warn("Payment method handler is ignored because it has no code");return}if(!s){console.warn("Payment method handler is ignored because it is empty");return}h(p=>({...p,[t]:s}))},[]);w(()=>{e!=null&&e.Handlers&&Object.entries(e.Handlers).forEach(([t,s])=>{b(t,s)})},[b,e==null?void 0:e.Handlers]);const f=e!=null&&e.Main?n(L,{name:"PaymentMethods",slot:e==null?void 0:e.Main,context:{replaceHTML(t){this.replaceWith(t),k(!1)}}}):null,P=a?d[a]:null,O=P?n(L,{name:"PaymentMethodContent",slot:P,context:{cartId:D.cartId||"",replaceHTML(t){this.replaceWith(t)}}},P):void 0;return w(()=>{!c&&d!=N&&console.warn("Payment method handlers you have added are ignored because the default content has been replaced")},[c,d]),M(R,{children:[f&&n(f.type,{ref:f.ref,...f.props}),c&&n(ee,{initializing:i===!1,loading:i&&W,onChange:I,options:m,paymentMethodContent:O,selection:a})]})};V.displayName="PaymentMethodsContainer";const He=Q(V);export{He as PaymentMethods,He as default}; +import{jsx as n,jsxs as M,Fragment as R}from"@dropins/tools/preact-jsx-runtime.js";import{s as D}from"../chunks/fetch-graphql.js";import{c as C}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import"@dropins/tools/event-bus.js";import{classes as H,Slot as L}from"@dropins/tools/lib.js";import{s as $}from"../chunks/setPaymentMethod.js";/* empty css */import{IllustratedMessage as B,Icon as U,ProgressSpinner as Z,ToggleButton as F,Skeleton as q,SkeletonRow as y}from"@dropins/tools/components.js";import*as g from"@dropins/tools/preact-compat.js";import{useState as S,useCallback as T,useEffect as w}from"@dropins/tools/preact-compat.js";import{useText as G}from"@dropins/tools/i18n.js";import{w as J}from"../chunks/withConditionalRendering.js";import{useRef as K}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const Q=e=>g.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},g.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"}),g.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.35 11.64H14.04V14.81H19.35V11.64Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),g.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M17.9304 11.64V8.25H15.1504",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),X=({code:e,loading:a,selected:r,onChange:d,title:h})=>n(F,{className:"checkout-payment-methods__method",label:h,name:"payment-method",value:e,selected:r,onChange:d,busy:a}),Y=({className:e,paymentMethodContent:a,loading:r=!1,initializing:d=!1,onChange:h=()=>{},options:c,selection:k})=>{const o=G({Title:"Checkout.PaymentMethods.title",EmptyState:"Checkout.PaymentMethods.emptyState"});return d?n(ee,{}):M("div",{className:H(["checkout-payment-methods",e]),children:[n("h2",{className:"checkout-payment-methods__title",children:o.Title}),!r&&c.length===0&&n(B,{icon:n(U,{source:Q}),message:n("p",{children:o.EmptyState})}),M("div",{className:H(["checkout-payment-methods__wrapper"]),children:[r&&n(Z,{className:"checkout-payment-methods__spinner"}),n("div",{className:H(["checkout-payment-methods__methods",["checkout-payment-methods--loading",r],["checkout-payment-methods--full-width",c.length%2!==0]]),children:c==null?void 0:c.map(i=>n(X,{code:i.code,onChange:h,selected:i.code===k,title:i.title},i.code))}),a&&n("div",{className:"checkout-payment-methods__content",children:a})]})]})},ee=()=>M(q,{"data-testid":"payment-methods-skeleton",children:[n(y,{variant:"heading",size:"medium"}),n(y,{variant:"empty",size:"medium"}),n(y,{size:"xlarge",fullWidth:!0}),n(y,{size:"xlarge",fullWidth:!0})]}),N={free:e=>{const a=document.createElement("div");a.innerText="",e.replaceHTML(a)},checkmo:e=>{const a=document.createElement("div");a.innerText="",e.replaceHTML(a)}},te=(e,a)=>{const r=K(e);return a(r.current,e)||(r.current=e),r.current},V=({slots:e})=>{var x,_;const[a,r]=S(),[d,h]=S(N),[c,k]=S(!0),o=C.value.data,i=!!C.value.data,W=C.value.pending,j=(o==null?void 0:o.isVirtual)??!1,z=(x=o==null?void 0:o.shippingAddresses)==null?void 0:x[0],A=(o==null?void 0:o.availablePaymentMethods)||[],l=(_=o==null?void 0:o.selectedPaymentMethod)==null?void 0:_.code,E=j?!0:!!z,m=te(A,(t,s)=>t.length!==s.length?!1:t.every((p,v)=>p.code===s[v].code)),u=T(t=>{r(t),!(!t||!E)&&t!==l&&$(t).catch(console.error)},[E,l]);w(()=>{if(!i)return;if(!!!(m!=null&&m.length)){u(void 0);return}const s=m[0].code;if(!l){u(s);return}const p=m.some(v=>v.code===l);u(p?l:s)},[m,i,l,u]);const I=t=>{u(t)},b=T((t,s)=>{if(!t){console.warn("Payment method handler is ignored because it has no code");return}if(!s){console.warn("Payment method handler is ignored because it is empty");return}h(p=>({...p,[t]:s}))},[]);w(()=>{e!=null&&e.Handlers&&Object.entries(e.Handlers).forEach(([t,s])=>{b(t,s)})},[b,e==null?void 0:e.Handlers]);const f=e!=null&&e.Main?n(L,{name:"PaymentMethods",slot:e==null?void 0:e.Main,context:{replaceHTML(t){this.replaceWith(t),k(!1)}}}):null,P=a?d[a]:null,O=P?n(L,{name:"PaymentMethodContent",slot:P,context:{cartId:D.cartId||"",replaceHTML(t){this.replaceWith(t)}}},P):void 0;return w(()=>{!c&&d!=N&&console.warn("Payment method handlers you have added are ignored because the default content has been replaced")},[c,d]),M(R,{children:[f&&n(f.type,{ref:f.ref,...f.props}),c&&n(Y,{initializing:i===!1,loading:i&&W,onChange:I,options:m,paymentMethodContent:O,selection:a})]})};V.displayName="PaymentMethodsContainer";const ke=J(V);export{ke as PaymentMethods,ke as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/PlaceOrder.js b/scripts/__dropins__/storefront-checkout/containers/PlaceOrder.js index f4b5b8ee0c..0c1eb8427b 100644 --- a/scripts/__dropins__/storefront-checkout/containers/PlaceOrder.js +++ b/scripts/__dropins__/storefront-checkout/containers/PlaceOrder.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as c}from"@dropins/tools/preact-jsx-runtime.js";import{U as y}from"../chunks/fetch-graphql.js";import{c as E}from"../chunks/store-config.js";import{s as P}from"../chunks/ServerErrorSignal.js";import{events as g}from"@dropins/tools/event-bus.js";import{classes as l}from"@dropins/tools/lib.js";import{p as v}from"../chunks/placeOrder2.js";/* empty css */import{Button as S}from"@dropins/tools/components.js";import{Text as b,useText as U}from"@dropins/tools/i18n.js";import{w}from"../chunks/withConditionalRendering.js";import{useState as T,useCallback as u,useEffect as z}from"@dropins/tools/preact-compat.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const H=({className:e,onClick:t,disabled:s=!1})=>c("div",{className:l(["checkout-place-order",e]),children:c(S,{className:l(["checkout-place-order__button",e]),"data-testid":"place-order-button",disabled:s,onClick:t,size:"medium",type:"submit",variant:"primary",children:c(b,{id:"Checkout.PlaceOrder.button"})},"placeOrder")}),I=e=>e instanceof TypeError||e instanceof y,f=({handleValidation:e,onPlaceOrder:t})=>{var d;const[s,h]=T(!1),{data:o,pending:O}=E.value,k=!!o,a=((d=o==null?void 0:o.selectedPaymentMethod)==null?void 0:d.code)||"",i=U({CheckoutUnexpectedError:"Checkout.ServerError.unexpected"}),m=u(r=>{P.value=I(r)?i.CheckoutUnexpectedError:r.message},[i]),C=u(async()=>{try{if(!(e?e():!0))return;t?await t({code:a}):await v()}catch(r){m(r)}},[e,t,a,m]);return z(()=>{const r=g.on("cart/initialized",n=>{const x=(n==null?void 0:n.items)||[];h(x.some(p=>p.outOfStock||p.insufficientQuantity))},{eager:!0});return()=>{r==null||r.off()}},[]),c(H,{onClick:C,disabled:!k||O||s})};f.displayName="PlaceOrderContainer";const W=w(f);export{W as PlaceOrder,W as default}; +import{jsx as c}from"@dropins/tools/preact-jsx-runtime.js";import{U as E}from"../chunks/fetch-graphql.js";import{c as P}from"../chunks/store-config.js";import{s as g}from"../chunks/ServerErrorSignal.js";import{events as v}from"@dropins/tools/event-bus.js";import{classes as S}from"@dropins/tools/lib.js";import{p as b}from"../chunks/placeOrder2.js";/* empty css */import{Button as U}from"@dropins/tools/components.js";import{Text as w,useText as N}from"@dropins/tools/i18n.js";import{w as T}from"../chunks/withConditionalRendering.js";import{useState as z,useCallback as p,useEffect as H}from"@dropins/tools/preact-compat.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../fragments.js";import"../chunks/synchronizeCheckout.js";const I=r=>r instanceof TypeError||r instanceof E,M=({className:r,disabled:t=!1,onClick:o})=>c("div",{className:S(["checkout-place-order",r]),children:c(U,{className:"checkout-place-order__button","data-testid":"place-order-button",disabled:t,onClick:o,size:"medium",type:"submit",variant:"primary",children:c(w,{id:"Checkout.PlaceOrder.button"})},"placeOrder")}),u=({disabled:r=!1,handleValidation:t,onPlaceOrder:o,...f})=>{var l;const[h,O]=z(!1),{data:s,pending:k}=P.value,C=!!s,n=((l=s==null?void 0:s.selectedPaymentMethod)==null?void 0:l.code)||"",i=N({CheckoutUnexpectedError:"Checkout.ServerError.unexpected"}),m=p(e=>{g.value=I(e)?i.CheckoutUnexpectedError:e.message},[i]),x=p(async()=>{try{if(!(t?t():!0))return;o?await o({code:n}):await b()}catch(e){m(e)}},[t,o,n,m]);return H(()=>{const e=v.on("cart/initialized",a=>{const y=(a==null?void 0:a.items)||[];O(y.some(d=>d.outOfStock||d.insufficientQuantity))},{eager:!0});return()=>{e==null||e.off()}},[]),c(M,{...f,onClick:x,disabled:r||!C||k||h})};u.displayName="PlaceOrderContainer";const Y=T(u);export{Y as PlaceOrder,Y as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/PlaceOrder/PlaceOrder.d.ts b/scripts/__dropins__/storefront-checkout/containers/PlaceOrder/PlaceOrder.d.ts index a651d81519..37d16c1ddd 100644 --- a/scripts/__dropins__/storefront-checkout/containers/PlaceOrder/PlaceOrder.d.ts +++ b/scripts/__dropins__/storefront-checkout/containers/PlaceOrder/PlaceOrder.d.ts @@ -1,6 +1,7 @@ import { HTMLAttributes } from 'preact/compat'; export interface PlaceOrderProps extends HTMLAttributes { + disabled?: boolean; handleValidation?: () => boolean; onPlaceOrder?: (ctx: PlaceOrderContext) => Promise; } diff --git a/scripts/__dropins__/storefront-checkout/containers/ServerError.js b/scripts/__dropins__/storefront-checkout/containers/ServerError.js index 675ba360bb..27e64533d2 100644 --- a/scripts/__dropins__/storefront-checkout/containers/ServerError.js +++ b/scripts/__dropins__/storefront-checkout/containers/ServerError.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as t,jsxs as u}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{IllustratedMessage as m,Icon as l,Button as n}from"@dropins/tools/components.js";/* empty css */import{classes as a}from"@dropins/tools/lib.js";import{useEffect as p}from"@dropins/tools/preact-hooks.js";/* empty css */import{S as d}from"../chunks/OrderError.js";import{useText as h}from"@dropins/tools/i18n.js";import{s as i}from"../chunks/ServerErrorSignal.js";import"@dropins/tools/preact-compat.js";import"@dropins/tools/signals.js";const v=({className:o,contactSupport:e,errorMessage:r,onClick:c})=>{const s=h({Title:"Checkout.ServerError.title",Message:"Checkout.ServerError.message",ContactSupport:"Checkout.ServerError.contactSupport",Button:"Checkout.ServerError.button"});return t(m,{"aria-invalid":"true","aria-describedby":"checkout-server-error__message","aria-live":"polite",className:a(["checkout-server-error",o]),"data-testid":"checkout-server-error",heading:r??s.Title,message:u("p",{id:a(["checkout-server-error__message"]),children:[s.Message,t("br",{}),t("span",{children:e??s.ContactSupport})]}),icon:t(l,{className:a(["checkout-server-error__icon"]),source:d}),action:t(n,{className:a(["checkout-server-error__button"]),onClick:c,children:s.Button})})},T=({onRetry:o,onServerError:e})=>{const r=i.value,c=async()=>{o==null||o(),i.value=void 0};return p(()=>{r&&(e==null||e(r))},[r,e]),r?t(v,{errorMessage:r,onClick:c}):null};export{T as ServerError,T as default}; +import{jsx as t,jsxs as u}from"@dropins/tools/preact-jsx-runtime.js";/* empty css */import{IllustratedMessage as m,Icon as l,Button as n}from"@dropins/tools/components.js";/* empty css */import{classes as a}from"@dropins/tools/lib.js";/* empty css *//* empty css */import{S as p}from"../chunks/OrderError.js";import{useText as d}from"@dropins/tools/i18n.js";/* empty css */import{s as i}from"../chunks/ServerErrorSignal.js";import{useEffect as h}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/preact-compat.js";import"@dropins/tools/signals.js";const v=({className:o,contactSupport:e,errorMessage:r,onClick:c})=>{const s=d({Title:"Checkout.ServerError.title",Message:"Checkout.ServerError.message",ContactSupport:"Checkout.ServerError.contactSupport",Button:"Checkout.ServerError.button"});return t(m,{"aria-invalid":"true","aria-describedby":"checkout-server-error__message","aria-live":"polite",className:a(["checkout-server-error",o]),"data-testid":"checkout-server-error",heading:r??s.Title,message:u("p",{id:a(["checkout-server-error__message"]),children:[s.Message,t("br",{}),t("span",{children:e??s.ContactSupport})]}),icon:t(l,{className:a(["checkout-server-error__icon"]),source:p}),action:t(n,{className:a(["checkout-server-error__button"]),onClick:c,children:s.Button})})},I=({onRetry:o,onServerError:e})=>{const r=i.value,c=async()=>{o==null||o(),i.value=void 0};return h(()=>{r&&(e==null||e(r))},[r,e]),r?t(v,{errorMessage:r,onClick:c}):null};export{I as ServerError,I as default}; diff --git a/scripts/__dropins__/storefront-checkout/containers/ShippingMethods.js b/scripts/__dropins__/storefront-checkout/containers/ShippingMethods.js index 645917dbe2..91c21ba66d 100644 --- a/scripts/__dropins__/storefront-checkout/containers/ShippingMethods.js +++ b/scripts/__dropins__/storefront-checkout/containers/ShippingMethods.js @@ -1,3 +1,3 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ -import{jsx as i,jsxs as L,Fragment as z}from"@dropins/tools/preact-jsx-runtime.js";import"../chunks/fetch-graphql.js";import{s as v,e as M,c as W,a as V}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import{events as T}from"@dropins/tools/event-bus.js";import{classes as j,Slot as A}from"@dropins/tools/lib.js";import{s as O}from"../chunks/setShippingMethods.js";/* empty css */import{IllustratedMessage as P,Icon as Z,ProgressSpinner as $,RadioButton as q,Price as F,Skeleton as G,SkeletonRow as _}from"@dropins/tools/components.js";/* empty css */import{H as J}from"../chunks/Heading.js";import{useState as I,useEffect as S}from"@dropins/tools/preact-hooks.js";/* empty css */import*as p from"@dropins/tools/preact-compat.js";import{useCallback as K,useMemo as Q,useEffect as X}from"@dropins/tools/preact-compat.js";import{useText as Y}from"@dropins/tools/i18n.js";import{w as D}from"../chunks/withConditionalRendering.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../chunks/synchronizeCheckout.js";import"../fragments.js";const U=e=>({countryCode:e.country_id,postCode:e.postcode||"",...e.region_id?{regionId:Number(e.region_id)}:{...e.region?{region:e.region}:{}}}),ee=e=>({carrierCode:e.carrier.code||"",methodCode:e.code||"",amount:e.amount,amountExclTax:e.amountExclTax,amountInclTax:e.amountInclTax}),te=e=>p.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M2.47266 4.90002H15.1851V10.9645H21.2495L23 12.715V17.6124H20.073",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M15.1758 5.87573H19.0019L21.0394 10.7636",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M9.76151 16.7898C9.76151 18.0525 8.72845 19.076 7.46582 19.076C6.20318 19.076 5.17969 18.0429 5.17969 16.7803C5.17969 15.5176 6.20318 14.4941 7.46582 14.4941C8.72845 14.4941 9.75195 15.5176 9.76151 16.7803C9.76151 16.7803 9.76151 16.7803 9.76151 16.7898Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.8726 16.7898C19.8726 18.062 18.8491 19.0855 17.5769 19.0855C16.3047 19.0855 15.2812 18.062 15.2812 16.7898C15.2812 15.5176 16.3047 14.4941 17.5769 14.4941C18.8491 14.4941 19.8726 15.5176 19.8726 16.7898Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M8.08792 7.63574H1.69824",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M7.11229 10.3619H1",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M5.16084 13.0402H1.92773",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M9.76172 16.7611H15.2809",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M2.38672 16.7611H5.17025",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),oe=({className:e,isLoading:t=!1,onSelectionChange:o=()=>{},options:s,selection:u,...a})=>{const c=Y({Title:"Checkout.ShippingMethods.title",EmptyState:"Checkout.ShippingMethods.emptyState"});return s===void 0?i(ne,{}):L("div",{...a,className:j(["checkout-shipping-methods",e]),children:[i(J,{level:3,className:"checkout-shipping-methods__title",children:c.Title}),!t&&s.length===0&&i(P,{icon:i(Z,{source:te}),message:i("p",{children:c.EmptyState})}),L("div",{className:j(["checkout-shipping-methods__content"]),children:[t&&i($,{className:"checkout-shipping-methods__spinner"}),i("div",{className:j(["checkout-shipping-methods__options",["checkout-shipping-methods__options--loading",t]]),children:s.map(n=>i(q,{"data-testid":"shipping-method-radiobutton","aria-busy":t,id:n.value,name:"shipping-method",className:"checkout-shipping-methods__method",label:L(z,{children:[i(F,{amount:n.amount.value,currency:n.amount.currency})," ",i("span",{children:n.carrier.title})]}),description:n.title,value:n.value,checked:(u==null?void 0:u.value)===n.value,onChange:()=>o(n)},n.value))})]})]})},ne=()=>L(G,{"data-testid":"shipping-methods-skeleton",children:[i(_,{variant:"heading",size:"small"}),i(_,{variant:"empty",size:"small"}),i(_,{size:"medium",fullWidth:!0}),i(_,{size:"medium",fullWidth:!0})]});function ie(){var C;const[e,t]=I(),[o,s]=I();S(()=>{T.on("checkout/estimate-shipping-address",({address:x,isValid:g})=>{t({address:x,isValid:g})})},[]),S(()=>{s(v.value)},[v.value]),S(()=>{M.value.pending?s(void 0):s(v.value)},[M.value.pending]);const{country_id:u,region_id:a,region:c,postcode:n}=(e==null?void 0:e.address)||{},f=!!e,r=W.value.data,k=!!((C=r==null?void 0:r.shippingAddresses)!=null&&C[0]),l=e==null?void 0:e.isValid;S(()=>{k||l||!o||!f||T.emit("shipping/estimate",{address:U({country_id:u,region_id:a,region:c,postcode:n}),shippingMethod:ee(o)})},[o,u,a,c,n,f,k,l])}const H=(e,t)=>e.code===t.code&&e.carrier.code===t.carrier.code;function re({onCheckoutDataUpdate:e,preSelectedMethod:t,onShippingMethodSelect:o}){const u=!V.value.data,a=W.value.data,c=W.value.pending,n=M.value.data,f=M.value.pending,r=v.value,k=a==null?void 0:a.shippingAddresses,l=k==null?void 0:k[0],C=!!l,x=l==null?void 0:l.availableShippingMethods,g=l==null?void 0:l.selectedShippingMethod,d=x||n,b=K(h=>{if(!C)return;const E={method_code:h.code,carrier_code:h.carrier.code};O([E]).then(()=>{e==null||e()}).catch(w=>{console.error("setting shipping methods on cart failed:",w)})},[C,e]),R=h=>{v.value=h,o==null||o(h)},m=Q(()=>{if(!(d!=null&&d.length))return;const h=d[0],E=r||g;return E?d.some(y=>H(y,E))?E:h:d.find(N=>N.carrier.code===(t==null?void 0:t.carrierCode)&&N.code===(t==null?void 0:t.methodCode))||h},[r,g,d,t]);return X(()=>{m&&((!r||!H(m,r))&&(v.value=m,o==null||o(m)),(!g||!H(m,g))&&b(m))},[m,r,g,b,o]),{isLoading:c||u||f,options:d,selection:m,onSelectionChange:R}}const B=({preSelectedMethod:e,onCheckoutDataUpdate:t,shippingMethodsSlot:o,onShippingMethodSelect:s,initialData:u,...a})=>{const{isLoading:c,options:n,selection:f,onSelectionChange:r}=re({preSelectedMethod:e,onCheckoutDataUpdate:t,onShippingMethodSelect:s});return ie(),L(z,{children:[i(oe,{...a,isLoading:c,onSelectionChange:r,options:n,selection:f}),!c&&o&&i(A,{name:"ShippingMethods",slot:o})]})};B.displayName="ShippingMethodsContainer";const je=D(B);export{je as ShippingMethods,je as default}; +import{jsx as i,jsxs as L,Fragment as R}from"@dropins/tools/preact-jsx-runtime.js";import"../chunks/fetch-graphql.js";import{s as v,e as M,c as x,a as V}from"../chunks/store-config.js";import"../chunks/ServerErrorSignal.js";import{events as T}from"@dropins/tools/event-bus.js";import{classes as W,Slot as O}from"@dropins/tools/lib.js";import{s as P}from"../chunks/setShippingMethods.js";/* empty css */import{IllustratedMessage as Z,Icon as $,ProgressSpinner as q,RadioButton as F,Price as G,Skeleton as J,SkeletonRow as S}from"@dropins/tools/components.js";import*as p from"@dropins/tools/preact-compat.js";import{useRef as K,useEffect as z,useCallback as Q,useMemo as X}from"@dropins/tools/preact-compat.js";import{useText as Y}from"@dropins/tools/i18n.js";import{useState as I,useEffect as _}from"@dropins/tools/preact-hooks.js";import{w as D}from"../chunks/withConditionalRendering.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"../chunks/synchronizeCheckout.js";import"../fragments.js";const U=e=>({countryCode:e.country_id,postCode:e.postcode||"",...e.region_id?{regionId:Number(e.region_id)}:{...e.region?{region:e.region}:{}}}),ee=e=>({carrierCode:e.carrier.code||"",methodCode:e.code||"",amount:e.amount,amountExclTax:e.amountExclTax,amountInclTax:e.amountInclTax}),te=e=>p.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M2.47266 4.90002H15.1851V10.9645H21.2495L23 12.715V17.6124H20.073",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M15.1758 5.87573H19.0019L21.0394 10.7636",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M9.76151 16.7898C9.76151 18.0525 8.72845 19.076 7.46582 19.076C6.20318 19.076 5.17969 18.0429 5.17969 16.7803C5.17969 15.5176 6.20318 14.4941 7.46582 14.4941C8.72845 14.4941 9.75195 15.5176 9.76151 16.7803C9.76151 16.7803 9.76151 16.7803 9.76151 16.7898Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M19.8726 16.7898C19.8726 18.062 18.8491 19.0855 17.5769 19.0855C16.3047 19.0855 15.2812 18.062 15.2812 16.7898C15.2812 15.5176 16.3047 14.4941 17.5769 14.4941C18.8491 14.4941 19.8726 15.5176 19.8726 16.7898Z",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M8.08792 7.63574H1.69824",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M7.11229 10.3619H1",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M5.16084 13.0402H1.92773",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M9.76172 16.7611H15.2809",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"}),p.createElement("path",{vectorEffect:"non-scaling-stroke",d:"M2.38672 16.7611H5.17025",stroke:"currentColor",strokeWidth:1,strokeLinecap:"round",strokeLinejoin:"round"})),ne=({className:e,isLoading:t=!1,onSelectionChange:n=()=>{},options:r,selection:a,...s})=>{const c=Y({Title:"Checkout.ShippingMethods.title",EmptyState:"Checkout.ShippingMethods.emptyState"});return r===void 0?i(oe,{}):L("div",{...s,className:W(["checkout-shipping-methods",e]),children:[i("h3",{className:"checkout-shipping-methods__title",children:c.Title}),!t&&r.length===0&&i(Z,{icon:i($,{source:te}),message:i("p",{children:c.EmptyState})}),L("div",{className:W(["checkout-shipping-methods__content"]),children:[t&&i(q,{className:"checkout-shipping-methods__spinner"}),i("div",{className:W(["checkout-shipping-methods__options",["checkout-shipping-methods__options--loading",t]]),children:r.map(o=>i(F,{"data-testid":"shipping-method-radiobutton","aria-busy":t,id:o.value,name:"shipping-method",className:"checkout-shipping-methods__method",label:L(R,{children:[i(G,{amount:o.amount.value,currency:o.amount.currency})," ",i("span",{children:o.carrier.title})]}),description:o.title,value:o.value,checked:(a==null?void 0:a.value)===o.value,onChange:()=>n(o)},o.value))})]})]})},oe=()=>L(J,{"data-testid":"shipping-methods-skeleton",children:[i(S,{variant:"heading",size:"small"}),i(S,{variant:"empty",size:"small"}),i(S,{size:"medium",fullWidth:!0}),i(S,{size:"medium",fullWidth:!0})]});function ie(){var C;const[e,t]=I(),[n,r]=I();_(()=>{T.on("checkout/estimate-shipping-address",({address:j,isValid:g})=>{t({address:j,isValid:g})})},[]),_(()=>{r(v.value)},[v.value]),_(()=>{M.value.pending?r(void 0):r(v.value)},[M.value.pending]);const{country_id:a,region_id:s,region:c,postcode:o}=(e==null?void 0:e.address)||{},f=!!e,l=x.value.data,k=!!((C=l==null?void 0:l.shippingAddresses)!=null&&C[0]),u=e==null?void 0:e.isValid;_(()=>{k||u||!n||!f||T.emit("shipping/estimate",{address:U({country_id:a,region_id:s,region:c,postcode:o}),shippingMethod:ee(n)})},[n,a,s,c,o,f,k,u])}const b=(e,t)=>e.code===t.code&&e.carrier.code===t.carrier.code,re=e=>{var r,a,s,c;const t=(c=(s=(a=(r=x.value.data)==null?void 0:r.shippingAddresses)==null?void 0:a[0])==null?void 0:s.selectedShippingMethod)==null?void 0:c.carrier.code,n=K();z(()=>{t!==n.current&&(n.current=t,t&&(e==null||e()))},[t,e])};function se({onCheckoutDataUpdate:e,preSelectedMethod:t,onShippingMethodSelect:n}){const a=!V.value.data,s=x.value.data,c=x.value.pending,o=M.value.data,f=M.value.pending,l=v.value,k=s==null?void 0:s.shippingAddresses,u=k==null?void 0:k[0],C=!!u,j=u==null?void 0:u.availableShippingMethods,g=u==null?void 0:u.selectedShippingMethod,d=j||o,w=Q(m=>{if(!C)return;const E={method_code:m.code,carrier_code:m.carrier.code};P([E]).catch(y=>{console.error("Setting shipping methods on cart failed:",y)})},[C,e]),B=m=>{v.value=m,n==null||n(m)},h=X(()=>{if(!(d!=null&&d.length))return;const m=d[0],E=l||g;return E?d.some(H=>b(H,E))?E:m:d.find(N=>N.carrier.code===(t==null?void 0:t.carrierCode)&&N.code===(t==null?void 0:t.methodCode))||m},[l,g,d,t]);return z(()=>{h&&((!l||!b(h,l))&&(v.value=h,n==null||n(h)),(!g||!b(h,g))&&w(h))},[h,l,g,w,n]),{isLoading:c||a||f,options:d,selection:h,onSelectionChange:B}}const A=({preSelectedMethod:e,onCheckoutDataUpdate:t,shippingMethodsSlot:n,onShippingMethodSelect:r,initialData:a,...s})=>{const{isLoading:c,options:o,selection:f,onSelectionChange:l}=se({preSelectedMethod:e,onCheckoutDataUpdate:t,onShippingMethodSelect:r});return ie(),re(t),L(R,{children:[i(ne,{...s,isLoading:c,onSelectionChange:l,options:o,selection:f}),!c&&n&&i(O,{name:"ShippingMethods",slot:n})]})};A.displayName="ShippingMethodsContainer";const Me=D(A);export{Me as ShippingMethods,Me as default}; diff --git a/scripts/__dropins__/storefront-checkout/lib/backup-data.d.ts b/scripts/__dropins__/storefront-checkout/lib/backup-data.d.ts deleted file mode 100644 index 929c09edc9..0000000000 --- a/scripts/__dropins__/storefront-checkout/lib/backup-data.d.ts +++ /dev/null @@ -1,20 +0,0 @@ -/******************************************************************** -* ADOBE CONFIDENTIAL -* __________________ -* -* Copyright 2024 Adobe -* All Rights Reserved. -* -* NOTICE: All information contained herein is, and remains -* the property of Adobe and its suppliers, if any. The intellectual -* and technical concepts contained herein are proprietary to Adobe -* and its suppliers and are protected by all applicable intellectual -* property laws, including trade secret and copyright laws. -* Dissemination of this information or reproduction of this material -* is strictly forbidden unless prior written permission is obtained -* from Adobe. -*******************************************************************/ -export declare const createBackup: (key: string, value: T) => void; -export declare const restoreBackup: (key: string) => T | null; -export declare const removeBackup: (key: string) => void; -//# sourceMappingURL=backup-data.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/lib/index.d.ts b/scripts/__dropins__/storefront-checkout/lib/index.d.ts index 23441b258c..84a72f08ea 100644 --- a/scripts/__dropins__/storefront-checkout/lib/index.d.ts +++ b/scripts/__dropins__/storefront-checkout/lib/index.d.ts @@ -14,7 +14,9 @@ * is strictly forbidden unless prior written permission is obtained * from Adobe. *******************************************************************/ +export * from './acdl'; export * from './fetch-error'; -export * from './redirect'; +export * from './network-error'; +export * from './state'; export * from './validation'; //# sourceMappingURL=index.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/lib/redirect.d.ts b/scripts/__dropins__/storefront-checkout/lib/redirect.d.ts deleted file mode 100644 index 21439d2633..0000000000 --- a/scripts/__dropins__/storefront-checkout/lib/redirect.d.ts +++ /dev/null @@ -1,18 +0,0 @@ -/******************************************************************** -* ADOBE CONFIDENTIAL -* __________________ -* -* Copyright 2024 Adobe -* All Rights Reserved. -* -* NOTICE: All information contained herein is, and remains -* the property of Adobe and its suppliers, if any. The intellectual -* and technical concepts contained herein are proprietary to Adobe -* and its suppliers and are protected by all applicable intellectual -* property laws, including trade secret and copyright laws. -* Dissemination of this information or reproduction of this material -* is strictly forbidden unless prior written permission is obtained -* from Adobe. -*******************************************************************/ -export declare function redirect(location: string): void; -//# sourceMappingURL=redirect.d.ts.map \ No newline at end of file diff --git a/scripts/__dropins__/storefront-checkout/render.js b/scripts/__dropins__/storefront-checkout/render.js index d83205f31c..d4283259db 100644 --- a/scripts/__dropins__/storefront-checkout/render.js +++ b/scripts/__dropins__/storefront-checkout/render.js @@ -1,7 +1,9 @@ /*! Copyright 2024 Adobe All Rights Reserved. */ (function(r,o){try{if(typeof document<"u"){const t=document.createElement("style"),n=o.styleId;for(const e in o.attributes)t.setAttribute(e,o.attributes[e]);t.setAttribute("data-dropin",n),t.appendChild(document.createTextNode(r));const a=document.querySelector('style[data-dropin="sdk"]');if(a)a.after(t);else{const e=document.querySelector('link[rel="stylesheet"], style');e?e.before(t):document.head.append(t)}}}catch(t){console.error("dropin-styles (injectCodeFunction)",t)}})(`.checkout__banner{margin-bottom:var(--spacing-xlarge)} -.checkout-estimate-shipping{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xxsmall);align-items:center;color:var(--color-neutral-800)}.checkout-estimate-shipping__label,.checkout-estimate-shipping__price{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.checkout-estimate-shipping__label--muted{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);color:var(--color-neutral-700)}.checkout-estimate-shipping__price--muted{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing)}.checkout-estimate-shipping__price{text-align:right}.checkout-estimate-shipping__label--bold,.checkout-estimate-shipping__price--bold{font:var(--type-body-1-emphasized-font);letter-spacing:var(--type-body-1-emphasized-letter-spacing)}.checkout-estimate-shipping__caption{font:var(--type-details-caption-2-font);letter-spacing:var(--type-details-caption-2-letter-spacing);color:var(--color-neutral-700)}.cart-order-summary__shipping .dropin-skeleton{grid-template-columns:1fr}.checkout-login-form__heading{display:grid;grid-template-columns:1fr max-content;grid-auto-rows:max-content}.checkout-login-form__content{grid-auto-rows:max-content}.checkout-login-form__customer-details{display:grid;grid-auto-flow:row;gap:var(--spacing-xxsmall)}.checkout-login-form__customer-name{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.checkout-login-form__customer-email{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);color:var(--color-neutral-700)}.checkout-login-form__title{grid-column-start:1;color:var(--color-neutral-800);font:var(--type-headline-2-default-font);letter-spacing:var(--type-headline-2-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-login-form__sign-in,.checkout-login-form__sign-out{grid-column-start:2;color:var(--color-neutral-800);font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);justify-self:flex-end;margin-top:var(--spacing-xxsmall)}a.checkout-login-form__link{font:var(--type-body-2-strong-font);margin-left:var(--spacing-xxsmall)}@media only screen and (min-width: 320px) and (max-width: 768px){.checkout-login-form__heading{grid-template-columns:repeat(1,1fr [col-start]);grid-template-rows:1fr}.checkout-login-form__sign-in,.checkout-login-form__sign-out{grid-column-start:1;align-self:flex-start;justify-self:flex-start;margin-top:0;margin-bottom:var(--spacing-medium)}}.checkout-out-of-stock.dropin-card{border-color:var(--color-warning-500)}.checkout-out-of-stock .dropin-card__content{gap:var(--spacing-small);padding:var(--spacing-small)}.checkout-out-of-stock__title{color:var(--color-neutral-900);font:var(--type-body-2-strong-font);margin:0;display:flex;gap:var(--spacing-xxsmall);align-items:center;justify-content:left;text-align:center}.checkout-out-of-stock__message{color:var(--color-neutral-800);font:var(--type-body-2-default-font);margin:0}.checkout-out-of-stock__items{display:grid;grid-template-columns:repeat(5,100px);grid-gap:var(--spacing-small);list-style:none;padding:0;margin:0}.checkout-out-of-stock__item img{width:100%;height:auto}.checkout-out-of-stock__actions{display:flex;gap:var(--spacing-small);justify-content:flex-end}a.checkout-out-of-stock__action{font:var(--type-details-caption-1-font)}.checkout-out-of-stock__action{background:none;border:none;padding:0;cursor:pointer}.checkout-out-of-stock__action:hover{--textColor: var(--color-brand-700);text-decoration:solid underline var(--textColor);text-underline-offset:6px}.checkout-overlay-loader{align-items:center;background:var(--color-neutral-50);display:flex;height:100vh;justify-content:center;left:0;opacity:.5;position:fixed;top:0;width:100%;z-index:9999}.checkout-payment-methods__title{color:var(--color-neutral-800);font:var(--type-headline-2-default-font);letter-spacing:var(--type-headline-2-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-payment-methods__wrapper{position:relative;display:grid}.checkout-payment-methods__methods{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-medium)}.checkout-payment-methods__content{margin-top:var(--spacing-medium)}.checkout-payment-methods--full-width{grid-template-columns:1fr}.checkout-payment-methods--loading{opacity:.4;pointer-events:none}.checkout-payment-methods__spinner{margin:0 auto;position:absolute;z-index:999;left:0;right:0;top:calc(50% - (var(--size) / 2));bottom:0}.checkout__content [data-slot=PaymentMethods]:empty{display:none}@media only screen and (min-width: 320px) and (max-width: 768px){.checkout-payment-methods__methods{grid-template-columns:1fr}}.checkout-server-error{position:relative;text-align:center}.checkout-server-error__icon .error-icon{color:var(--color-alert-500)}.checkout-server-error a{font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing)}.order-confirmation-header{text-align:center;padding:var(--spacing-xxbig)}.order-confirmation-header__icon{margin-bottom:var(--spacing-small)}.order-confirmation-header__title{color:var(--color-neutral-800);font:var(--type-headline-1-font);letter-spacing:var(--type-headline-1-letter-spacing);margin:0}.order-confirmation-header__title:first-letter{text-transform:uppercase}.order-confirmation-header__order{color:var(--color-neutral-700);font:var(--type-details-overline-font);letter-spacing:var(--type-details-overline-letter-spacing);margin:var(--spacing-xxsmall) 0 0 0}.order-confirmation-header .success-icon{color:var(--color-positive-500)}.order-confirmation-create-account{display:grid;gap:var(--spacing-small);margin-top:var(--spacing-large)}.order-confirmation-create-account__message{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);margin:0}.order-confirmation-create-account__button{display:flex;margin:0 auto;text-align:center}.checkout-shipping-methods__title{color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-shipping-methods__content{position:relative;display:block}.checkout-shipping-methods__method{margin-bottom:var(--spacing-medium);width:fit-content;cursor:pointer;font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing)}.checkout-shipping-methods__method:last-child{margin-bottom:0}.dropin-radio-button__label .dropin-price{color:var(--color-neutral-800);font-weight:400}.checkout-shipping-methods__options--loading{opacity:.4;pointer-events:none}.checkout-shipping-methods__spinner{margin:0 auto;position:absolute;z-index:999;left:0;right:0;top:calc(50% - (var(--size) / 2));bottom:0} +.checkout-estimate-shipping{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-xxsmall);align-items:center;color:var(--color-neutral-800)}.checkout-estimate-shipping__label,.checkout-estimate-shipping__price{font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.checkout-estimate-shipping__label--muted{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);color:var(--color-neutral-700)}.checkout-estimate-shipping__price--muted{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing)}.checkout-estimate-shipping__price{text-align:right}.checkout-estimate-shipping__label--bold,.checkout-estimate-shipping__price--bold{font:var(--type-body-1-emphasized-font);letter-spacing:var(--type-body-1-emphasized-letter-spacing)}.checkout-estimate-shipping__caption{font:var(--type-details-caption-2-font);letter-spacing:var(--type-details-caption-2-letter-spacing);color:var(--color-neutral-700)}.cart-order-summary__shipping .dropin-skeleton{grid-template-columns:1fr}.checkout-login-form__heading{display:grid;grid-template-columns:1fr max-content;grid-auto-rows:max-content}.checkout-login-form__content{grid-auto-rows:max-content}.checkout-login-form__content .dropin-field__hint a{font-weight:400}.checkout-login-form__customer-details{display:grid;grid-auto-flow:row;gap:var(--spacing-xxsmall)}.checkout-login-form__customer-name{font:var(--type-body-1-strong-font);letter-spacing:var(--type-body-1-default-letter-spacing)}.checkout-login-form__customer-email{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);color:var(--color-neutral-700)}.checkout-login-form__title{grid-column-start:1;color:var(--color-neutral-800);font:var(--type-headline-2-default-font);letter-spacing:var(--type-headline-2-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-login-form__sign-in,.checkout-login-form__sign-out{grid-column-start:2;color:var(--color-neutral-800);font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);justify-self:flex-end;margin-top:var(--spacing-xxsmall)}a.checkout-login-form__link{font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing);margin-left:var(--spacing-xxsmall)}@media only screen and (min-width: 320px) and (max-width: 768px){.checkout-login-form__heading{grid-template-columns:repeat(1,1fr [col-start]);grid-template-rows:1fr}.checkout-login-form__sign-in,.checkout-login-form__sign-out{grid-column-start:1;align-self:flex-start;justify-self:flex-start;margin-top:0;margin-bottom:var(--spacing-medium)}}.order-confirmation-header{text-align:center;padding:var(--spacing-xxbig)}.order-confirmation-header__icon{margin-bottom:var(--spacing-small)}.order-confirmation-header__title{color:var(--color-neutral-800);font:var(--type-headline-1-font);letter-spacing:var(--type-headline-1-letter-spacing);justify-content:center;margin:0}.order-confirmation-header__title:first-letter{text-transform:uppercase}.order-confirmation-header__order{color:var(--color-neutral-700);font:var(--type-details-overline-font);letter-spacing:var(--type-details-overline-letter-spacing);margin:var(--spacing-xxsmall) 0 0 0}.order-confirmation-header .success-icon{color:var(--color-positive-500)}.order-confirmation-create-account{display:grid;gap:var(--spacing-small);margin-top:var(--spacing-large)}.order-confirmation-create-account__message{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);margin:0}.order-confirmation-create-account__button{display:flex;margin:0 auto;text-align:center}.checkout-out-of-stock.dropin-card{border-color:var(--color-warning-500)}.checkout-out-of-stock .dropin-card__content{gap:var(--spacing-small);padding:var(--spacing-small)}.checkout-out-of-stock__title{color:var(--color-neutral-900);font:var(--type-body-2-strong-font);margin:0;display:flex;gap:var(--spacing-xxsmall);align-items:center;justify-content:left;text-align:center}.checkout-out-of-stock__message{color:var(--color-neutral-800);font:var(--type-body-2-default-font);margin:0}.checkout-out-of-stock__items{display:grid;grid-template-columns:repeat(5,100px);grid-gap:var(--spacing-small);list-style:none;padding:0;margin:0}.checkout-out-of-stock__item img{width:100%;height:auto}.checkout-out-of-stock__actions{display:flex;gap:var(--spacing-small);justify-content:flex-end}a.checkout-out-of-stock__action{font:var(--type-details-caption-1-font)}.checkout-out-of-stock__action{background:none;border:none;padding:0;cursor:pointer}.checkout-out-of-stock__action:hover{--textColor: var(--color-brand-700);text-decoration:solid underline var(--textColor);text-underline-offset:6px}.checkout-server-error{position:relative;text-align:center}.checkout-server-error__icon .error-icon{color:var(--color-alert-500)}.checkout-server-error a{font:var(--type-body-2-strong-font);letter-spacing:var(--type-body-2-strong-letter-spacing)} +.checkout-shipping-methods__title{color:var(--color-neutral-800);font:var(--type-body-1-default-font);letter-spacing:var(--type-body-1-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-shipping-methods__content{position:relative;display:block}.checkout-shipping-methods__method{margin-bottom:var(--spacing-medium);width:fit-content;cursor:pointer;font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing)}.checkout-shipping-methods__method:last-child{margin-bottom:0}.dropin-radio-button__label .dropin-price{color:var(--color-neutral-800);font-weight:400}.checkout-shipping-methods__options--loading{opacity:.4;pointer-events:none}.checkout-shipping-methods__spinner{margin:0 auto;position:absolute;z-index:999;left:0;right:0;top:calc(50% - (var(--size) / 2));bottom:0} .checkout-place-order{display:grid;padding-bottom:var(--spacing-big)}.checkout-place-order__button{align-self:flex-end;justify-self:flex-end}@media only screen and (min-width:320px) and (max-width: 768px){.checkout-place-order{background-color:var(--color-neutral-200);padding:var(--spacing-medium) var(--spacing-medium) var(--spacing-big) var(--spacing-medium)}.checkout-place-order__button{align-self:center;justify-self:stretch}} +.checkout-payment-methods__title{color:var(--color-neutral-800);font:var(--type-headline-2-default-font);letter-spacing:var(--type-headline-2-default-letter-spacing);margin:0 0 var(--spacing-medium) 0}.checkout-payment-methods__wrapper{position:relative;display:grid}.checkout-payment-methods__methods{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-medium)}.checkout-payment-methods__content{margin-top:var(--spacing-medium)}.checkout-payment-methods--full-width{grid-template-columns:1fr}.checkout-payment-methods--loading{opacity:.4;pointer-events:none}.checkout-payment-methods__spinner{margin:0 auto;position:absolute;z-index:999;left:0;right:0;top:calc(50% - (var(--size) / 2));bottom:0}.checkout__content [data-slot=PaymentMethods]:empty{display:none}@media only screen and (min-width: 320px) and (max-width: 768px){.checkout-payment-methods__methods{grid-template-columns:1fr}} .checkout-bill-to-shipping-address label{font:var(--type-body-2-default-font);letter-spacing:var(--type-body-2-default-letter-spacing);gap:0}`,{styleId:"checkout"}); import{jsx as f}from"@dropins/tools/preact-jsx-runtime.js";import{Render as d}from"@dropins/tools/lib.js";import"./chunks/fetch-graphql.js";import"./chunks/store-config.js";import"./chunks/ServerErrorSignal.js";import{events as p}from"@dropins/tools/event-bus.js";import{c as y}from"./chunks/synchronizeCheckout.js";import{UIProvider as g}from"@dropins/tools/components.js";import{useState as b,useEffect as h}from"@dropins/tools/preact-hooks.js";import"@dropins/tools/fetch-graphql.js";import"@dropins/tools/signals.js";import"./fragments.js";function O(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var S=function(r){return E(r)&&!v(r)};function E(e){return!!e&&typeof e=="object"}function v(e){var r=Object.prototype.toString.call(e);return r==="[object RegExp]"||r==="[object Date]"||M(e)}var w=typeof Symbol=="function"&&Symbol.for,j=w?Symbol.for("react.element"):60103;function M(e){return e.$$typeof===j}function A(e){return Array.isArray(e)?[]:{}}function i(e,r){return r.clone!==!1&&r.isMergeableObject(e)?a(A(e),e,r):e}function P(e,r,t){return e.concat(r).map(function(o){return i(o,t)})}function T(e,r){if(!r.customMerge)return a;var t=r.customMerge(e);return typeof t=="function"?t:a}function C(e){return Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(e).filter(function(r){return Object.propertyIsEnumerable.call(e,r)}):[]}function l(e){return Object.keys(e).concat(C(e))}function m(e,r){try{return r in e}catch{return!1}}function I(e,r){return m(e,r)&&!(Object.hasOwnProperty.call(e,r)&&Object.propertyIsEnumerable.call(e,r))}function x(e,r,t){var o={};return t.isMergeableObject(e)&&l(e).forEach(function(n){o[n]=i(e[n],t)}),l(r).forEach(function(n){I(e,n)||(m(e,n)&&t.isMergeableObject(r[n])?o[n]=T(n,t)(e[n],r[n],t):o[n]=i(r[n],t))}),o}function a(e,r,t){t=t||{},t.arrayMerge=t.arrayMerge||P,t.isMergeableObject=t.isMergeableObject||S,t.cloneUnlessOtherwiseSpecified=i;var o=Array.isArray(r),n=Array.isArray(e),c=o===n;return c?o?t.arrayMerge(e,r,t):x(e,r,t):i(r,t)}a.all=function(r,t){if(!Array.isArray(r))throw new Error("first argument should be an array");return r.reduce(function(o,n){return a(o,n,t)},{})};var D=a,k=D;const R=O(k),B={title:"Checkout",LoginForm:{title:"Contact details",account:"Already have an account?",ariaLabel:"Email",invalidEmailError:"Please enter a valid email address.",missingEmailError:"Enter an email address.",emailExists:{alreadyHaveAccount:"It looks like you already have an account.",signInButton:"Sign in",forFasterCheckout:"for a faster checkout."},floatingLabel:"Email *",placeholder:"Enter your email address",signIn:"Sign In",switch:"Do you want to switch account?",signOut:"Sign Out"},ShippingMethods:{title:"Shipping options",emptyState:"This order can't be shipped to the address provided. Please review the address details you entered and make sure they're correct."},BillToShippingAddress:{title:"Bill to shipping address"},PaymentMethods:{title:"Payment",emptyState:"No payment methods available"},OutOfStock:{title:"Your cart contains items that are out of stock",message:"The following items are out of stock:",actions:{reviewCart:"Review cart",removeOutOfStock:"Remove out of stock items"},lowInventory:{one:"Last item!",many:"Only {{count}} left!"},alert:"Out of stock!"},PlaceOrder:{button:"Place Order"},ServerError:{title:"We were unable to process your order",contactSupport:"If you continue to have issues, please contact support.",unexpected:"An unexpected error occurred while processing your order. Please try again later.",button:"Try again"},EmptyCart:{title:"Your cart is empty",button:"Start shopping"},ErrorBanner:{genericMessage:"Server error detected. Please check your connection and try again."},MergedCartBanner:{items:{one:"1 item from a previous session was added to your cart. Please review your new subtotal.",many:"{{count}} items from a previous session were added to your cart. Please review your new subtotal."}},EstimateShipping:{estimated:"Estimated Shipping",freeShipping:"Free",label:"Shipping",taxToBeDetermined:"TBD",withTaxes:"Including taxes",withoutTaxes:"Excluding taxes"},OrderConfirmationHeader:{title:"{{name}}, thank you for your order!",defaultTitle:"Thank you for your order!",order:"ORDER #{{order}}",CreateAccount:{message:"Save your information for faster checkout next time.",button:"Create an account"}}},L={Checkout:B},_={default:L},U=({children:e})=>{var c;const[r,t]=b(),o=(c=y.getConfig())==null?void 0:c.langDefinitions;h(()=>{const s=p.on("locale",u=>{u!==r&&t(u)},{eager:!0});return()=>{s==null||s.off()}},[r]);const n=R(_,o??{});return f(g,{lang:r,langDefinitions:n,children:e})},Q=new d(f(U,{}));export{U as Provider,Q as render}; diff --git a/scripts/checkout.js b/scripts/checkout.js index 88b23f619a..f0f323c687 100644 --- a/scripts/checkout.js +++ b/scripts/checkout.js @@ -1,3 +1,7 @@ +/* eslint-disable import/no-unresolved */ +import { events } from '@dropins/tools/event-bus.js'; +import { debounce } from '@dropins/tools/lib.js'; + export function scrollToElement(element) { element.scrollIntoView({ behavior: 'smooth' }); element.focus(); @@ -32,26 +36,22 @@ export function getCartAddress(checkoutData, type) { } export function getCartDeliveryMethod(data) { - if (!data) return; + if (!data) return null; const shippingAddresses = data.shippingAddresses || []; - if (shippingAddresses.length === 0) return; - // eslint-disable-next-line consistent-return + if (shippingAddresses.length === 0) return null; return shippingAddresses[0]?.selectedShippingMethod; } -export function setAddressOnCart(values, setCartAddress) { - const { data, isDataValid } = values; +const transformAddressFormValues = (data) => { const isNewAddress = !data?.id; - if (!isDataValid) return; - const customAttributes = data.customAttributes?.map(({ code, value }) => ({ code, value: String(value), })); // TODO: implement new address creation - const address = !isNewAddress + return !isNewAddress ? { customerAddressId: data.id } : { address: { @@ -74,6 +74,64 @@ export function setAddressOnCart(values, setCartAddress) { saveInAddressBook: data.saveAddressBook, }, }; +}; + +export function setAddressOnCart({ api, debounceMs = 0, placeOrderBtn = null }) { + const debouncedApi = debounce((address) => { + api(address) + .catch(console.error) + .finally(() => { + placeOrderBtn?.setProps((prev) => ({ ...prev, disabled: false })); + }); + }, debounceMs); + + return ({ data, isDataValid }) => { + if (!isDataValid) return; + placeOrderBtn?.setProps((prev) => ({ ...prev, disabled: true })); + const address = transformAddressFormValues(data); + debouncedApi(address); + }; +} + +export function estimateShippingCost({ api, debounceMs = 0 }) { + let prevEstimateShippingData = {}; + + const debouncedApi = debounce((data) => { + const criteria = { + country_code: data.countryCode, + region_name: String(data.region.regionCode || ''), + region_id: String(data.region.regionId || ''), + }; + + api({ criteria }); - setCartAddress(address); + events.emit('checkout/estimate-shipping-address', { + address: { + country_id: data.countryCode, + region: String(data.region.regionCode || ''), + region_id: String(data.region.regionId || ''), + postcode: data.postcode, + }, + }); + + prevEstimateShippingData = { + countryCode: data.countryCode, + regionCode: data.region.regionCode, + regionId: data.region.regionId, + postcode: data.postcode, + }; + }, debounceMs); + + return ({ data, isDataValid }) => { + if (isDataValid) return; + + if ( + prevEstimateShippingData.countryCode === data.countryCode + && prevEstimateShippingData.regionCode === data.region.regionCode + && prevEstimateShippingData.regionId === data.region.regionId + && prevEstimateShippingData.postcode === data.postcode + ) return; + + debouncedApi(data); + }; }