@shopify/hydrogen-react 2022.10.7 → 2023.1.4

package/dist/browser-dev/cart-hooks.mjs

@@ -1,42 +1,37 @@
 import { useCallback } from "react";
 import { useShop } from "./ShopifyProvider.mjs";
-import { SHOPIFY_STOREFRONT_ID_HEADER, SHOPIFY_Y, SHOPIFY_S, SHOPIFY_STOREFRONT_Y_HEADER, SHOPIFY_STOREFRONT_S_HEADER } from "./cart-constants.mjs";
-import { parse } from "worktop/cookie";
+import { SHOPIFY_STOREFRONT_ID_HEADER, SHOPIFY_STOREFRONT_Y_HEADER, SHOPIFY_Y, SHOPIFY_STOREFRONT_S_HEADER, SHOPIFY_S } from "./cart-constants.mjs";
+import { getShopifyCookies } from "./cookies-utils.mjs";
 function useCartFetch() {
-  const {
-    storefrontId,
-    getPublicTokenHeaders,
-    getStorefrontApiUrl
-  } = useShop();
-  return useCallback(({
-    query,
-    variables
-  }) => {
-    const headers = getPublicTokenHeaders({
-      contentType: "json"
-    });
-    if (storefrontId) {
-      headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;
-    }
-    const cookieData = parse(document.cookie);
-    if (cookieData[SHOPIFY_Y] && cookieData[SHOPIFY_S]) {
+  const { storefrontId, getPublicTokenHeaders, getStorefrontApiUrl } = useShop();
+  return useCallback(
+    ({
+      query,
+      variables
+    }) => {
+      const headers = getPublicTokenHeaders({ contentType: "json" });
+      if (storefrontId) {
+        headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;
+      }
+      const cookieData = getShopifyCookies(document.cookie);
       headers[SHOPIFY_STOREFRONT_Y_HEADER] = cookieData[SHOPIFY_Y];
       headers[SHOPIFY_STOREFRONT_S_HEADER] = cookieData[SHOPIFY_S];
-    }
-    return fetch(getStorefrontApiUrl(), {
-      method: "POST",
-      headers,
-      body: JSON.stringify({
-        query: query.toString(),
-        variables
-      })
-    }).then((res) => res.json()).catch((error) => {
-      return {
-        data: void 0,
-        errors: error.toString()
-      };
-    });
-  }, [getPublicTokenHeaders, storefrontId, getStorefrontApiUrl]);
+      return fetch(getStorefrontApiUrl(), {
+        method: "POST",
+        headers,
+        body: JSON.stringify({
+          query: query.toString(),
+          variables
+        })
+      }).then((res) => res.json()).catch((error) => {
+        return {
+          data: void 0,
+          errors: error.toString()
+        };
+      });
+    },
+    [getPublicTokenHeaders, storefrontId, getStorefrontApiUrl]
+  );
 }
 export {
   useCartFetch

package/dist/browser-dev/cart-hooks.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cart-hooks.mjs","sources":["../../src/cart-hooks.tsx"],"sourcesContent":["import {useState, useCallback} from 'react';\nimport {useShop} from './ShopifyProvider.js';\nimport {flattenConnection} from './flatten-connection.js';\nimport {CartInput, Cart as CartType} from './storefront-api-types.js';\nimport {CartCreate, defaultCartFragment} from './cart-queries.js';\nimport {Cart} from './cart-types.js';\nimport {\n  SHOPIFY_STOREFRONT_ID_HEADER,\n  SHOPIFY_STOREFRONT_Y_HEADER,\n  SHOPIFY_STOREFRONT_S_HEADER,\n  SHOPIFY_Y,\n  SHOPIFY_S,\n} from './cart-constants.js';\nimport {parse} from 'worktop/cookie';\nimport type {StorefrontApiResponseOkPartial} from './storefront-api-response.types.js';\n\nexport function useCartFetch() {\n  const {storefrontId, getPublicTokenHeaders, getStorefrontApiUrl} = useShop();\n\n  return useCallback(\n    <ReturnDataGeneric,>({\n      query,\n      variables,\n    }: {\n      query: string;\n      variables: Record<string, unknown>;\n    }): Promise<StorefrontApiResponseOkPartial<ReturnDataGeneric>> => {\n      const headers = getPublicTokenHeaders({contentType: 'json'});\n\n      if (storefrontId) {\n        headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;\n      }\n\n      // Find Shopify cookies\n      const cookieData = parse(document.cookie);\n      if (cookieData[SHOPIFY_Y] && cookieData[SHOPIFY_S]) {\n        headers[SHOPIFY_STOREFRONT_Y_HEADER] = cookieData[SHOPIFY_Y];\n        headers[SHOPIFY_STOREFRONT_S_HEADER] = cookieData[SHOPIFY_S];\n      }\n\n      return fetch(getStorefrontApiUrl(), {\n        method: 'POST',\n        headers,\n        body: JSON.stringify({\n          query: query.toString(),\n          variables,\n        }),\n      })\n        .then((res) => res.json())\n        .catch((error) => {\n          return {\n            data: undefined,\n            errors: error.toString(),\n          };\n        });\n    },\n    [getPublicTokenHeaders, storefrontId, getStorefrontApiUrl]\n  );\n}\n\nexport function useInstantCheckout() {\n  const [cart, updateCart] = useState<Cart | undefined>();\n  const [checkoutUrl, updateCheckoutUrl] = useState<Cart['checkoutUrl']>();\n  const [error, updateError] = useState<string | undefined>();\n\n  const fetch = useCartFetch();\n\n  const createInstantCheckout = useCallback(\n    async (cartInput: CartInput) => {\n      const {data, errors} = await fetch<{\n        cartCreate: {cart: CartType};\n      }>({\n        query: CartCreate(defaultCartFragment),\n        variables: {\n          input: cartInput,\n        },\n      });\n\n      if (errors) {\n        updateError(errors.toString());\n        updateCart(undefined);\n        updateCheckoutUrl(undefined);\n      }\n\n      if (data?.cartCreate?.cart) {\n        const dataCart = data.cartCreate.cart;\n        updateCart({\n          ...dataCart,\n          lines: flattenConnection(dataCart.lines),\n          note: dataCart.note ?? undefined,\n        });\n        updateCheckoutUrl(dataCart.checkoutUrl);\n      }\n    },\n    [fetch]\n  );\n\n  return {cart, checkoutUrl, error, createInstantCheckout};\n}\n"],"names":["useCartFetch","storefrontId","getPublicTokenHeaders","getStorefrontApiUrl","useShop","useCallback","query","variables","headers","contentType","SHOPIFY_STOREFRONT_ID_HEADER","cookieData","parse","document","cookie","SHOPIFY_Y","SHOPIFY_S","SHOPIFY_STOREFRONT_Y_HEADER","SHOPIFY_STOREFRONT_S_HEADER","fetch","method","body","JSON","stringify","toString","then","res","json","catch","error","data","undefined","errors"],"mappings":";;;;AAgBO,SAASA,eAAe;AACvB,QAAA;AAAA,IAACC;AAAAA,IAAcC;AAAAA,IAAuBC;AAAAA,MAAuBC,QAAS;AAE5E,SAAOC,YACL,CAAqB;AAAA,IACnBC;AAAAA,IACAC;AAAAA,EAAAA,MAIgE;AAChE,UAAMC,UAAUN,sBAAsB;AAAA,MAACO,aAAa;AAAA,IAAA,CAAO;AAE3D,QAAIR,cAAc;AAChBO,cAAQE,gCAAgCT;AAAAA,IAC1C;AAGMU,UAAAA,aAAaC,MAAMC,SAASC,MAAM;AACpCH,QAAAA,WAAWI,cAAcJ,WAAWK,YAAY;AAClDR,cAAQS,+BAA+BN,WAAWI;AAClDP,cAAQU,+BAA+BP,WAAWK;AAAAA,IACpD;AAEOG,WAAAA,MAAMhB,uBAAuB;AAAA,MAClCiB,QAAQ;AAAA,MACRZ;AAAAA,MACAa,MAAMC,KAAKC,UAAU;AAAA,QACnBjB,OAAOA,MAAMkB,SAAU;AAAA,QACvBjB;AAAAA,MAAAA,CACD;AAAA,IAAA,CACF,EACEkB,KAAMC,CAAAA,QAAQA,IAAIC,MAAM,EACxBC,MAAOC,CAAU,UAAA;AACT,aAAA;AAAA,QACLC,MAAMC;AAAAA,QACNC,QAAQH,MAAML,SAAQ;AAAA,MAAA;AAAA,IACxB,CACD;AAAA,EAEL,GAAA,CAACtB,uBAAuBD,cAAcE,mBAAmB,CAAC;AAE9D;"}
+{"version":3,"file":"cart-hooks.mjs","sources":["../../src/cart-hooks.tsx"],"sourcesContent":["import {useState, useCallback} from 'react';\nimport {useShop} from './ShopifyProvider.js';\nimport {flattenConnection} from './flatten-connection.js';\nimport {CartInput, Cart as CartType} from './storefront-api-types.js';\nimport {CartCreate, defaultCartFragment} from './cart-queries.js';\nimport {Cart} from './cart-types.js';\nimport {\n  SHOPIFY_STOREFRONT_ID_HEADER,\n  SHOPIFY_STOREFRONT_Y_HEADER,\n  SHOPIFY_STOREFRONT_S_HEADER,\n  SHOPIFY_Y,\n  SHOPIFY_S,\n} from './cart-constants.js';\nimport type {StorefrontApiResponseOkPartial} from './storefront-api-response.types.js';\nimport {getShopifyCookies} from './cookies-utils.js';\n\nexport function useCartFetch() {\n  const {storefrontId, getPublicTokenHeaders, getStorefrontApiUrl} = useShop();\n\n  return useCallback(\n    <ReturnDataGeneric,>({\n      query,\n      variables,\n    }: {\n      query: string;\n      variables: Record<string, unknown>;\n    }): Promise<StorefrontApiResponseOkPartial<ReturnDataGeneric>> => {\n      const headers = getPublicTokenHeaders({contentType: 'json'});\n\n      if (storefrontId) {\n        headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;\n      }\n\n      // Find Shopify cookies\n      const cookieData = getShopifyCookies(document.cookie);\n      headers[SHOPIFY_STOREFRONT_Y_HEADER] = cookieData[SHOPIFY_Y];\n      headers[SHOPIFY_STOREFRONT_S_HEADER] = cookieData[SHOPIFY_S];\n\n      return fetch(getStorefrontApiUrl(), {\n        method: 'POST',\n        headers,\n        body: JSON.stringify({\n          query: query.toString(),\n          variables,\n        }),\n      })\n        .then((res) => res.json())\n        .catch((error) => {\n          return {\n            data: undefined,\n            errors: error.toString(),\n          };\n        });\n    },\n    [getPublicTokenHeaders, storefrontId, getStorefrontApiUrl]\n  );\n}\n\nexport function useInstantCheckout() {\n  const [cart, updateCart] = useState<Cart | undefined>();\n  const [checkoutUrl, updateCheckoutUrl] = useState<Cart['checkoutUrl']>();\n  const [error, updateError] = useState<string | undefined>();\n\n  const fetch = useCartFetch();\n\n  const createInstantCheckout = useCallback(\n    async (cartInput: CartInput) => {\n      const {data, errors} = await fetch<{\n        cartCreate: {cart: CartType};\n      }>({\n        query: CartCreate(defaultCartFragment),\n        variables: {\n          input: cartInput,\n        },\n      });\n\n      if (errors) {\n        updateError(errors.toString());\n        updateCart(undefined);\n        updateCheckoutUrl(undefined);\n      }\n\n      if (data?.cartCreate?.cart) {\n        const dataCart = data.cartCreate.cart;\n        updateCart({\n          ...dataCart,\n          lines: flattenConnection(dataCart.lines),\n          note: dataCart.note ?? undefined,\n        });\n        updateCheckoutUrl(dataCart.checkoutUrl);\n      }\n    },\n    [fetch]\n  );\n\n  return {cart, checkoutUrl, error, createInstantCheckout};\n}\n"],"names":[],"mappings":";;;;AAgBO,SAAS,eAAe;AAC7B,QAAM,EAAC,cAAc,uBAAuB,wBAAuB,QAAQ;AAEpE,SAAA;AAAA,IACL,CAAqB;AAAA,MACnB;AAAA,MACA;AAAA,IAAA,MAIgE;AAChE,YAAM,UAAU,sBAAsB,EAAC,aAAa,OAAO,CAAA;AAE3D,UAAI,cAAc;AAChB,gBAAQ,4BAA4B,IAAI;AAAA,MAC1C;AAGM,YAAA,aAAa,kBAAkB,SAAS,MAAM;AAC5C,cAAA,2BAA2B,IAAI,WAAW,SAAS;AACnD,cAAA,2BAA2B,IAAI,WAAW,SAAS;AAEpD,aAAA,MAAM,uBAAuB;AAAA,QAClC,QAAQ;AAAA,QACR;AAAA,QACA,MAAM,KAAK,UAAU;AAAA,UACnB,OAAO,MAAM,SAAS;AAAA,UACtB;AAAA,QAAA,CACD;AAAA,MAAA,CACF,EACE,KAAK,CAAC,QAAQ,IAAI,MAAM,EACxB,MAAM,CAAC,UAAU;AACT,eAAA;AAAA,UACL,MAAM;AAAA,UACN,QAAQ,MAAM,SAAS;AAAA,QAAA;AAAA,MACzB,CACD;AAAA,IACL;AAAA,IACA,CAAC,uBAAuB,cAAc,mBAAmB;AAAA,EAAA;AAE7D;"}

package/dist/browser-dev/cart-queries.mjs

@@ -1,4 +1,6 @@
-const CartLineAdd = (cartFragment) => `
+const CartLineAdd = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartLineAdd(
     $cartId: ID!
     $lines: [CartLineInput!]!
@@ -13,8 +15,11 @@ const CartLineAdd = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartCreate = (cartFragment) => `
+`
+);
+const CartCreate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartCreate(
     $input: CartInput!
     $numCartLines: Int = 250
@@ -28,8 +33,11 @@ const CartCreate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartLineRemove = (cartFragment) => `
+`
+);
+const CartLineRemove = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartLineRemove(
     $cartId: ID!
     $lines: [ID!]!
@@ -44,8 +52,11 @@ const CartLineRemove = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartLineUpdate = (cartFragment) => `
+`
+);
+const CartLineUpdate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartLineUpdate(
     $cartId: ID!
     $lines: [CartLineUpdateInput!]!
@@ -60,8 +71,11 @@ const CartLineUpdate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartNoteUpdate = (cartFragment) => `
+`
+);
+const CartNoteUpdate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartNoteUpdate(
     $cartId: ID!
     $note: String
@@ -76,8 +90,11 @@ const CartNoteUpdate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartBuyerIdentityUpdate = (cartFragment) => `
+`
+);
+const CartBuyerIdentityUpdate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartBuyerIdentityUpdate(
     $cartId: ID!
     $buyerIdentity: CartBuyerIdentityInput!
@@ -92,8 +109,11 @@ const CartBuyerIdentityUpdate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartAttributesUpdate = (cartFragment) => `
+`
+);
+const CartAttributesUpdate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartAttributesUpdate(
     $attributes: [AttributeInput!]!
     $cartId: ID!
@@ -108,8 +128,11 @@ const CartAttributesUpdate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartDiscountCodesUpdate = (cartFragment) => `
+`
+);
+const CartDiscountCodesUpdate = (cartFragment) => (
+  /* GraphQL */
+  `
   mutation CartDiscountCodesUpdate(
     $cartId: ID!
     $discountCodes: [String!]
@@ -124,8 +147,11 @@ const CartDiscountCodesUpdate = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const CartQuery = (cartFragment) => `
+`
+);
+const CartQuery = (cartFragment) => (
+  /* GraphQL */
+  `
   query CartQuery(
     $id: ID!
     $numCartLines: Int = 250
@@ -137,8 +163,11 @@ const CartQuery = (cartFragment) => `
   }
 
   ${cartFragment}
-`;
-const defaultCartFragment = `
+`
+);
+const defaultCartFragment = (
+  /* GraphQL */
+  `
   fragment CartFragment on Cart {
     id
     checkoutUrl
@@ -181,17 +210,9 @@ const defaultCartFragment = `
               compareAtPrice {
                 ...MoneyFragment
               }
-              # @deprecated remove in next major
-              compareAtPriceV2 {
-                ...MoneyFragment
-              }
               price {
                 ...MoneyFragment
               }
-              # @deprecated remove in next major
-              priceV2 {
-                ...MoneyFragment
-              }
               requiresShipping
               title
               image {
@@ -246,7 +267,8 @@ const defaultCartFragment = `
     width
     height
   }
-`;
+`
+);
 export {
   CartAttributesUpdate,
   CartBuyerIdentityUpdate,

package/dist/browser-dev/cart-queries.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cart-queries.mjs","sources":["../../src/cart-queries.ts"],"sourcesContent":["export const CartLineAdd = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineAdd(\n    $cartId: ID!\n    $lines: [CartLineInput!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesAdd(cartId: $cartId, lines: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartCreate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartCreate(\n    $input: CartInput!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartCreate(input: $input) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartLineRemove = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineRemove(\n    $cartId: ID!\n    $lines: [ID!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesRemove(cartId: $cartId, lineIds: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartLineUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineUpdate(\n    $cartId: ID!\n    $lines: [CartLineUpdateInput!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesUpdate(cartId: $cartId, lines: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartNoteUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartNoteUpdate(\n    $cartId: ID!\n    $note: String\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartNoteUpdate(cartId: $cartId, note: $note) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartBuyerIdentityUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartBuyerIdentityUpdate(\n    $cartId: ID!\n    $buyerIdentity: CartBuyerIdentityInput!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartBuyerIdentityUpdate(cartId: $cartId, buyerIdentity: $buyerIdentity) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartAttributesUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartAttributesUpdate(\n    $attributes: [AttributeInput!]!\n    $cartId: ID!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartAttributesUpdate(attributes: $attributes, cartId: $cartId) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartDiscountCodesUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartDiscountCodesUpdate(\n    $cartId: ID!\n    $discountCodes: [String!]\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartDiscountCodesUpdate(cartId: $cartId, discountCodes: $discountCodes) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartQuery = (cartFragment: string) => /* GraphQL */ `\n  query CartQuery(\n    $id: ID!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cart(id: $id) {\n      ...CartFragment\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const defaultCartFragment = /* GraphQL */ `\n  fragment CartFragment on Cart {\n    id\n    checkoutUrl\n    totalQuantity\n    buyerIdentity {\n      countryCode\n      customer {\n        id\n        email\n        firstName\n        lastName\n        displayName\n      }\n      email\n      phone\n    }\n    lines(first: $numCartLines) {\n      edges {\n        node {\n          id\n          quantity\n          attributes {\n            key\n            value\n          }\n          cost {\n            totalAmount {\n              amount\n              currencyCode\n            }\n            compareAtAmountPerQuantity {\n              amount\n              currencyCode\n            }\n          }\n          merchandise {\n            ... on ProductVariant {\n              id\n              availableForSale\n              compareAtPrice {\n                ...MoneyFragment\n              }\n              # @deprecated remove in next major\n              compareAtPriceV2 {\n                ...MoneyFragment\n              }\n              price {\n                ...MoneyFragment\n              }\n              # @deprecated remove in next major\n              priceV2 {\n                ...MoneyFragment\n              }\n              requiresShipping\n              title\n              image {\n                ...ImageFragment\n              }\n              product {\n                handle\n                title\n                id\n              }\n              selectedOptions {\n                name\n                value\n              }\n            }\n          }\n        }\n      }\n    }\n    cost {\n      subtotalAmount {\n        ...MoneyFragment\n      }\n      totalAmount {\n        ...MoneyFragment\n      }\n      totalDutyAmount {\n        ...MoneyFragment\n      }\n      totalTaxAmount {\n        ...MoneyFragment\n      }\n    }\n    note\n    attributes {\n      key\n      value\n    }\n    discountCodes {\n      code\n    }\n  }\n\n  fragment MoneyFragment on MoneyV2 {\n    currencyCode\n    amount\n  }\n  fragment ImageFragment on Image {\n    id\n    url\n    altText\n    width\n    height\n  }\n`;\n"],"names":[],"mappings":"AAAa,MAAA,cAAc,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc/D;AAAA;AAGS,MAAA,aAAa,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAa9D;AAAA;AAGS,MAAA,iBAAiB,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAGS,MAAA,iBAAiB,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAGS,MAAA,iBAAiB,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAGS,MAAA,0BAA0B,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc3E;AAAA;AAGS,MAAA,uBAAuB,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAcxE;AAAA;AAGS,MAAA,0BAA0B,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc3E;AAAA;AAGS,MAAA,YAAY,CAAC,iBAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAW7D;AAAA;AAGG,MAAM,sBAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"cart-queries.mjs","sources":["../../src/cart-queries.ts"],"sourcesContent":["export const CartLineAdd = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineAdd(\n    $cartId: ID!\n    $lines: [CartLineInput!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesAdd(cartId: $cartId, lines: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartCreate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartCreate(\n    $input: CartInput!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartCreate(input: $input) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartLineRemove = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineRemove(\n    $cartId: ID!\n    $lines: [ID!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesRemove(cartId: $cartId, lineIds: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartLineUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartLineUpdate(\n    $cartId: ID!\n    $lines: [CartLineUpdateInput!]!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartLinesUpdate(cartId: $cartId, lines: $lines) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartNoteUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartNoteUpdate(\n    $cartId: ID!\n    $note: String\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartNoteUpdate(cartId: $cartId, note: $note) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartBuyerIdentityUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartBuyerIdentityUpdate(\n    $cartId: ID!\n    $buyerIdentity: CartBuyerIdentityInput!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartBuyerIdentityUpdate(cartId: $cartId, buyerIdentity: $buyerIdentity) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartAttributesUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartAttributesUpdate(\n    $attributes: [AttributeInput!]!\n    $cartId: ID!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartAttributesUpdate(attributes: $attributes, cartId: $cartId) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartDiscountCodesUpdate = (cartFragment: string) => /* GraphQL */ `\n  mutation CartDiscountCodesUpdate(\n    $cartId: ID!\n    $discountCodes: [String!]\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cartDiscountCodesUpdate(cartId: $cartId, discountCodes: $discountCodes) {\n      cart {\n        ...CartFragment\n      }\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const CartQuery = (cartFragment: string) => /* GraphQL */ `\n  query CartQuery(\n    $id: ID!\n    $numCartLines: Int = 250\n    $country: CountryCode = ZZ\n  ) @inContext(country: $country) {\n    cart(id: $id) {\n      ...CartFragment\n    }\n  }\n\n  ${cartFragment}\n`;\n\nexport const defaultCartFragment = /* GraphQL */ `\n  fragment CartFragment on Cart {\n    id\n    checkoutUrl\n    totalQuantity\n    buyerIdentity {\n      countryCode\n      customer {\n        id\n        email\n        firstName\n        lastName\n        displayName\n      }\n      email\n      phone\n    }\n    lines(first: $numCartLines) {\n      edges {\n        node {\n          id\n          quantity\n          attributes {\n            key\n            value\n          }\n          cost {\n            totalAmount {\n              amount\n              currencyCode\n            }\n            compareAtAmountPerQuantity {\n              amount\n              currencyCode\n            }\n          }\n          merchandise {\n            ... on ProductVariant {\n              id\n              availableForSale\n              compareAtPrice {\n                ...MoneyFragment\n              }\n              price {\n                ...MoneyFragment\n              }\n              requiresShipping\n              title\n              image {\n                ...ImageFragment\n              }\n              product {\n                handle\n                title\n                id\n              }\n              selectedOptions {\n                name\n                value\n              }\n            }\n          }\n        }\n      }\n    }\n    cost {\n      subtotalAmount {\n        ...MoneyFragment\n      }\n      totalAmount {\n        ...MoneyFragment\n      }\n      totalDutyAmount {\n        ...MoneyFragment\n      }\n      totalTaxAmount {\n        ...MoneyFragment\n      }\n    }\n    note\n    attributes {\n      key\n      value\n    }\n    discountCodes {\n      code\n    }\n  }\n\n  fragment MoneyFragment on MoneyV2 {\n    currencyCode\n    amount\n  }\n  fragment ImageFragment on Image {\n    id\n    url\n    altText\n    width\n    height\n  }\n`;\n"],"names":[],"mappings":"AAAO,MAAM,cAAc,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc/D;AAAA;AAAA;AAGG,MAAM,aAAa,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAa9D;AAAA;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAclE;AAAA;AAAA;AAGG,MAAM,0BAA0B,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc3E;AAAA;AAAA;AAGG,MAAM,uBAAuB,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAcxE;AAAA;AAAA;AAGG,MAAM,0BAA0B,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAc3E;AAAA;AAAA;AAGG,MAAM,YAAY,CAAC;AAAA;AAAA,EAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAW7D;AAAA;AAAA;AAGS,MAAA;AAAA;AAAA,EAAoC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/browser-dev/codegen.helpers.mjs

@@ -1,4 +1,5 @@
 const storefrontApiCustomScalars = {
+  // Keep in sync with the definitions in the app/nextjs/codegen.ts!
   DateTime: "string",
   Decimal: "string",
   HTML: "string",

package/dist/browser-dev/codegen.helpers.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"codegen.helpers.mjs","sources":["../../src/codegen.helpers.ts"],"sourcesContent":["/** Meant to be used with GraphQL CodeGen to type the Storefront API's custom scalars correctly */\nexport const storefrontApiCustomScalars = {\n  // Keep in sync with the definitions in the app/nextjs/codegen.ts!\n  DateTime: 'string',\n  Decimal: 'string',\n  HTML: 'string',\n  URL: 'string',\n  Color: 'string',\n  UnsignedInt64: 'string',\n};\n"],"names":[],"mappings":"AACO,MAAM,6BAA6B;AAAA,EAExC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,eAAe;AACjB;"}
+{"version":3,"file":"codegen.helpers.mjs","sources":["../../src/codegen.helpers.ts"],"sourcesContent":["/** Meant to be used with GraphQL CodeGen to type the Storefront API's custom scalars correctly */\nexport const storefrontApiCustomScalars = {\n  // Keep in sync with the definitions in the app/nextjs/codegen.ts!\n  DateTime: 'string',\n  Decimal: 'string',\n  HTML: 'string',\n  URL: 'string',\n  Color: 'string',\n  UnsignedInt64: 'string',\n};\n"],"names":[],"mappings":"AACO,MAAM,6BAA6B;AAAA;AAAA,EAExC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,MAAM;AAAA,EACN,KAAK;AAAA,EACL,OAAO;AAAA,EACP,eAAe;AACjB;"}

package/dist/browser-dev/cookies-utils.mjs

@@ -0,0 +1,50 @@
+import { parse } from "worktop/cookie";
+import { SHOPIFY_Y, SHOPIFY_S } from "./cart-constants.mjs";
+const tokenHash = "xxxx-4xxx-xxxx-xxxxxxxxxxxx";
+function buildUUID() {
+  let hash = "";
+  try {
+    const crypto = window.crypto;
+    const randomValuesArray = new Uint16Array(31);
+    crypto.getRandomValues(randomValuesArray);
+    let i = 0;
+    hash = tokenHash.replace(/[x]/g, (c) => {
+      const r = randomValuesArray[i] % 16;
+      const v = c === "x" ? r : r & 3 | 8;
+      i++;
+      return v.toString(16);
+    }).toUpperCase();
+  } catch (err) {
+    hash = tokenHash.replace(/[x]/g, (c) => {
+      const r = Math.random() * 16 | 0;
+      const v = c === "x" ? r : r & 3 | 8;
+      return v.toString(16);
+    }).toUpperCase();
+  }
+  return `${hexTime()}-${hash}`;
+}
+function hexTime() {
+  let dateNumber = 0;
+  let perfNumber = 0;
+  dateNumber = new Date().getTime() >>> 0;
+  try {
+    perfNumber = performance.now() >>> 0;
+  } catch (err) {
+    perfNumber = 0;
+  }
+  const output = Math.abs(dateNumber + perfNumber).toString(16).toLowerCase();
+  return output.padStart(8 - output.length, "0");
+}
+function getShopifyCookies(cookies) {
+  const cookieData = parse(cookies);
+  return {
+    [SHOPIFY_Y]: cookieData[SHOPIFY_Y] || "",
+    [SHOPIFY_S]: cookieData[SHOPIFY_S] || ""
+  };
+}
+export {
+  buildUUID,
+  getShopifyCookies,
+  hexTime
+};
+//# sourceMappingURL=cookies-utils.mjs.map

package/dist/browser-dev/cookies-utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookies-utils.mjs","sources":["../../src/cookies-utils.tsx"],"sourcesContent":["import {parse} from 'worktop/cookie';\nimport {ShopifyCookies} from './analytics-types.js';\nimport {SHOPIFY_Y, SHOPIFY_S} from './cart-constants.js';\n\nconst tokenHash = 'xxxx-4xxx-xxxx-xxxxxxxxxxxx';\n\nexport function buildUUID(): string {\n  let hash = '';\n\n  try {\n    const crypto: Crypto = window.crypto;\n    const randomValuesArray = new Uint16Array(31);\n    crypto.getRandomValues(randomValuesArray);\n\n    // Generate a strong UUID\n    let i = 0;\n    hash = tokenHash\n      .replace(/[x]/g, (c: string): string => {\n        const r = randomValuesArray[i] % 16;\n        const v = c === 'x' ? r : (r & 0x3) | 0x8;\n        i++;\n        return v.toString(16);\n      })\n      .toUpperCase();\n  } catch (err) {\n    // crypto not available, generate weak UUID\n    hash = tokenHash\n      .replace(/[x]/g, (c: string): string => {\n        const r = (Math.random() * 16) | 0;\n        const v = c === 'x' ? r : (r & 0x3) | 0x8;\n        return v.toString(16);\n      })\n      .toUpperCase();\n  }\n\n  return `${hexTime()}-${hash}`;\n}\n\nexport function hexTime(): string {\n  // 32 bit representations of new Date().getTime() and performance.now()\n  let dateNumber = 0;\n  let perfNumber = 0;\n\n  // Result of zero-fill right shift is always positive\n  dateNumber = new Date().getTime() >>> 0;\n\n  try {\n    perfNumber = performance.now() >>> 0;\n  } catch (err) {\n    perfNumber = 0;\n  }\n\n  const output = Math.abs(dateNumber + perfNumber)\n    .toString(16)\n    .toLowerCase();\n\n  return output.padStart(8 - output.length, '0');\n}\n\nexport function getShopifyCookies(cookies: string): ShopifyCookies {\n  const cookieData = parse(cookies);\n  return {\n    [SHOPIFY_Y]: cookieData[SHOPIFY_Y] || '',\n    [SHOPIFY_S]: cookieData[SHOPIFY_S] || '',\n  };\n}\n"],"names":[],"mappings":";;AAIA,MAAM,YAAY;AAEX,SAAS,YAAoB;AAClC,MAAI,OAAO;AAEP,MAAA;AACF,UAAM,SAAiB,OAAO;AACxB,UAAA,oBAAoB,IAAI,YAAY,EAAE;AAC5C,WAAO,gBAAgB,iBAAiB;AAGxC,QAAI,IAAI;AACR,WAAO,UACJ,QAAQ,QAAQ,CAAC,MAAsB;AAChC,YAAA,IAAI,kBAAkB,CAAC,IAAI;AACjC,YAAM,IAAI,MAAM,MAAM,IAAK,IAAI,IAAO;AACtC;AACO,aAAA,EAAE,SAAS,EAAE;AAAA,IAAA,CACrB,EACA,YAAY;AAAA,WACR;AAEP,WAAO,UACJ,QAAQ,QAAQ,CAAC,MAAsB;AACtC,YAAM,IAAK,KAAK,OAAO,IAAI,KAAM;AACjC,YAAM,IAAI,MAAM,MAAM,IAAK,IAAI,IAAO;AAC/B,aAAA,EAAE,SAAS,EAAE;AAAA,IAAA,CACrB,EACA,YAAY;AAAA,EACjB;AAEO,SAAA,GAAG,aAAa;AACzB;AAEO,SAAS,UAAkB;AAEhC,MAAI,aAAa;AACjB,MAAI,aAAa;AAGjB,eAAa,IAAI,KAAA,EAAO,QAAA,MAAc;AAElC,MAAA;AACW,iBAAA,YAAY,IAAU,MAAA;AAAA,WAC5B;AACM,iBAAA;AAAA,EACf;AAEM,QAAA,SAAS,KAAK,IAAI,aAAa,UAAU,EAC5C,SAAS,EAAE,EACX;AAEH,SAAO,OAAO,SAAS,IAAI,OAAO,QAAQ,GAAG;AAC/C;AAEO,SAAS,kBAAkB,SAAiC;AAC3D,QAAA,aAAa,MAAM,OAAO;AACzB,SAAA;AAAA,IACL,CAAC,SAAS,GAAG,WAAW,SAAS,KAAK;AAAA,IACtC,CAAC,SAAS,GAAG,WAAW,SAAS,KAAK;AAAA,EAAA;AAE1C;"}

package/dist/browser-dev/flatten-connection.mjs

@@ -1,24 +1,26 @@
 function flattenConnection(connection) {
   if (!connection) {
-    const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead`;
+    const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead.`;
     {
       throw new Error(noConnectionErr);
     }
   }
-  if (connection.nodes) {
+  if ("nodes" in connection) {
     return connection.nodes;
   }
-  if (connection.edges) {
+  if ("edges" in connection && Array.isArray(connection.edges)) {
     return connection.edges.map((edge) => {
       if (!(edge == null ? void 0 : edge.node)) {
-        throw new Error("Connection edges must contain nodes");
+        throw new Error(
+          "flattenConnection(): Connection edges must contain nodes"
+        );
       }
       return edge.node;
     });
   }
   {
     console.warn(
-      `The connection did not contain either "nodes" or "edges.node". A empty array will be returned in its place.`
+      `flattenConnection(): The connection did not contain either "nodes" or "edges.node". Returning an empty array.`
     );
   }
   return [];

package/dist/browser-dev/flatten-connection.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"flatten-connection.mjs","sources":["../../src/flatten-connection.ts"],"sourcesContent":["import type {PartialDeep} from 'type-fest';\n\n/**\n * The `flattenConnection` utility transforms a connection object from the Storefront API (for example, [Product-related connections](https://shopify.dev/api/storefront/reference/products/product)) into a flat array of nodes.\n * The utility works with either `nodes` or `edges.node`.\n *\n * If `connection` is null or undefined, will return an empty array instead in production. In development, an error will be thrown.\n */\nexport function flattenConnection<T>(\n  connection?: PartialDeep<GraphQLConnection<T>, {recurseIntoArrays: true}>\n): PartialDeep<T, {recurseIntoArrays: true}>[] {\n  if (!connection) {\n    const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead`;\n    if (__HYDROGEN_DEV__) {\n      throw new Error(noConnectionErr);\n    } else {\n      console.error(noConnectionErr);\n      return [];\n    }\n  }\n\n  if (connection.nodes) {\n    return connection.nodes as PartialDeep<T, {recurseIntoArrays: true}>[];\n  }\n\n  if (connection.edges) {\n    return connection.edges.map((edge) => {\n      if (!edge?.node) {\n        throw new Error('Connection edges must contain nodes');\n      }\n      return edge.node;\n    });\n  }\n\n  if (__HYDROGEN_DEV__) {\n    console.warn(\n      `The connection did not contain either \"nodes\" or \"edges.node\". A empty array will be returned in its place.`\n    );\n  }\n\n  return [];\n}\n\ninterface GraphQLConnection<T> {\n  edges?: {node: T}[];\n  nodes?: T[];\n}\n"],"names":[],"mappings":"AAQO,SAAS,kBACd,YAC6C;AAC7C,MAAI,CAAC,YAAY;AACf,UAAM,kBAAkB,uEAAuE;AACzE;AACd,YAAA,IAAI,MAAM,eAAe;AAAA,IAIjC;AAAA,EACF;AAEA,MAAI,WAAW,OAAO;AACpB,WAAO,WAAW;AAAA,EACpB;AAEA,MAAI,WAAW,OAAO;AACpB,WAAO,WAAW,MAAM,IAAI,CAAC,SAAS;AAChC,UAAA,EAAC,6BAAM,OAAM;AACT,cAAA,IAAI,MAAM,qCAAqC;AAAA,MACvD;AACA,aAAO,KAAK;AAAA,IAAA,CACb;AAAA,EACH;AAEsB;AACZ,YAAA;AAAA,MACN;AAAA,IAAA;AAAA,EAEJ;AAEA,SAAO;AACT;"}
+{"version":3,"file":"flatten-connection.mjs","sources":["../../src/flatten-connection.ts"],"sourcesContent":["import type {PartialDeep} from 'type-fest';\n\n/**\n * The `flattenConnection` utility transforms a connection object from the Storefront API (for example, [Product-related connections](https://shopify.dev/api/storefront/reference/products/product)) into a flat array of nodes.\n * The utility works with either `nodes` or `edges.node`.\n *\n * If `connection` is null or undefined, will return an empty array instead in production. In development, an error will be thrown.\n */\nexport function flattenConnection<\n  ConnectionGeneric extends\n    | PartialDeep<ConnectionEdges, {recurseIntoArrays: true}>\n    | PartialDeep<ConnectionNodes, {recurseIntoArrays: true}>\n    | ConnectionEdges\n    | ConnectionNodes\n>(\n  connection?: ConnectionGeneric\n): ConnectionGeneric extends\n  | {\n      edges: {node: Array<infer ConnectionBaseType>};\n    }\n  | {\n      nodes: Array<infer ConnectionBaseType>;\n    }\n  ? // if it's not a PartialDeep, then return the infered type\n    ConnectionBaseType[]\n  : ConnectionGeneric extends\n      | PartialDeep<\n          {edges: {node: Array<infer ConnectionBaseType>}},\n          {recurseIntoArrays: true}\n        >\n      | PartialDeep<\n          {\n            nodes: Array<infer ConnectionBaseType>;\n          },\n          {recurseIntoArrays: true}\n        >\n  ? // if it is a PartialDeep, return a PartialDeep inferred type\n    PartialDeep<ConnectionBaseType[], {recurseIntoArrays: true}>\n  : never {\n  if (!connection) {\n    const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead.`;\n    if (__HYDROGEN_DEV__) {\n      throw new Error(noConnectionErr);\n    } else {\n      console.error(noConnectionErr + ` Returning an empty array`);\n      // @ts-expect-error We don't want to crash prod, so return an empty array\n      return [];\n    }\n  }\n\n  if ('nodes' in connection) {\n    // @ts-expect-error return type is failing\n    return connection.nodes;\n  }\n\n  if ('edges' in connection && Array.isArray(connection.edges)) {\n    // @ts-expect-error return type is failing\n    return connection.edges.map((edge) => {\n      if (!edge?.node) {\n        throw new Error(\n          'flattenConnection(): Connection edges must contain nodes'\n        );\n      }\n      return edge.node;\n    });\n  }\n\n  if (__HYDROGEN_DEV__) {\n    console.warn(\n      `flattenConnection(): The connection did not contain either \"nodes\" or \"edges.node\". Returning an empty array.`\n    );\n  }\n\n  // @ts-expect-error We don't want to crash prod, so return an empty array\n  return [];\n}\n\ntype ConnectionEdges = {\n  edges: {node: Array<unknown>};\n};\n\ntype ConnectionNodes = {\n  nodes: Array<unknown>;\n};\n"],"names":[],"mappings":"AAQO,SAAS,kBAOd,YAuBQ;AACR,MAAI,CAAC,YAAY;AACf,UAAM,kBAAkB,uEAAuE;AACzE;AACd,YAAA,IAAI,MAAM,eAAe;AAAA,IAKjC;AAAA,EACF;AAEA,MAAI,WAAW,YAAY;AAEzB,WAAO,WAAW;AAAA,EACpB;AAEA,MAAI,WAAW,cAAc,MAAM,QAAQ,WAAW,KAAK,GAAG;AAE5D,WAAO,WAAW,MAAM,IAAI,CAAC,SAAS;AAChC,UAAA,EAAC,6BAAM,OAAM;AACf,cAAM,IAAI;AAAA,UACR;AAAA,QAAA;AAAA,MAEJ;AACA,aAAO,KAAK;AAAA,IAAA,CACb;AAAA,EACH;AAEsB;AACZ,YAAA;AAAA,MACN;AAAA,IAAA;AAAA,EAEJ;AAGA,SAAO;AACT;"}

package/dist/browser-dev/image-size.mjs

@@ -15,7 +15,7 @@ function addImageSizeParametersToUrl({
   scale
 }) {
   const newUrl = new URL(src);
-  const multipliedScale = scale != null ? scale : 1;
+  const multipliedScale = scale ?? 1;
   if (width) {
     let finalWidth;
     if (typeof width === "string") {
@@ -46,27 +46,27 @@ function getShopifyImageDimensions({
   loaderOptions,
   elementProps
 }) {
-  var _a, _b, _c, _d, _e, _f;
   let aspectRatio = null;
   if ((sfapiImage == null ? void 0 : sfapiImage.width) && (sfapiImage == null ? void 0 : sfapiImage.height)) {
     aspectRatio = (sfapiImage == null ? void 0 : sfapiImage.width) / (sfapiImage == null ? void 0 : sfapiImage.height);
   }
   if ((loaderOptions == null ? void 0 : loaderOptions.width) || (loaderOptions == null ? void 0 : loaderOptions.height)) {
     return {
-      width: (_a = loaderOptions == null ? void 0 : loaderOptions.width) != null ? _a : aspectRatio && typeof loaderOptions.height === "number" ? Math.round(aspectRatio * loaderOptions.height) : null,
-      height: (_b = loaderOptions == null ? void 0 : loaderOptions.height) != null ? _b : aspectRatio && typeof loaderOptions.width === "number" ? Math.round(aspectRatio * loaderOptions.width) : null
+      width: (loaderOptions == null ? void 0 : loaderOptions.width) ?? (aspectRatio && typeof loaderOptions.height === "number" ? Math.round(aspectRatio * loaderOptions.height) : null),
+      height: (loaderOptions == null ? void 0 : loaderOptions.height) ?? (aspectRatio && typeof loaderOptions.width === "number" ? Math.round(aspectRatio * loaderOptions.width) : null)
     };
   }
   if ((elementProps == null ? void 0 : elementProps.width) || (elementProps == null ? void 0 : elementProps.height)) {
     return {
-      width: (_c = elementProps == null ? void 0 : elementProps.width) != null ? _c : aspectRatio && typeof elementProps.height === "number" ? Math.round(aspectRatio * elementProps.height) : null,
-      height: (_d = elementProps == null ? void 0 : elementProps.height) != null ? _d : aspectRatio && typeof elementProps.width === "number" ? Math.round(aspectRatio * elementProps.width) : null
+      width: (elementProps == null ? void 0 : elementProps.width) ?? (aspectRatio && typeof elementProps.height === "number" ? Math.round(aspectRatio * elementProps.height) : null),
+      height: (elementProps == null ? void 0 : elementProps.height) ?? (aspectRatio && typeof elementProps.width === "number" ? Math.round(aspectRatio * elementProps.width) : null)
     };
   }
   if ((sfapiImage == null ? void 0 : sfapiImage.width) || (sfapiImage == null ? void 0 : sfapiImage.height)) {
     return {
-      width: (_e = sfapiImage == null ? void 0 : sfapiImage.width) != null ? _e : null,
-      height: (_f = sfapiImage == null ? void 0 : sfapiImage.height) != null ? _f : null
+      // can't calculate the aspect ratio here
+      width: (sfapiImage == null ? void 0 : sfapiImage.width) ?? null,
+      height: (sfapiImage == null ? void 0 : sfapiImage.height) ?? null
     };
   }
   return { width: null, height: null };

package/dist/browser-dev/image-size.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image-size.mjs","sources":["../../src/image-size.ts"],"sourcesContent":["import type {Image as ImageType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ShopifyLoaderOptions, ShopifyLoaderParams} from './Image.js';\n\n// TODO: Are there other CDNs missing from here?\nconst PRODUCTION_CDN_HOSTNAMES = [\n  'cdn.shopify.com',\n  'cdn.shopifycdn.net',\n  'shopify-assets.shopifycdn.com',\n  'shopify-assets.shopifycdn.net',\n];\nconst LOCAL_CDN_HOSTNAMES = ['spin.dev'];\nconst ALL_CDN_HOSTNAMES = [...PRODUCTION_CDN_HOSTNAMES, ...LOCAL_CDN_HOSTNAMES];\n\n// based on the default width sizes used by the Shopify liquid HTML tag img_tag plus a 2560 width to account for 2k resolutions\n// reference: https://shopify.dev/api/liquid/filters/html-filters#image_tag\nexport const IMG_SRC_SET_SIZES = [352, 832, 1200, 1920, 2560];\n\n/**\n * Adds image size parameters to an image URL hosted by Shopify's CDN\n */\nexport function addImageSizeParametersToUrl({\n  src,\n  width,\n  height,\n  crop,\n  scale,\n}: ShopifyLoaderParams) {\n  const newUrl = new URL(src);\n\n  const multipliedScale = scale ?? 1;\n\n  if (width) {\n    let finalWidth: string;\n\n    if (typeof width === 'string') {\n      finalWidth = (IMG_SRC_SET_SIZES[0] * multipliedScale).toString();\n    } else {\n      finalWidth = (Number(width) * multipliedScale).toString();\n    }\n\n    newUrl.searchParams.append('width', finalWidth);\n  }\n\n  if (height && typeof height === 'number') {\n    newUrl.searchParams.append('height', (height * multipliedScale).toString());\n  }\n\n  crop && newUrl.searchParams.append('crop', crop);\n\n  // for now we intentionally leave off the scale param, and instead multiple width & height by scale instead\n  // scale && newUrl.searchParams.append('scale', scale.toString());\n\n  return newUrl.toString();\n}\n\nexport function shopifyImageLoader(params: ShopifyLoaderParams) {\n  const newSrc = new URL(params.src);\n  const isShopifyServedImage = ALL_CDN_HOSTNAMES.some((allowedHostname) =>\n    newSrc.hostname.endsWith(allowedHostname)\n  );\n\n  if (\n    !isShopifyServedImage ||\n    (!params.width && !params.height && !params.crop && !params.scale)\n  ) {\n    return params.src;\n  }\n\n  return addImageSizeParametersToUrl(params);\n}\n\ntype HtmlImageProps = React.ImgHTMLAttributes<HTMLImageElement>;\n\nexport type GetShopifyImageDimensionsProps = {\n  data: Pick<\n    PartialDeep<ImageType, {recurseIntoArrays: true}>,\n    'altText' | 'url' | 'id' | 'width' | 'height'\n  >;\n  loaderOptions?: ShopifyLoaderOptions;\n  elementProps?: {\n    width?: HtmlImageProps['width'];\n    height?: HtmlImageProps['height'];\n  };\n};\n\ntype GetShopifyImageDimensionsPropsReturn = {\n  width: number | string | null;\n  height: number | string | null;\n};\n\n/**\n * Width and height are determined using the followiing priority list:\n * 1. `loaderOptions`'s width/height\n * 2. `elementProps`'s width/height\n * 3. `data`'s width/height\n *\n * If only one of `width` or `height` are defined, then the other will attempt to be calculated based on the Image's aspect ratio,\n * provided that both `data.width` and `data.height` are available. If not, then the aspect ratio cannot be determined and the missing\n * value will reamin as `null`\n */\nexport function getShopifyImageDimensions({\n  data: sfapiImage,\n  loaderOptions,\n  elementProps,\n}: GetShopifyImageDimensionsProps): GetShopifyImageDimensionsPropsReturn {\n  let aspectRatio: number | null = null;\n\n  if (sfapiImage?.width && sfapiImage?.height) {\n    aspectRatio = sfapiImage?.width / sfapiImage?.height;\n  }\n\n  //  * 1. `loaderOptions`'s width/height\n  if (loaderOptions?.width || loaderOptions?.height) {\n    return {\n      width:\n        loaderOptions?.width ??\n        (aspectRatio && typeof loaderOptions.height === 'number'\n          ? Math.round(aspectRatio * loaderOptions.height)\n          : null),\n      height:\n        loaderOptions?.height ??\n        (aspectRatio && typeof loaderOptions.width === 'number'\n          ? Math.round(aspectRatio * loaderOptions.width)\n          : null),\n    };\n  }\n\n  //  * 2. `elementProps`'s width/height\n  if (elementProps?.width || elementProps?.height) {\n    return {\n      width:\n        elementProps?.width ??\n        (aspectRatio && typeof elementProps.height === 'number'\n          ? Math.round(aspectRatio * elementProps.height)\n          : null),\n      height:\n        elementProps?.height ??\n        (aspectRatio && typeof elementProps.width === 'number'\n          ? Math.round(aspectRatio * elementProps.width)\n          : null),\n    };\n  }\n\n  //  * 3. `data`'s width/height\n  if (sfapiImage?.width || sfapiImage?.height) {\n    return {\n      // can't calculate the aspect ratio here\n      width: sfapiImage?.width ?? null,\n      height: sfapiImage?.height ?? null,\n    };\n  }\n\n  return {width: null, height: null};\n}\n"],"names":[],"mappings":"AAKA,MAAM,2BAA2B;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACA,MAAM,sBAAsB,CAAC,UAAU;AACvC,MAAM,oBAAoB,CAAC,GAAG,0BAA0B,GAAG,mBAAmB;AAIvE,MAAM,oBAAoB,CAAC,KAAK,KAAK,MAAM,MAAM,IAAI;AAKrD,SAAS,4BAA4B;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAwB;AAChB,QAAA,SAAS,IAAI,IAAI,GAAG;AAE1B,QAAM,kBAAkB,wBAAS;AAEjC,MAAI,OAAO;AACL,QAAA;AAEA,QAAA,OAAO,UAAU,UAAU;AACf,oBAAA,kBAAkB,KAAK,iBAAiB,SAAS;AAAA,IAAA,OAC1D;AACL,oBAAc,OAAO,KAAK,IAAI,iBAAiB,SAAS;AAAA,IAC1D;AAEO,WAAA,aAAa,OAAO,SAAS,UAAU;AAAA,EAChD;AAEI,MAAA,UAAU,OAAO,WAAW,UAAU;AACxC,WAAO,aAAa,OAAO,WAAW,SAAS,iBAAiB,UAAU;AAAA,EAC5E;AAEA,UAAQ,OAAO,aAAa,OAAO,QAAQ,IAAI;AAK/C,SAAO,OAAO;AAChB;AAEO,SAAS,mBAAmB,QAA6B;AAC9D,QAAM,SAAS,IAAI,IAAI,OAAO,GAAG;AACjC,QAAM,uBAAuB,kBAAkB;AAAA,IAAK,CAAC,oBACnD,OAAO,SAAS,SAAS,eAAe;AAAA,EAAA;AAG1C,MACE,CAAC,wBACA,CAAC,OAAO,SAAS,CAAC,OAAO,UAAU,CAAC,OAAO,QAAQ,CAAC,OAAO,OAC5D;AACA,WAAO,OAAO;AAAA,EAChB;AAEA,SAAO,4BAA4B,MAAM;AAC3C;AA+BO,SAAS,0BAA0B;AAAA,EACxC,MAAM;AAAA,EACN;AAAA,EACA;AACF,GAAyE;AApGzE;AAqGE,MAAI,cAA6B;AAE7B,OAAA,yCAAY,WAAS,yCAAY,SAAQ;AAC7B,mBAAA,yCAAY,UAAQ,yCAAY;AAAA,EAChD;AAGI,OAAA,+CAAe,WAAS,+CAAe,SAAQ;AAC1C,WAAA;AAAA,MACL,QACE,oDAAe,UAAf,YACC,eAAe,OAAO,cAAc,WAAW,WAC5C,KAAK,MAAM,cAAc,cAAc,MAAM,IAC7C;AAAA,MACN,SACE,oDAAe,WAAf,YACC,eAAe,OAAO,cAAc,UAAU,WAC3C,KAAK,MAAM,cAAc,cAAc,KAAK,IAC5C;AAAA,IAAA;AAAA,EAEV;AAGI,OAAA,6CAAc,WAAS,6CAAc,SAAQ;AACxC,WAAA;AAAA,MACL,QACE,kDAAc,UAAd,YACC,eAAe,OAAO,aAAa,WAAW,WAC3C,KAAK,MAAM,cAAc,aAAa,MAAM,IAC5C;AAAA,MACN,SACE,kDAAc,WAAd,YACC,eAAe,OAAO,aAAa,UAAU,WAC1C,KAAK,MAAM,cAAc,aAAa,KAAK,IAC3C;AAAA,IAAA;AAAA,EAEV;AAGI,OAAA,yCAAY,WAAS,yCAAY,SAAQ;AACpC,WAAA;AAAA,MAEL,QAAO,8CAAY,UAAZ,YAAqB;AAAA,MAC5B,SAAQ,8CAAY,WAAZ,YAAsB;AAAA,IAAA;AAAA,EAElC;AAEA,SAAO,EAAC,OAAO,MAAM,QAAQ,KAAI;AACnC;"}
+{"version":3,"file":"image-size.mjs","sources":["../../src/image-size.ts"],"sourcesContent":["import type {Image as ImageType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ShopifyLoaderOptions, ShopifyLoaderParams} from './Image.js';\n\n// TODO: Are there other CDNs missing from here?\nconst PRODUCTION_CDN_HOSTNAMES = [\n  'cdn.shopify.com',\n  'cdn.shopifycdn.net',\n  'shopify-assets.shopifycdn.com',\n  'shopify-assets.shopifycdn.net',\n];\nconst LOCAL_CDN_HOSTNAMES = ['spin.dev'];\nconst ALL_CDN_HOSTNAMES = [...PRODUCTION_CDN_HOSTNAMES, ...LOCAL_CDN_HOSTNAMES];\n\n// based on the default width sizes used by the Shopify liquid HTML tag img_tag plus a 2560 width to account for 2k resolutions\n// reference: https://shopify.dev/api/liquid/filters/html-filters#image_tag\nexport const IMG_SRC_SET_SIZES = [352, 832, 1200, 1920, 2560];\n\n/**\n * Adds image size parameters to an image URL hosted by Shopify's CDN\n */\nexport function addImageSizeParametersToUrl({\n  src,\n  width,\n  height,\n  crop,\n  scale,\n}: ShopifyLoaderParams) {\n  const newUrl = new URL(src);\n\n  const multipliedScale = scale ?? 1;\n\n  if (width) {\n    let finalWidth: string;\n\n    if (typeof width === 'string') {\n      finalWidth = (IMG_SRC_SET_SIZES[0] * multipliedScale).toString();\n    } else {\n      finalWidth = (Number(width) * multipliedScale).toString();\n    }\n\n    newUrl.searchParams.append('width', finalWidth);\n  }\n\n  if (height && typeof height === 'number') {\n    newUrl.searchParams.append('height', (height * multipliedScale).toString());\n  }\n\n  crop && newUrl.searchParams.append('crop', crop);\n\n  // for now we intentionally leave off the scale param, and instead multiple width & height by scale instead\n  // scale && newUrl.searchParams.append('scale', scale.toString());\n\n  return newUrl.toString();\n}\n\nexport function shopifyImageLoader(params: ShopifyLoaderParams) {\n  const newSrc = new URL(params.src);\n  const isShopifyServedImage = ALL_CDN_HOSTNAMES.some((allowedHostname) =>\n    newSrc.hostname.endsWith(allowedHostname)\n  );\n\n  if (\n    !isShopifyServedImage ||\n    (!params.width && !params.height && !params.crop && !params.scale)\n  ) {\n    return params.src;\n  }\n\n  return addImageSizeParametersToUrl(params);\n}\n\ntype HtmlImageProps = React.ImgHTMLAttributes<HTMLImageElement>;\n\nexport type GetShopifyImageDimensionsProps = {\n  data: Pick<\n    PartialDeep<ImageType, {recurseIntoArrays: true}>,\n    'altText' | 'url' | 'id' | 'width' | 'height'\n  >;\n  loaderOptions?: ShopifyLoaderOptions;\n  elementProps?: {\n    width?: HtmlImageProps['width'];\n    height?: HtmlImageProps['height'];\n  };\n};\n\ntype GetShopifyImageDimensionsPropsReturn = {\n  width: number | string | null;\n  height: number | string | null;\n};\n\n/**\n * Width and height are determined using the followiing priority list:\n * 1. `loaderOptions`'s width/height\n * 2. `elementProps`'s width/height\n * 3. `data`'s width/height\n *\n * If only one of `width` or `height` are defined, then the other will attempt to be calculated based on the Image's aspect ratio,\n * provided that both `data.width` and `data.height` are available. If not, then the aspect ratio cannot be determined and the missing\n * value will reamin as `null`\n */\nexport function getShopifyImageDimensions({\n  data: sfapiImage,\n  loaderOptions,\n  elementProps,\n}: GetShopifyImageDimensionsProps): GetShopifyImageDimensionsPropsReturn {\n  let aspectRatio: number | null = null;\n\n  if (sfapiImage?.width && sfapiImage?.height) {\n    aspectRatio = sfapiImage?.width / sfapiImage?.height;\n  }\n\n  //  * 1. `loaderOptions`'s width/height\n  if (loaderOptions?.width || loaderOptions?.height) {\n    return {\n      width:\n        loaderOptions?.width ??\n        (aspectRatio && typeof loaderOptions.height === 'number'\n          ? Math.round(aspectRatio * loaderOptions.height)\n          : null),\n      height:\n        loaderOptions?.height ??\n        (aspectRatio && typeof loaderOptions.width === 'number'\n          ? Math.round(aspectRatio * loaderOptions.width)\n          : null),\n    };\n  }\n\n  //  * 2. `elementProps`'s width/height\n  if (elementProps?.width || elementProps?.height) {\n    return {\n      width:\n        elementProps?.width ??\n        (aspectRatio && typeof elementProps.height === 'number'\n          ? Math.round(aspectRatio * elementProps.height)\n          : null),\n      height:\n        elementProps?.height ??\n        (aspectRatio && typeof elementProps.width === 'number'\n          ? Math.round(aspectRatio * elementProps.width)\n          : null),\n    };\n  }\n\n  //  * 3. `data`'s width/height\n  if (sfapiImage?.width || sfapiImage?.height) {\n    return {\n      // can't calculate the aspect ratio here\n      width: sfapiImage?.width ?? null,\n      height: sfapiImage?.height ?? null,\n    };\n  }\n\n  return {width: null, height: null};\n}\n"],"names":[],"mappings":"AAKA,MAAM,2BAA2B;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACA,MAAM,sBAAsB,CAAC,UAAU;AACvC,MAAM,oBAAoB,CAAC,GAAG,0BAA0B,GAAG,mBAAmB;AAIvE,MAAM,oBAAoB,CAAC,KAAK,KAAK,MAAM,MAAM,IAAI;AAKrD,SAAS,4BAA4B;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAwB;AAChB,QAAA,SAAS,IAAI,IAAI,GAAG;AAE1B,QAAM,kBAAkB,SAAS;AAEjC,MAAI,OAAO;AACL,QAAA;AAEA,QAAA,OAAO,UAAU,UAAU;AAC7B,oBAAc,kBAAkB,CAAC,IAAI,iBAAiB,SAAS;AAAA,IAAA,OAC1D;AACL,oBAAc,OAAO,KAAK,IAAI,iBAAiB,SAAS;AAAA,IAC1D;AAEO,WAAA,aAAa,OAAO,SAAS,UAAU;AAAA,EAChD;AAEI,MAAA,UAAU,OAAO,WAAW,UAAU;AACxC,WAAO,aAAa,OAAO,WAAW,SAAS,iBAAiB,UAAU;AAAA,EAC5E;AAEA,UAAQ,OAAO,aAAa,OAAO,QAAQ,IAAI;AAK/C,SAAO,OAAO;AAChB;AAEO,SAAS,mBAAmB,QAA6B;AAC9D,QAAM,SAAS,IAAI,IAAI,OAAO,GAAG;AACjC,QAAM,uBAAuB,kBAAkB;AAAA,IAAK,CAAC,oBACnD,OAAO,SAAS,SAAS,eAAe;AAAA,EAAA;AAG1C,MACE,CAAC,wBACA,CAAC,OAAO,SAAS,CAAC,OAAO,UAAU,CAAC,OAAO,QAAQ,CAAC,OAAO,OAC5D;AACA,WAAO,OAAO;AAAA,EAChB;AAEA,SAAO,4BAA4B,MAAM;AAC3C;AA+BO,SAAS,0BAA0B;AAAA,EACxC,MAAM;AAAA,EACN;AAAA,EACA;AACF,GAAyE;AACvE,MAAI,cAA6B;AAE7B,OAAA,yCAAY,WAAS,yCAAY,SAAQ;AAC7B,mBAAA,yCAAY,UAAQ,yCAAY;AAAA,EAChD;AAGI,OAAA,+CAAe,WAAS,+CAAe,SAAQ;AAC1C,WAAA;AAAA,MACL,QACE,+CAAe,WACd,eAAe,OAAO,cAAc,WAAW,WAC5C,KAAK,MAAM,cAAc,cAAc,MAAM,IAC7C;AAAA,MACN,SACE,+CAAe,YACd,eAAe,OAAO,cAAc,UAAU,WAC3C,KAAK,MAAM,cAAc,cAAc,KAAK,IAC5C;AAAA,IAAA;AAAA,EAEV;AAGI,OAAA,6CAAc,WAAS,6CAAc,SAAQ;AACxC,WAAA;AAAA,MACL,QACE,6CAAc,WACb,eAAe,OAAO,aAAa,WAAW,WAC3C,KAAK,MAAM,cAAc,aAAa,MAAM,IAC5C;AAAA,MACN,SACE,6CAAc,YACb,eAAe,OAAO,aAAa,UAAU,WAC1C,KAAK,MAAM,cAAc,aAAa,KAAK,IAC3C;AAAA,IAAA;AAAA,EAEV;AAGI,OAAA,yCAAY,WAAS,yCAAY,SAAQ;AACpC,WAAA;AAAA;AAAA,MAEL,QAAO,yCAAY,UAAS;AAAA,MAC5B,SAAQ,yCAAY,WAAU;AAAA,IAAA;AAAA,EAElC;AAEA,SAAO,EAAC,OAAO,MAAM,QAAQ,KAAI;AACnC;"}

package/dist/browser-dev/index.mjs

@@ -1,48 +1,62 @@
 import { AddToCartButton } from "./AddToCartButton.mjs";
+import { getClientBrowserParameters, sendShopifyAnalytics } from "./analytics.mjs";
+import { AnalyticsEventName, AnalyticsPageType, ShopifySalesChannel } from "./analytics-constants.mjs";
 import { BuyNowButton } from "./BuyNowButton.mjs";
 import { CartCheckoutButton } from "./CartCheckoutButton.mjs";
+import { CartCost } from "./CartCost.mjs";
+import { CartLinePrice } from "./CartLinePrice.mjs";
+import { CartLineProvider, useCartLine } from "./CartLineProvider.mjs";
 import { CartProvider, useCart } from "./CartProvider.mjs";
 import { storefrontApiCustomScalars } from "./codegen.helpers.mjs";
+import { getShopifyCookies } from "./cookies-utils.mjs";
 import { ExternalVideo } from "./ExternalVideo.mjs";
 import { flattenConnection } from "./flatten-connection.mjs";
 import { Image } from "./Image.mjs";
 import { MediaFile } from "./MediaFile.mjs";
-import { metafieldParser } from "./metafield-parser.mjs";
-import { Metafield, parseMetafield, parseMetafieldValue } from "./Metafield.mjs";
 import { ModelViewer } from "./ModelViewer.mjs";
 import { Money } from "./Money.mjs";
+import { parseMetafield } from "./parse-metafield.mjs";
 import { ProductPrice } from "./ProductPrice.mjs";
 import { ProductProvider, useProduct } from "./ProductProvider.mjs";
 import { ShopifyProvider, useShop } from "./ShopifyProvider.mjs";
 import { ShopPayButton } from "./ShopPayButton.mjs";
 import { createStorefrontClient } from "./storefront-client.mjs";
 import { useMoney } from "./useMoney.mjs";
+import { useShopifyCookies } from "./useShopifyCookies.mjs";
 import { Video } from "./Video.mjs";
 export {
   AddToCartButton,
+  AnalyticsEventName,
+  AnalyticsPageType,
   BuyNowButton,
   CartCheckoutButton,
+  CartCost,
+  CartLinePrice,
+  CartLineProvider,
   CartProvider,
   ExternalVideo,
   Image,
   MediaFile,
-  Metafield,
   ModelViewer,
   Money,
   ProductPrice,
   ProductProvider,
   ShopPayButton,
   ShopifyProvider,
+  ShopifySalesChannel,
   Video,
   createStorefrontClient,
   flattenConnection,
-  metafieldParser,
+  getClientBrowserParameters,
+  getShopifyCookies,
   parseMetafield,
-  parseMetafieldValue,
+  sendShopifyAnalytics,
   storefrontApiCustomScalars,
   useCart,
+  useCartLine,
   useMoney,
   useProduct,
-  useShop
+  useShop,
+  useShopifyCookies
 };
 //# sourceMappingURL=index.mjs.map

package/dist/browser-dev/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/browser-dev/load-script.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"load-script.mjs","sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\nexport function loadScript(\n  src: string,\n  options?: {module?: boolean; in?: 'head' | 'body'}\n): Promise<boolean> {\n  const isScriptLoaded: Promise<boolean> = SCRIPTS_LOADED[src];\n\n  if (isScriptLoaded) {\n    return isScriptLoaded;\n  }\n\n  const promise = new Promise<boolean>((resolve, reject) => {\n    const script = document.createElement('script');\n    if (options?.module) {\n      script.type = 'module';\n    } else {\n      script.type = 'text/javascript';\n    }\n    script.src = src;\n    script.onload = () => {\n      resolve(true);\n    };\n    script.onerror = () => {\n      reject(false);\n    };\n    if (options?.in === 'head') {\n      document.head.appendChild(script);\n    } else {\n      document.body.appendChild(script);\n    }\n  });\n\n  SCRIPTS_LOADED[src] = promise;\n\n  return promise;\n}\n\ntype LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n */\nexport function useLoadScript(\n  url: LoadScriptParams[0],\n  options?: LoadScriptParams[1]\n): ScriptState {\n  const [status, setStatus] = useState<ScriptState>('loading');\n  const stringifiedOptions = JSON.stringify(options);\n\n  useEffect(() => {\n    async function loadScriptWrapper() {\n      try {\n        setStatus('loading');\n        await loadScript(url, options);\n        setStatus('done');\n      } catch (error) {\n        setStatus('error');\n      }\n    }\n\n    loadScriptWrapper();\n  }, [url, stringifiedOptions, options]);\n\n  return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"names":["SCRIPTS_LOADED","loadScript","src","options","isScriptLoaded","promise","Promise","resolve","reject","script","document","createElement","module","type","onload","onerror","in","head","appendChild","body","useLoadScript","url","status","setStatus","useState","stringifiedOptions","JSON","stringify","useEffect","loadScriptWrapper","error"],"mappings":";AAEA,MAAMA,iBAAmD,CAAA;AAEzCC,SAAAA,WACdC,KACAC,SACkB;AAClB,QAAMC,iBAAmCJ,eAAeE;AAExD,MAAIE,gBAAgB;AACXA,WAAAA;AAAAA,EACT;AAEA,QAAMC,UAAU,IAAIC,QAAiB,CAACC,SAASC,WAAW;AAClDC,UAAAA,SAASC,SAASC,cAAc,QAAQ;AAC9C,QAAIR,mCAASS,QAAQ;AACnBH,aAAOI,OAAO;AAAA,IAAA,OACT;AACLJ,aAAOI,OAAO;AAAA,IAChB;AACAJ,WAAOP,MAAMA;AACbO,WAAOK,SAAS,MAAM;AACpBP,cAAQ,IAAI;AAAA,IAAA;AAEdE,WAAOM,UAAU,MAAM;AACrBP,aAAO,KAAK;AAAA,IAAA;AAEVL,SAAAA,mCAASa,QAAO,QAAQ;AACjBC,eAAAA,KAAKC,YAAYT,MAAM;AAAA,IAAA,OAC3B;AACIU,eAAAA,KAAKD,YAAYT,MAAM;AAAA,IAClC;AAAA,EAAA,CACD;AAEDT,iBAAeE,OAAOG;AAEfA,SAAAA;AACT;AAOgBe,SAAAA,cACdC,KACAlB,SACa;AACb,QAAM,CAACmB,QAAQC,SAAS,IAAIC,SAAsB,SAAS;AACrDC,QAAAA,qBAAqBC,KAAKC,UAAUxB,OAAO;AAEjDyB,YAAU,MAAM;AACd,mBAAeC,oBAAoB;AAC7B,UAAA;AACFN,kBAAU,SAAS;AACbtB,cAAAA,WAAWoB,KAAKlB,OAAO;AAC7BoB,kBAAU,MAAM;AAAA,eACTO;AACPP,kBAAU,OAAO;AAAA,MACnB;AAAA,IACF;AAEmB;EAClB,GAAA,CAACF,KAAKI,oBAAoBtB,OAAO,CAAC;AAE9BmB,SAAAA;AACT;"}
+{"version":3,"file":"load-script.mjs","sources":["../../src/load-script.tsx"],"sourcesContent":["import {useState, useEffect} from 'react';\n\nconst SCRIPTS_LOADED: Record<string, Promise<boolean>> = {};\n\nexport function loadScript(\n  src: string,\n  options?: {module?: boolean; in?: 'head' | 'body'}\n): Promise<boolean> {\n  const isScriptLoaded: Promise<boolean> = SCRIPTS_LOADED[src];\n\n  if (isScriptLoaded) {\n    return isScriptLoaded;\n  }\n\n  const promise = new Promise<boolean>((resolve, reject) => {\n    const script = document.createElement('script');\n    if (options?.module) {\n      script.type = 'module';\n    } else {\n      script.type = 'text/javascript';\n    }\n    script.src = src;\n    script.onload = () => {\n      resolve(true);\n    };\n    script.onerror = () => {\n      reject(false);\n    };\n    if (options?.in === 'head') {\n      document.head.appendChild(script);\n    } else {\n      document.body.appendChild(script);\n    }\n  });\n\n  SCRIPTS_LOADED[src] = promise;\n\n  return promise;\n}\n\ntype LoadScriptParams = Parameters<typeof loadScript>;\n\n/**\n * The `useLoadScript` hook loads an external script tag in the browser. It allows React components to lazy-load large third-party dependencies.\n */\nexport function useLoadScript(\n  url: LoadScriptParams[0],\n  options?: LoadScriptParams[1]\n): ScriptState {\n  const [status, setStatus] = useState<ScriptState>('loading');\n  const stringifiedOptions = JSON.stringify(options);\n\n  useEffect(() => {\n    async function loadScriptWrapper() {\n      try {\n        setStatus('loading');\n        await loadScript(url, options);\n        setStatus('done');\n      } catch (error) {\n        setStatus('error');\n      }\n    }\n\n    loadScriptWrapper();\n  }, [url, stringifiedOptions, options]);\n\n  return status;\n}\n\ntype ScriptState = 'loading' | 'done' | 'error';\n"],"names":[],"mappings":";AAEA,MAAM,iBAAmD,CAAA;AAEzC,SAAA,WACd,KACA,SACkB;AACZ,QAAA,iBAAmC,eAAe,GAAG;AAE3D,MAAI,gBAAgB;AACX,WAAA;AAAA,EACT;AAEA,QAAM,UAAU,IAAI,QAAiB,CAAC,SAAS,WAAW;AAClD,UAAA,SAAS,SAAS,cAAc,QAAQ;AAC9C,QAAI,mCAAS,QAAQ;AACnB,aAAO,OAAO;AAAA,IAAA,OACT;AACL,aAAO,OAAO;AAAA,IAChB;AACA,WAAO,MAAM;AACb,WAAO,SAAS,MAAM;AACpB,cAAQ,IAAI;AAAA,IAAA;AAEd,WAAO,UAAU,MAAM;AACrB,aAAO,KAAK;AAAA,IAAA;AAEV,SAAA,mCAAS,QAAO,QAAQ;AACjB,eAAA,KAAK,YAAY,MAAM;AAAA,IAAA,OAC3B;AACI,eAAA,KAAK,YAAY,MAAM;AAAA,IAClC;AAAA,EAAA,CACD;AAED,iBAAe,GAAG,IAAI;AAEf,SAAA;AACT;AAOgB,SAAA,cACd,KACA,SACa;AACb,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAsB,SAAS;AACrD,QAAA,qBAAqB,KAAK,UAAU,OAAO;AAEjD,YAAU,MAAM;AACd,mBAAe,oBAAoB;AAC7B,UAAA;AACF,kBAAU,SAAS;AACb,cAAA,WAAW,KAAK,OAAO;AAC7B,kBAAU,MAAM;AAAA,eACT;AACP,kBAAU,OAAO;AAAA,MACnB;AAAA,IACF;AAEkB;EACjB,GAAA,CAAC,KAAK,oBAAoB,OAAO,CAAC;AAE9B,SAAA;AACT;"}