@shopify/hydrogen-react 0.0.0-next-59d697b → 0.0.0-next-4695e32

package/dist/dev/BuyNowButton.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const react = require("react");
+const CartProvider = require("./CartProvider.js");
+const BaseButton = require("./BaseButton.js");
+const jsxRuntime = require("react/jsx-runtime");
+function BuyNowButton(props) {
+  const {
+    cartCreate,
+    checkoutUrl
+  } = CartProvider.useCart();
+  const [loading, setLoading] = react.useState(false);
+  const {
+    quantity,
+    variantId,
+    onClick,
+    attributes,
+    children,
+    ...passthroughProps
+  } = props;
+  react.useEffect(() => {
+    if (checkoutUrl) {
+      window.location.href = checkoutUrl;
+    }
+  }, [checkoutUrl]);
+  const handleBuyNow = react.useCallback(() => {
+    setLoading(true);
+    cartCreate({
+      lines: [{
+        quantity: quantity != null ? quantity : 1,
+        merchandiseId: variantId,
+        attributes
+      }]
+    });
+  }, [cartCreate, quantity, variantId, attributes]);
+  return /* @__PURE__ */ jsxRuntime.jsx(BaseButton.BaseButton, {
+    disabled: loading != null ? loading : passthroughProps.disabled,
+    ...passthroughProps,
+    onClick,
+    defaultOnClick: handleBuyNow,
+    children
+  });
+}
+exports.BuyNowButton = BuyNowButton;
+//# sourceMappingURL=BuyNowButton.js.map

package/dist/dev/BuyNowButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuyNowButton.js","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ninterface BuyNowButtonProps {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\n/** The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout. */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps & BaseButtonProps<AsType>\n) {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes]);\n\n  return (\n    <BaseButton\n      disabled={loading ?? passthroughProps.disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["BuyNowButton","props","cartCreate","checkoutUrl","useCart","loading","setLoading","useState","quantity","variantId","onClick","attributes","children","passthroughProps","useEffect","window","location","href","handleBuyNow","useCallback","lines","merchandiseId","BaseButton","disabled"],"mappings":";;;;;;AAiBO,SAASA,aACdC,OACA;AACM,QAAA;AAAA,IAACC;AAAAA,IAAYC;AAAAA,MAAeC,aAAlC,QAAA;AACA,QAAM,CAACC,SAASC,UAAV,IAAwBC,eAAkB,KAAV;AAEhC,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AAEJa,QAAAA,UAAU,MAAM;AACd,QAAIX,aAAa;AACfY,aAAOC,SAASC,OAAOd;AAAAA,IACxB;AAAA,EAAA,GACA,CAACA,WAAD,CAJM;AAMHe,QAAAA,eAAeC,MAAAA,YAAY,MAAM;AACrCb,eAAW,IAAD;AACC,eAAA;AAAA,MACTc,OAAO,CACL;AAAA,QACEZ,UAAUA,8BAAY;AAAA,QACtBa,eAAeZ;AAAAA,QACfE;AAAAA,MAAAA,CAJG;AAAA,IAAA,CADC;AAAA,KAST,CAACT,YAAYM,UAAUC,WAAWE,UAAlC,CAX6B;AAahC,wCACGW,WAAAA,YAAD;AAAA,IACE,UAAUjB,4BAAWQ,iBAAiBU;AAAAA,IADxC,GAEMV;AAAAA,IACJ;AAAA,IACA,gBAAgBK;AAAAA,IAJlB;AAAA,EAAA,CADF;AAUD;;"}

package/dist/dev/BuyNowButton.mjs

@@ -0,0 +1,45 @@
+import { useState, useEffect, useCallback } from "react";
+import { useCart } from "./CartProvider.mjs";
+import { BaseButton } from "./BaseButton.mjs";
+import { jsx } from "react/jsx-runtime";
+function BuyNowButton(props) {
+  const {
+    cartCreate,
+    checkoutUrl
+  } = useCart();
+  const [loading, setLoading] = useState(false);
+  const {
+    quantity,
+    variantId,
+    onClick,
+    attributes,
+    children,
+    ...passthroughProps
+  } = props;
+  useEffect(() => {
+    if (checkoutUrl) {
+      window.location.href = checkoutUrl;
+    }
+  }, [checkoutUrl]);
+  const handleBuyNow = useCallback(() => {
+    setLoading(true);
+    cartCreate({
+      lines: [{
+        quantity: quantity != null ? quantity : 1,
+        merchandiseId: variantId,
+        attributes
+      }]
+    });
+  }, [cartCreate, quantity, variantId, attributes]);
+  return /* @__PURE__ */ jsx(BaseButton, {
+    disabled: loading != null ? loading : passthroughProps.disabled,
+    ...passthroughProps,
+    onClick,
+    defaultOnClick: handleBuyNow,
+    children
+  });
+}
+export {
+  BuyNowButton
+};
+//# sourceMappingURL=BuyNowButton.mjs.map

package/dist/dev/BuyNowButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuyNowButton.mjs","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ninterface BuyNowButtonProps {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\n/** The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout. */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps & BaseButtonProps<AsType>\n) {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes]);\n\n  return (\n    <BaseButton\n      disabled={loading ?? passthroughProps.disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["BuyNowButton","props","cartCreate","checkoutUrl","useCart","loading","setLoading","useState","quantity","variantId","onClick","attributes","children","passthroughProps","useEffect","window","location","href","handleBuyNow","useCallback","lines","merchandiseId","disabled"],"mappings":";;;;AAiBO,SAASA,aACdC,OACA;AACM,QAAA;AAAA,IAACC;AAAAA,IAAYC;AAAAA,MAAeC,QAAlC;AACA,QAAM,CAACC,SAASC,UAAV,IAAwBC,SAAkB,KAAV;AAEhC,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AAEJa,YAAU,MAAM;AACd,QAAIX,aAAa;AACfY,aAAOC,SAASC,OAAOd;AAAAA,IACxB;AAAA,EAAA,GACA,CAACA,WAAD,CAJM;AAMHe,QAAAA,eAAeC,YAAY,MAAM;AACrCb,eAAW,IAAD;AACC,eAAA;AAAA,MACTc,OAAO,CACL;AAAA,QACEZ,UAAUA,8BAAY;AAAA,QACtBa,eAAeZ;AAAAA,QACfE;AAAAA,MAAAA,CAJG;AAAA,IAAA,CADC;AAAA,KAST,CAACT,YAAYM,UAAUC,WAAWE,UAAlC,CAX6B;AAahC,6BACG,YAAD;AAAA,IACE,UAAUN,4BAAWQ,iBAAiBS;AAAAA,IADxC,GAEMT;AAAAA,IACJ;AAAA,IACA,gBAAgBK;AAAAA,IAJlB;AAAA,EAAA,CADF;AAUD;"}

package/dist/dev/CartCheckoutButton.js

@@ -2,6 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const react = require("react");
 const CartProvider = require("./CartProvider.js");
+const BaseButton = require("./BaseButton.js");
 const jsxRuntime = require("react/jsx-runtime");
 function CartCheckoutButton(props) {
   const [requestedCheckout, setRequestedCheckout] = react.useState(false);
@@ -18,7 +19,7 @@ function CartCheckoutButton(props) {
       window.location.href = checkoutUrl;
     }
   }, [requestedCheckout, status, checkoutUrl]);
-  return /* @__PURE__ */ jsxRuntime.jsx("button", {
+  return /* @__PURE__ */ jsxRuntime.jsx(BaseButton.BaseButton, {
     ...passthroughProps,
     disabled: requestedCheckout || passthroughProps.disabled,
     onClick: () => setRequestedCheckout(true),

package/dist/dev/CartCheckoutButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<JSX.IntrinsicElements['button'], PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <button\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </button>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;;;AASO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,eAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,aAA9B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,QAAAA,UAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT;OAEQG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;;"}
+{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<BaseButtonProps<'button'>, PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","BaseButton","disabled"],"mappings":";;;;;;AAUO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,eAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,aAA9B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,QAAAA,UAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT,wCACGQ,WAAAA,YAAD;AAAA,IAAA,GACML;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBM;AAAAA,IAChD,SAAS,MAAMZ,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;;"}

package/dist/dev/CartCheckoutButton.mjs

@@ -1,5 +1,6 @@
 import { useState, useEffect } from "react";
 import { useCart } from "./CartProvider.mjs";
+import { BaseButton } from "./BaseButton.mjs";
 import { jsx } from "react/jsx-runtime";
 function CartCheckoutButton(props) {
   const [requestedCheckout, setRequestedCheckout] = useState(false);
@@ -16,7 +17,7 @@ function CartCheckoutButton(props) {
       window.location.href = checkoutUrl;
     }
   }, [requestedCheckout, status, checkoutUrl]);
-  return /* @__PURE__ */ jsx("button", {
+  return /* @__PURE__ */ jsx(BaseButton, {
     ...passthroughProps,
     disabled: requestedCheckout || passthroughProps.disabled,
     onClick: () => setRequestedCheckout(true),

package/dist/dev/CartCheckoutButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<JSX.IntrinsicElements['button'], PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <button\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </button>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;AASO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,SAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,QAA9B;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,YAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT;OAEQG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;"}
+{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<BaseButtonProps<'button'>, PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;;AAUO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,SAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,QAA9B;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,YAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT,6BACG,YAAD;AAAA,IAAA,GACMG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;"}

package/dist/dev/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const AddToCartButton = require("./AddToCartButton.js");
+const BuyNowButton = require("./BuyNowButton.js");
 const CartCheckoutButton = require("./CartCheckoutButton.js");
 const CartProvider = require("./CartProvider.js");
 const ExternalVideo = require("./ExternalVideo.js");
@@ -19,6 +20,7 @@ const storefrontClient = require("./storefront-client.js");
 const useMoney = require("./useMoney.js");
 const Video = require("./Video.js");
 exports.AddToCartButton = AddToCartButton.AddToCartButton;
+exports.BuyNowButton = BuyNowButton.BuyNowButton;
 exports.CartCheckoutButton = CartCheckoutButton.CartCheckoutButton;
 exports.CartProvider = CartProvider.CartProvider;
 exports.useCart = CartProvider.useCart;

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,4 +1,5 @@
 import { AddToCartButton } from "./AddToCartButton.mjs";
+import { BuyNowButton } from "./BuyNowButton.mjs";
 import { CartCheckoutButton } from "./CartCheckoutButton.mjs";
 import { CartProvider, useCart } from "./CartProvider.mjs";
 import { ExternalVideo } from "./ExternalVideo.mjs";
@@ -18,6 +19,7 @@ import { useMoney } from "./useMoney.mjs";
 import { Video } from "./Video.mjs";
 export {
   AddToCartButton,
+  BuyNowButton,
   CartCheckoutButton,
   CartProvider,
   ExternalVideo,

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/BuyNowButton.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const react = require("react");
+const CartProvider = require("./CartProvider.js");
+const BaseButton = require("./BaseButton.js");
+const jsxRuntime = require("react/jsx-runtime");
+function BuyNowButton(props) {
+  const {
+    cartCreate,
+    checkoutUrl
+  } = CartProvider.useCart();
+  const [loading, setLoading] = react.useState(false);
+  const {
+    quantity,
+    variantId,
+    onClick,
+    attributes,
+    children,
+    ...passthroughProps
+  } = props;
+  react.useEffect(() => {
+    if (checkoutUrl) {
+      window.location.href = checkoutUrl;
+    }
+  }, [checkoutUrl]);
+  const handleBuyNow = react.useCallback(() => {
+    setLoading(true);
+    cartCreate({
+      lines: [{
+        quantity: quantity != null ? quantity : 1,
+        merchandiseId: variantId,
+        attributes
+      }]
+    });
+  }, [cartCreate, quantity, variantId, attributes]);
+  return /* @__PURE__ */ jsxRuntime.jsx(BaseButton.BaseButton, {
+    disabled: loading != null ? loading : passthroughProps.disabled,
+    ...passthroughProps,
+    onClick,
+    defaultOnClick: handleBuyNow,
+    children
+  });
+}
+exports.BuyNowButton = BuyNowButton;
+//# sourceMappingURL=BuyNowButton.js.map

package/dist/prod/BuyNowButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuyNowButton.js","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ninterface BuyNowButtonProps {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\n/** The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout. */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps & BaseButtonProps<AsType>\n) {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes]);\n\n  return (\n    <BaseButton\n      disabled={loading ?? passthroughProps.disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["BuyNowButton","props","cartCreate","checkoutUrl","useCart","loading","setLoading","useState","quantity","variantId","onClick","attributes","children","passthroughProps","useEffect","window","location","href","handleBuyNow","useCallback","lines","merchandiseId","BaseButton","disabled"],"mappings":";;;;;;AAiBO,SAASA,aACdC,OACA;AACM,QAAA;AAAA,IAACC;AAAAA,IAAYC;AAAAA,MAAeC,aAAlC,QAAA;AACA,QAAM,CAACC,SAASC,UAAV,IAAwBC,eAAkB,KAAV;AAEhC,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AAEJa,QAAAA,UAAU,MAAM;AACd,QAAIX,aAAa;AACfY,aAAOC,SAASC,OAAOd;AAAAA,IACxB;AAAA,EAAA,GACA,CAACA,WAAD,CAJM;AAMHe,QAAAA,eAAeC,MAAAA,YAAY,MAAM;AACrCb,eAAW,IAAD;AACC,eAAA;AAAA,MACTc,OAAO,CACL;AAAA,QACEZ,UAAUA,8BAAY;AAAA,QACtBa,eAAeZ;AAAAA,QACfE;AAAAA,MAAAA,CAJG;AAAA,IAAA,CADC;AAAA,KAST,CAACT,YAAYM,UAAUC,WAAWE,UAAlC,CAX6B;AAahC,wCACGW,WAAAA,YAAD;AAAA,IACE,UAAUjB,4BAAWQ,iBAAiBU;AAAAA,IADxC,GAEMV;AAAAA,IACJ;AAAA,IACA,gBAAgBK;AAAAA,IAJlB;AAAA,EAAA,CADF;AAUD;;"}

package/dist/prod/BuyNowButton.mjs

@@ -0,0 +1,45 @@
+import { useState, useEffect, useCallback } from "react";
+import { useCart } from "./CartProvider.mjs";
+import { BaseButton } from "./BaseButton.mjs";
+import { jsx } from "react/jsx-runtime";
+function BuyNowButton(props) {
+  const {
+    cartCreate,
+    checkoutUrl
+  } = useCart();
+  const [loading, setLoading] = useState(false);
+  const {
+    quantity,
+    variantId,
+    onClick,
+    attributes,
+    children,
+    ...passthroughProps
+  } = props;
+  useEffect(() => {
+    if (checkoutUrl) {
+      window.location.href = checkoutUrl;
+    }
+  }, [checkoutUrl]);
+  const handleBuyNow = useCallback(() => {
+    setLoading(true);
+    cartCreate({
+      lines: [{
+        quantity: quantity != null ? quantity : 1,
+        merchandiseId: variantId,
+        attributes
+      }]
+    });
+  }, [cartCreate, quantity, variantId, attributes]);
+  return /* @__PURE__ */ jsx(BaseButton, {
+    disabled: loading != null ? loading : passthroughProps.disabled,
+    ...passthroughProps,
+    onClick,
+    defaultOnClick: handleBuyNow,
+    children
+  });
+}
+export {
+  BuyNowButton
+};
+//# sourceMappingURL=BuyNowButton.mjs.map

package/dist/prod/BuyNowButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuyNowButton.mjs","sources":["../../src/BuyNowButton.tsx"],"sourcesContent":["import {useEffect, useState, useCallback} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ninterface BuyNowButtonProps {\n  /** The item quantity. Defaults to 1. */\n  quantity?: number;\n  /** The ID of the variant. */\n  variantId: string;\n  /** An array of cart line attributes that belong to the item being added to the cart. */\n  attributes?: {\n    key: string;\n    value: string;\n  }[];\n}\n\n/** The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout. */\nexport function BuyNowButton<AsType extends React.ElementType = 'button'>(\n  props: BuyNowButtonProps & BaseButtonProps<AsType>\n) {\n  const {cartCreate, checkoutUrl} = useCart();\n  const [loading, setLoading] = useState<boolean>(false);\n\n  const {\n    quantity,\n    variantId,\n    onClick,\n    attributes,\n    children,\n    ...passthroughProps\n  } = props;\n\n  useEffect(() => {\n    if (checkoutUrl) {\n      window.location.href = checkoutUrl;\n    }\n  }, [checkoutUrl]);\n\n  const handleBuyNow = useCallback(() => {\n    setLoading(true);\n    cartCreate({\n      lines: [\n        {\n          quantity: quantity ?? 1,\n          merchandiseId: variantId,\n          attributes,\n        },\n      ],\n    });\n  }, [cartCreate, quantity, variantId, attributes]);\n\n  return (\n    <BaseButton\n      disabled={loading ?? passthroughProps.disabled}\n      {...passthroughProps}\n      onClick={onClick}\n      defaultOnClick={handleBuyNow}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["BuyNowButton","props","cartCreate","checkoutUrl","useCart","loading","setLoading","useState","quantity","variantId","onClick","attributes","children","passthroughProps","useEffect","window","location","href","handleBuyNow","useCallback","lines","merchandiseId","disabled"],"mappings":";;;;AAiBO,SAASA,aACdC,OACA;AACM,QAAA;AAAA,IAACC;AAAAA,IAAYC;AAAAA,MAAeC,QAAlC;AACA,QAAM,CAACC,SAASC,UAAV,IAAwBC,SAAkB,KAAV;AAEhC,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,OACGC;AAAAA,EACDZ,IAAAA;AAEJa,YAAU,MAAM;AACd,QAAIX,aAAa;AACfY,aAAOC,SAASC,OAAOd;AAAAA,IACxB;AAAA,EAAA,GACA,CAACA,WAAD,CAJM;AAMHe,QAAAA,eAAeC,YAAY,MAAM;AACrCb,eAAW,IAAD;AACC,eAAA;AAAA,MACTc,OAAO,CACL;AAAA,QACEZ,UAAUA,8BAAY;AAAA,QACtBa,eAAeZ;AAAAA,QACfE;AAAAA,MAAAA,CAJG;AAAA,IAAA,CADC;AAAA,KAST,CAACT,YAAYM,UAAUC,WAAWE,UAAlC,CAX6B;AAahC,6BACG,YAAD;AAAA,IACE,UAAUN,4BAAWQ,iBAAiBS;AAAAA,IADxC,GAEMT;AAAAA,IACJ;AAAA,IACA,gBAAgBK;AAAAA,IAJlB;AAAA,EAAA,CADF;AAUD;"}

package/dist/prod/CartCheckoutButton.js

@@ -2,6 +2,7 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const react = require("react");
 const CartProvider = require("./CartProvider.js");
+const BaseButton = require("./BaseButton.js");
 const jsxRuntime = require("react/jsx-runtime");
 function CartCheckoutButton(props) {
   const [requestedCheckout, setRequestedCheckout] = react.useState(false);
@@ -18,7 +19,7 @@ function CartCheckoutButton(props) {
       window.location.href = checkoutUrl;
     }
   }, [requestedCheckout, status, checkoutUrl]);
-  return /* @__PURE__ */ jsxRuntime.jsx("button", {
+  return /* @__PURE__ */ jsxRuntime.jsx(BaseButton.BaseButton, {
     ...passthroughProps,
     disabled: requestedCheckout || passthroughProps.disabled,
     onClick: () => setRequestedCheckout(true),

package/dist/prod/CartCheckoutButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<JSX.IntrinsicElements['button'], PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <button\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </button>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;;;AASO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,eAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,aAA9B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,QAAAA,UAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT;OAEQG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;;"}
+{"version":3,"file":"CartCheckoutButton.js","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<BaseButtonProps<'button'>, PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","BaseButton","disabled"],"mappings":";;;;;;AAUO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,eAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,aAA9B,QAAA;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,QAAAA,UAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT,wCACGQ,WAAAA,YAAD;AAAA,IAAA,GACML;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBM;AAAAA,IAChD,SAAS,MAAMZ,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;;"}

package/dist/prod/CartCheckoutButton.mjs

@@ -1,5 +1,6 @@
 import { useState, useEffect } from "react";
 import { useCart } from "./CartProvider.mjs";
+import { BaseButton } from "./BaseButton.mjs";
 import { jsx } from "react/jsx-runtime";
 function CartCheckoutButton(props) {
   const [requestedCheckout, setRequestedCheckout] = useState(false);
@@ -16,7 +17,7 @@ function CartCheckoutButton(props) {
       window.location.href = checkoutUrl;
     }
   }, [requestedCheckout, status, checkoutUrl]);
-  return /* @__PURE__ */ jsx("button", {
+  return /* @__PURE__ */ jsx(BaseButton, {
     ...passthroughProps,
     disabled: requestedCheckout || passthroughProps.disabled,
     onClick: () => setRequestedCheckout(true),

package/dist/prod/CartCheckoutButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<JSX.IntrinsicElements['button'], PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <button\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </button>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;AASO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,SAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,QAA9B;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,YAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT;OAEQG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;"}
+{"version":3,"file":"CartCheckoutButton.mjs","sources":["../../src/CartCheckoutButton.tsx"],"sourcesContent":["import {ReactNode, useEffect, useState} from 'react';\nimport {useCart} from './CartProvider.js';\nimport {BaseButton, BaseButtonProps} from './BaseButton.js';\n\ntype PropsWeControl = 'onClick';\n\n/**\n * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.\n * It must be a descendent of a `CartProvider` component.\n */\nexport function CartCheckoutButton(\n  props: Omit<BaseButtonProps<'button'>, PropsWeControl> & {\n    /** A `ReactNode` element. */\n    children: ReactNode;\n  }\n) {\n  const [requestedCheckout, setRequestedCheckout] = useState(false);\n  const {status, checkoutUrl} = useCart();\n  const {children, ...passthroughProps} = props;\n\n  useEffect(() => {\n    if (requestedCheckout && checkoutUrl && status === 'idle') {\n      window.location.href = checkoutUrl;\n    }\n  }, [requestedCheckout, status, checkoutUrl]);\n\n  return (\n    <BaseButton\n      {...passthroughProps}\n      disabled={requestedCheckout || passthroughProps.disabled}\n      onClick={() => setRequestedCheckout(true)}\n    >\n      {children}\n    </BaseButton>\n  );\n}\n"],"names":["CartCheckoutButton","props","requestedCheckout","setRequestedCheckout","useState","status","checkoutUrl","useCart","children","passthroughProps","useEffect","window","location","href","disabled"],"mappings":";;;;AAUO,SAASA,mBACdC,OAIA;AACA,QAAM,CAACC,mBAAmBC,oBAApB,IAA4CC,SAAS,KAAD;AACpD,QAAA;AAAA,IAACC;AAAAA,IAAQC;AAAAA,MAAeC,QAA9B;AACM,QAAA;AAAA,IAACC;AAAAA,OAAaC;AAAAA,EAAoBR,IAAAA;AAExCS,YAAU,MAAM;AACVR,QAAAA,qBAAqBI,eAAeD,WAAW,QAAQ;AACzDM,aAAOC,SAASC,OAAOP;AAAAA,IACxB;AAAA,EACA,GAAA,CAACJ,mBAAmBG,QAAQC,WAA5B,CAJM;AAMT,6BACG,YAAD;AAAA,IAAA,GACMG;AAAAA,IACJ,UAAUP,qBAAqBO,iBAAiBK;AAAAA,IAChD,SAAS,MAAMX,qBAAqB,IAAD;AAAA,IAHrC;AAAA,EAAA,CADF;AASD;"}

package/dist/prod/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const AddToCartButton = require("./AddToCartButton.js");
+const BuyNowButton = require("./BuyNowButton.js");
 const CartCheckoutButton = require("./CartCheckoutButton.js");
 const CartProvider = require("./CartProvider.js");
 const ExternalVideo = require("./ExternalVideo.js");
@@ -19,6 +20,7 @@ const storefrontClient = require("./storefront-client.js");
 const useMoney = require("./useMoney.js");
 const Video = require("./Video.js");
 exports.AddToCartButton = AddToCartButton.AddToCartButton;
+exports.BuyNowButton = BuyNowButton.BuyNowButton;
 exports.CartCheckoutButton = CartCheckoutButton.CartCheckoutButton;
 exports.CartProvider = CartProvider.CartProvider;
 exports.useCart = CartProvider.useCart;

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,4 +1,5 @@
 import { AddToCartButton } from "./AddToCartButton.mjs";
+import { BuyNowButton } from "./BuyNowButton.mjs";
 import { CartCheckoutButton } from "./CartCheckoutButton.mjs";
 import { CartProvider, useCart } from "./CartProvider.mjs";
 import { ExternalVideo } from "./ExternalVideo.mjs";
@@ -18,6 +19,7 @@ import { useMoney } from "./useMoney.mjs";
 import { Video } from "./Video.mjs";
 export {
   AddToCartButton,
+  BuyNowButton,
   CartCheckoutButton,
   CartProvider,
   ExternalVideo,

package/dist/prod/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/types/BuyNowButton.d.ts

@@ -0,0 +1,15 @@
+import { BaseButtonProps } from './BaseButton.js';
+interface BuyNowButtonProps {
+    /** The item quantity. Defaults to 1. */
+    quantity?: number;
+    /** The ID of the variant. */
+    variantId: string;
+    /** An array of cart line attributes that belong to the item being added to the cart. */
+    attributes?: {
+        key: string;
+        value: string;
+    }[];
+}
+/** The `BuyNowButton` component renders a button that adds an item to the cart and redirects the customer to checkout. */
+export declare function BuyNowButton<AsType extends React.ElementType = 'button'>(props: BuyNowButtonProps & BaseButtonProps<AsType>): JSX.Element;
+export {};

package/dist/types/CartCheckoutButton.d.ts

@@ -1,10 +1,11 @@
 import { ReactNode } from 'react';
+import { BaseButtonProps } from './BaseButton.js';
 declare type PropsWeControl = 'onClick';
 /**
  * The `CartCheckoutButton` component renders a button that redirects to the checkout URL for the cart.
  * It must be a descendent of a `CartProvider` component.
  */
-export declare function CartCheckoutButton(props: Omit<JSX.IntrinsicElements['button'], PropsWeControl> & {
+export declare function CartCheckoutButton(props: Omit<BaseButtonProps<'button'>, PropsWeControl> & {
     /** A `ReactNode` element. */
     children: ReactNode;
 }): JSX.Element;

package/dist/types/index.d.cts

@@ -1,4 +1,5 @@
 export { AddToCartButton } from './AddToCartButton.js';
+export { BuyNowButton } from './BuyNowButton.js';
 export type { CartState, CartStatus, Cart, CartWithActions, CartAction, } from './cart-types.js';
 export { CartCheckoutButton } from './CartCheckoutButton.js';
 export { CartProvider, useCart } from './CartProvider.js';

package/dist/types/index.d.ts

@@ -1,4 +1,5 @@
 export { AddToCartButton } from './AddToCartButton.js';
+export { BuyNowButton } from './BuyNowButton.js';
 export type { CartState, CartStatus, Cart, CartWithActions, CartAction, } from './cart-types.js';
 export { CartCheckoutButton } from './CartCheckoutButton.js';
 export { CartProvider, useCart } from './CartProvider.js';

package/dist/umd/hydrogen-react.dev.js

@@ -766,7 +766,7 @@ query CartQuery($id: ID!, $numCartLines: Int = 250, $country: CountryCode = ZZ)
 ${cartFragment}
 `;
   const SFAPI_VERSION = "2022-10";
-  var _jsxFileName$e = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";
+  var _jsxFileName$f = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";
   const ShopifyContext = React.createContext({
     storeDomain: "test.myshopify.com",
     storefrontToken: "abc123",
@@ -797,7 +797,7 @@ ${cartFragment}
       value: finalConfig,
       __self: this,
       __source: {
-        fileName: _jsxFileName$e,
+        fileName: _jsxFileName$f,
         lineNumber: 49,
         columnNumber: 5
       }
@@ -1312,7 +1312,7 @@ ${cartFragment}
   function isCartFetchResultEvent(event) {
     return event.type === "RESOLVE" || event.type === "ERROR" || event.type === "CART_COMPLETED";
   }
-  var _jsxFileName$d = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/CartProvider.tsx";
+  var _jsxFileName$e = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/CartProvider.tsx";
   const CartContext = React.createContext(null);
   function useCart() {
     const context = React.useContext(CartContext);
@@ -1625,7 +1625,7 @@ ${cartFragment}
       value: cartContextValue,
       __self: this,
       __source: {
-        fileName: _jsxFileName$d,
+        fileName: _jsxFileName$e,
         lineNumber: 425,
         columnNumber: 5
       }
@@ -1791,7 +1791,7 @@ fragment ImageFragment on Image {
   height
 }
 `;
-  var _jsxFileName$c = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductProvider.tsx";
+  var _jsxFileName$d = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ProductProvider.tsx";
   const ProductOptionsContext = React.createContext(null);
   function ProductProvider({
     children,
@@ -1877,7 +1877,7 @@ fragment ImageFragment on Image {
       value,
       __self: this,
       __source: {
-        fileName: _jsxFileName$c,
+        fileName: _jsxFileName$d,
         lineNumber: 201,
         columnNumber: 5
       }
@@ -1950,7 +1950,7 @@ fragment ImageFragment on Image {
     }
     return true;
   }
-  var _jsxFileName$b = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/BaseButton.tsx";
+  var _jsxFileName$c = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/BaseButton.tsx";
   function BaseButton(props) {
     const {
       as,
@@ -1975,13 +1975,13 @@ fragment ImageFragment on Image {
       ...passthroughProps,
       __self: this,
       __source: {
-        fileName: _jsxFileName$b,
+        fileName: _jsxFileName$c,
         lineNumber: 59,
         columnNumber: 5
       }
     }, children);
   }
-  var _jsxFileName$a = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/AddToCartButton.tsx";
+  var _jsxFileName$b = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/AddToCartButton.tsx";
   function AddToCartButton(props) {
     var _a;
     const [addingItem, setAddingItem] = React.useState(false);
@@ -2025,7 +2025,7 @@ fragment ImageFragment on Image {
       defaultOnClick: handleAddItem,
       __self: this,
       __source: {
-        fileName: _jsxFileName$a,
+        fileName: _jsxFileName$b,
         lineNumber: 71,
         columnNumber: 7
       }
@@ -2045,12 +2045,55 @@ fragment ImageFragment on Image {
       "aria-live": "assertive",
       __self: this,
       __source: {
-        fileName: _jsxFileName$a,
+        fileName: _jsxFileName$b,
         lineNumber: 80,
         columnNumber: 9
       }
     }, addingItem ? accessibleAddingToCartLabel : null) : null);
   }
+  var _jsxFileName$a = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/BuyNowButton.tsx";
+  function BuyNowButton(props) {
+    const {
+      cartCreate,
+      checkoutUrl
+    } = useCart();
+    const [loading, setLoading] = React.useState(false);
+    const {
+      quantity,
+      variantId,
+      onClick,
+      attributes,
+      children,
+      ...passthroughProps
+    } = props;
+    React.useEffect(() => {
+      if (checkoutUrl) {
+        window.location.href = checkoutUrl;
+      }
+    }, [checkoutUrl]);
+    const handleBuyNow = React.useCallback(() => {
+      setLoading(true);
+      cartCreate({
+        lines: [{
+          quantity: quantity != null ? quantity : 1,
+          merchandiseId: variantId,
+          attributes
+        }]
+      });
+    }, [cartCreate, quantity, variantId, attributes]);
+    return /* @__PURE__ */ React__default.default.createElement(BaseButton, {
+      disabled: loading != null ? loading : passthroughProps.disabled,
+      ...passthroughProps,
+      onClick,
+      defaultOnClick: handleBuyNow,
+      __self: this,
+      __source: {
+        fileName: _jsxFileName$a,
+        lineNumber: 53,
+        columnNumber: 5
+      }
+    }, children);
+  }
   var _jsxFileName$9 = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/CartCheckoutButton.tsx";
   function CartCheckoutButton(props) {
     const [requestedCheckout, setRequestedCheckout] = React.useState(false);
@@ -2067,14 +2110,14 @@ fragment ImageFragment on Image {
         window.location.href = checkoutUrl;
       }
     }, [requestedCheckout, status, checkoutUrl]);
-    return /* @__PURE__ */ React__default.default.createElement("button", {
+    return /* @__PURE__ */ React__default.default.createElement(BaseButton, {
       ...passthroughProps,
       disabled: requestedCheckout || passthroughProps.disabled,
       onClick: () => setRequestedCheckout(true),
       __self: this,
       __source: {
         fileName: _jsxFileName$9,
-        lineNumber: 27,
+        lineNumber: 28,
         columnNumber: 5
       }
     }, children);
@@ -3386,6 +3429,7 @@ fragment ImageFragment on Image {
     };
   }
   exports2.AddToCartButton = AddToCartButton;
+  exports2.BuyNowButton = BuyNowButton;
   exports2.CartCheckoutButton = CartCheckoutButton;
   exports2.CartProvider = CartProvider;
   exports2.ExternalVideo = ExternalVideo;