@shopify/hydrogen-react 2025.5.0 → 2025.7.1

package/dist/browser-prod/useCartActions.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useCartActions.mjs","sources":["../../src/useCartActions.tsx"],"sourcesContent":["import {useCallback, useMemo} from 'react';\nimport {\n  AttributeInput,\n  CartBuyerIdentityInput,\n  CartInput,\n  CartLineInput,\n  CartLineUpdateInput,\n  CountryCode,\n  LanguageCode,\n  Cart as CartType,\n  MutationCartDiscountCodesUpdateArgs,\n  MutationCartNoteUpdateArgs,\n} from './storefront-api-types.js';\nimport {\n  CartAttributesUpdate,\n  CartBuyerIdentityUpdate,\n  CartCreate,\n  CartDiscountCodesUpdate,\n  CartLineAdd,\n  CartLineRemove,\n  CartLineUpdate,\n  CartNoteUpdate,\n  CartQuery,\n} from './cart-queries.js';\nimport {useCartFetch} from './cart-hooks.js';\nimport {PartialDeep} from 'type-fest';\n\ntype CartResponse = PartialDeep<CartType, {recurseIntoArrays: true}>;\n\n/**\n * The `useCartActions` hook returns helper graphql functions for Storefront Cart API\n *\n * See [cart API graphql mutations](https://shopify.dev/api/storefront/2025-04/objects/Cart)\n */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nexport function useCartActions({\n  numCartLines,\n  cartFragment,\n  countryCode = 'US',\n  languageCode = 'EN',\n}: {\n  /**  Maximum number of cart lines to fetch. Defaults to 250 cart lines. */\n  numCartLines?: number;\n  /** A fragment used to query the Storefront API's [Cart object](https://shopify.dev/api/storefront/2025-04/objects/cart) for all queries and mutations. A default value is used if no argument is provided. */\n  cartFragment: string;\n  /** The ISO country code for i18n. Default to `US` */\n  countryCode?: CountryCode;\n  /** The ISO language code for i18n. Default to `EN` */\n  languageCode?: LanguageCode;\n}) {\n  const fetchCart = useCartFetch();\n\n  const cartFetch = useCallback(\n    (cartId: string) => {\n      return fetchCart<{cart: CartResponse}>({\n        query: CartQuery(cartFragment),\n        variables: {\n          id: cartId,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [fetchCart, cartFragment, numCartLines, countryCode, languageCode],\n  );\n\n  const cartCreate = useCallback(\n    (cart: CartInput) => {\n      return fetchCart<{cartCreate: {cart: CartResponse}}>({\n        query: CartCreate(cartFragment),\n        variables: {\n          input: cart,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineAdd = useCallback(\n    (cartId: string, lines: CartLineInput[]) => {\n      return fetchCart<{cartLinesAdd: {cart: CartResponse}}>({\n        query: CartLineAdd(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineUpdate = useCallback(\n    (cartId: string, lines: CartLineUpdateInput[]) => {\n      return fetchCart<{cartLinesUpdate: {cart: CartResponse}}>({\n        query: CartLineUpdate(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineRemove = useCallback(\n    (cartId: string, lines: string[]) => {\n      return fetchCart<{cartLinesRemove: {cart: CartResponse}}>({\n        query: CartLineRemove(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const noteUpdate = useCallback(\n    (cartId: string, note: MutationCartNoteUpdateArgs['note']) => {\n      return fetchCart<{cartNoteUpdate: {cart: CartResponse}}>({\n        query: CartNoteUpdate(cartFragment),\n        variables: {\n          cartId,\n          note,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [fetchCart, cartFragment, numCartLines, countryCode, languageCode],\n  );\n\n  const buyerIdentityUpdate = useCallback(\n    (cartId: string, buyerIdentity: CartBuyerIdentityInput) => {\n      return fetchCart<{cartBuyerIdentityUpdate: {cart: CartResponse}}>({\n        query: CartBuyerIdentityUpdate(cartFragment),\n        variables: {\n          cartId,\n          buyerIdentity,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartAttributesUpdate = useCallback(\n    (cartId: string, attributes: AttributeInput[]) => {\n      return fetchCart<{cartAttributesUpdate: {cart: CartResponse}}>({\n        query: CartAttributesUpdate(cartFragment),\n        variables: {\n          cartId,\n          attributes,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const discountCodesUpdate = useCallback(\n    (\n      cartId: string,\n      discountCodes: MutationCartDiscountCodesUpdateArgs['discountCodes'],\n    ) => {\n      return fetchCart<{cartDiscountCodesUpdate: {cart: CartResponse}}>({\n        query: CartDiscountCodesUpdate(cartFragment),\n        variables: {\n          cartId,\n          discountCodes,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  return useMemo(\n    () => ({\n      cartFetch,\n      cartCreate,\n      cartLineAdd,\n      cartLineUpdate,\n      cartLineRemove,\n      noteUpdate,\n      buyerIdentityUpdate,\n      cartAttributesUpdate,\n      discountCodesUpdate,\n      cartFragment,\n    }),\n    [\n      cartFetch,\n      cartCreate,\n      cartLineAdd,\n      cartLineUpdate,\n      cartLineRemove,\n      noteUpdate,\n      buyerIdentityUpdate,\n      cartAttributesUpdate,\n      discountCodesUpdate,\n      cartFragment,\n    ],\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useCartActions.mjs","sources":["../../src/useCartActions.tsx"],"sourcesContent":["import {useCallback, useMemo} from 'react';\nimport {\n  AttributeInput,\n  CartBuyerIdentityInput,\n  CartInput,\n  CartLineInput,\n  CartLineUpdateInput,\n  CountryCode,\n  LanguageCode,\n  Cart as CartType,\n  MutationCartDiscountCodesUpdateArgs,\n  MutationCartNoteUpdateArgs,\n} from './storefront-api-types.js';\nimport {\n  CartAttributesUpdate,\n  CartBuyerIdentityUpdate,\n  CartCreate,\n  CartDiscountCodesUpdate,\n  CartLineAdd,\n  CartLineRemove,\n  CartLineUpdate,\n  CartNoteUpdate,\n  CartQuery,\n} from './cart-queries.js';\nimport {useCartFetch} from './cart-hooks.js';\nimport {PartialDeep} from 'type-fest';\n\ntype CartResponse = PartialDeep<CartType, {recurseIntoArrays: true}>;\n\n/**\n * The `useCartActions` hook returns helper graphql functions for Storefront Cart API\n *\n * See [cart API graphql mutations](https://shopify.dev/api/storefront/2025-07/objects/Cart)\n */\n// eslint-disable-next-line @typescript-eslint/explicit-function-return-type\nexport function useCartActions({\n  numCartLines,\n  cartFragment,\n  countryCode = 'US',\n  languageCode = 'EN',\n}: {\n  /**  Maximum number of cart lines to fetch. Defaults to 250 cart lines. */\n  numCartLines?: number;\n  /** A fragment used to query the Storefront API's [Cart object](https://shopify.dev/api/storefront/2025-07/objects/cart) for all queries and mutations. A default value is used if no argument is provided. */\n  cartFragment: string;\n  /** The ISO country code for i18n. Default to `US` */\n  countryCode?: CountryCode;\n  /** The ISO language code for i18n. Default to `EN` */\n  languageCode?: LanguageCode;\n}) {\n  const fetchCart = useCartFetch();\n\n  const cartFetch = useCallback(\n    (cartId: string) => {\n      return fetchCart<{cart: CartResponse}>({\n        query: CartQuery(cartFragment),\n        variables: {\n          id: cartId,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [fetchCart, cartFragment, numCartLines, countryCode, languageCode],\n  );\n\n  const cartCreate = useCallback(\n    (cart: CartInput) => {\n      return fetchCart<{cartCreate: {cart: CartResponse}}>({\n        query: CartCreate(cartFragment),\n        variables: {\n          input: cart,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineAdd = useCallback(\n    (cartId: string, lines: CartLineInput[]) => {\n      return fetchCart<{cartLinesAdd: {cart: CartResponse}}>({\n        query: CartLineAdd(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineUpdate = useCallback(\n    (cartId: string, lines: CartLineUpdateInput[]) => {\n      return fetchCart<{cartLinesUpdate: {cart: CartResponse}}>({\n        query: CartLineUpdate(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartLineRemove = useCallback(\n    (cartId: string, lines: string[]) => {\n      return fetchCart<{cartLinesRemove: {cart: CartResponse}}>({\n        query: CartLineRemove(cartFragment),\n        variables: {\n          cartId,\n          lines,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const noteUpdate = useCallback(\n    (cartId: string, note: MutationCartNoteUpdateArgs['note']) => {\n      return fetchCart<{cartNoteUpdate: {cart: CartResponse}}>({\n        query: CartNoteUpdate(cartFragment),\n        variables: {\n          cartId,\n          note,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [fetchCart, cartFragment, numCartLines, countryCode, languageCode],\n  );\n\n  const buyerIdentityUpdate = useCallback(\n    (cartId: string, buyerIdentity: CartBuyerIdentityInput) => {\n      return fetchCart<{cartBuyerIdentityUpdate: {cart: CartResponse}}>({\n        query: CartBuyerIdentityUpdate(cartFragment),\n        variables: {\n          cartId,\n          buyerIdentity,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const cartAttributesUpdate = useCallback(\n    (cartId: string, attributes: AttributeInput[]) => {\n      return fetchCart<{cartAttributesUpdate: {cart: CartResponse}}>({\n        query: CartAttributesUpdate(cartFragment),\n        variables: {\n          cartId,\n          attributes,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  const discountCodesUpdate = useCallback(\n    (\n      cartId: string,\n      discountCodes: MutationCartDiscountCodesUpdateArgs['discountCodes'],\n    ) => {\n      return fetchCart<{cartDiscountCodesUpdate: {cart: CartResponse}}>({\n        query: CartDiscountCodesUpdate(cartFragment),\n        variables: {\n          cartId,\n          discountCodes,\n          numCartLines,\n          country: countryCode,\n          language: languageCode,\n        },\n      });\n    },\n    [cartFragment, countryCode, fetchCart, numCartLines, languageCode],\n  );\n\n  return useMemo(\n    () => ({\n      cartFetch,\n      cartCreate,\n      cartLineAdd,\n      cartLineUpdate,\n      cartLineRemove,\n      noteUpdate,\n      buyerIdentityUpdate,\n      cartAttributesUpdate,\n      discountCodesUpdate,\n      cartFragment,\n    }),\n    [\n      cartFetch,\n      cartCreate,\n      cartLineAdd,\n      cartLineUpdate,\n      cartLineRemove,\n      noteUpdate,\n      buyerIdentityUpdate,\n      cartAttributesUpdate,\n      discountCodesUpdate,\n      cartFragment,\n    ],\n  );\n}\n"],"names":[],"mappings":";;;AAmCO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AACjB,GASG;AACD,QAAM,YAAY,aAAA;AAElB,QAAM,YAAY;AAAA,IAChB,CAAC,WAAmB;AAClB,aAAO,UAAgC;AAAA,QACrC,OAAO,UAAU,YAAY;AAAA,QAC7B,WAAW;AAAA,UACT,IAAI;AAAA,UACJ;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,WAAW,cAAc,cAAc,aAAa,YAAY;AAAA,EAAA;AAGnE,QAAM,aAAa;AAAA,IACjB,CAAC,SAAoB;AACnB,aAAO,UAA8C;AAAA,QACnD,OAAO,WAAW,YAAY;AAAA,QAC9B,WAAW;AAAA,UACT,OAAO;AAAA,UACP;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,cAAc;AAAA,IAClB,CAAC,QAAgB,UAA2B;AAC1C,aAAO,UAAgD;AAAA,QACrD,OAAO,YAAY,YAAY;AAAA,QAC/B,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,iBAAiB;AAAA,IACrB,CAAC,QAAgB,UAAiC;AAChD,aAAO,UAAmD;AAAA,QACxD,OAAO,eAAe,YAAY;AAAA,QAClC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,iBAAiB;AAAA,IACrB,CAAC,QAAgB,UAAoB;AACnC,aAAO,UAAmD;AAAA,QACxD,OAAO,eAAe,YAAY;AAAA,QAClC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,aAAa;AAAA,IACjB,CAAC,QAAgB,SAA6C;AAC5D,aAAO,UAAkD;AAAA,QACvD,OAAO,eAAe,YAAY;AAAA,QAClC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,WAAW,cAAc,cAAc,aAAa,YAAY;AAAA,EAAA;AAGnE,QAAM,sBAAsB;AAAA,IAC1B,CAAC,QAAgB,kBAA0C;AACzD,aAAO,UAA2D;AAAA,QAChE,OAAO,wBAAwB,YAAY;AAAA,QAC3C,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,uBAAuB;AAAA,IAC3B,CAAC,QAAgB,eAAiC;AAChD,aAAO,UAAwD;AAAA,QAC7D,OAAO,qBAAqB,YAAY;AAAA,QACxC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,QAAM,sBAAsB;AAAA,IAC1B,CACE,QACA,kBACG;AACH,aAAO,UAA2D;AAAA,QAChE,OAAO,wBAAwB,YAAY;AAAA,QAC3C,WAAW;AAAA,UACT;AAAA,UACA;AAAA,UACA;AAAA,UACA,SAAS;AAAA,UACT,UAAU;AAAA,QAAA;AAAA,MACZ,CACD;AAAA,IACH;AAAA,IACA,CAAC,cAAc,aAAa,WAAW,cAAc,YAAY;AAAA,EAAA;AAGnE,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/browser-prod/useMoney.mjs

@@ -9,6 +9,17 @@ function useMoney(money) {
     );
   }
   const amount = parseFloat(money.amount);
+  let isCurrencySupported = true;
+  try {
+    new Intl.NumberFormat(locale, {
+      style: "currency",
+      currency: money.currencyCode
+    });
+  } catch (e) {
+    if (e instanceof RangeError && e.message.includes("currency")) {
+      isCurrencySupported = false;
+    }
+  }
   const {
     defaultFormatter,
     nameFormatter,
@@ -17,9 +28,13 @@ function useMoney(money) {
     withoutCurrencyFormatter,
     withoutTrailingZerosOrCurrencyFormatter
   } = useMemo(() => {
-    const options = {
+    const options = isCurrencySupported ? {
       style: "currency",
       currency: money.currencyCode
+    } : {
+      style: "decimal",
+      minimumFractionDigits: 2,
+      maximumFractionDigits: 2
     };
     return {
       defaultFormatter: getLazyFormatter(locale, options),
@@ -36,21 +51,39 @@ function useMoney(money) {
         minimumFractionDigits: 0,
         maximumFractionDigits: 0
       }),
-      withoutCurrencyFormatter: getLazyFormatter(locale),
+      withoutCurrencyFormatter: getLazyFormatter(locale, {
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2
+      }),
       withoutTrailingZerosOrCurrencyFormatter: getLazyFormatter(locale, {
         minimumFractionDigits: 0,
         maximumFractionDigits: 0
       })
     };
-  }, [money.currencyCode, locale]);
+  }, [money.currencyCode, locale, isCurrencySupported]);
   const isPartCurrency = (part) => part.type === "currency";
   const lazyFormatters = useMemo(
     () => ({
       original: () => money,
       currencyCode: () => money.currencyCode,
-      localizedString: () => defaultFormatter().format(amount),
-      parts: () => defaultFormatter().formatToParts(amount),
-      withoutTrailingZeros: () => amount % 1 === 0 ? withoutTrailingZerosFormatter().format(amount) : defaultFormatter().format(amount),
+      localizedString: () => {
+        const formatted = defaultFormatter().format(amount);
+        return isCurrencySupported ? formatted : `${formatted} ${money.currencyCode}`;
+      },
+      parts: () => {
+        const parts = defaultFormatter().formatToParts(amount);
+        if (!isCurrencySupported) {
+          parts.push(
+            { type: "literal", value: " " },
+            { type: "currency", value: money.currencyCode }
+          );
+        }
+        return parts;
+      },
+      withoutTrailingZeros: () => {
+        const formatted = amount % 1 === 0 ? withoutTrailingZerosFormatter().format(amount) : defaultFormatter().format(amount);
+        return isCurrencySupported ? formatted : `${formatted} ${money.currencyCode}`;
+      },
       withoutTrailingZerosAndCurrency: () => amount % 1 === 0 ? withoutTrailingZerosOrCurrencyFormatter().format(amount) : withoutCurrencyFormatter().format(amount),
       currencyName: () => {
         var _a;
@@ -76,6 +109,7 @@ function useMoney(money) {
     [
       money,
       amount,
+      isCurrencySupported,
       nameFormatter,
       defaultFormatter,
       narrowSymbolFormatter,
@@ -101,7 +135,19 @@ function getLazyFormatter(locale, options) {
   return function() {
     let formatter = formatterCache.get(key);
     if (!formatter) {
-      formatter = new Intl.NumberFormat(locale, options);
+      try {
+        formatter = new Intl.NumberFormat(locale, options);
+      } catch (error) {
+        if (error instanceof RangeError && error.message.includes("currency")) {
+          const fallbackOptions = { ...options };
+          delete fallbackOptions.currency;
+          delete fallbackOptions.currencyDisplay;
+          delete fallbackOptions.currencySign;
+          formatter = new Intl.NumberFormat(locale, fallbackOptions);
+        } else {
+          throw error;
+        }
+      }
       formatterCache.set(key, formatter);
     }
     return formatter;

package/dist/browser-prod/useMoney.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useMoney.mjs","sources":["../../src/useMoney.tsx"],"sourcesContent":["import {useMemo} from 'react';\nimport {useShop} from './ShopifyProvider.js';\nimport {CurrencyCode, MoneyV2} from './storefront-api-types.js';\n\nexport type UseMoneyValue = {\n  /**\n   * The currency code from the `MoneyV2` object.\n   */\n  currencyCode: CurrencyCode;\n  /**\n   * The name for the currency code, returned by `Intl.NumberFormat`.\n   */\n  currencyName?: string;\n  /**\n   * The currency symbol returned by `Intl.NumberFormat`.\n   */\n  currencySymbol?: string;\n  /**\n   * The currency narrow symbol returned by `Intl.NumberFormat`.\n   */\n  currencyNarrowSymbol?: string;\n  /**\n   * The localized amount, without any currency symbols or non-number types from the `Intl.NumberFormat.formatToParts` parts.\n   */\n  amount: string;\n  /**\n   * All parts returned by `Intl.NumberFormat.formatToParts`.\n   */\n  parts: Intl.NumberFormatPart[];\n  /**\n   * A string returned by `new Intl.NumberFormat` for the amount and currency code,\n   * using the `locale` value in the [`LocalizationProvider` component](https://shopify.dev/api/hydrogen/components/localization/localizationprovider).\n   */\n  localizedString: string;\n  /**\n   * The `MoneyV2` object provided as an argument to the hook.\n   */\n  original: MoneyV2;\n  /**\n   * A string with trailing zeros removed from the fractional part, if any exist. If there are no trailing zeros, then the fractional part remains.\n   * For example, `$640.00` turns into `$640`.\n   * `$640.42` remains `$640.42`.\n   */\n  withoutTrailingZeros: string;\n  /**\n   * A string without currency and without trailing zeros removed from the fractional part, if any exist. If there are no trailing zeros, then the fractional part remains.\n   * For example, `$640.00` turns into `640`.\n   * `$640.42` turns into `640.42`.\n   */\n  withoutTrailingZerosAndCurrency: string;\n};\n\n/**\n * The `useMoney` hook takes a [MoneyV2 object](https://shopify.dev/api/storefront/reference/common-objects/moneyv2) and returns a\n * default-formatted string of the amount with the correct currency indicator, along with some of the parts provided by\n * [Intl.NumberFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).\n * Uses `locale` from `ShopifyProvider`\n * &nbsp;\n * @see {@link https://shopify.dev/api/hydrogen/hooks/usemoney}\n * @example initialize the money object\n * ```ts\n * const money = useMoney({\n *   amount: '100.00',\n *   currencyCode: 'USD'\n * })\n * ```\n * &nbsp;\n *\n * @example basic usage, outputs: $100.00\n * ```ts\n * money.localizedString\n * ```\n * &nbsp;\n *\n * @example without currency, outputs: 100.00\n * ```ts\n * money.amount\n * ```\n * &nbsp;\n *\n * @example without trailing zeros, outputs: $100\n * ```ts\n * money.withoutTrailingZeros\n * ```\n * &nbsp;\n *\n * @example currency name, outputs: US dollars\n * ```ts\n * money.currencyCode\n * ```\n * &nbsp;\n *\n * @example currency symbol, outputs: $\n * ```ts\n * money.currencySymbol\n * ```\n * &nbsp;\n *\n * @example without currency and without trailing zeros, outputs: 100\n * ```ts\n * money.withoutTrailingZerosAndCurrency\n * ```\n */\nexport function useMoney(money: MoneyV2): UseMoneyValue {\n  const {countryIsoCode, languageIsoCode} = useShop();\n  const locale = languageIsoCode.includes('_')\n    ? languageIsoCode.replace('_', '-')\n    : `${languageIsoCode}-${countryIsoCode}`;\n\n  if (!locale) {\n    throw new Error(\n      `useMoney(): Unable to get 'locale' from 'useShop()', which means that 'locale' was not passed to '<ShopifyProvider/>'. 'locale' is required for 'useMoney()' to work`,\n    );\n  }\n\n  const amount = parseFloat(money.amount);\n\n  const {\n    defaultFormatter,\n    nameFormatter,\n    narrowSymbolFormatter,\n    withoutTrailingZerosFormatter,\n    withoutCurrencyFormatter,\n    withoutTrailingZerosOrCurrencyFormatter,\n  } = useMemo(() => {\n    const options = {\n      style: 'currency' as const,\n      currency: money.currencyCode,\n    };\n\n    return {\n      defaultFormatter: getLazyFormatter(locale, options),\n      nameFormatter: getLazyFormatter(locale, {\n        ...options,\n        currencyDisplay: 'name',\n      }),\n      narrowSymbolFormatter: getLazyFormatter(locale, {\n        ...options,\n        currencyDisplay: 'narrowSymbol',\n      }),\n      withoutTrailingZerosFormatter: getLazyFormatter(locale, {\n        ...options,\n        minimumFractionDigits: 0,\n        maximumFractionDigits: 0,\n      }),\n      withoutCurrencyFormatter: getLazyFormatter(locale),\n      withoutTrailingZerosOrCurrencyFormatter: getLazyFormatter(locale, {\n        minimumFractionDigits: 0,\n        maximumFractionDigits: 0,\n      }),\n    };\n  }, [money.currencyCode, locale]);\n\n  const isPartCurrency = (part: Intl.NumberFormatPart): boolean =>\n    part.type === 'currency';\n\n  // By wrapping these properties in functions, we only\n  // create formatters if they are going to be used.\n  const lazyFormatters = useMemo(\n    () => ({\n      original: (): MoneyV2 => money,\n      currencyCode: (): CurrencyCode => money.currencyCode,\n\n      localizedString: (): string => defaultFormatter().format(amount),\n\n      parts: (): Intl.NumberFormatPart[] =>\n        defaultFormatter().formatToParts(amount),\n\n      withoutTrailingZeros: (): string =>\n        amount % 1 === 0\n          ? withoutTrailingZerosFormatter().format(amount)\n          : defaultFormatter().format(amount),\n\n      withoutTrailingZerosAndCurrency: (): string =>\n        amount % 1 === 0\n          ? withoutTrailingZerosOrCurrencyFormatter().format(amount)\n          : withoutCurrencyFormatter().format(amount),\n\n      currencyName: (): string =>\n        nameFormatter().formatToParts(amount).find(isPartCurrency)?.value ??\n        money.currencyCode, // e.g. \"US dollars\"\n\n      currencySymbol: (): string =>\n        defaultFormatter().formatToParts(amount).find(isPartCurrency)?.value ??\n        money.currencyCode, // e.g. \"USD\"\n\n      currencyNarrowSymbol: (): string =>\n        narrowSymbolFormatter().formatToParts(amount).find(isPartCurrency)\n          ?.value ?? '', // e.g. \"$\"\n\n      amount: (): string =>\n        defaultFormatter()\n          .formatToParts(amount)\n          .filter((part) =>\n            ['decimal', 'fraction', 'group', 'integer', 'literal'].includes(\n              part.type,\n            ),\n          )\n          .map((part) => part.value)\n          .join(''),\n    }),\n    [\n      money,\n      amount,\n      nameFormatter,\n      defaultFormatter,\n      narrowSymbolFormatter,\n      withoutCurrencyFormatter,\n      withoutTrailingZerosFormatter,\n      withoutTrailingZerosOrCurrencyFormatter,\n    ],\n  );\n\n  // Call functions automatically when the properties are accessed\n  // to keep these functions as an implementation detail.\n  return useMemo(\n    () =>\n      new Proxy(lazyFormatters as unknown as UseMoneyValue, {\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call\n        get: (target, key) => Reflect.get(target, key)?.call(null),\n      }),\n    [lazyFormatters],\n  );\n}\n\nconst formatterCache = new Map<string, Intl.NumberFormat>();\n\nfunction getLazyFormatter(\n  locale: string,\n  options?: Intl.NumberFormatOptions,\n): () => Intl.NumberFormat {\n  const key = JSON.stringify([locale, options]);\n\n  return function (): Intl.NumberFormat {\n    let formatter = formatterCache.get(key);\n    if (!formatter) {\n      formatter = new Intl.NumberFormat(locale, options);\n      formatterCache.set(key, formatter);\n    }\n    return formatter;\n  };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useMoney.mjs","sources":["../../src/useMoney.tsx"],"sourcesContent":["import {useMemo} from 'react';\nimport {useShop} from './ShopifyProvider.js';\nimport {\n  CurrencyCode as StorefrontApiCurrencyCode,\n  MoneyV2 as StorefrontApiMoneyV2,\n} from './storefront-api-types.js';\nimport type {\n  MoneyV2 as CustomerAccountApiMoneyV2,\n  CurrencyCode as CustomerAccountApiCurrencyCode,\n} from './customer-account-api-types.js';\n\n// Support MoneyV2 from both Storefront API and Customer Account API\n// The APIs may have different CurrencyCode enums\n/**\n * Supports MoneyV2 from both Storefront API and Customer Account API.\n * The APIs may have different CurrencyCode enums (e.g., Customer Account API added USDC in 2025-07, but Storefront API doesn't support USDC in 2025-07).\n * This union type ensures useMoney works with data from either API.\n */\ntype MoneyV2 = StorefrontApiMoneyV2 | CustomerAccountApiMoneyV2;\n\n/**\n * Supports CurrencyCode from both Storefront API and Customer Account API. The APIs may have different CurrencyCode enums (e.g., Customer Account API added USDC in 2025-07, but Storefront API doesn't support USDC in 2025-07).\n * This union type ensures useMoney works with data from either API.\n */\ntype CurrencyCode = StorefrontApiCurrencyCode | CustomerAccountApiCurrencyCode;\n\nexport type UseMoneyValue = {\n  /**\n   * The currency code from the `MoneyV2` object.\n   */\n  currencyCode: CurrencyCode;\n  /**\n   * The name for the currency code, returned by `Intl.NumberFormat`.\n   */\n  currencyName?: string;\n  /**\n   * The currency symbol returned by `Intl.NumberFormat`.\n   */\n  currencySymbol?: string;\n  /**\n   * The currency narrow symbol returned by `Intl.NumberFormat`.\n   */\n  currencyNarrowSymbol?: string;\n  /**\n   * The localized amount, without any currency symbols or non-number types from the `Intl.NumberFormat.formatToParts` parts.\n   */\n  amount: string;\n  /**\n   * All parts returned by `Intl.NumberFormat.formatToParts`.\n   */\n  parts: Intl.NumberFormatPart[];\n  /**\n   * A string returned by `new Intl.NumberFormat` for the amount and currency code,\n   * using the `locale` value in the [`LocalizationProvider` component](https://shopify.dev/api/hydrogen/components/localization/localizationprovider).\n   */\n  localizedString: string;\n  /**\n   * The `MoneyV2` object provided as an argument to the hook.\n   */\n  original: MoneyV2;\n  /**\n   * A string with trailing zeros removed from the fractional part, if any exist. If there are no trailing zeros, then the fractional part remains.\n   * For example, `$640.00` turns into `$640`.\n   * `$640.42` remains `$640.42`.\n   */\n  withoutTrailingZeros: string;\n  /**\n   * A string without currency and without trailing zeros removed from the fractional part, if any exist. If there are no trailing zeros, then the fractional part remains.\n   * For example, `$640.00` turns into `640`.\n   * `$640.42` turns into `640.42`.\n   */\n  withoutTrailingZerosAndCurrency: string;\n};\n\n/**\n * The `useMoney` hook takes a [MoneyV2 object from the Storefront API](https://shopify.dev/docs/api/storefront/2025-07/objects/MoneyV2)\n * or a [MoneyV2 object from the Customer Account API](https://shopify.dev/docs/api/customer/2025-07/objects/moneyv2) and returns a\n * default-formatted string of the amount with the correct currency indicator, along with some of the parts provided by\n * [Intl.NumberFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat).\n * Uses `locale` from `ShopifyProvider`\n * &nbsp;\n * @see {@link https://shopify.dev/api/hydrogen/hooks/usemoney}\n * @example initialize the money object\n * ```ts\n * const money = useMoney({\n *   amount: '100.00',\n *   currencyCode: 'USD'\n * })\n * ```\n * &nbsp;\n *\n * @example basic usage, outputs: $100.00\n * ```ts\n * money.localizedString\n * ```\n * &nbsp;\n *\n * @example without currency, outputs: 100.00\n * ```ts\n * money.amount\n * ```\n * &nbsp;\n *\n * @example without trailing zeros, outputs: $100\n * ```ts\n * money.withoutTrailingZeros\n * ```\n * &nbsp;\n *\n * @example currency name, outputs: US dollars\n * ```ts\n * money.currencyCode\n * ```\n * &nbsp;\n *\n * @example currency symbol, outputs: $\n * ```ts\n * money.currencySymbol\n * ```\n * &nbsp;\n *\n * @example without currency and without trailing zeros, outputs: 100\n * ```ts\n * money.withoutTrailingZerosAndCurrency\n * ```\n */\nexport function useMoney(money: MoneyV2): UseMoneyValue {\n  const {countryIsoCode, languageIsoCode} = useShop();\n  const locale = languageIsoCode.includes('_')\n    ? languageIsoCode.replace('_', '-')\n    : `${languageIsoCode}-${countryIsoCode}`;\n\n  if (!locale) {\n    throw new Error(\n      `useMoney(): Unable to get 'locale' from 'useShop()', which means that 'locale' was not passed to '<ShopifyProvider/>'. 'locale' is required for 'useMoney()' to work`,\n    );\n  }\n\n  const amount = parseFloat(money.amount);\n\n  // Check if the currency code is supported by Intl.NumberFormat\n  let isCurrencySupported = true;\n  try {\n    new Intl.NumberFormat(locale, {\n      style: 'currency',\n      currency: money.currencyCode,\n    });\n  } catch (e) {\n    if (e instanceof RangeError && e.message.includes('currency')) {\n      isCurrencySupported = false;\n    }\n  }\n\n  const {\n    defaultFormatter,\n    nameFormatter,\n    narrowSymbolFormatter,\n    withoutTrailingZerosFormatter,\n    withoutCurrencyFormatter,\n    withoutTrailingZerosOrCurrencyFormatter,\n  } = useMemo(() => {\n    // For unsupported currencies (like USDC cryptocurrency), use decimal formatting with 2 decimal places\n    // We default to 2 decimal places based on research showing USDC displays like USD to reinforce its 1:1 peg\n    const options = isCurrencySupported\n      ? {\n          style: 'currency' as const,\n          currency: money.currencyCode,\n        }\n      : {\n          style: 'decimal' as const,\n          minimumFractionDigits: 2,\n          maximumFractionDigits: 2,\n        };\n\n    return {\n      defaultFormatter: getLazyFormatter(locale, options),\n      nameFormatter: getLazyFormatter(locale, {\n        ...options,\n        currencyDisplay: 'name',\n      }),\n      narrowSymbolFormatter: getLazyFormatter(locale, {\n        ...options,\n        currencyDisplay: 'narrowSymbol',\n      }),\n      withoutTrailingZerosFormatter: getLazyFormatter(locale, {\n        ...options,\n        minimumFractionDigits: 0,\n        maximumFractionDigits: 0,\n      }),\n      withoutCurrencyFormatter: getLazyFormatter(locale, {\n        minimumFractionDigits: 2,\n        maximumFractionDigits: 2,\n      }),\n      withoutTrailingZerosOrCurrencyFormatter: getLazyFormatter(locale, {\n        minimumFractionDigits: 0,\n        maximumFractionDigits: 0,\n      }),\n    };\n  }, [money.currencyCode, locale, isCurrencySupported]);\n\n  const isPartCurrency = (part: Intl.NumberFormatPart): boolean =>\n    part.type === 'currency';\n\n  // By wrapping these properties in functions, we only\n  // create formatters if they are going to be used.\n  const lazyFormatters = useMemo(\n    () => ({\n      original: (): MoneyV2 => money,\n      currencyCode: (): CurrencyCode => money.currencyCode,\n\n      localizedString: (): string => {\n        const formatted = defaultFormatter().format(amount);\n        // For unsupported currencies, append the currency code\n        return isCurrencySupported\n          ? formatted\n          : `${formatted} ${money.currencyCode}`;\n      },\n\n      parts: (): Intl.NumberFormatPart[] => {\n        const parts = defaultFormatter().formatToParts(amount);\n        // For unsupported currencies, add currency code as a currency part\n        if (!isCurrencySupported) {\n          parts.push(\n            {type: 'literal', value: ' '},\n            {type: 'currency', value: money.currencyCode},\n          );\n        }\n        return parts;\n      },\n\n      withoutTrailingZeros: (): string => {\n        const formatted =\n          amount % 1 === 0\n            ? withoutTrailingZerosFormatter().format(amount)\n            : defaultFormatter().format(amount);\n        // For unsupported currencies, append the currency code\n        return isCurrencySupported\n          ? formatted\n          : `${formatted} ${money.currencyCode}`;\n      },\n\n      withoutTrailingZerosAndCurrency: (): string =>\n        amount % 1 === 0\n          ? withoutTrailingZerosOrCurrencyFormatter().format(amount)\n          : withoutCurrencyFormatter().format(amount),\n\n      currencyName: (): string =>\n        nameFormatter().formatToParts(amount).find(isPartCurrency)?.value ??\n        money.currencyCode, // e.g. \"US dollars\"\n\n      currencySymbol: (): string =>\n        defaultFormatter().formatToParts(amount).find(isPartCurrency)?.value ??\n        money.currencyCode, // e.g. \"USD\"\n\n      currencyNarrowSymbol: (): string =>\n        narrowSymbolFormatter().formatToParts(amount).find(isPartCurrency)\n          ?.value ?? '', // e.g. \"$\"\n\n      amount: (): string =>\n        defaultFormatter()\n          .formatToParts(amount)\n          .filter((part) =>\n            ['decimal', 'fraction', 'group', 'integer', 'literal'].includes(\n              part.type,\n            ),\n          )\n          .map((part) => part.value)\n          .join(''),\n    }),\n    [\n      money,\n      amount,\n      isCurrencySupported,\n      nameFormatter,\n      defaultFormatter,\n      narrowSymbolFormatter,\n      withoutCurrencyFormatter,\n      withoutTrailingZerosFormatter,\n      withoutTrailingZerosOrCurrencyFormatter,\n    ],\n  );\n\n  // Call functions automatically when the properties are accessed\n  // to keep these functions as an implementation detail.\n  return useMemo(\n    () =>\n      new Proxy(lazyFormatters as unknown as UseMoneyValue, {\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-return, @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-call\n        get: (target, key) => Reflect.get(target, key)?.call(null),\n      }),\n    [lazyFormatters],\n  );\n}\n\nconst formatterCache = new Map<string, Intl.NumberFormat>();\n\nfunction getLazyFormatter(\n  locale: string,\n  options?: Intl.NumberFormatOptions,\n): () => Intl.NumberFormat {\n  const key = JSON.stringify([locale, options]);\n\n  return function (): Intl.NumberFormat {\n    let formatter = formatterCache.get(key);\n    if (!formatter) {\n      try {\n        formatter = new Intl.NumberFormat(locale, options);\n      } catch (error) {\n        // Handle unsupported currency codes (e.g., USDC from Customer Account API)\n        // Fall back to formatting without currency\n        if (error instanceof RangeError && error.message.includes('currency')) {\n          const fallbackOptions = {...options};\n          delete fallbackOptions.currency;\n          delete fallbackOptions.currencyDisplay;\n          delete fallbackOptions.currencySign;\n          formatter = new Intl.NumberFormat(locale, fallbackOptions);\n        } else {\n          throw error;\n        }\n      }\n      formatterCache.set(key, formatter);\n    }\n    return formatter;\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/browser-prod/useSelectedOptionInUrlParam.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectedOptionInUrlParam.mjs","sources":["../../src/useSelectedOptionInUrlParam.tsx"],"sourcesContent":["import {useEffect} from 'react';\nimport {mapSelectedProductOptionToObject} from './getProductOptions.js';\nimport {SelectedOption} from './storefront-api-types.js';\n\nexport function useSelectedOptionInUrlParam(\n  selectedOptions: Pick<SelectedOption, 'name' | 'value'>[],\n): null {\n  useEffect(() => {\n    const optionsSearchParams = new URLSearchParams(\n      mapSelectedProductOptionToObject(selectedOptions || []),\n    );\n    const currentSearchParams = new URLSearchParams(window.location.search);\n\n    // ts ignoring the URLSearchParams not iterable error for now\n    // https://stackoverflow.com/questions/72522489/urlsearchparams-not-accepting-string#answer-72522838\n    // TODO: update ts lib\n    const combinedSearchParams = new URLSearchParams({\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      ...Object.fromEntries(currentSearchParams),\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      ...Object.fromEntries(optionsSearchParams),\n    });\n\n    if (combinedSearchParams.size > 0) {\n      window.history.replaceState(\n        {},\n        '',\n        `${window.location.pathname}?${combinedSearchParams.toString()}`,\n      );\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(selectedOptions)]);\n\n  return null;\n}\n"],"names":[],"mappings":";;AAIO,SAAS,4BACd,iBACM;AACN,YAAU,MAAM;AACd,UAAM,sBAAsB,IAAI;AAAA,MAC9B,iCAAiC,mBAAmB,CAAE,CAAA;AAAA,IACxD;AACA,UAAM,sBAAsB,IAAI,gBAAgB,OAAO,SAAS,MAAM;AAKhE,UAAA,uBAAuB,IAAI,gBAAgB;AAAA;AAAA;AAAA,MAG/C,GAAG,OAAO,YAAY,mBAAmB;AAAA;AAAA;AAAA,MAGzC,GAAG,OAAO,YAAY,mBAAmB;AAAA,IAAA,CAC1C;AAEG,QAAA,qBAAqB,OAAO,GAAG;AACjC,aAAO,QAAQ;AAAA,QACb,CAAC;AAAA,QACD;AAAA,QACA,GAAG,OAAO,SAAS,QAAQ,IAAI,qBAAqB,UAAU;AAAA,MAChE;AAAA,IAAA;AAAA,KAGD,CAAC,KAAK,UAAU,eAAe,CAAC,CAAC;AAE7B,SAAA;AACT;"}
+{"version":3,"file":"useSelectedOptionInUrlParam.mjs","sources":["../../src/useSelectedOptionInUrlParam.tsx"],"sourcesContent":["import {useEffect} from 'react';\nimport {mapSelectedProductOptionToObject} from './getProductOptions.js';\nimport {SelectedOption} from './storefront-api-types.js';\n\nexport function useSelectedOptionInUrlParam(\n  selectedOptions: Pick<SelectedOption, 'name' | 'value'>[],\n): null {\n  useEffect(() => {\n    const optionsSearchParams = new URLSearchParams(\n      mapSelectedProductOptionToObject(selectedOptions || []),\n    );\n    const currentSearchParams = new URLSearchParams(window.location.search);\n\n    // ts ignoring the URLSearchParams not iterable error for now\n    // https://stackoverflow.com/questions/72522489/urlsearchparams-not-accepting-string#answer-72522838\n    // TODO: update ts lib\n    const combinedSearchParams = new URLSearchParams({\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      ...Object.fromEntries(currentSearchParams),\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-ignore\n      ...Object.fromEntries(optionsSearchParams),\n    });\n\n    if (combinedSearchParams.size > 0) {\n      window.history.replaceState(\n        {},\n        '',\n        `${window.location.pathname}?${combinedSearchParams.toString()}`,\n      );\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(selectedOptions)]);\n\n  return null;\n}\n"],"names":[],"mappings":";;AAIO,SAAS,4BACd,iBACM;AACN,YAAU,MAAM;AACd,UAAM,sBAAsB,IAAI;AAAA,MAC9B,iCAAiC,mBAAmB,CAAA,CAAE;AAAA,IAAA;AAExD,UAAM,sBAAsB,IAAI,gBAAgB,OAAO,SAAS,MAAM;AAKtE,UAAM,uBAAuB,IAAI,gBAAgB;AAAA;AAAA;AAAA,MAG/C,GAAG,OAAO,YAAY,mBAAmB;AAAA;AAAA;AAAA,MAGzC,GAAG,OAAO,YAAY,mBAAmB;AAAA,IAAA,CAC1C;AAED,QAAI,qBAAqB,OAAO,GAAG;AACjC,aAAO,QAAQ;AAAA,QACb,CAAA;AAAA,QACA;AAAA,QACA,GAAG,OAAO,SAAS,QAAQ,IAAI,qBAAqB,UAAU;AAAA,MAAA;AAAA,IAElE;AAAA,EAEF,GAAG,CAAC,KAAK,UAAU,eAAe,CAAC,CAAC;AAEpC,SAAO;AACT;"}

package/dist/browser-prod/useShopifyCookies.mjs

@@ -1,18 +1,27 @@
-import { useEffect } from "react";
+import { useEffect, useState, useRef } from "react";
 import { stringify } from "worktop/cookie";
 import { SHOPIFY_Y, SHOPIFY_S } from "./cart-constants.mjs";
-import { getShopifyCookies, buildUUID } from "./cookies-utils.mjs";
+import { buildUUID } from "./cookies-utils.mjs";
+import { getTrackingValues, SHOPIFY_UNIQUE_TOKEN_HEADER, SHOPIFY_VISIT_TOKEN_HEADER } from "./tracking-utils.mjs";
 const longTermLength = 60 * 60 * 24 * 360 * 1;
 const shortTermLength = 60 * 30;
 function useShopifyCookies(options) {
   const {
-    hasUserConsent = false,
+    hasUserConsent,
     domain = "",
-    checkoutDomain = ""
+    checkoutDomain = "",
+    storefrontAccessToken,
+    fetchTrackingValues,
+    ignoreDeprecatedCookies = false
   } = options || {};
+  const coreCookiesReady = useCoreShopifyCookies({
+    storefrontAccessToken,
+    fetchTrackingValues,
+    checkoutDomain
+  });
   useEffect(() => {
-    const cookies = getShopifyCookies(document.cookie);
-    let currentDomain = domain || window.document.location.host;
+    if (ignoreDeprecatedCookies || !coreCookiesReady) return;
+    let currentDomain = domain || window.location.host;
     if (checkoutDomain) {
       const checkoutDomainParts = checkoutDomain.split(".").reverse();
       const currentDomainParts = currentDomain.split(".").reverse();
@@ -27,15 +36,19 @@ function useShopifyCookies(options) {
     if (/^localhost/.test(currentDomain)) currentDomain = "";
     const domainWithLeadingDot = currentDomain ? /^\./.test(currentDomain) ? currentDomain : `.${currentDomain}` : "";
     if (hasUserConsent) {
+      const trackingValues = getTrackingValues();
+      if ((trackingValues.uniqueToken || trackingValues.visitToken || "").startsWith("00000000-")) {
+        return;
+      }
       setCookie(
         SHOPIFY_Y,
-        cookies[SHOPIFY_Y] || buildUUID(),
+        trackingValues.uniqueToken || buildUUID(),
         longTermLength,
         domainWithLeadingDot
       );
       setCookie(
         SHOPIFY_S,
-        cookies[SHOPIFY_S] || buildUUID(),
+        trackingValues.visitToken || buildUUID(),
         shortTermLength,
         domainWithLeadingDot
       );
@@ -43,7 +56,14 @@ function useShopifyCookies(options) {
       setCookie(SHOPIFY_Y, "", 0, domainWithLeadingDot);
       setCookie(SHOPIFY_S, "", 0, domainWithLeadingDot);
     }
-  }, [options, hasUserConsent, domain, checkoutDomain]);
+  }, [
+    coreCookiesReady,
+    hasUserConsent,
+    domain,
+    checkoutDomain,
+    ignoreDeprecatedCookies
+  ]);
+  return coreCookiesReady;
 }
 function setCookie(name, value, maxage, domain) {
   document.cookie = stringify(name, value, {
@@ -53,6 +73,73 @@ function setCookie(name, value, maxage, domain) {
     path: "/"
   });
 }
+async function fetchTrackingValuesFromBrowser(storefrontAccessToken, storefrontApiDomain = "") {
+  const { uniqueToken, visitToken } = getTrackingValues();
+  const response = await fetch(
+    // TODO: update this endpoint when it becomes stable
+    `${storefrontApiDomain.replace(/\/+$/, "")}/api/unstable/graphql.json`,
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...storefrontAccessToken && {
+          "X-Shopify-Storefront-Access-Token": storefrontAccessToken
+        },
+        ...visitToken || uniqueToken ? {
+          [SHOPIFY_VISIT_TOKEN_HEADER]: visitToken,
+          [SHOPIFY_UNIQUE_TOKEN_HEADER]: uniqueToken
+        } : void 0
+      },
+      body: JSON.stringify({
+        query: (
+          // This query ensures we get _cmp (consent) server-timing header, which is not available in other queries.
+          // This value can be passed later to consent-tracking-api and privacy-banner scripts to avoid extra requests.
+          "query ensureCookies { consentManagement { cookies(visitorConsent:{}) { cookieDomain } } }"
+        )
+      })
+    }
+  );
+  if (!response.ok) {
+    throw new Error(
+      `Failed to fetch consent from browser: ${response.status} ${response.statusText}`
+    );
+  }
+  await response.json();
+  getTrackingValues();
+}
+function useCoreShopifyCookies({
+  checkoutDomain,
+  storefrontAccessToken,
+  fetchTrackingValues = false
+}) {
+  const [cookiesReady, setCookiesReady] = useState(!fetchTrackingValues);
+  const hasFetchedTrackingValues = useRef(false);
+  useEffect(() => {
+    if (!fetchTrackingValues) {
+      setCookiesReady(true);
+      return;
+    }
+    if (hasFetchedTrackingValues.current) return;
+    hasFetchedTrackingValues.current = true;
+    fetchTrackingValuesFromBrowser(storefrontAccessToken).catch(
+      (error) => checkoutDomain ? (
+        // Retry with checkout domain if available to at least
+        // get the server-timing values for tracking.
+        fetchTrackingValuesFromBrowser(
+          storefrontAccessToken,
+          checkoutDomain
+        )
+      ) : Promise.reject(error)
+    ).catch((error) => {
+      console.warn(
+        "[h2:warn:useShopifyCookies] Failed to fetch tracking values from browser: " + (error instanceof Error ? error.message : String(error))
+      );
+    }).finally(() => {
+      setCookiesReady(true);
+    });
+  }, [checkoutDomain, fetchTrackingValues, storefrontAccessToken]);
+  return cookiesReady;
+}
 export {
   useShopifyCookies
 };

package/dist/browser-prod/useShopifyCookies.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useShopifyCookies.mjs","sources":["../../src/useShopifyCookies.tsx"],"sourcesContent":["import {useEffect} from 'react';\nimport {stringify} from 'worktop/cookie';\nimport {SHOPIFY_Y, SHOPIFY_S} from './cart-constants.js';\nimport {buildUUID, getShopifyCookies} from './cookies-utils.js';\n\nconst longTermLength = 60 * 60 * 24 * 360 * 1; // ~1 year expiry\nconst shortTermLength = 60 * 30; // 30 mins\n\ntype UseShopifyCookiesOptions = {\n  /**\n   * If set to `false`, Shopify cookies will be removed.\n   * If set to `true`, Shopify unique user token cookie will have cookie expiry of 1 year.\n   * Defaults to false.\n   **/\n  hasUserConsent?: boolean;\n  /**\n   * The domain scope of the cookie. Defaults to empty string.\n   **/\n  domain?: string;\n  /**\n   * The checkout domain of the shop. Defaults to empty string. If set, the cookie domain will check if it can be set with the checkout domain.\n   */\n  checkoutDomain?: string;\n};\n\nexport function useShopifyCookies(options?: UseShopifyCookiesOptions): void {\n  const {\n    hasUserConsent = false,\n    domain = '',\n    checkoutDomain = '',\n  } = options || {};\n  useEffect(() => {\n    const cookies = getShopifyCookies(document.cookie);\n\n    /**\n     * Setting cookie with domain\n     *\n     * If no domain is provided, the cookie will be set for the current host.\n     * For Shopify, we need to ensure this domain is set with a leading dot.\n     */\n\n    // Use override domain or current host\n    let currentDomain = domain || window.document.location.host;\n\n    if (checkoutDomain) {\n      const checkoutDomainParts = checkoutDomain.split('.').reverse();\n      const currentDomainParts = currentDomain.split('.').reverse();\n      const sameDomainParts: Array<string> = [];\n      checkoutDomainParts.forEach((part, index) => {\n        if (part === currentDomainParts[index]) {\n          sameDomainParts.push(part);\n        }\n      });\n\n      currentDomain = sameDomainParts.reverse().join('.');\n    }\n\n    // Reset domain if localhost\n    if (/^localhost/.test(currentDomain)) currentDomain = '';\n\n    // Shopify checkout only consumes cookies set with leading dot domain\n    const domainWithLeadingDot = currentDomain\n      ? /^\\./.test(currentDomain)\n        ? currentDomain\n        : `.${currentDomain}`\n      : '';\n\n    /**\n     * Set user and session cookies and refresh the expiry time\n     */\n    if (hasUserConsent) {\n      setCookie(\n        SHOPIFY_Y,\n        cookies[SHOPIFY_Y] || buildUUID(),\n        longTermLength,\n        domainWithLeadingDot,\n      );\n      setCookie(\n        SHOPIFY_S,\n        cookies[SHOPIFY_S] || buildUUID(),\n        shortTermLength,\n        domainWithLeadingDot,\n      );\n    } else {\n      setCookie(SHOPIFY_Y, '', 0, domainWithLeadingDot);\n      setCookie(SHOPIFY_S, '', 0, domainWithLeadingDot);\n    }\n  }, [options, hasUserConsent, domain, checkoutDomain]);\n}\n\nfunction setCookie(\n  name: string,\n  value: string,\n  maxage: number,\n  domain: string,\n): void {\n  document.cookie = stringify(name, value, {\n    maxage,\n    domain,\n    samesite: 'Lax',\n    path: '/',\n  });\n}\n"],"names":[],"mappings":";;;;AAKA,MAAM,iBAAiB,KAAK,KAAK,KAAK,MAAM;AAC5C,MAAM,kBAAkB,KAAK;AAmBtB,SAAS,kBAAkB,SAA0C;AACpE,QAAA;AAAA,IACJ,iBAAiB;AAAA,IACjB,SAAS;AAAA,IACT,iBAAiB;AAAA,EACnB,IAAI,WAAW,CAAC;AAChB,YAAU,MAAM;AACR,UAAA,UAAU,kBAAkB,SAAS,MAAM;AAUjD,QAAI,gBAAgB,UAAU,OAAO,SAAS,SAAS;AAEvD,QAAI,gBAAgB;AAClB,YAAM,sBAAsB,eAAe,MAAM,GAAG,EAAE,QAAQ;AAC9D,YAAM,qBAAqB,cAAc,MAAM,GAAG,EAAE,QAAQ;AAC5D,YAAM,kBAAiC,CAAC;AACpB,0BAAA,QAAQ,CAAC,MAAM,UAAU;AACvC,YAAA,SAAS,mBAAmB,KAAK,GAAG;AACtC,0BAAgB,KAAK,IAAI;AAAA,QAAA;AAAA,MAC3B,CACD;AAED,sBAAgB,gBAAgB,UAAU,KAAK,GAAG;AAAA,IAAA;AAIpD,QAAI,aAAa,KAAK,aAAa,EAAmB,iBAAA;AAGhD,UAAA,uBAAuB,gBACzB,MAAM,KAAK,aAAa,IACtB,gBACA,IAAI,aAAa,KACnB;AAKJ,QAAI,gBAAgB;AAClB;AAAA,QACE;AAAA,QACA,QAAQ,SAAS,KAAK,UAAU;AAAA,QAChC;AAAA,QACA;AAAA,MACF;AACA;AAAA,QACE;AAAA,QACA,QAAQ,SAAS,KAAK,UAAU;AAAA,QAChC;AAAA,QACA;AAAA,MACF;AAAA,IAAA,OACK;AACK,gBAAA,WAAW,IAAI,GAAG,oBAAoB;AACtC,gBAAA,WAAW,IAAI,GAAG,oBAAoB;AAAA,IAAA;AAAA,KAEjD,CAAC,SAAS,gBAAgB,QAAQ,cAAc,CAAC;AACtD;AAEA,SAAS,UACP,MACA,OACA,QACA,QACM;AACG,WAAA,SAAS,UAAU,MAAM,OAAO;AAAA,IACvC;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,MAAM;AAAA,EAAA,CACP;AACH;"}
+{"version":3,"file":"useShopifyCookies.mjs","sources":["../../src/useShopifyCookies.tsx"],"sourcesContent":["import {useEffect, useRef, useState} from 'react';\n// @ts-ignore - worktop/cookie types not properly exported\nimport {stringify} from 'worktop/cookie';\nimport {SHOPIFY_Y, SHOPIFY_S} from './cart-constants.js';\nimport {buildUUID} from './cookies-utils.js';\nimport {\n  getTrackingValues,\n  SHOPIFY_UNIQUE_TOKEN_HEADER,\n  SHOPIFY_VISIT_TOKEN_HEADER,\n} from './tracking-utils.js';\n\nconst longTermLength = 60 * 60 * 24 * 360 * 1; // ~1 year expiry\nconst shortTermLength = 60 * 30; // 30 mins\n\ntype UseShopifyCookiesOptions = CoreShopifyCookiesOptions & {\n  /**\n   * If set to `false`, Shopify cookies will be removed.\n   * If set to `true`, Shopify unique user token cookie will have cookie expiry of 1 year.\n   * Defaults to false.\n   **/\n  hasUserConsent?: boolean;\n  /**\n   * The domain scope of the cookie. Defaults to empty string.\n   **/\n  domain?: string;\n  /**\n   * The checkout domain of the shop. Defaults to empty string. If set, the cookie domain will check if it can be set with the checkout domain.\n   */\n  checkoutDomain?: string;\n  /**\n   * If set to `true`, it skips modifying the deprecated shopify_y and shopify_s cookies.\n   */\n  ignoreDeprecatedCookies?: boolean;\n};\n\n/**\n * Sets the `shopify_y` and `shopify_s` cookies in the browser based on user consent\n * for backward compatibility support.\n *\n * If `fetchTrackingValues` is true, it makes a request to Storefront API\n * to fetch or refresh Shopiy analytics and marketing cookies and tracking values.\n * Generally speaking, this should only be needed if you're not using Hydrogen's\n * built-in analytics components and hooks that already handle this automatically.\n * For example, set it to `true` if you are using `hydrogen-react` only with\n * a different framework and still need to make a same-domain request to\n * Storefront API to set cookies.\n *\n * If `ignoreDeprecatedCookies` is true, it skips setting the deprecated cookies entirely.\n * Useful when you only want to use the newer tracking values and not rely on the deprecated ones.\n *\n * @returns `true` when cookies are set and ready.\n */\nexport function useShopifyCookies(options?: UseShopifyCookiesOptions): boolean {\n  const {\n    hasUserConsent,\n    domain = '',\n    checkoutDomain = '',\n    storefrontAccessToken,\n    fetchTrackingValues,\n    ignoreDeprecatedCookies = false,\n  } = options || {};\n\n  const coreCookiesReady = useCoreShopifyCookies({\n    storefrontAccessToken,\n    fetchTrackingValues,\n    checkoutDomain,\n  });\n\n  useEffect(() => {\n    // Skip setting JS cookies until http-only cookies and server-timing\n    // are ready so that we have values synced in JS and http-only cookies.\n    if (ignoreDeprecatedCookies || !coreCookiesReady) return;\n\n    /**\n     * Setting cookie with domain\n     *\n     * If no domain is provided, the cookie will be set for the current host.\n     * For Shopify, we need to ensure this domain is set with a leading dot.\n     */\n\n    // Use override domain or current host\n    let currentDomain = domain || window.location.host;\n\n    if (checkoutDomain) {\n      const checkoutDomainParts = checkoutDomain.split('.').reverse();\n      const currentDomainParts = currentDomain.split('.').reverse();\n      const sameDomainParts: Array<string> = [];\n      checkoutDomainParts.forEach((part, index) => {\n        if (part === currentDomainParts[index]) {\n          sameDomainParts.push(part);\n        }\n      });\n\n      currentDomain = sameDomainParts.reverse().join('.');\n    }\n\n    // Reset domain if localhost\n    if (/^localhost/.test(currentDomain)) currentDomain = '';\n\n    // Shopify checkout only consumes cookies set with leading dot domain\n    const domainWithLeadingDot = currentDomain\n      ? /^\\./.test(currentDomain)\n        ? currentDomain\n        : `.${currentDomain}`\n      : '';\n\n    /**\n     * Set user and session cookies and refresh the expiry time\n     */\n    if (hasUserConsent) {\n      const trackingValues = getTrackingValues();\n      if (\n        (\n          trackingValues.uniqueToken ||\n          trackingValues.visitToken ||\n          ''\n        ).startsWith('00000000-')\n      ) {\n        // Skip writing cookies when tracking values signal we don't have consent yet\n        return;\n      }\n\n      setCookie(\n        SHOPIFY_Y,\n        trackingValues.uniqueToken || buildUUID(),\n        longTermLength,\n        domainWithLeadingDot,\n      );\n      setCookie(\n        SHOPIFY_S,\n        trackingValues.visitToken || buildUUID(),\n        shortTermLength,\n        domainWithLeadingDot,\n      );\n    } else {\n      setCookie(SHOPIFY_Y, '', 0, domainWithLeadingDot);\n      setCookie(SHOPIFY_S, '', 0, domainWithLeadingDot);\n    }\n  }, [\n    coreCookiesReady,\n    hasUserConsent,\n    domain,\n    checkoutDomain,\n    ignoreDeprecatedCookies,\n  ]);\n\n  return coreCookiesReady;\n}\n\nfunction setCookie(\n  name: string,\n  value: string,\n  maxage: number,\n  domain: string,\n): void {\n  document.cookie = stringify(name, value, {\n    maxage,\n    domain,\n    samesite: 'Lax',\n    path: '/',\n  });\n}\n\nasync function fetchTrackingValuesFromBrowser(\n  storefrontAccessToken?: string,\n  storefrontApiDomain = '',\n): Promise<void> {\n  // These values might come from server-timing or old cookies.\n  // If consent cannot be initially assumed, these tokens\n  // will be dropped in SFAPI and it will return a mock token\n  // starting with '00000000-'.\n  // However, if consent can be assumed initially, these tokens\n  // will be used to create proper cookies and continue our flow.\n  const {uniqueToken, visitToken} = getTrackingValues();\n\n  const response = await fetch(\n    // TODO: update this endpoint when it becomes stable\n    `${storefrontApiDomain.replace(/\\/+$/, '')}/api/unstable/graphql.json`,\n    {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json',\n        ...(storefrontAccessToken && {\n          'X-Shopify-Storefront-Access-Token': storefrontAccessToken,\n        }),\n        ...(visitToken || uniqueToken\n          ? {\n              [SHOPIFY_VISIT_TOKEN_HEADER]: visitToken,\n              [SHOPIFY_UNIQUE_TOKEN_HEADER]: uniqueToken,\n            }\n          : undefined),\n      },\n      body: JSON.stringify({\n        query:\n          // This query ensures we get _cmp (consent) server-timing header, which is not available in other queries.\n          // This value can be passed later to consent-tracking-api and privacy-banner scripts to avoid extra requests.\n          'query ensureCookies { consentManagement { cookies(visitorConsent:{}) { cookieDomain } } }',\n      }),\n    },\n  );\n\n  if (!response.ok) {\n    throw new Error(\n      `Failed to fetch consent from browser: ${response.status} ${response.statusText}`,\n    );\n  }\n\n  // Consume the body to complete the request and\n  // ensure server-timing is available in performance API\n  await response.json();\n\n  // Ensure we cache the latest tracking values from resources timing\n  getTrackingValues();\n}\n\ntype CoreShopifyCookiesOptions = {\n  storefrontAccessToken?: string;\n  fetchTrackingValues?: boolean;\n  checkoutDomain?: string;\n};\n\n/**\n * Gets http-only cookies from Storefront API via same-origin fetch request.\n * Falls back to checkout domain if provided to at least obtain the tracking\n * values via server-timing headers.\n */\nfunction useCoreShopifyCookies({\n  checkoutDomain,\n  storefrontAccessToken,\n  fetchTrackingValues = false,\n}: CoreShopifyCookiesOptions) {\n  const [cookiesReady, setCookiesReady] = useState(!fetchTrackingValues);\n  const hasFetchedTrackingValues = useRef(false);\n\n  useEffect(() => {\n    if (!fetchTrackingValues) {\n      // Backend did the work, or proxy is disabled.\n      setCookiesReady(true);\n      return;\n    }\n\n    // React runs effects twice in dev mode, avoid double fetching\n    if (hasFetchedTrackingValues.current) return;\n    hasFetchedTrackingValues.current = true;\n\n    // Fetch consent from browser via proxy\n    fetchTrackingValuesFromBrowser(storefrontAccessToken)\n      .catch((error) =>\n        checkoutDomain\n          ? // Retry with checkout domain if available to at least\n            // get the server-timing values for tracking.\n            fetchTrackingValuesFromBrowser(\n              storefrontAccessToken,\n              checkoutDomain,\n            )\n          : Promise.reject(error),\n      )\n      .catch((error) => {\n        console.warn(\n          '[h2:warn:useShopifyCookies] Failed to fetch tracking values from browser: ' +\n            (error instanceof Error ? error.message : String(error)),\n        );\n      })\n      .finally(() => {\n        // Proceed even on errors, degraded tracking is better than no app\n        setCookiesReady(true);\n      });\n  }, [checkoutDomain, fetchTrackingValues, storefrontAccessToken]);\n\n  return cookiesReady;\n}\n"],"names":[],"mappings":"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"}

package/dist/node-dev/AddToCartButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddToCartButton.js","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\nimport {\n  BaseButton,\n  type CustomBaseButtonProps,\n  type BaseButtonProps,\n} from './BaseButton.js';\nimport * as React from 'react';\n\nexport interface AddToCartButtonPropsBase {\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n  /** The ID of the variant. */\n  variantId?: string | null;\n  /** The item quantity. */\n  quantity?: number;\n  /** The text that is announced by the screen reader when the item is being added to the cart. Used for accessibility purposes only and not displayed on the page. */\n  accessibleAddingToCartLabel?: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n}\n\nexport type AddToCartButtonProps<AsType extends React.ElementType = 'button'> =\n  AddToCartButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `AddToCartButton` component renders a button that adds an item to the cart when pressed.\n * It must be a descendent of the `CartProvider` component.\n */\nexport function AddToCartButton<AsType extends React.ElementType = 'button'>(\n  props: AddToCartButtonProps<AsType>,\n): JSX.Element {\n  const [addingItem, setAddingItem] = useState<boolean>(false);\n  const {\n    variantId: explicitVariantId,\n    quantity = 1,\n    attributes,\n    sellingPlanId,\n    onClick,\n    children,\n    accessibleAddingToCartLabel,\n    ...passthroughProps\n  } = props;\n  const {status, linesAdd} = useCart();\n  const {selectedVariant} = useProduct();\n  const variantId = explicitVariantId ?? selectedVariant?.id ?? '';\n  const disabled =\n    explicitVariantId === null ||\n    variantId === '' ||\n    selectedVariant === null ||\n    addingItem ||\n    // Only certain 'as' types such as 'button' contain `disabled`\n    (passthroughProps as {disabled?: boolean}).disabled;\n\n  useEffect(() => {\n    if (addingItem && status === 'idle') {\n      setAddingItem(false);\n    }\n  }, [status, addingItem]);\n\n  const handleAddItem = useCallback(() => {\n    setAddingItem(true);\n    linesAdd([\n      {\n        quantity,\n        merchandiseId: variantId || '',\n        attributes,\n        sellingPlanId,\n      },\n    ]);\n  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <>\n      <BaseButton\n        {...passthroughProps}\n        disabled={disabled}\n        onClick={onClick}\n        defaultOnClick={handleAddItem}\n      >\n        {children}\n      </BaseButton>\n      {accessibleAddingToCartLabel ? (\n        <p\n          style={{\n            position: 'absolute',\n            width: '1px',\n            height: '1px',\n            padding: '0',\n            margin: '-1px',\n            overflow: 'hidden',\n            clip: 'rect(0, 0, 0, 0)',\n            whiteSpace: 'nowrap',\n            borderWidth: '0',\n          }}\n          role=\"alert\"\n          aria-live=\"assertive\"\n        >\n          {addingItem ? accessibleAddingToCartLabel : null}\n        </p>\n      ) : null}\n    </>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface AddToCartButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends AddToCartButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":["useState","useCart","useProduct","useEffect","useCallback","jsxs","Fragment","jsx","BaseButton"],"mappings":";;;;;;;AAiCO,SAAS,gBACd,OACa;AACb,QAAM,CAAC,YAAY,aAAa,IAAIA,MAAAA,SAAkB,KAAK;AACrD,QAAA;AAAA,IACJ,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,QAAM,EAAC,QAAQ,SAAQ,IAAIC,qBAAQ;AAC7B,QAAA,EAAC,gBAAe,IAAIC,2BAAW;AAC/B,QAAA,YAAY,sBAAqB,mDAAiB,OAAM;AAC9D,QAAM,WACJ,sBAAsB,QACtB,cAAc,MACd,oBAAoB,QACpB;AAAA,EAEC,iBAA0C;AAE7CC,QAAAA,UAAU,MAAM;AACV,QAAA,cAAc,WAAW,QAAQ;AACnC,oBAAc,KAAK;AAAA,IAAA;AAAA,EACrB,GACC,CAAC,QAAQ,UAAU,CAAC;AAEjB,QAAA,gBAAgBC,MAAAA,YAAY,MAAM;AACtC,kBAAc,IAAI;AACT,aAAA;AAAA,MACP;AAAA,QACE;AAAA,QACA,eAAe,aAAa;AAAA,QAC5B;AAAA,QACA;AAAA,MAAA;AAAA,IACF,CACD;AAAA,EAAA,GACA,CAAC,UAAU,UAAU,WAAW,YAAY,aAAa,CAAC;AAE7D,SAEIC,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAAC,2BAAA;AAAA,MAACC,WAAA;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAEf;AAAA,MAAA;AAAA,IACH;AAAA,IACC,8BACCD,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,MAAM;AAAA,UACN,YAAY;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QACA,MAAK;AAAA,QACL,aAAU;AAAA,QAET,uBAAa,8BAA8B;AAAA,MAAA;AAAA,IAAA,IAE5C;AAAA,EAAA,GACN;AAEJ;;"}
+{"version":3,"file":"AddToCartButton.js","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\nimport {\n  BaseButton,\n  type CustomBaseButtonProps,\n  type BaseButtonProps,\n} from './BaseButton.js';\nimport * as React from 'react';\n\nexport interface AddToCartButtonPropsBase {\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n  /** The ID of the variant. */\n  variantId?: string | null;\n  /** The item quantity. */\n  quantity?: number;\n  /** The text that is announced by the screen reader when the item is being added to the cart. Used for accessibility purposes only and not displayed on the page. */\n  accessibleAddingToCartLabel?: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n}\n\nexport type AddToCartButtonProps<AsType extends React.ElementType = 'button'> =\n  AddToCartButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `AddToCartButton` component renders a button that adds an item to the cart when pressed.\n * It must be a descendent of the `CartProvider` component.\n */\nexport function AddToCartButton<AsType extends React.ElementType = 'button'>(\n  props: AddToCartButtonProps<AsType>,\n): JSX.Element {\n  const [addingItem, setAddingItem] = useState<boolean>(false);\n  const {\n    variantId: explicitVariantId,\n    quantity = 1,\n    attributes,\n    sellingPlanId,\n    onClick,\n    children,\n    accessibleAddingToCartLabel,\n    ...passthroughProps\n  } = props;\n  const {status, linesAdd} = useCart();\n  const {selectedVariant} = useProduct();\n  const variantId = explicitVariantId ?? selectedVariant?.id ?? '';\n  const disabled =\n    explicitVariantId === null ||\n    variantId === '' ||\n    selectedVariant === null ||\n    addingItem ||\n    // Only certain 'as' types such as 'button' contain `disabled`\n    (passthroughProps as {disabled?: boolean}).disabled;\n\n  useEffect(() => {\n    if (addingItem && status === 'idle') {\n      setAddingItem(false);\n    }\n  }, [status, addingItem]);\n\n  const handleAddItem = useCallback(() => {\n    setAddingItem(true);\n    linesAdd([\n      {\n        quantity,\n        merchandiseId: variantId || '',\n        attributes,\n        sellingPlanId,\n      },\n    ]);\n  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <>\n      <BaseButton\n        {...passthroughProps}\n        disabled={disabled}\n        onClick={onClick}\n        defaultOnClick={handleAddItem}\n      >\n        {children}\n      </BaseButton>\n      {accessibleAddingToCartLabel ? (\n        <p\n          style={{\n            position: 'absolute',\n            width: '1px',\n            height: '1px',\n            padding: '0',\n            margin: '-1px',\n            overflow: 'hidden',\n            clip: 'rect(0, 0, 0, 0)',\n            whiteSpace: 'nowrap',\n            borderWidth: '0',\n          }}\n          role=\"alert\"\n          aria-live=\"assertive\"\n        >\n          {addingItem ? accessibleAddingToCartLabel : null}\n        </p>\n      ) : null}\n    </>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface AddToCartButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends AddToCartButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":["useState","useCart","useProduct","useEffect","useCallback","jsxs","Fragment","jsx","BaseButton"],"mappings":";;;;;;;AAiCO,SAAS,gBACd,OACa;AACb,QAAM,CAAC,YAAY,aAAa,IAAIA,MAAAA,SAAkB,KAAK;AAC3D,QAAM;AAAA,IACJ,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,QAAM,EAAC,QAAQ,SAAA,IAAYC,qBAAA;AAC3B,QAAM,EAAC,gBAAA,IAAmBC,2BAAA;AAC1B,QAAM,YAAY,sBAAqB,mDAAiB,OAAM;AAC9D,QAAM,WACJ,sBAAsB,QACtB,cAAc,MACd,oBAAoB,QACpB;AAAA,EAEC,iBAA0C;AAE7CC,QAAAA,UAAU,MAAM;AACd,QAAI,cAAc,WAAW,QAAQ;AACnC,oBAAc,KAAK;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,QAAQ,UAAU,CAAC;AAEvB,QAAM,gBAAgBC,MAAAA,YAAY,MAAM;AACtC,kBAAc,IAAI;AAClB,aAAS;AAAA,MACP;AAAA,QACE;AAAA,QACA,eAAe,aAAa;AAAA,QAC5B;AAAA,QACA;AAAA,MAAA;AAAA,IACF,CACD;AAAA,EACH,GAAG,CAAC,UAAU,UAAU,WAAW,YAAY,aAAa,CAAC;AAE7D,SACEC,2BAAAA,KAAAC,qBAAA,EACE,UAAA;AAAA,IAAAC,2BAAAA;AAAAA,MAACC,WAAAA;AAAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAEf;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,8BACCD,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,MAAM;AAAA,UACN,YAAY;AAAA,UACZ,aAAa;AAAA,QAAA;AAAA,QAEf,MAAK;AAAA,QACL,aAAU;AAAA,QAET,uBAAa,8BAA8B;AAAA,MAAA;AAAA,IAAA,IAE5C;AAAA,EAAA,GACN;AAEJ;;"}

package/dist/node-dev/AddToCartButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AddToCartButton.mjs","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\nimport {\n  BaseButton,\n  type CustomBaseButtonProps,\n  type BaseButtonProps,\n} from './BaseButton.js';\nimport * as React from 'react';\n\nexport interface AddToCartButtonPropsBase {\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n  /** The ID of the variant. */\n  variantId?: string | null;\n  /** The item quantity. */\n  quantity?: number;\n  /** The text that is announced by the screen reader when the item is being added to the cart. Used for accessibility purposes only and not displayed on the page. */\n  accessibleAddingToCartLabel?: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n}\n\nexport type AddToCartButtonProps<AsType extends React.ElementType = 'button'> =\n  AddToCartButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `AddToCartButton` component renders a button that adds an item to the cart when pressed.\n * It must be a descendent of the `CartProvider` component.\n */\nexport function AddToCartButton<AsType extends React.ElementType = 'button'>(\n  props: AddToCartButtonProps<AsType>,\n): JSX.Element {\n  const [addingItem, setAddingItem] = useState<boolean>(false);\n  const {\n    variantId: explicitVariantId,\n    quantity = 1,\n    attributes,\n    sellingPlanId,\n    onClick,\n    children,\n    accessibleAddingToCartLabel,\n    ...passthroughProps\n  } = props;\n  const {status, linesAdd} = useCart();\n  const {selectedVariant} = useProduct();\n  const variantId = explicitVariantId ?? selectedVariant?.id ?? '';\n  const disabled =\n    explicitVariantId === null ||\n    variantId === '' ||\n    selectedVariant === null ||\n    addingItem ||\n    // Only certain 'as' types such as 'button' contain `disabled`\n    (passthroughProps as {disabled?: boolean}).disabled;\n\n  useEffect(() => {\n    if (addingItem && status === 'idle') {\n      setAddingItem(false);\n    }\n  }, [status, addingItem]);\n\n  const handleAddItem = useCallback(() => {\n    setAddingItem(true);\n    linesAdd([\n      {\n        quantity,\n        merchandiseId: variantId || '',\n        attributes,\n        sellingPlanId,\n      },\n    ]);\n  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <>\n      <BaseButton\n        {...passthroughProps}\n        disabled={disabled}\n        onClick={onClick}\n        defaultOnClick={handleAddItem}\n      >\n        {children}\n      </BaseButton>\n      {accessibleAddingToCartLabel ? (\n        <p\n          style={{\n            position: 'absolute',\n            width: '1px',\n            height: '1px',\n            padding: '0',\n            margin: '-1px',\n            overflow: 'hidden',\n            clip: 'rect(0, 0, 0, 0)',\n            whiteSpace: 'nowrap',\n            borderWidth: '0',\n          }}\n          role=\"alert\"\n          aria-live=\"assertive\"\n        >\n          {addingItem ? accessibleAddingToCartLabel : null}\n        </p>\n      ) : null}\n    </>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface AddToCartButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends AddToCartButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":[],"mappings":";;;;;AAiCO,SAAS,gBACd,OACa;AACb,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AACrD,QAAA;AAAA,IACJ,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,QAAM,EAAC,QAAQ,SAAQ,IAAI,QAAQ;AAC7B,QAAA,EAAC,gBAAe,IAAI,WAAW;AAC/B,QAAA,YAAY,sBAAqB,mDAAiB,OAAM;AAC9D,QAAM,WACJ,sBAAsB,QACtB,cAAc,MACd,oBAAoB,QACpB;AAAA,EAEC,iBAA0C;AAE7C,YAAU,MAAM;AACV,QAAA,cAAc,WAAW,QAAQ;AACnC,oBAAc,KAAK;AAAA,IAAA;AAAA,EACrB,GACC,CAAC,QAAQ,UAAU,CAAC;AAEjB,QAAA,gBAAgB,YAAY,MAAM;AACtC,kBAAc,IAAI;AACT,aAAA;AAAA,MACP;AAAA,QACE;AAAA,QACA,eAAe,aAAa;AAAA,QAC5B;AAAA,QACA;AAAA,MAAA;AAAA,IACF,CACD;AAAA,EAAA,GACA,CAAC,UAAU,UAAU,WAAW,YAAY,aAAa,CAAC;AAE7D,SAEI,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAEf;AAAA,MAAA;AAAA,IACH;AAAA,IACC,8BACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,MAAM;AAAA,UACN,YAAY;AAAA,UACZ,aAAa;AAAA,QACf;AAAA,QACA,MAAK;AAAA,QACL,aAAU;AAAA,QAET,uBAAa,8BAA8B;AAAA,MAAA;AAAA,IAAA,IAE5C;AAAA,EAAA,GACN;AAEJ;"}
+{"version":3,"file":"AddToCartButton.mjs","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\nimport {\n  BaseButton,\n  type CustomBaseButtonProps,\n  type BaseButtonProps,\n} from './BaseButton.js';\nimport * as React from 'react';\n\nexport interface AddToCartButtonPropsBase {\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n  /** The ID of the variant. */\n  variantId?: string | null;\n  /** The item quantity. */\n  quantity?: number;\n  /** The text that is announced by the screen reader when the item is being added to the cart. Used for accessibility purposes only and not displayed on the page. */\n  accessibleAddingToCartLabel?: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n}\n\nexport type AddToCartButtonProps<AsType extends React.ElementType = 'button'> =\n  AddToCartButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `AddToCartButton` component renders a button that adds an item to the cart when pressed.\n * It must be a descendent of the `CartProvider` component.\n */\nexport function AddToCartButton<AsType extends React.ElementType = 'button'>(\n  props: AddToCartButtonProps<AsType>,\n): JSX.Element {\n  const [addingItem, setAddingItem] = useState<boolean>(false);\n  const {\n    variantId: explicitVariantId,\n    quantity = 1,\n    attributes,\n    sellingPlanId,\n    onClick,\n    children,\n    accessibleAddingToCartLabel,\n    ...passthroughProps\n  } = props;\n  const {status, linesAdd} = useCart();\n  const {selectedVariant} = useProduct();\n  const variantId = explicitVariantId ?? selectedVariant?.id ?? '';\n  const disabled =\n    explicitVariantId === null ||\n    variantId === '' ||\n    selectedVariant === null ||\n    addingItem ||\n    // Only certain 'as' types such as 'button' contain `disabled`\n    (passthroughProps as {disabled?: boolean}).disabled;\n\n  useEffect(() => {\n    if (addingItem && status === 'idle') {\n      setAddingItem(false);\n    }\n  }, [status, addingItem]);\n\n  const handleAddItem = useCallback(() => {\n    setAddingItem(true);\n    linesAdd([\n      {\n        quantity,\n        merchandiseId: variantId || '',\n        attributes,\n        sellingPlanId,\n      },\n    ]);\n  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <>\n      <BaseButton\n        {...passthroughProps}\n        disabled={disabled}\n        onClick={onClick}\n        defaultOnClick={handleAddItem}\n      >\n        {children}\n      </BaseButton>\n      {accessibleAddingToCartLabel ? (\n        <p\n          style={{\n            position: 'absolute',\n            width: '1px',\n            height: '1px',\n            padding: '0',\n            margin: '-1px',\n            overflow: 'hidden',\n            clip: 'rect(0, 0, 0, 0)',\n            whiteSpace: 'nowrap',\n            borderWidth: '0',\n          }}\n          role=\"alert\"\n          aria-live=\"assertive\"\n        >\n          {addingItem ? accessibleAddingToCartLabel : null}\n        </p>\n      ) : null}\n    </>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface AddToCartButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends AddToCartButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":[],"mappings":";;;;;AAiCO,SAAS,gBACd,OACa;AACb,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAC3D,QAAM;AAAA,IACJ,WAAW;AAAA,IACX,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AACJ,QAAM,EAAC,QAAQ,SAAA,IAAY,QAAA;AAC3B,QAAM,EAAC,gBAAA,IAAmB,WAAA;AAC1B,QAAM,YAAY,sBAAqB,mDAAiB,OAAM;AAC9D,QAAM,WACJ,sBAAsB,QACtB,cAAc,MACd,oBAAoB,QACpB;AAAA,EAEC,iBAA0C;AAE7C,YAAU,MAAM;AACd,QAAI,cAAc,WAAW,QAAQ;AACnC,oBAAc,KAAK;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,QAAQ,UAAU,CAAC;AAEvB,QAAM,gBAAgB,YAAY,MAAM;AACtC,kBAAc,IAAI;AAClB,aAAS;AAAA,MACP;AAAA,QACE;AAAA,QACA,eAAe,aAAa;AAAA,QAC5B;AAAA,QACA;AAAA,MAAA;AAAA,IACF,CACD;AAAA,EACH,GAAG,CAAC,UAAU,UAAU,WAAW,YAAY,aAAa,CAAC;AAE7D,SACE,qBAAA,UAAA,EACE,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,gBAAgB;AAAA,QAEf;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF,8BACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,UACL,UAAU;AAAA,UACV,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,QAAQ;AAAA,UACR,UAAU;AAAA,UACV,MAAM;AAAA,UACN,YAAY;AAAA,UACZ,aAAa;AAAA,QAAA;AAAA,QAEf,MAAK;AAAA,QACL,aAAU;AAAA,QAET,uBAAa,8BAA8B;AAAA,MAAA;AAAA,IAAA,IAE5C;AAAA,EAAA,GACN;AAEJ;"}

package/dist/node-dev/BaseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseButton.js","sources":["../../src/BaseButton.tsx"],"sourcesContent":["import {ReactNode, Ref, useCallback} from 'react';\n\nexport interface CustomBaseButtonProps<AsType> {\n  /** Provide a React element or component to render as the underlying button. Note: for accessibility compliance, almost always you should use a `button` element, or a component that renders an underlying button. */\n  as?: AsType;\n  /** Any ReactNode elements. */\n  children: ReactNode;\n  /** Click event handler. Default behaviour triggers unless prevented */\n  onClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A default `onClick` behavior */\n  defaultOnClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A `ref` to the underlying button */\n  buttonRef?: Ref<HTMLButtonElement>;\n}\n\nexport type BaseButtonProps<AsType extends React.ElementType> =\n  CustomBaseButtonProps<AsType> &\n    (AsType extends keyof React.JSX.IntrinsicElements\n      ? Omit<\n          React.ComponentPropsWithoutRef<AsType>,\n          keyof CustomBaseButtonProps<AsType>\n        >\n      : React.ComponentPropsWithoutRef<AsType>);\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>,\n): JSX.Element {\n  const {\n    as,\n    onClick,\n    defaultOnClick,\n    children,\n    buttonRef,\n    ...passthroughProps\n  } = props;\n\n  const handleOnClick = useCallback(\n    (event?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n      if (onClick) {\n        const clickShouldContinue = onClick(event);\n        if (\n          (typeof clickShouldContinue === 'boolean' &&\n            clickShouldContinue === false) ||\n          event?.defaultPrevented\n        )\n          return;\n      }\n\n      defaultOnClick?.(event);\n    },\n    [defaultOnClick, onClick],\n  );\n\n  const Component = as || 'button';\n\n  return (\n    <Component ref={buttonRef} onClick={handleOnClick} {...passthroughProps}>\n      {children}\n    </Component>\n  );\n}\n"],"names":["useCallback","jsx"],"mappings":";;;;AA4BO,SAAS,WACd,OACa;AACP,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,gBAAgBA,MAAA;AAAA,IACpB,CAAC,UAA4D;AAC3D,UAAI,SAAS;AACL,cAAA,sBAAsB,QAAQ,KAAK;AACzC,YACG,OAAO,wBAAwB,aAC9B,wBAAwB,UAC1B,+BAAO;AAEP;AAAA,MAAA;AAGJ,uDAAiB;AAAA,IACnB;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,QAAM,YAAY,MAAM;AAGtB,SAAAC,2BAAA,IAAC,aAAU,KAAK,WAAW,SAAS,eAAgB,GAAG,kBACpD,UACH;AAEJ;;"}
+{"version":3,"file":"BaseButton.js","sources":["../../src/BaseButton.tsx"],"sourcesContent":["import {ReactNode, Ref, useCallback} from 'react';\n\nexport interface CustomBaseButtonProps<AsType> {\n  /** Provide a React element or component to render as the underlying button. Note: for accessibility compliance, almost always you should use a `button` element, or a component that renders an underlying button. */\n  as?: AsType;\n  /** Any ReactNode elements. */\n  children: ReactNode;\n  /** Click event handler. Default behaviour triggers unless prevented */\n  onClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A default `onClick` behavior */\n  defaultOnClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A `ref` to the underlying button */\n  buttonRef?: Ref<HTMLButtonElement>;\n}\n\nexport type BaseButtonProps<AsType extends React.ElementType> =\n  CustomBaseButtonProps<AsType> &\n    (AsType extends keyof React.JSX.IntrinsicElements\n      ? Omit<\n          React.ComponentPropsWithoutRef<AsType>,\n          keyof CustomBaseButtonProps<AsType>\n        >\n      : React.ComponentPropsWithoutRef<AsType>);\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>,\n): JSX.Element {\n  const {\n    as,\n    onClick,\n    defaultOnClick,\n    children,\n    buttonRef,\n    ...passthroughProps\n  } = props;\n\n  const handleOnClick = useCallback(\n    (event?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n      if (onClick) {\n        const clickShouldContinue = onClick(event);\n        if (\n          (typeof clickShouldContinue === 'boolean' &&\n            clickShouldContinue === false) ||\n          event?.defaultPrevented\n        )\n          return;\n      }\n\n      defaultOnClick?.(event);\n    },\n    [defaultOnClick, onClick],\n  );\n\n  const Component = as || 'button';\n\n  return (\n    <Component ref={buttonRef} onClick={handleOnClick} {...passthroughProps}>\n      {children}\n    </Component>\n  );\n}\n"],"names":["useCallback","jsx"],"mappings":";;;;AA4BO,SAAS,WACd,OACa;AACb,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,gBAAgBA,MAAAA;AAAAA,IACpB,CAAC,UAA4D;AAC3D,UAAI,SAAS;AACX,cAAM,sBAAsB,QAAQ,KAAK;AACzC,YACG,OAAO,wBAAwB,aAC9B,wBAAwB,UAC1B,+BAAO;AAEP;AAAA,MACJ;AAEA,uDAAiB;AAAA,IACnB;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAAA;AAG1B,QAAM,YAAY,MAAM;AAExB,SACEC,2BAAAA,IAAC,aAAU,KAAK,WAAW,SAAS,eAAgB,GAAG,kBACpD,UACH;AAEJ;;"}

package/dist/node-dev/BaseButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseButton.mjs","sources":["../../src/BaseButton.tsx"],"sourcesContent":["import {ReactNode, Ref, useCallback} from 'react';\n\nexport interface CustomBaseButtonProps<AsType> {\n  /** Provide a React element or component to render as the underlying button. Note: for accessibility compliance, almost always you should use a `button` element, or a component that renders an underlying button. */\n  as?: AsType;\n  /** Any ReactNode elements. */\n  children: ReactNode;\n  /** Click event handler. Default behaviour triggers unless prevented */\n  onClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A default `onClick` behavior */\n  defaultOnClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A `ref` to the underlying button */\n  buttonRef?: Ref<HTMLButtonElement>;\n}\n\nexport type BaseButtonProps<AsType extends React.ElementType> =\n  CustomBaseButtonProps<AsType> &\n    (AsType extends keyof React.JSX.IntrinsicElements\n      ? Omit<\n          React.ComponentPropsWithoutRef<AsType>,\n          keyof CustomBaseButtonProps<AsType>\n        >\n      : React.ComponentPropsWithoutRef<AsType>);\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>,\n): JSX.Element {\n  const {\n    as,\n    onClick,\n    defaultOnClick,\n    children,\n    buttonRef,\n    ...passthroughProps\n  } = props;\n\n  const handleOnClick = useCallback(\n    (event?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n      if (onClick) {\n        const clickShouldContinue = onClick(event);\n        if (\n          (typeof clickShouldContinue === 'boolean' &&\n            clickShouldContinue === false) ||\n          event?.defaultPrevented\n        )\n          return;\n      }\n\n      defaultOnClick?.(event);\n    },\n    [defaultOnClick, onClick],\n  );\n\n  const Component = as || 'button';\n\n  return (\n    <Component ref={buttonRef} onClick={handleOnClick} {...passthroughProps}>\n      {children}\n    </Component>\n  );\n}\n"],"names":[],"mappings":";;AA4BO,SAAS,WACd,OACa;AACP,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAA4D;AAC3D,UAAI,SAAS;AACL,cAAA,sBAAsB,QAAQ,KAAK;AACzC,YACG,OAAO,wBAAwB,aAC9B,wBAAwB,UAC1B,+BAAO;AAEP;AAAA,MAAA;AAGJ,uDAAiB;AAAA,IACnB;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAC1B;AAEA,QAAM,YAAY,MAAM;AAGtB,SAAA,oBAAC,aAAU,KAAK,WAAW,SAAS,eAAgB,GAAG,kBACpD,UACH;AAEJ;"}
+{"version":3,"file":"BaseButton.mjs","sources":["../../src/BaseButton.tsx"],"sourcesContent":["import {ReactNode, Ref, useCallback} from 'react';\n\nexport interface CustomBaseButtonProps<AsType> {\n  /** Provide a React element or component to render as the underlying button. Note: for accessibility compliance, almost always you should use a `button` element, or a component that renders an underlying button. */\n  as?: AsType;\n  /** Any ReactNode elements. */\n  children: ReactNode;\n  /** Click event handler. Default behaviour triggers unless prevented */\n  onClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A default `onClick` behavior */\n  defaultOnClick?: (\n    event?: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => void | boolean;\n  /** A `ref` to the underlying button */\n  buttonRef?: Ref<HTMLButtonElement>;\n}\n\nexport type BaseButtonProps<AsType extends React.ElementType> =\n  CustomBaseButtonProps<AsType> &\n    (AsType extends keyof React.JSX.IntrinsicElements\n      ? Omit<\n          React.ComponentPropsWithoutRef<AsType>,\n          keyof CustomBaseButtonProps<AsType>\n        >\n      : React.ComponentPropsWithoutRef<AsType>);\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>,\n): JSX.Element {\n  const {\n    as,\n    onClick,\n    defaultOnClick,\n    children,\n    buttonRef,\n    ...passthroughProps\n  } = props;\n\n  const handleOnClick = useCallback(\n    (event?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n      if (onClick) {\n        const clickShouldContinue = onClick(event);\n        if (\n          (typeof clickShouldContinue === 'boolean' &&\n            clickShouldContinue === false) ||\n          event?.defaultPrevented\n        )\n          return;\n      }\n\n      defaultOnClick?.(event);\n    },\n    [defaultOnClick, onClick],\n  );\n\n  const Component = as || 'button';\n\n  return (\n    <Component ref={buttonRef} onClick={handleOnClick} {...passthroughProps}>\n      {children}\n    </Component>\n  );\n}\n"],"names":[],"mappings":";;AA4BO,SAAS,WACd,OACa;AACb,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,QAAM,gBAAgB;AAAA,IACpB,CAAC,UAA4D;AAC3D,UAAI,SAAS;AACX,cAAM,sBAAsB,QAAQ,KAAK;AACzC,YACG,OAAO,wBAAwB,aAC9B,wBAAwB,UAC1B,+BAAO;AAEP;AAAA,MACJ;AAEA,uDAAiB;AAAA,IACnB;AAAA,IACA,CAAC,gBAAgB,OAAO;AAAA,EAAA;AAG1B,QAAM,YAAY,MAAM;AAExB,SACE,oBAAC,aAAU,KAAK,WAAW,SAAS,eAAgB,GAAG,kBACpD,UACH;AAEJ;"}

package/dist/node-dev/BuyNowButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BuyNowButton.js","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ninterface BuyNowButtonPropsBase {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\ntype BuyNowButtonProps<AsType extends React.ElementType = 'button'> =\n  BuyNowButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout.\n * Must be a child of a `CartProvider` component.\n */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps<AsType>,\n): JSX.Element {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    sellingPlanId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (loading && checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [loading, checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n          sellingPlanId,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <BaseButton\n      // Only certain 'as' types such as 'button' contain `disabled`\n      disabled={loading ?? (passthroughProps as {disabled?: boolean}).disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface BuyNowButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends BuyNowButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":["useCart","useState","useEffect","useCallback","jsx","BaseButton"],"mappings":";;;;;;AA6BO,SAAS,aACd,OACa;AACb,QAAM,EAAC,YAAY,YAAW,IAAIA,qBAAQ;AAC1C,QAAM,CAAC,SAAS,UAAU,IAAIC,MAAAA,SAAkB,KAAK;AAE/C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJC,QAAAA,UAAU,MAAM;AACd,QAAI,WAAW,aAAa;AAC1B,aAAO,SAAS,OAAO;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,SAAS,WAAW,CAAC;AAEnB,QAAA,eAAeC,MAAAA,YAAY,MAAM;AACrC,eAAW,IAAI;AACJ,eAAA;AAAA,MACT,OAAO;AAAA,QACL;AAAA,UACE,UAAU,YAAY;AAAA,UACtB,eAAe;AAAA,UACf;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF,CACD;AAAA,EAAA,GACA,CAAC,YAAY,UAAU,WAAW,YAAY,aAAa,CAAC;AAG7D,SAAAC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MAEC,UAAU,WAAY,iBAA0C;AAAA,MAC/D,GAAG;AAAA,MACJ;AAAA,MACA,gBAAgB;AAAA,MAEf;AAAA,IAAA;AAAA,EACH;AAEJ;;"}
+{"version":3,"file":"BuyNowButton.js","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ninterface BuyNowButtonPropsBase {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\ntype BuyNowButtonProps<AsType extends React.ElementType = 'button'> =\n  BuyNowButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout.\n * Must be a child of a `CartProvider` component.\n */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps<AsType>,\n): JSX.Element {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    sellingPlanId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (loading && checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [loading, checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n          sellingPlanId,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <BaseButton\n      // Only certain 'as' types such as 'button' contain `disabled`\n      disabled={loading ?? (passthroughProps as {disabled?: boolean}).disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface BuyNowButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends BuyNowButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":["useCart","useState","useEffect","useCallback","jsx","BaseButton"],"mappings":";;;;;;AA6BO,SAAS,aACd,OACa;AACb,QAAM,EAAC,YAAY,YAAA,IAAeA,qBAAA;AAClC,QAAM,CAAC,SAAS,UAAU,IAAIC,MAAAA,SAAkB,KAAK;AAErD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJC,QAAAA,UAAU,MAAM;AACd,QAAI,WAAW,aAAa;AAC1B,aAAO,SAAS,OAAO;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,SAAS,WAAW,CAAC;AAEzB,QAAM,eAAeC,MAAAA,YAAY,MAAM;AACrC,eAAW,IAAI;AACf,eAAW;AAAA,MACT,OAAO;AAAA,QACL;AAAA,UACE,UAAU,YAAY;AAAA,UACtB,eAAe;AAAA,UACf;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF,CACD;AAAA,EACH,GAAG,CAAC,YAAY,UAAU,WAAW,YAAY,aAAa,CAAC;AAE/D,SACEC,2BAAAA;AAAAA,IAACC,WAAAA;AAAAA,IAAA;AAAA,MAEC,UAAU,WAAY,iBAA0C;AAAA,MAC/D,GAAG;AAAA,MACJ;AAAA,MACA,gBAAgB;AAAA,MAEf;AAAA,IAAA;AAAA,EAAA;AAGP;;"}

package/dist/node-dev/BuyNowButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"BuyNowButton.mjs","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ninterface BuyNowButtonPropsBase {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\ntype BuyNowButtonProps<AsType extends React.ElementType = 'button'> =\n  BuyNowButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout.\n * Must be a child of a `CartProvider` component.\n */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps<AsType>,\n): JSX.Element {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    sellingPlanId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (loading && checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [loading, checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n          sellingPlanId,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <BaseButton\n      // Only certain 'as' types such as 'button' contain `disabled`\n      disabled={loading ?? (passthroughProps as {disabled?: boolean}).disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface BuyNowButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends BuyNowButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":[],"mappings":";;;;AA6BO,SAAS,aACd,OACa;AACb,QAAM,EAAC,YAAY,YAAW,IAAI,QAAQ;AAC1C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,KAAK;AAE/C,QAAA;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,YAAU,MAAM;AACd,QAAI,WAAW,aAAa;AAC1B,aAAO,SAAS,OAAO;AAAA,IAAA;AAAA,EACzB,GACC,CAAC,SAAS,WAAW,CAAC;AAEnB,QAAA,eAAe,YAAY,MAAM;AACrC,eAAW,IAAI;AACJ,eAAA;AAAA,MACT,OAAO;AAAA,QACL;AAAA,UACE,UAAU,YAAY;AAAA,UACtB,eAAe;AAAA,UACf;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF,CACD;AAAA,EAAA,GACA,CAAC,YAAY,UAAU,WAAW,YAAY,aAAa,CAAC;AAG7D,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MAEC,UAAU,WAAY,iBAA0C;AAAA,MAC/D,GAAG;AAAA,MACJ;AAAA,MACA,gBAAgB;AAAA,MAEf;AAAA,IAAA;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"BuyNowButton.mjs","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ninterface BuyNowButtonPropsBase {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** The selling plan ID of the subscription variant */\n  sellingPlanId?: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\ntype BuyNowButtonProps<AsType extends React.ElementType = 'button'> =\n  BuyNowButtonPropsBase & BaseButtonProps<AsType>;\n\n/**\n * The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout.\n * Must be a child of a `CartProvider` component.\n */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps<AsType>,\n): JSX.Element {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    sellingPlanId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (loading && checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [loading, checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n          sellingPlanId,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes, sellingPlanId]);\n\n  return (\n    <BaseButton\n      // Only certain 'as' types such as 'button' contain `disabled`\n      disabled={loading ?? (passthroughProps as {disabled?: boolean}).disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface BuyNowButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends BuyNowButtonPropsBase,\n    CustomBaseButtonProps<AsType> {}\n"],"names":[],"mappings":";;;;AA6BO,SAAS,aACd,OACa;AACb,QAAM,EAAC,YAAY,YAAA,IAAe,QAAA;AAClC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,KAAK;AAErD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,IACD;AAEJ,YAAU,MAAM;AACd,QAAI,WAAW,aAAa;AAC1B,aAAO,SAAS,OAAO;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,SAAS,WAAW,CAAC;AAEzB,QAAM,eAAe,YAAY,MAAM;AACrC,eAAW,IAAI;AACf,eAAW;AAAA,MACT,OAAO;AAAA,QACL;AAAA,UACE,UAAU,YAAY;AAAA,UACtB,eAAe;AAAA,UACf;AAAA,UACA;AAAA,QAAA;AAAA,MACF;AAAA,IACF,CACD;AAAA,EACH,GAAG,CAAC,YAAY,UAAU,WAAW,YAAY,aAAa,CAAC;AAE/D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MAEC,UAAU,WAAY,iBAA0C;AAAA,MAC/D,GAAG;AAAA,MACJ;AAAA,MACA,gBAAgB;AAAA,MAEf;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/node-dev/CartCheckoutButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ntype ChildrenProps = {\n  /** A `ReactNode` element. */\n  children: ReactNode;\n};\ntype CartCheckoutButtonProps = Omit<BaseButtonProps<'button'>, 'onClick'> &\n  ChildrenProps;\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: CartCheckoutButtonProps,\n): JSX.Element {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={(): void => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\n// we ignore this issue because it makes the documentation look better than the equivalent `type` that it wants us to convert to\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface CartCheckoutButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends Omit<CustomBaseButtonProps<AsType>, 'onClick'> {}\n"],"names":["useState","useCart","useEffect","jsx","BaseButton"],"mappings":";;;;;;AAmBO,SAAS,mBACd,OACa;AACb,QAAM,CAAC,mBAAmB,oBAAoB,IAAIA,MAAAA,SAAS,KAAK;AAChE,QAAM,EAAC,QAAQ,YAAW,IAAIC,qBAAQ;AACtC,QAAM,EAAC,UAAU,GAAG,iBAAA,IAAoB;AAExCC,QAAAA,UAAU,MAAM;AACV,QAAA,qBAAqB,eAAe,WAAW,QAAQ;AACzD,aAAO,SAAS,OAAO;AAAA,IAAA;AAAA,EAExB,GAAA,CAAC,mBAAmB,QAAQ,WAAW,CAAC;AAGzC,SAAAC,2BAAA;AAAA,IAACC,WAAA;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,qBAAqB,iBAAiB;AAAA,MAChD,SAAS,MAAY,qBAAqB,IAAI;AAAA,MAE7C;AAAA,IAAA;AAAA,EACH;AAEJ;;"}
+{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ntype ChildrenProps = {\n  /** A `ReactNode` element. */\n  children: ReactNode;\n};\ntype CartCheckoutButtonProps = Omit<BaseButtonProps<'button'>, 'onClick'> &\n  ChildrenProps;\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: CartCheckoutButtonProps,\n): JSX.Element {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={(): void => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\n// we ignore this issue because it makes the documentation look better than the equivalent `type` that it wants us to convert to\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface CartCheckoutButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends Omit<CustomBaseButtonProps<AsType>, 'onClick'> {}\n"],"names":["useState","useCart","useEffect","jsx","BaseButton"],"mappings":";;;;;;AAmBO,SAAS,mBACd,OACa;AACb,QAAM,CAAC,mBAAmB,oBAAoB,IAAIA,MAAAA,SAAS,KAAK;AAChE,QAAM,EAAC,QAAQ,YAAA,IAAeC,qBAAA;AAC9B,QAAM,EAAC,UAAU,GAAG,iBAAA,IAAoB;AAExCC,QAAAA,UAAU,MAAM;AACd,QAAI,qBAAqB,eAAe,WAAW,QAAQ;AACzD,aAAO,SAAS,OAAO;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,mBAAmB,QAAQ,WAAW,CAAC;AAE3C,SACEC,2BAAAA;AAAAA,IAACC,WAAAA;AAAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,qBAAqB,iBAAiB;AAAA,MAChD,SAAS,MAAY,qBAAqB,IAAI;AAAA,MAE7C;AAAA,IAAA;AAAA,EAAA;AAGP;;"}

package/dist/node-dev/CartCheckoutButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ntype ChildrenProps = {\n  /** A `ReactNode` element. */\n  children: ReactNode;\n};\ntype CartCheckoutButtonProps = Omit<BaseButtonProps<'button'>, 'onClick'> &\n  ChildrenProps;\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: CartCheckoutButtonProps,\n): JSX.Element {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={(): void => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\n// we ignore this issue because it makes the documentation look better than the equivalent `type` that it wants us to convert to\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface CartCheckoutButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends Omit<CustomBaseButtonProps<AsType>, 'onClick'> {}\n"],"names":[],"mappings":";;;;AAmBO,SAAS,mBACd,OACa;AACb,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAChE,QAAM,EAAC,QAAQ,YAAW,IAAI,QAAQ;AACtC,QAAM,EAAC,UAAU,GAAG,iBAAA,IAAoB;AAExC,YAAU,MAAM;AACV,QAAA,qBAAqB,eAAe,WAAW,QAAQ;AACzD,aAAO,SAAS,OAAO;AAAA,IAAA;AAAA,EAExB,GAAA,CAAC,mBAAmB,QAAQ,WAAW,CAAC;AAGzC,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,qBAAqB,iBAAiB;AAAA,MAChD,SAAS,MAAY,qBAAqB,IAAI;AAAA,MAE7C;AAAA,IAAA;AAAA,EACH;AAEJ;"}
+{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {\n  BaseButton,\n  type BaseButtonProps,\n  type CustomBaseButtonProps,\n} from './BaseButton.js';\n\ntype ChildrenProps = {\n  /** A `ReactNode` element. */\n  children: ReactNode;\n};\ntype CartCheckoutButtonProps = Omit<BaseButtonProps<'button'>, 'onClick'> &\n  ChildrenProps;\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: CartCheckoutButtonProps,\n): JSX.Element {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={(): void => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\n// we ignore this issue because it makes the documentation look better than the equivalent `type` that it wants us to convert to\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface CartCheckoutButtonPropsForDocs<\n  AsType extends React.ElementType = 'button',\n> extends Omit<CustomBaseButtonProps<AsType>, 'onClick'> {}\n"],"names":[],"mappings":";;;;AAmBO,SAAS,mBACd,OACa;AACb,QAAM,CAAC,mBAAmB,oBAAoB,IAAI,SAAS,KAAK;AAChE,QAAM,EAAC,QAAQ,YAAA,IAAe,QAAA;AAC9B,QAAM,EAAC,UAAU,GAAG,iBAAA,IAAoB;AAExC,YAAU,MAAM;AACd,QAAI,qBAAqB,eAAe,WAAW,QAAQ;AACzD,aAAO,SAAS,OAAO;AAAA,IACzB;AAAA,EACF,GAAG,CAAC,mBAAmB,QAAQ,WAAW,CAAC;AAE3C,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU,qBAAqB,iBAAiB;AAAA,MAChD,SAAS,MAAY,qBAAqB,IAAI;AAAA,MAE7C;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/node-dev/CartCost.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartCost.js","sources":["../../src/CartCost.tsx"],"sourcesContent":["import {Money, type MoneyPropsBase} from './Money.js';\nimport {useCart} from './CartProvider.js';\n\ninterface CartCostPropsBase {\n  /** A string type that defines the type of cost needed. Valid values: `total`, `subtotal`, `tax`, or `duty`. */\n  amountType?: 'total' | 'subtotal' | 'tax' | 'duty';\n  /** Any `ReactNode` elements. */\n  children?: React.ReactNode;\n}\n\ntype CartCostProps = Omit<React.ComponentProps<typeof Money>, 'data'> &\n  CartCostPropsBase;\n\n/**\n * The `CartCost` component renders a `Money` component with the cost associated with the `amountType` prop.\n * If no `amountType` prop is specified, then it defaults to `totalAmount`.\n * Depends on `useCart()` and must be a child of `<CartProvider/>`\n */\nexport function CartCost(props: CartCostProps): JSX.Element | null {\n  const {cost} = useCart();\n  const {amountType = 'total', children, ...passthroughProps} = props;\n  let amount;\n\n  if (amountType == 'total') {\n    amount = cost?.totalAmount;\n  } else if (amountType == 'subtotal') {\n    amount = cost?.subtotalAmount;\n  } else if (amountType == 'tax') {\n    amount = cost?.totalTaxAmount;\n  } else if (amountType == 'duty') {\n    amount = cost?.totalDutyAmount;\n  }\n\n  if (amount == null) {\n    return null;\n  }\n\n  return (\n    <Money {...passthroughProps} data={amount}>\n      {children}\n    </Money>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface CartCostPropsForDocs<AsType extends React.ElementType = 'div'>\n  extends Omit<MoneyPropsBase<AsType>, 'data'>,\n    CartCostPropsBase {}\n"],"names":["useCart","Money"],"mappings":";;;;;AAkBO,SAAS,SAAS,OAA0C;AAC3D,QAAA,EAAC,KAAI,IAAIA,qBAAQ;AACvB,QAAM,EAAC,aAAa,SAAS,UAAU,GAAG,iBAAoB,IAAA;AAC1D,MAAA;AAEJ,MAAI,cAAc,SAAS;AACzB,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,YAAY;AACnC,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,OAAO;AAC9B,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,QAAQ;AAC/B,aAAS,6BAAM;AAAA,EAAA;AAGjB,MAAI,UAAU,MAAM;AACX,WAAA;AAAA,EAAA;AAGT,wCACGC,MAAAA,OAAO,EAAA,GAAG,kBAAkB,MAAM,QAChC,UACH;AAEJ;;"}
+{"version":3,"file":"CartCost.js","sources":["../../src/CartCost.tsx"],"sourcesContent":["import {Money, type MoneyPropsBase} from './Money.js';\nimport {useCart} from './CartProvider.js';\n\ninterface CartCostPropsBase {\n  /** A string type that defines the type of cost needed. Valid values: `total`, `subtotal`, `tax`, or `duty`. */\n  amountType?: 'total' | 'subtotal' | 'tax' | 'duty';\n  /** Any `ReactNode` elements. */\n  children?: React.ReactNode;\n}\n\ntype CartCostProps = Omit<React.ComponentProps<typeof Money>, 'data'> &\n  CartCostPropsBase;\n\n/**\n * The `CartCost` component renders a `Money` component with the cost associated with the `amountType` prop.\n * If no `amountType` prop is specified, then it defaults to `totalAmount`.\n * Depends on `useCart()` and must be a child of `<CartProvider/>`\n */\nexport function CartCost(props: CartCostProps): JSX.Element | null {\n  const {cost} = useCart();\n  const {amountType = 'total', children, ...passthroughProps} = props;\n  let amount;\n\n  if (amountType == 'total') {\n    amount = cost?.totalAmount;\n  } else if (amountType == 'subtotal') {\n    amount = cost?.subtotalAmount;\n  } else if (amountType == 'tax') {\n    amount = cost?.totalTaxAmount;\n  } else if (amountType == 'duty') {\n    amount = cost?.totalDutyAmount;\n  }\n\n  if (amount == null) {\n    return null;\n  }\n\n  return (\n    <Money {...passthroughProps} data={amount}>\n      {children}\n    </Money>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface CartCostPropsForDocs<AsType extends React.ElementType = 'div'>\n  extends Omit<MoneyPropsBase<AsType>, 'data'>,\n    CartCostPropsBase {}\n"],"names":["useCart","Money"],"mappings":";;;;;AAkBO,SAAS,SAAS,OAA0C;AACjE,QAAM,EAAC,KAAA,IAAQA,qBAAA;AACf,QAAM,EAAC,aAAa,SAAS,UAAU,GAAG,qBAAoB;AAC9D,MAAI;AAEJ,MAAI,cAAc,SAAS;AACzB,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,YAAY;AACnC,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,OAAO;AAC9B,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,QAAQ;AAC/B,aAAS,6BAAM;AAAA,EACjB;AAEA,MAAI,UAAU,MAAM;AAClB,WAAO;AAAA,EACT;AAEA,wCACGC,MAAAA,OAAA,EAAO,GAAG,kBAAkB,MAAM,QAChC,UACH;AAEJ;;"}

package/dist/node-dev/CartCost.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartCost.mjs","sources":["../../src/CartCost.tsx"],"sourcesContent":["import {Money, type MoneyPropsBase} from './Money.js';\nimport {useCart} from './CartProvider.js';\n\ninterface CartCostPropsBase {\n  /** A string type that defines the type of cost needed. Valid values: `total`, `subtotal`, `tax`, or `duty`. */\n  amountType?: 'total' | 'subtotal' | 'tax' | 'duty';\n  /** Any `ReactNode` elements. */\n  children?: React.ReactNode;\n}\n\ntype CartCostProps = Omit<React.ComponentProps<typeof Money>, 'data'> &\n  CartCostPropsBase;\n\n/**\n * The `CartCost` component renders a `Money` component with the cost associated with the `amountType` prop.\n * If no `amountType` prop is specified, then it defaults to `totalAmount`.\n * Depends on `useCart()` and must be a child of `<CartProvider/>`\n */\nexport function CartCost(props: CartCostProps): JSX.Element | null {\n  const {cost} = useCart();\n  const {amountType = 'total', children, ...passthroughProps} = props;\n  let amount;\n\n  if (amountType == 'total') {\n    amount = cost?.totalAmount;\n  } else if (amountType == 'subtotal') {\n    amount = cost?.subtotalAmount;\n  } else if (amountType == 'tax') {\n    amount = cost?.totalTaxAmount;\n  } else if (amountType == 'duty') {\n    amount = cost?.totalDutyAmount;\n  }\n\n  if (amount == null) {\n    return null;\n  }\n\n  return (\n    <Money {...passthroughProps} data={amount}>\n      {children}\n    </Money>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface CartCostPropsForDocs<AsType extends React.ElementType = 'div'>\n  extends Omit<MoneyPropsBase<AsType>, 'data'>,\n    CartCostPropsBase {}\n"],"names":[],"mappings":";;;AAkBO,SAAS,SAAS,OAA0C;AAC3D,QAAA,EAAC,KAAI,IAAI,QAAQ;AACvB,QAAM,EAAC,aAAa,SAAS,UAAU,GAAG,iBAAoB,IAAA;AAC1D,MAAA;AAEJ,MAAI,cAAc,SAAS;AACzB,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,YAAY;AACnC,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,OAAO;AAC9B,aAAS,6BAAM;AAAA,EAAA,WACN,cAAc,QAAQ;AAC/B,aAAS,6BAAM;AAAA,EAAA;AAGjB,MAAI,UAAU,MAAM;AACX,WAAA;AAAA,EAAA;AAGT,6BACG,OAAO,EAAA,GAAG,kBAAkB,MAAM,QAChC,UACH;AAEJ;"}
+{"version":3,"file":"CartCost.mjs","sources":["../../src/CartCost.tsx"],"sourcesContent":["import {Money, type MoneyPropsBase} from './Money.js';\nimport {useCart} from './CartProvider.js';\n\ninterface CartCostPropsBase {\n  /** A string type that defines the type of cost needed. Valid values: `total`, `subtotal`, `tax`, or `duty`. */\n  amountType?: 'total' | 'subtotal' | 'tax' | 'duty';\n  /** Any `ReactNode` elements. */\n  children?: React.ReactNode;\n}\n\ntype CartCostProps = Omit<React.ComponentProps<typeof Money>, 'data'> &\n  CartCostPropsBase;\n\n/**\n * The `CartCost` component renders a `Money` component with the cost associated with the `amountType` prop.\n * If no `amountType` prop is specified, then it defaults to `totalAmount`.\n * Depends on `useCart()` and must be a child of `<CartProvider/>`\n */\nexport function CartCost(props: CartCostProps): JSX.Element | null {\n  const {cost} = useCart();\n  const {amountType = 'total', children, ...passthroughProps} = props;\n  let amount;\n\n  if (amountType == 'total') {\n    amount = cost?.totalAmount;\n  } else if (amountType == 'subtotal') {\n    amount = cost?.subtotalAmount;\n  } else if (amountType == 'tax') {\n    amount = cost?.totalTaxAmount;\n  } else if (amountType == 'duty') {\n    amount = cost?.totalDutyAmount;\n  }\n\n  if (amount == null) {\n    return null;\n  }\n\n  return (\n    <Money {...passthroughProps} data={amount}>\n      {children}\n    </Money>\n  );\n}\n\n// This is only for documentation purposes, and it is not used in the code.\nexport interface CartCostPropsForDocs<AsType extends React.ElementType = 'div'>\n  extends Omit<MoneyPropsBase<AsType>, 'data'>,\n    CartCostPropsBase {}\n"],"names":[],"mappings":";;;AAkBO,SAAS,SAAS,OAA0C;AACjE,QAAM,EAAC,KAAA,IAAQ,QAAA;AACf,QAAM,EAAC,aAAa,SAAS,UAAU,GAAG,qBAAoB;AAC9D,MAAI;AAEJ,MAAI,cAAc,SAAS;AACzB,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,YAAY;AACnC,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,OAAO;AAC9B,aAAS,6BAAM;AAAA,EACjB,WAAW,cAAc,QAAQ;AAC/B,aAAS,6BAAM;AAAA,EACjB;AAEA,MAAI,UAAU,MAAM;AAClB,WAAO;AAAA,EACT;AAEA,6BACG,OAAA,EAAO,GAAG,kBAAkB,MAAM,QAChC,UACH;AAEJ;"}