@shopify/hydrogen-react 0.0.0-next-96e1bb8 → 0.0.0-next-182fb2f

package/dist/dev/AddToCartButton.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const react = require("react");
+const CartProvider = require("./CartProvider.js");
+const ProductProvider = require("./ProductProvider.js");
+const jsxRuntime = require("react/jsx-runtime");
+function AddToCartButton(props) {
+  var _a;
+  const [addingItem, setAddingItem] = react.useState(false);
+  const {
+    variantId: explicitVariantId,
+    quantity = 1,
+    attributes,
+    sellingPlanId,
+    onClick,
+    children,
+    accessibleAddingToCartLabel,
+    ...passthroughProps
+  } = props;
+  const {
+    status,
+    linesAdd
+  } = CartProvider.useCart();
+  const {
+    selectedVariant
+  } = ProductProvider.useProduct();
+  const variantId = (_a = explicitVariantId != null ? explicitVariantId : selectedVariant == null ? void 0 : selectedVariant.id) != null ? _a : "";
+  const disabled = explicitVariantId === null || variantId === "" || selectedVariant === null || addingItem || passthroughProps.disabled;
+  react.useEffect(() => {
+    if (addingItem && status === "idle") {
+      setAddingItem(false);
+    }
+  }, [status, addingItem]);
+  const handleAddItem = react.useCallback(() => {
+    setAddingItem(true);
+    linesAdd([{
+      quantity,
+      merchandiseId: variantId || "",
+      attributes,
+      sellingPlanId
+    }]);
+  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(BaseButton, {
+      ...passthroughProps,
+      disabled,
+      onClick,
+      defaultOnClick: handleAddItem,
+      children
+    }), accessibleAddingToCartLabel ? /* @__PURE__ */ jsxRuntime.jsx("p", {
+      style: {
+        position: "absolute",
+        width: "1px",
+        height: "1px",
+        padding: "0",
+        margin: "-1px",
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        borderWidth: "0"
+      },
+      role: "alert",
+      "aria-live": "assertive",
+      children: addingItem ? accessibleAddingToCartLabel : null
+    }) : null]
+  });
+}
+function BaseButton(props) {
+  const {
+    as,
+    onClick,
+    defaultOnClick,
+    children,
+    buttonRef,
+    ...passthroughProps
+  } = props;
+  const handleOnClick = react.useCallback((event) => {
+    if (onClick) {
+      const clickShouldContinue = onClick(event);
+      if (typeof clickShouldContinue === "boolean" && clickShouldContinue === false || (event == null ? void 0 : event.defaultPrevented))
+        return;
+    }
+    defaultOnClick == null ? void 0 : defaultOnClick(event);
+  }, [defaultOnClick, onClick]);
+  const Component = as || "button";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, {
+    ref: buttonRef,
+    onClick: handleOnClick,
+    ...passthroughProps,
+    children
+  });
+}
+exports.AddToCartButton = AddToCartButton;
+exports.BaseButton = BaseButton;
+//# sourceMappingURL=AddToCartButton.js.map

package/dist/dev/AddToCartButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddToCartButton.js","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, Ref, ReactNode, useState} from 'react';\n\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\n\ninterface AddToCartButtonProps {\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\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 & BaseButtonProps<AsType>\n) {\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    passthroughProps.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\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    Omit<\n      React.ComponentPropsWithoutRef<AsType>,\n      keyof CustomBaseButtonProps<AsType>\n    >;\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>\n) {\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":["AddToCartButton","props","addingItem","setAddingItem","useState","variantId","explicitVariantId","quantity","attributes","sellingPlanId","onClick","children","accessibleAddingToCartLabel","passthroughProps","status","linesAdd","useCart","selectedVariant","useProduct","id","disabled","useEffect","handleAddItem","useCallback","merchandiseId","_Fragment","_jsx","position","width","height","padding","margin","overflow","clip","whiteSpace","borderWidth","BaseButton","as","defaultOnClick","buttonRef","handleOnClick","event","clickShouldContinue","defaultPrevented","Component"],"mappings":";;;;;;AAyBO,SAASA,gBACdC,OACA;;AACA,QAAM,CAACC,YAAYC,aAAb,IAA8BC,eAAkB,KAAV;AACtC,QAAA;AAAA,IACJC,WAAWC;AAAAA,IACXC,WAAW;AAAA,IACXC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AACE,QAAA;AAAA,IAACa;AAAAA,IAAQC;AAAAA,MAAYC,aAA3B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,MAAmBC,gBAA1B,WAAA;AACMb,QAAAA,aAAYC,qDAAqBW,mDAAiBE,OAAtCb,YAA4C;AACxDc,QAAAA,WACJd,sBAAsB,QACtBD,cAAc,MACdY,oBAAoB,QACpBf,cACAW,iBAAiBO;AAEnBC,QAAAA,UAAU,MAAM;AACVnB,QAAAA,cAAcY,WAAW,QAAQ;AACnCX,oBAAc,KAAD;AAAA,IACd;AAAA,EAAA,GACA,CAACW,QAAQZ,UAAT,CAJM;AAMHoB,QAAAA,gBAAgBC,MAAAA,YAAY,MAAM;AACtCpB,kBAAc,IAAD;AACbY,aAAS,CACP;AAAA,MACER;AAAAA,MACAiB,eAAenB,aAAa;AAAA,MAC5BG;AAAAA,MACAC;AAAAA,IALK,CAAA,CAAD;AAAA,EAAA,GAQP,CAACM,UAAUR,UAAUF,WAAWG,YAAYC,aAA5C,CAV8B;AAYjC,yCACEgB,WAAAA,UAAA;AAAA,IAAA,UACE,CAAAC,2BAAA,IAAC,YAAD;AAAA,MAAA,GACMb;AAAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgBS;AAAAA,MAJlB;AAAA,IAAA,CADF,GASGV,8BACCc,2BAAA,IAAA,KAAA;AAAA,MACE,OAAO;AAAA,QACLC,UAAU;AAAA,QACVC,OAAO;AAAA,QACPC,QAAQ;AAAA,QACRC,SAAS;AAAA,QACTC,QAAQ;AAAA,QACRC,UAAU;AAAA,QACVC,MAAM;AAAA,QACNC,YAAY;AAAA,QACZC,aAAa;AAAA,MATR;AAAA,MAWP,MAAK;AAAA,MACL,aAAU;AAAA,MAbZ,UAeGjC,aAAaU,8BAA8B;AAAA,IAf9C,CAAA,IAiBE,IA3BN;AAAA,EAAA,CADF;AA+BD;AA0BM,SAASwB,WACdnC,OACA;AACM,QAAA;AAAA,IACJoC;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,OACG1B;AAAAA,EACDZ,IAAAA;AAEEuC,QAAAA,gBAAgBjB,kBACpB,CAACkB,UAA4D;AAC3D,QAAI/B,SAAS;AACLgC,YAAAA,sBAAsBhC,QAAQ+B,KAAD;AACnC,UACG,OAAOC,wBAAwB,aAC9BA,wBAAwB,UAC1BD,+BAAOE;AAEP;AAAA,IACH;AAEDL,qDAAiBG;AAAAA,EAAH,GAEhB,CAACH,gBAAgB5B,OAAjB,CAd+B;AAiBjC,QAAMkC,YAAYP,MAAM;AAExB,wCACG,WAAD;AAAA,IAAW,KAAKE;AAAAA,IAAW,SAASC;AAAAA,IAApC,GAAuD3B;AAAAA,IAAvD;AAAA,EAAA,CADF;AAKD;;;"}

package/dist/dev/AddToCartButton.mjs

@@ -0,0 +1,95 @@
+import { useState, useEffect, useCallback } from "react";
+import { useCart } from "./CartProvider.mjs";
+import { useProduct } from "./ProductProvider.mjs";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+function AddToCartButton(props) {
+  var _a;
+  const [addingItem, setAddingItem] = useState(false);
+  const {
+    variantId: explicitVariantId,
+    quantity = 1,
+    attributes,
+    sellingPlanId,
+    onClick,
+    children,
+    accessibleAddingToCartLabel,
+    ...passthroughProps
+  } = props;
+  const {
+    status,
+    linesAdd
+  } = useCart();
+  const {
+    selectedVariant
+  } = useProduct();
+  const variantId = (_a = explicitVariantId != null ? explicitVariantId : selectedVariant == null ? void 0 : selectedVariant.id) != null ? _a : "";
+  const disabled = explicitVariantId === null || variantId === "" || selectedVariant === null || addingItem || passthroughProps.disabled;
+  useEffect(() => {
+    if (addingItem && status === "idle") {
+      setAddingItem(false);
+    }
+  }, [status, addingItem]);
+  const handleAddItem = useCallback(() => {
+    setAddingItem(true);
+    linesAdd([{
+      quantity,
+      merchandiseId: variantId || "",
+      attributes,
+      sellingPlanId
+    }]);
+  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [/* @__PURE__ */ jsx(BaseButton, {
+      ...passthroughProps,
+      disabled,
+      onClick,
+      defaultOnClick: handleAddItem,
+      children
+    }), accessibleAddingToCartLabel ? /* @__PURE__ */ jsx("p", {
+      style: {
+        position: "absolute",
+        width: "1px",
+        height: "1px",
+        padding: "0",
+        margin: "-1px",
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        borderWidth: "0"
+      },
+      role: "alert",
+      "aria-live": "assertive",
+      children: addingItem ? accessibleAddingToCartLabel : null
+    }) : null]
+  });
+}
+function BaseButton(props) {
+  const {
+    as,
+    onClick,
+    defaultOnClick,
+    children,
+    buttonRef,
+    ...passthroughProps
+  } = props;
+  const handleOnClick = useCallback((event) => {
+    if (onClick) {
+      const clickShouldContinue = onClick(event);
+      if (typeof clickShouldContinue === "boolean" && clickShouldContinue === false || (event == null ? void 0 : event.defaultPrevented))
+        return;
+    }
+    defaultOnClick == null ? void 0 : defaultOnClick(event);
+  }, [defaultOnClick, onClick]);
+  const Component = as || "button";
+  return /* @__PURE__ */ jsx(Component, {
+    ref: buttonRef,
+    onClick: handleOnClick,
+    ...passthroughProps,
+    children
+  });
+}
+export {
+  AddToCartButton,
+  BaseButton
+};
+//# sourceMappingURL=AddToCartButton.mjs.map

package/dist/dev/AddToCartButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddToCartButton.mjs","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, Ref, ReactNode, useState} from 'react';\n\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\n\ninterface AddToCartButtonProps {\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\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 & BaseButtonProps<AsType>\n) {\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    passthroughProps.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\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    Omit<\n      React.ComponentPropsWithoutRef<AsType>,\n      keyof CustomBaseButtonProps<AsType>\n    >;\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>\n) {\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":["AddToCartButton","props","addingItem","setAddingItem","useState","variantId","explicitVariantId","quantity","attributes","sellingPlanId","onClick","children","accessibleAddingToCartLabel","passthroughProps","status","linesAdd","useCart","selectedVariant","useProduct","id","disabled","useEffect","handleAddItem","useCallback","merchandiseId","_Fragment","_jsx","position","width","height","padding","margin","overflow","clip","whiteSpace","borderWidth","BaseButton","as","defaultOnClick","buttonRef","handleOnClick","event","clickShouldContinue","defaultPrevented","Component"],"mappings":";;;;AAyBO,SAASA,gBACdC,OACA;;AACA,QAAM,CAACC,YAAYC,aAAb,IAA8BC,SAAkB,KAAV;AACtC,QAAA;AAAA,IACJC,WAAWC;AAAAA,IACXC,WAAW;AAAA,IACXC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AACE,QAAA;AAAA,IAACa;AAAAA,IAAQC;AAAAA,MAAYC,QAA3B;AACM,QAAA;AAAA,IAACC;AAAAA,MAAmBC,WAA1B;AACMb,QAAAA,aAAYC,qDAAqBW,mDAAiBE,OAAtCb,YAA4C;AACxDc,QAAAA,WACJd,sBAAsB,QACtBD,cAAc,MACdY,oBAAoB,QACpBf,cACAW,iBAAiBO;AAEnBC,YAAU,MAAM;AACVnB,QAAAA,cAAcY,WAAW,QAAQ;AACnCX,oBAAc,KAAD;AAAA,IACd;AAAA,EAAA,GACA,CAACW,QAAQZ,UAAT,CAJM;AAMHoB,QAAAA,gBAAgBC,YAAY,MAAM;AACtCpB,kBAAc,IAAD;AACbY,aAAS,CACP;AAAA,MACER;AAAAA,MACAiB,eAAenB,aAAa;AAAA,MAC5BG;AAAAA,MACAC;AAAAA,IALK,CAAA,CAAD;AAAA,EAAA,GAQP,CAACM,UAAUR,UAAUF,WAAWG,YAAYC,aAA5C,CAV8B;AAYjC,8BACEgB,UAAA;AAAA,IAAA,UACE,CAAAC,oBAAC,YAAD;AAAA,MAAA,GACMb;AAAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgBS;AAAAA,MAJlB;AAAA,IAAA,CADF,GASGV,8BACCc,oBAAA,KAAA;AAAA,MACE,OAAO;AAAA,QACLC,UAAU;AAAA,QACVC,OAAO;AAAA,QACPC,QAAQ;AAAA,QACRC,SAAS;AAAA,QACTC,QAAQ;AAAA,QACRC,UAAU;AAAA,QACVC,MAAM;AAAA,QACNC,YAAY;AAAA,QACZC,aAAa;AAAA,MATR;AAAA,MAWP,MAAK;AAAA,MACL,aAAU;AAAA,MAbZ,UAeGjC,aAAaU,8BAA8B;AAAA,IAf9C,CAAA,IAiBE,IA3BN;AAAA,EAAA,CADF;AA+BD;AA0BM,SAASwB,WACdnC,OACA;AACM,QAAA;AAAA,IACJoC;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,OACG1B;AAAAA,EACDZ,IAAAA;AAEEuC,QAAAA,gBAAgBjB,YACpB,CAACkB,UAA4D;AAC3D,QAAI/B,SAAS;AACLgC,YAAAA,sBAAsBhC,QAAQ+B,KAAD;AACnC,UACG,OAAOC,wBAAwB,aAC9BA,wBAAwB,UAC1BD,+BAAOE;AAEP;AAAA,IACH;AAEDL,qDAAiBG;AAAAA,EAAH,GAEhB,CAACH,gBAAgB5B,OAAjB,CAd+B;AAiBjC,QAAMkC,YAAYP,MAAM;AAExB,6BACG,WAAD;AAAA,IAAW,KAAKE;AAAAA,IAAW,SAASC;AAAAA,IAApC,GAAuD3B;AAAAA,IAAvD;AAAA,EAAA,CADF;AAKD;"}

package/dist/dev/MediaFile.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaFile.js","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\n\nexport interface MediaFileProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","Error","Image","Video","video","ExternalVideo","externalVideo","ModelViewer","modelViewer","typenameMissingMessage"],"mappings":";;;;;;;AA+BO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AACC;AACd,gBAAA,IAAIC,MAAMD,WAAV;AAAA,QAIP;AAAA,MACF;AAED,4CACGE,MAAAA,OAAD;AAAA,QAAA,GACML;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,4CACGI,MAAAA,OAAD;AAAA,QAAA,GAAWN;AAAAA,QAAX,GAAiCD,6CAAcQ;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,4CACGC,cAAAA,eAAD;AAAA,QAAA,GACMR;AAAAA,QADN,GAEMD,6CAAcU;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,4CACGC,YAAAA,aAAD;AAAA,QAAA,GACMV;AAAAA,QADN,GAEMD,6CAAcY;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AACV;AACd,cAAA,IAAIR,MAAMQ,sBAAV;AAAA,MAIP;AAAA,IACF;AAAA,EAnDH;AAqDD;;"}
+{"version":3,"file":"MediaFile.js","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ModelViewerElement} from '@google/model-viewer/lib/model-viewer.js';\n\ntype BaseProps = React.HTMLAttributes<\n  HTMLImageElement | HTMLVideoElement | HTMLIFrameElement | ModelViewerElement\n>;\nexport interface MediaFileProps extends BaseProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        // @ts-expect-error There are issues with the inferred HTML attribute types here for ModelViewer (and contentEditable), but I think that's a little bit beyond me at the moment\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","Error","Image","Video","video","ExternalVideo","externalVideo","ModelViewer","modelViewer","typenameMissingMessage"],"mappings":";;;;;;;AAmCO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AACC;AACd,gBAAA,IAAIC,MAAMD,WAAV;AAAA,QAIP;AAAA,MACF;AAED,4CACGE,MAAAA,OAAD;AAAA,QAAA,GACML;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,4CACGI,MAAAA,OAAD;AAAA,QAAA,GAAWN;AAAAA,QAAX,GAAiCD,6CAAcQ;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,4CACGC,cAAAA,eAAD;AAAA,QAAA,GACMR;AAAAA,QADN,GAEMD,6CAAcU;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,4CAEGC,YAAAA;WACKV;AAAAA,QADN,GAEMD,6CAAcY;AAAAA,QAClB;AAAA,MAAA,CAHF;AAAA,IAMH;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AACV;AACd,cAAA,IAAIR,MAAMQ,sBAAV;AAAA,MAIP;AAAA,IACF;AAAA,EApDH;AAsDD;;"}

package/dist/dev/MediaFile.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MediaFile.mjs","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\n\nexport interface MediaFileProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","Error","video","externalVideo","modelViewer","typenameMissingMessage"],"mappings":";;;;;AA+BO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AACC;AACd,gBAAA,IAAIC,MAAMD,WAAV;AAAA,QAIP;AAAA,MACF;AAED,iCACG,OAAD;AAAA,QAAA,GACMH;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,iCACG,OAAD;AAAA,QAAA,GAAWF;AAAAA,QAAX,GAAiCD,6CAAcM;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,iCACG,eAAD;AAAA,QAAA,GACML;AAAAA,QADN,GAEMD,6CAAcO;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,iCACG,aAAD;AAAA,QAAA,GACMN;AAAAA,QADN,GAEMD,6CAAcQ;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AACV;AACd,cAAA,IAAIJ,MAAMI,sBAAV;AAAA,MAIP;AAAA,IACF;AAAA,EAnDH;AAqDD;"}
+{"version":3,"file":"MediaFile.mjs","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ModelViewerElement} from '@google/model-viewer/lib/model-viewer.js';\n\ntype BaseProps = React.HTMLAttributes<\n  HTMLImageElement | HTMLVideoElement | HTMLIFrameElement | ModelViewerElement\n>;\nexport interface MediaFileProps extends BaseProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        // @ts-expect-error There are issues with the inferred HTML attribute types here for ModelViewer (and contentEditable), but I think that's a little bit beyond me at the moment\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","Error","video","externalVideo","modelViewer","typenameMissingMessage"],"mappings":";;;;;AAmCO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AACC;AACd,gBAAA,IAAIC,MAAMD,WAAV;AAAA,QAIP;AAAA,MACF;AAED,iCACG,OAAD;AAAA,QAAA,GACMH;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,iCACG,OAAD;AAAA,QAAA,GAAWF;AAAAA,QAAX,GAAiCD,6CAAcM;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,iCACG,eAAD;AAAA,QAAA,GACML;AAAAA,QADN,GAEMD,6CAAcO;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,iCAEG;WACKN;AAAAA,QADN,GAEMD,6CAAcQ;AAAAA,QAClB;AAAA,MAAA,CAHF;AAAA,IAMH;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AACV;AACd,cAAA,IAAIJ,MAAMI,sBAAV;AAAA,MAIP;AAAA,IACF;AAAA,EApDH;AAsDD;"}

package/dist/dev/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const AddToCartButton = require("./AddToCartButton.js");
 const CartProvider = require("./CartProvider.js");
 const ExternalVideo = require("./ExternalVideo.js");
 const flattenConnection = require("./flatten-connection.js");
@@ -16,6 +17,7 @@ const ShopPayButton = require("./ShopPayButton.js");
 const storefrontClient = require("./storefront-client.js");
 const useMoney = require("./useMoney.js");
 const Video = require("./Video.js");
+exports.AddToCartButton = AddToCartButton.AddToCartButton;
 exports.CartProvider = CartProvider.CartProvider;
 exports.useCart = CartProvider.useCart;
 exports.ExternalVideo = ExternalVideo.ExternalVideo;

package/dist/dev/index.js.map

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

package/dist/dev/index.mjs

@@ -1,3 +1,4 @@
+import { AddToCartButton } from "./AddToCartButton.mjs";
 import { CartProvider, useCart } from "./CartProvider.mjs";
 import { ExternalVideo } from "./ExternalVideo.mjs";
 import { flattenConnection } from "./flatten-connection.mjs";
@@ -15,6 +16,7 @@ import { createStorefrontClient } from "./storefront-client.mjs";
 import { useMoney } from "./useMoney.mjs";
 import { Video } from "./Video.mjs";
 export {
+  AddToCartButton,
   CartProvider,
   ExternalVideo,
   Image,

package/dist/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/prod/AddToCartButton.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const react = require("react");
+const CartProvider = require("./CartProvider.js");
+const ProductProvider = require("./ProductProvider.js");
+const jsxRuntime = require("react/jsx-runtime");
+function AddToCartButton(props) {
+  var _a;
+  const [addingItem, setAddingItem] = react.useState(false);
+  const {
+    variantId: explicitVariantId,
+    quantity = 1,
+    attributes,
+    sellingPlanId,
+    onClick,
+    children,
+    accessibleAddingToCartLabel,
+    ...passthroughProps
+  } = props;
+  const {
+    status,
+    linesAdd
+  } = CartProvider.useCart();
+  const {
+    selectedVariant
+  } = ProductProvider.useProduct();
+  const variantId = (_a = explicitVariantId != null ? explicitVariantId : selectedVariant == null ? void 0 : selectedVariant.id) != null ? _a : "";
+  const disabled = explicitVariantId === null || variantId === "" || selectedVariant === null || addingItem || passthroughProps.disabled;
+  react.useEffect(() => {
+    if (addingItem && status === "idle") {
+      setAddingItem(false);
+    }
+  }, [status, addingItem]);
+  const handleAddItem = react.useCallback(() => {
+    setAddingItem(true);
+    linesAdd([{
+      quantity,
+      merchandiseId: variantId || "",
+      attributes,
+      sellingPlanId
+    }]);
+  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(BaseButton, {
+      ...passthroughProps,
+      disabled,
+      onClick,
+      defaultOnClick: handleAddItem,
+      children
+    }), accessibleAddingToCartLabel ? /* @__PURE__ */ jsxRuntime.jsx("p", {
+      style: {
+        position: "absolute",
+        width: "1px",
+        height: "1px",
+        padding: "0",
+        margin: "-1px",
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        borderWidth: "0"
+      },
+      role: "alert",
+      "aria-live": "assertive",
+      children: addingItem ? accessibleAddingToCartLabel : null
+    }) : null]
+  });
+}
+function BaseButton(props) {
+  const {
+    as,
+    onClick,
+    defaultOnClick,
+    children,
+    buttonRef,
+    ...passthroughProps
+  } = props;
+  const handleOnClick = react.useCallback((event) => {
+    if (onClick) {
+      const clickShouldContinue = onClick(event);
+      if (typeof clickShouldContinue === "boolean" && clickShouldContinue === false || (event == null ? void 0 : event.defaultPrevented))
+        return;
+    }
+    defaultOnClick == null ? void 0 : defaultOnClick(event);
+  }, [defaultOnClick, onClick]);
+  const Component = as || "button";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, {
+    ref: buttonRef,
+    onClick: handleOnClick,
+    ...passthroughProps,
+    children
+  });
+}
+exports.AddToCartButton = AddToCartButton;
+exports.BaseButton = BaseButton;
+//# sourceMappingURL=AddToCartButton.js.map

package/dist/prod/AddToCartButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddToCartButton.js","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, Ref, ReactNode, useState} from 'react';\n\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\n\ninterface AddToCartButtonProps {\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\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 & BaseButtonProps<AsType>\n) {\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    passthroughProps.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\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    Omit<\n      React.ComponentPropsWithoutRef<AsType>,\n      keyof CustomBaseButtonProps<AsType>\n    >;\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>\n) {\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":["AddToCartButton","props","addingItem","setAddingItem","useState","variantId","explicitVariantId","quantity","attributes","sellingPlanId","onClick","children","accessibleAddingToCartLabel","passthroughProps","status","linesAdd","useCart","selectedVariant","useProduct","id","disabled","useEffect","handleAddItem","useCallback","merchandiseId","_Fragment","_jsx","position","width","height","padding","margin","overflow","clip","whiteSpace","borderWidth","BaseButton","as","defaultOnClick","buttonRef","handleOnClick","event","clickShouldContinue","defaultPrevented","Component"],"mappings":";;;;;;AAyBO,SAASA,gBACdC,OACA;;AACA,QAAM,CAACC,YAAYC,aAAb,IAA8BC,eAAkB,KAAV;AACtC,QAAA;AAAA,IACJC,WAAWC;AAAAA,IACXC,WAAW;AAAA,IACXC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AACE,QAAA;AAAA,IAACa;AAAAA,IAAQC;AAAAA,MAAYC,aAA3B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,MAAmBC,gBAA1B,WAAA;AACMb,QAAAA,aAAYC,qDAAqBW,mDAAiBE,OAAtCb,YAA4C;AACxDc,QAAAA,WACJd,sBAAsB,QACtBD,cAAc,MACdY,oBAAoB,QACpBf,cACAW,iBAAiBO;AAEnBC,QAAAA,UAAU,MAAM;AACVnB,QAAAA,cAAcY,WAAW,QAAQ;AACnCX,oBAAc,KAAD;AAAA,IACd;AAAA,EAAA,GACA,CAACW,QAAQZ,UAAT,CAJM;AAMHoB,QAAAA,gBAAgBC,MAAAA,YAAY,MAAM;AACtCpB,kBAAc,IAAD;AACbY,aAAS,CACP;AAAA,MACER;AAAAA,MACAiB,eAAenB,aAAa;AAAA,MAC5BG;AAAAA,MACAC;AAAAA,IALK,CAAA,CAAD;AAAA,EAAA,GAQP,CAACM,UAAUR,UAAUF,WAAWG,YAAYC,aAA5C,CAV8B;AAYjC,yCACEgB,WAAAA,UAAA;AAAA,IAAA,UACE,CAAAC,2BAAA,IAAC,YAAD;AAAA,MAAA,GACMb;AAAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgBS;AAAAA,MAJlB;AAAA,IAAA,CADF,GASGV,8BACCc,2BAAA,IAAA,KAAA;AAAA,MACE,OAAO;AAAA,QACLC,UAAU;AAAA,QACVC,OAAO;AAAA,QACPC,QAAQ;AAAA,QACRC,SAAS;AAAA,QACTC,QAAQ;AAAA,QACRC,UAAU;AAAA,QACVC,MAAM;AAAA,QACNC,YAAY;AAAA,QACZC,aAAa;AAAA,MATR;AAAA,MAWP,MAAK;AAAA,MACL,aAAU;AAAA,MAbZ,UAeGjC,aAAaU,8BAA8B;AAAA,IAf9C,CAAA,IAiBE,IA3BN;AAAA,EAAA,CADF;AA+BD;AA0BM,SAASwB,WACdnC,OACA;AACM,QAAA;AAAA,IACJoC;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,OACG1B;AAAAA,EACDZ,IAAAA;AAEEuC,QAAAA,gBAAgBjB,kBACpB,CAACkB,UAA4D;AAC3D,QAAI/B,SAAS;AACLgC,YAAAA,sBAAsBhC,QAAQ+B,KAAD;AACnC,UACG,OAAOC,wBAAwB,aAC9BA,wBAAwB,UAC1BD,+BAAOE;AAEP;AAAA,IACH;AAEDL,qDAAiBG;AAAAA,EAAH,GAEhB,CAACH,gBAAgB5B,OAAjB,CAd+B;AAiBjC,QAAMkC,YAAYP,MAAM;AAExB,wCACG,WAAD;AAAA,IAAW,KAAKE;AAAAA,IAAW,SAASC;AAAAA,IAApC,GAAuD3B;AAAAA,IAAvD;AAAA,EAAA,CADF;AAKD;;;"}

package/dist/prod/AddToCartButton.mjs

@@ -0,0 +1,95 @@
+import { useState, useEffect, useCallback } from "react";
+import { useCart } from "./CartProvider.mjs";
+import { useProduct } from "./ProductProvider.mjs";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+function AddToCartButton(props) {
+  var _a;
+  const [addingItem, setAddingItem] = useState(false);
+  const {
+    variantId: explicitVariantId,
+    quantity = 1,
+    attributes,
+    sellingPlanId,
+    onClick,
+    children,
+    accessibleAddingToCartLabel,
+    ...passthroughProps
+  } = props;
+  const {
+    status,
+    linesAdd
+  } = useCart();
+  const {
+    selectedVariant
+  } = useProduct();
+  const variantId = (_a = explicitVariantId != null ? explicitVariantId : selectedVariant == null ? void 0 : selectedVariant.id) != null ? _a : "";
+  const disabled = explicitVariantId === null || variantId === "" || selectedVariant === null || addingItem || passthroughProps.disabled;
+  useEffect(() => {
+    if (addingItem && status === "idle") {
+      setAddingItem(false);
+    }
+  }, [status, addingItem]);
+  const handleAddItem = useCallback(() => {
+    setAddingItem(true);
+    linesAdd([{
+      quantity,
+      merchandiseId: variantId || "",
+      attributes,
+      sellingPlanId
+    }]);
+  }, [linesAdd, quantity, variantId, attributes, sellingPlanId]);
+  return /* @__PURE__ */ jsxs(Fragment, {
+    children: [/* @__PURE__ */ jsx(BaseButton, {
+      ...passthroughProps,
+      disabled,
+      onClick,
+      defaultOnClick: handleAddItem,
+      children
+    }), accessibleAddingToCartLabel ? /* @__PURE__ */ jsx("p", {
+      style: {
+        position: "absolute",
+        width: "1px",
+        height: "1px",
+        padding: "0",
+        margin: "-1px",
+        overflow: "hidden",
+        clip: "rect(0, 0, 0, 0)",
+        whiteSpace: "nowrap",
+        borderWidth: "0"
+      },
+      role: "alert",
+      "aria-live": "assertive",
+      children: addingItem ? accessibleAddingToCartLabel : null
+    }) : null]
+  });
+}
+function BaseButton(props) {
+  const {
+    as,
+    onClick,
+    defaultOnClick,
+    children,
+    buttonRef,
+    ...passthroughProps
+  } = props;
+  const handleOnClick = useCallback((event) => {
+    if (onClick) {
+      const clickShouldContinue = onClick(event);
+      if (typeof clickShouldContinue === "boolean" && clickShouldContinue === false || (event == null ? void 0 : event.defaultPrevented))
+        return;
+    }
+    defaultOnClick == null ? void 0 : defaultOnClick(event);
+  }, [defaultOnClick, onClick]);
+  const Component = as || "button";
+  return /* @__PURE__ */ jsx(Component, {
+    ref: buttonRef,
+    onClick: handleOnClick,
+    ...passthroughProps,
+    children
+  });
+}
+export {
+  AddToCartButton,
+  BaseButton
+};
+//# sourceMappingURL=AddToCartButton.mjs.map

package/dist/prod/AddToCartButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddToCartButton.mjs","sources":["../../src/AddToCartButton.tsx"],"sourcesContent":["import {useCallback, useEffect, Ref, ReactNode, useState} from 'react';\n\nimport {useCart} from './CartProvider.js';\nimport {useProduct} from './ProductProvider.js';\n\ninterface AddToCartButtonProps {\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\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 & BaseButtonProps<AsType>\n) {\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    passthroughProps.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\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    Omit<\n      React.ComponentPropsWithoutRef<AsType>,\n      keyof CustomBaseButtonProps<AsType>\n    >;\n\nexport function BaseButton<AsType extends React.ElementType = 'button'>(\n  props: BaseButtonProps<AsType>\n) {\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":["AddToCartButton","props","addingItem","setAddingItem","useState","variantId","explicitVariantId","quantity","attributes","sellingPlanId","onClick","children","accessibleAddingToCartLabel","passthroughProps","status","linesAdd","useCart","selectedVariant","useProduct","id","disabled","useEffect","handleAddItem","useCallback","merchandiseId","_Fragment","_jsx","position","width","height","padding","margin","overflow","clip","whiteSpace","borderWidth","BaseButton","as","defaultOnClick","buttonRef","handleOnClick","event","clickShouldContinue","defaultPrevented","Component"],"mappings":";;;;AAyBO,SAASA,gBACdC,OACA;;AACA,QAAM,CAACC,YAAYC,aAAb,IAA8BC,SAAkB,KAAV;AACtC,QAAA;AAAA,IACJC,WAAWC;AAAAA,IACXC,WAAW;AAAA,IACXC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AACE,QAAA;AAAA,IAACa;AAAAA,IAAQC;AAAAA,MAAYC,QAA3B;AACM,QAAA;AAAA,IAACC;AAAAA,MAAmBC,WAA1B;AACMb,QAAAA,aAAYC,qDAAqBW,mDAAiBE,OAAtCb,YAA4C;AACxDc,QAAAA,WACJd,sBAAsB,QACtBD,cAAc,MACdY,oBAAoB,QACpBf,cACAW,iBAAiBO;AAEnBC,YAAU,MAAM;AACVnB,QAAAA,cAAcY,WAAW,QAAQ;AACnCX,oBAAc,KAAD;AAAA,IACd;AAAA,EAAA,GACA,CAACW,QAAQZ,UAAT,CAJM;AAMHoB,QAAAA,gBAAgBC,YAAY,MAAM;AACtCpB,kBAAc,IAAD;AACbY,aAAS,CACP;AAAA,MACER;AAAAA,MACAiB,eAAenB,aAAa;AAAA,MAC5BG;AAAAA,MACAC;AAAAA,IALK,CAAA,CAAD;AAAA,EAAA,GAQP,CAACM,UAAUR,UAAUF,WAAWG,YAAYC,aAA5C,CAV8B;AAYjC,8BACEgB,UAAA;AAAA,IAAA,UACE,CAAAC,oBAAC,YAAD;AAAA,MAAA,GACMb;AAAAA,MACJ;AAAA,MACA;AAAA,MACA,gBAAgBS;AAAAA,MAJlB;AAAA,IAAA,CADF,GASGV,8BACCc,oBAAA,KAAA;AAAA,MACE,OAAO;AAAA,QACLC,UAAU;AAAA,QACVC,OAAO;AAAA,QACPC,QAAQ;AAAA,QACRC,SAAS;AAAA,QACTC,QAAQ;AAAA,QACRC,UAAU;AAAA,QACVC,MAAM;AAAA,QACNC,YAAY;AAAA,QACZC,aAAa;AAAA,MATR;AAAA,MAWP,MAAK;AAAA,MACL,aAAU;AAAA,MAbZ,UAeGjC,aAAaU,8BAA8B;AAAA,IAf9C,CAAA,IAiBE,IA3BN;AAAA,EAAA,CADF;AA+BD;AA0BM,SAASwB,WACdnC,OACA;AACM,QAAA;AAAA,IACJoC;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,IACA3B;AAAAA,IACA4B;AAAAA,OACG1B;AAAAA,EACDZ,IAAAA;AAEEuC,QAAAA,gBAAgBjB,YACpB,CAACkB,UAA4D;AAC3D,QAAI/B,SAAS;AACLgC,YAAAA,sBAAsBhC,QAAQ+B,KAAD;AACnC,UACG,OAAOC,wBAAwB,aAC9BA,wBAAwB,UAC1BD,+BAAOE;AAEP;AAAA,IACH;AAEDL,qDAAiBG;AAAAA,EAAH,GAEhB,CAACH,gBAAgB5B,OAAjB,CAd+B;AAiBjC,QAAMkC,YAAYP,MAAM;AAExB,6BACG,WAAD;AAAA,IAAW,KAAKE;AAAAA,IAAW,SAASC;AAAAA,IAApC,GAAuD3B;AAAAA,IAAvD;AAAA,EAAA,CADF;AAKD;"}

package/dist/prod/MediaFile.js.map

@@ -1 +1 @@
-{"version":3,"file":"MediaFile.js","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\n\nexport interface MediaFileProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","console","warn","Image","Video","video","ExternalVideo","externalVideo","ModelViewer","modelViewer","typenameMissingMessage","error"],"mappings":";;;;;;;AA+BO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AAGd;AACLC,kBAAQC,KAAKF,WAAb;AACO,iBAAA;AAAA,QACR;AAAA,MACF;AAED,4CACGG,MAAAA,OAAD;AAAA,QAAA,GACMN;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,4CACGK,MAAAA,OAAD;AAAA,QAAA,GAAWP;AAAAA,QAAX,GAAiCD,6CAAcS;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,4CACGC,cAAAA,eAAD;AAAA,QAAA,GACMT;AAAAA,QADN,GAEMD,6CAAcW;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,4CACGC,YAAAA,aAAD;AAAA,QAAA,GACMX;AAAAA,QADN,GAEMD,6CAAca;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AAGzB;AACLT,gBAAQU,MAAMD,sBAAd;AACO,eAAA;AAAA,MACR;AAAA,IACF;AAAA,EAnDH;AAqDD;;"}
+{"version":3,"file":"MediaFile.js","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ModelViewerElement} from '@google/model-viewer/lib/model-viewer.js';\n\ntype BaseProps = React.HTMLAttributes<\n  HTMLImageElement | HTMLVideoElement | HTMLIFrameElement | ModelViewerElement\n>;\nexport interface MediaFileProps extends BaseProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        // @ts-expect-error There are issues with the inferred HTML attribute types here for ModelViewer (and contentEditable), but I think that's a little bit beyond me at the moment\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","console","warn","Image","Video","video","ExternalVideo","externalVideo","ModelViewer","modelViewer","typenameMissingMessage","error"],"mappings":";;;;;;;AAmCO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AAGd;AACLC,kBAAQC,KAAKF,WAAb;AACO,iBAAA;AAAA,QACR;AAAA,MACF;AAED,4CACGG,MAAAA,OAAD;AAAA,QAAA,GACMN;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,4CACGK,MAAAA,OAAD;AAAA,QAAA,GAAWP;AAAAA,QAAX,GAAiCD,6CAAcS;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,4CACGC,cAAAA,eAAD;AAAA,QAAA,GACMT;AAAAA,QADN,GAEMD,6CAAcW;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,4CAEGC,YAAAA;WACKX;AAAAA,QADN,GAEMD,6CAAca;AAAAA,QAClB;AAAA,MAAA,CAHF;AAAA,IAMH;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AAGzB;AACLT,gBAAQU,MAAMD,sBAAd;AACO,eAAA;AAAA,MACR;AAAA,IACF;AAAA,EApDH;AAsDD;;"}

package/dist/prod/MediaFile.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MediaFile.mjs","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\n\nexport interface MediaFileProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","console","warn","video","externalVideo","modelViewer","typenameMissingMessage","error"],"mappings":";;;;;AA+BO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AAGd;AACLC,kBAAQC,KAAKF,WAAb;AACO,iBAAA;AAAA,QACR;AAAA,MACF;AAED,iCACG,OAAD;AAAA,QAAA,GACMH;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,iCACG,OAAD;AAAA,QAAA,GAAWF;AAAAA,QAAX,GAAiCD,6CAAcO;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,iCACG,eAAD;AAAA,QAAA,GACMN;AAAAA,QADN,GAEMD,6CAAcQ;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,iCACG,aAAD;AAAA,QAAA,GACMP;AAAAA,QADN,GAEMD,6CAAcS;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AAGzB;AACLL,gBAAQM,MAAMD,sBAAd;AACO,eAAA;AAAA,MACR;AAAA,IACF;AAAA,EAnDH;AAqDD;"}
+{"version":3,"file":"MediaFile.mjs","sources":["../../src/MediaFile.tsx"],"sourcesContent":["import {Image, type ShopifyImageProps} from './Image.js';\nimport {Video} from './Video.js';\nimport {ExternalVideo} from './ExternalVideo.js';\nimport {ModelViewer} from './ModelViewer.js';\nimport type {MediaEdge as MediaEdgeType} from './storefront-api-types.js';\nimport type {PartialDeep} from 'type-fest';\nimport type {ModelViewerElement} from '@google/model-viewer/lib/model-viewer.js';\n\ntype BaseProps = React.HTMLAttributes<\n  HTMLImageElement | HTMLVideoElement | HTMLIFrameElement | ModelViewerElement\n>;\nexport interface MediaFileProps extends BaseProps {\n  /** An object with fields that correspond to the Storefront API's [Media object](https://shopify.dev/api/storefront/reference/products/media). */\n  data: PartialDeep<MediaEdgeType['node'], {recurseIntoArrays: true}>;\n  /** The options for the `Image`, `Video`, or `ExternalVideo` components. */\n  mediaOptions?: {\n    /** Props that will only apply when an `<Image />` is rendered */\n    image: Omit<ShopifyImageProps, 'data'>;\n    /** Props that will only apply when a `<Video />` is rendered */\n    video: Omit<React.ComponentProps<typeof Video>, 'data'>;\n    /** Props that will only apply when an `<ExternalVideo />` is rendered */\n    externalVideo: Omit<\n      React.ComponentProps<typeof ExternalVideo>['options'],\n      'data'\n    >;\n    /** Props that will only apply when a `<ModelViewer />` is rendered */\n    modelViewer: Omit<typeof ModelViewer, 'data'>;\n  };\n}\n\n/**\n * The `MediaFile` component renders the media for the Storefront API's\n * [Media object](https://shopify.dev/api/storefront/reference/products/media). It renders an `Image`, a\n * `Video`, an `ExternalVideo`, or a `ModelViewer` depending on the `__typename` of the `data` prop.\n */\nexport function MediaFile({\n  data,\n  mediaOptions,\n  ...passthroughProps\n}: MediaFileProps) {\n  switch (data.__typename) {\n    case 'MediaImage': {\n      if (!data.image) {\n        const noDataImage = `<MediaFile/>: 'data.image' does not exist for __typename of 'MediaImage'; rendering 'null' by default.`;\n        if (__HYDROGEN_DEV__) {\n          throw new Error(noDataImage);\n        } else {\n          console.warn(noDataImage);\n          return null;\n        }\n      }\n\n      return (\n        <Image\n          {...passthroughProps}\n          {...mediaOptions?.image}\n          data={data.image}\n        />\n      );\n    }\n    case 'Video': {\n      return (\n        <Video {...passthroughProps} {...mediaOptions?.video} data={data} />\n      );\n    }\n    case 'ExternalVideo': {\n      return (\n        <ExternalVideo\n          {...passthroughProps}\n          {...mediaOptions?.externalVideo}\n          data={data}\n        />\n      );\n    }\n    case 'Model3d': {\n      return (\n        // @ts-expect-error There are issues with the inferred HTML attribute types here for ModelViewer (and contentEditable), but I think that's a little bit beyond me at the moment\n        <ModelViewer\n          {...passthroughProps}\n          {...mediaOptions?.modelViewer}\n          data={data}\n        />\n      );\n    }\n    default: {\n      const typenameMissingMessage = `<MediaFile /> requires the '__typename' property to exist on the 'data' prop in order to correctly render the correct component for this media. Rendering 'null' by default`;\n      if (__HYDROGEN_DEV__) {\n        throw new Error(typenameMissingMessage);\n      } else {\n        console.error(typenameMissingMessage);\n        return null;\n      }\n    }\n  }\n}\n"],"names":["MediaFile","data","mediaOptions","passthroughProps","__typename","image","noDataImage","console","warn","video","externalVideo","modelViewer","typenameMissingMessage","error"],"mappings":";;;;;AAmCO,SAASA,UAAU;AAAA,EACxBC;AAAAA,EACAC;AAAAA,KACGC;AAHqB,GAIP;AACjB,UAAQF,KAAKG,YAAb;AAAA,IACE,KAAK,cAAc;AACb,UAAA,CAACH,KAAKI,OAAO;AACf,cAAMC,cAAe;AAGd;AACLC,kBAAQC,KAAKF,WAAb;AACO,iBAAA;AAAA,QACR;AAAA,MACF;AAED,iCACG,OAAD;AAAA,QAAA,GACMH;AAAAA,QADN,GAEMD,6CAAcG;AAAAA,QAClB,MAAMJ,KAAKI;AAAAA,MAAAA,CAJf;AAAA,IAOD;AAAA,IACD,KAAK,SAAS;AACZ,iCACG,OAAD;AAAA,QAAA,GAAWF;AAAAA,QAAX,GAAiCD,6CAAcO;AAAAA,QAAO;AAAA,MAAA,CADxD;AAAA,IAGD;AAAA,IACD,KAAK,iBAAiB;AACpB,iCACG,eAAD;AAAA,QAAA,GACMN;AAAAA,QADN,GAEMD,6CAAcQ;AAAAA,QAClB;AAAA,MAAA,CAJJ;AAAA,IAOD;AAAA,IACD,KAAK,WAAW;AACd,iCAEG;WACKP;AAAAA,QADN,GAEMD,6CAAcS;AAAAA,QAClB;AAAA,MAAA,CAHF;AAAA,IAMH;AAAA,IACD,SAAS;AACP,YAAMC,yBAA0B;AAGzB;AACLL,gBAAQM,MAAMD,sBAAd;AACO,eAAA;AAAA,MACR;AAAA,IACF;AAAA,EApDH;AAsDD;"}

package/dist/prod/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const AddToCartButton = require("./AddToCartButton.js");
 const CartProvider = require("./CartProvider.js");
 const ExternalVideo = require("./ExternalVideo.js");
 const flattenConnection = require("./flatten-connection.js");
@@ -16,6 +17,7 @@ const ShopPayButton = require("./ShopPayButton.js");
 const storefrontClient = require("./storefront-client.js");
 const useMoney = require("./useMoney.js");
 const Video = require("./Video.js");
+exports.AddToCartButton = AddToCartButton.AddToCartButton;
 exports.CartProvider = CartProvider.CartProvider;
 exports.useCart = CartProvider.useCart;
 exports.ExternalVideo = ExternalVideo.ExternalVideo;

package/dist/prod/index.js.map

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

package/dist/prod/index.mjs

@@ -1,3 +1,4 @@
+import { AddToCartButton } from "./AddToCartButton.mjs";
 import { CartProvider, useCart } from "./CartProvider.mjs";
 import { ExternalVideo } from "./ExternalVideo.mjs";
 import { flattenConnection } from "./flatten-connection.mjs";
@@ -15,6 +16,7 @@ import { createStorefrontClient } from "./storefront-client.mjs";
 import { useMoney } from "./useMoney.mjs";
 import { Video } from "./Video.mjs";
 export {
+  AddToCartButton,
   CartProvider,
   ExternalVideo,
   Image,