@lime-bundles/react 0.1.0

package/dist/index.js

@@ -0,0 +1,677 @@
+// src/components/FixedBundle.tsx
+import { useCallback as useCallback3 } from "react";
+import { formatMoney, calculateDiscount } from "@lime-bundles/core";
+
+// src/hooks/useBundleData.ts
+import { useState, useEffect, useRef } from "react";
+import {
+  createStorefrontClient,
+  BUNDLE_METAOBJECT_QUERY,
+  parseMetaobjectBundle
+} from "@lime-bundles/core";
+function useBundleData(options) {
+  const [bundle, setBundle] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const abortRef = useRef(null);
+  useEffect(() => {
+    abortRef.current?.abort();
+    const controller = new AbortController();
+    abortRef.current = controller;
+    setLoading(true);
+    setError(null);
+    const client = createStorefrontClient({
+      shopDomain: options.shopDomain,
+      accessToken: options.storefrontAccessToken
+    });
+    client.query(BUNDLE_METAOBJECT_QUERY, {
+      id: options.bundleGid
+    }).then((data) => {
+      if (controller.signal.aborted) return;
+      if (!data.metaobject) {
+        setError("Bundle not found");
+        setBundle(null);
+      } else {
+        const parsed = parseMetaobjectBundle(
+          data.metaobject.id,
+          data.metaobject.fields
+        );
+        if (parsed) {
+          setBundle(parsed);
+        } else {
+          setError("Bundle is not active or has expired");
+          setBundle(null);
+        }
+      }
+      setLoading(false);
+    }).catch((err) => {
+      if (controller.signal.aborted) return;
+      setError(err instanceof Error ? err.message : "Failed to load bundle");
+      setLoading(false);
+    });
+    return () => {
+      controller.abort();
+    };
+  }, [options.shopDomain, options.storefrontAccessToken, options.bundleGid]);
+  return { bundle, loading, error };
+}
+
+// src/hooks/useCart.ts
+import { useState as useState2, useCallback, useMemo } from "react";
+import {
+  detectCartApi,
+  createAjaxCartApi,
+  createStorefrontCartApi,
+  createStorefrontClient as createStorefrontClient2
+} from "@lime-bundles/core";
+function useCart(options) {
+  const [loading, setLoading] = useState2(false);
+  const [error, setError] = useState2(null);
+  const [lastResult, setLastResult] = useState2(null);
+  const cart = useMemo(() => {
+    const apiType = options.cartApi ?? detectCartApi();
+    if (apiType === "ajax") {
+      return createAjaxCartApi(options.bundleGid, options.bundleType);
+    }
+    const client = createStorefrontClient2({
+      shopDomain: options.shopDomain,
+      accessToken: options.storefrontAccessToken
+    });
+    return createStorefrontCartApi(
+      client,
+      options.bundleGid,
+      options.bundleType,
+      options.cartId
+    );
+  }, [
+    options.shopDomain,
+    options.storefrontAccessToken,
+    options.bundleGid,
+    options.bundleType,
+    options.cartId,
+    options.cartApi
+  ]);
+  const addToCart = useCallback(
+    async (items) => {
+      setLoading(true);
+      setError(null);
+      try {
+        const result = await cart.addLines(items);
+        setLastResult(result);
+        if (!result.success) {
+          setError(result.error ?? "Failed to add to cart");
+        }
+        return result;
+      } catch (err) {
+        const message = err instanceof Error ? err.message : "Failed to add to cart";
+        setError(message);
+        const result = { success: false, error: message };
+        setLastResult(result);
+        return result;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [cart]
+  );
+  return { addToCart, loading, error, lastResult };
+}
+
+// src/hooks/useAnalytics.ts
+import { useEffect as useEffect2, useMemo as useMemo2, useRef as useRef2, useCallback as useCallback2, useState as useState3 } from "react";
+import {
+  reportImpression,
+  reportAddToCart,
+  observeImpression
+} from "@lime-bundles/core";
+function useAnalytics(options) {
+  const impressionFiredRef = useRef2(false);
+  const [element, setElement] = useState3(null);
+  const elementRef = useCallback2((el) => {
+    setElement(el);
+  }, []);
+  const config = useMemo2(
+    () => ({ shopDomain: options.shopDomain, appUrl: options.appUrl }),
+    [options.shopDomain, options.appUrl]
+  );
+  useEffect2(() => {
+    impressionFiredRef.current = false;
+  }, [options.bundleGid, options.abVariant]);
+  useEffect2(() => {
+    if (options.enabled === false) return;
+    if (impressionFiredRef.current) return;
+    if (!element) return;
+    const cleanup = observeImpression(element, () => {
+      if (impressionFiredRef.current) return;
+      impressionFiredRef.current = true;
+      reportImpression(config, {
+        bundleGid: options.bundleGid,
+        bundleType: options.bundleType,
+        abTestId: options.abTestId,
+        abVariant: options.abVariant
+      });
+    });
+    return cleanup;
+  }, [
+    element,
+    config,
+    options.enabled,
+    options.bundleGid,
+    options.bundleType,
+    options.abTestId,
+    options.abVariant
+  ]);
+  const trackAddToCart = useCallback2(
+    (event) => {
+      if (options.enabled === false) return;
+      reportAddToCart(config, {
+        bundleGid: options.bundleGid,
+        bundleType: options.bundleType,
+        productId: event.productId,
+        quantity: event.quantity,
+        totalPrice: event.totalPrice,
+        abTestId: options.abTestId,
+        abVariant: options.abVariant
+      });
+    },
+    [
+      config,
+      options.enabled,
+      options.bundleGid,
+      options.bundleType,
+      options.abTestId,
+      options.abVariant
+    ]
+  );
+  return { elementRef, trackAddToCart };
+}
+
+// src/components/FixedBundle.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function FixedBundle(props) {
+  const {
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    cartId,
+    cartApi,
+    appUrl,
+    analyticsEnabled,
+    onAddToCart,
+    onError,
+    className
+  } = props;
+  const { bundle, loading, error: loadError } = useBundleData({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid
+  });
+  const { addToCart, loading: cartLoading, error: cartError } = useCart({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    bundleType: "fixed",
+    cartId,
+    cartApi
+  });
+  const { elementRef, trackAddToCart } = useAnalytics({
+    shopDomain,
+    appUrl: appUrl ?? `https://${shopDomain}`,
+    bundleGid,
+    bundleType: "fixed",
+    enabled: analyticsEnabled !== false
+  });
+  const handleAddToCart = useCallback3(async () => {
+    if (!bundle) return;
+    const items = bundle.products.filter((p) => p.variants.nodes.some((v) => v.availableForSale)).map((p) => {
+      const variant = p.variants.nodes.find((v) => v.availableForSale);
+      return { variantId: variant.id, quantity: 1 };
+    });
+    if (items.length === 0) return;
+    const result = await addToCart(items);
+    if (result.success) {
+      const totalPrice = bundle.products.reduce((sum, p) => {
+        const price = parseFloat(p.priceRange.minVariantPrice.amount);
+        return sum + calculateDiscount(price, bundle.discountConfig.discountType, bundle.discountConfig.discountValue);
+      }, 0);
+      trackAddToCart({
+        productId: bundle.products[0]?.id ?? "",
+        quantity: 1,
+        totalPrice: Math.round(totalPrice * 100) / 100
+      });
+      onAddToCart?.(items);
+    }
+  }, [bundle, addToCart, trackAddToCart, onAddToCart]);
+  if (loading) {
+    return /* @__PURE__ */ jsxs("div", { className: `lb-bundle lb-bundle--loading ${className ?? ""}`, children: [
+      /* @__PURE__ */ jsx("div", { className: "lb-skeleton lb-skeleton--title" }),
+      /* @__PURE__ */ jsx("div", { className: "lb-skeleton lb-skeleton--products" })
+    ] });
+  }
+  if (loadError || !bundle) {
+    if (onError) onError(loadError ?? "Bundle not found");
+    return null;
+  }
+  const currency = bundle.products[0]?.priceRange.minVariantPrice.currencyCode ?? "USD";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: elementRef,
+      className: `lb-bundle lb-bundle--fixed ${className ?? ""}`,
+      role: "region",
+      "aria-label": bundle.title,
+      children: [
+        /* @__PURE__ */ jsx("h3", { className: "lb-bundle__title", children: bundle.title }),
+        bundle.discountLabel && /* @__PURE__ */ jsx("span", { className: "lb-bundle__discount-badge", children: bundle.discountLabel }),
+        /* @__PURE__ */ jsx("div", { className: "lb-bundle__products", children: bundle.products.map((product) => /* @__PURE__ */ jsxs("div", { className: "lb-bundle__product", part: "product", children: [
+          product.featuredImage && /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: product.featuredImage.url,
+              alt: product.featuredImage.altText ?? product.title,
+              className: "lb-bundle__product-image",
+              loading: "lazy"
+            }
+          ),
+          /* @__PURE__ */ jsxs("div", { className: "lb-bundle__product-info", children: [
+            /* @__PURE__ */ jsx("p", { className: "lb-bundle__product-title", children: product.title }),
+            /* @__PURE__ */ jsx("p", { className: "lb-bundle__product-price", children: formatMoney(product.priceRange.minVariantPrice.amount, currency) })
+          ] })
+        ] }, product.id)) }),
+        cartError && /* @__PURE__ */ jsx("p", { className: "lb-bundle__error", role: "alert", children: cartError }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            className: "lb-bundle__cta",
+            onClick: handleAddToCart,
+            disabled: cartLoading,
+            "aria-busy": cartLoading,
+            children: cartLoading ? "Adding..." : bundle.widgetConfig.ctaText ?? "Add Bundle to Cart"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/MixMatchBundle.tsx
+import { useState as useState4, useCallback as useCallback4 } from "react";
+import {
+  formatMoney as formatMoney2,
+  validateQuantity
+} from "@lime-bundles/core";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function MixMatchBundle(props) {
+  const {
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    cartId,
+    cartApi,
+    appUrl,
+    analyticsEnabled,
+    onAddToCart,
+    onError,
+    className
+  } = props;
+  const { bundle, loading, error: loadError } = useBundleData({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid
+  });
+  const { addToCart, loading: cartLoading, error: cartError } = useCart({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    bundleType: "mix_match",
+    cartId,
+    cartApi
+  });
+  const { elementRef, trackAddToCart } = useAnalytics({
+    shopDomain,
+    appUrl: appUrl ?? `https://${shopDomain}`,
+    bundleGid,
+    bundleType: "mix_match",
+    enabled: analyticsEnabled !== false
+  });
+  const [selections, setSelections] = useState4(/* @__PURE__ */ new Map());
+  const totalQuantity = Array.from(selections.values()).reduce(
+    (sum, s) => sum + s.quantity,
+    0
+  );
+  const validation = bundle ? validateQuantity(totalQuantity, bundle.minQuantity, bundle.maxQuantity) : { valid: false, totalQuantity: 0, message: null };
+  const toggleProduct = useCallback4(
+    (productId, variant) => {
+      setSelections((prev) => {
+        const next = new Map(prev);
+        const key = `${productId}:${variant.id}`;
+        if (next.has(key)) {
+          next.delete(key);
+        } else {
+          next.set(key, { productId, variantId: variant.id, quantity: 1 });
+        }
+        return next;
+      });
+    },
+    []
+  );
+  const updateQuantity = useCallback4(
+    (productId, variantId, quantity) => {
+      setSelections((prev) => {
+        const next = new Map(prev);
+        const key = `${productId}:${variantId}`;
+        if (quantity <= 0) {
+          next.delete(key);
+        } else {
+          next.set(key, { productId, variantId, quantity });
+        }
+        return next;
+      });
+    },
+    []
+  );
+  const handleAddToCart = useCallback4(async () => {
+    if (!bundle || !validation.valid) return;
+    const items = Array.from(selections.values()).map((s) => ({
+      variantId: s.variantId,
+      quantity: s.quantity
+    }));
+    const result = await addToCart(items);
+    if (result.success) {
+      const totalPrice = items.reduce((sum, item) => {
+        const product = bundle.products.find(
+          (p) => p.variants.nodes.some((v) => v.id === item.variantId)
+        );
+        const variant = product?.variants.nodes.find(
+          (v) => v.id === item.variantId
+        );
+        return sum + parseFloat(variant?.price.amount ?? "0") * item.quantity;
+      }, 0);
+      trackAddToCart({
+        productId: bundle.products[0]?.id ?? "",
+        quantity: totalQuantity,
+        totalPrice: Math.round(totalPrice * 100) / 100
+      });
+      onAddToCart?.(items);
+      setSelections(/* @__PURE__ */ new Map());
+    }
+  }, [bundle, selections, validation.valid, addToCart, trackAddToCart, totalQuantity, onAddToCart]);
+  if (loading) {
+    return /* @__PURE__ */ jsxs2("div", { className: `lb-bundle lb-bundle--loading ${className ?? ""}`, children: [
+      /* @__PURE__ */ jsx2("div", { className: "lb-skeleton lb-skeleton--title" }),
+      /* @__PURE__ */ jsx2("div", { className: "lb-skeleton lb-skeleton--products" })
+    ] });
+  }
+  if (loadError || !bundle) {
+    if (onError) onError(loadError ?? "Bundle not found");
+    return null;
+  }
+  const currency = bundle.products[0]?.priceRange.minVariantPrice.currencyCode ?? "USD";
+  return /* @__PURE__ */ jsxs2(
+    "div",
+    {
+      ref: elementRef,
+      className: `lb-bundle lb-bundle--mix-match ${className ?? ""}`,
+      role: "region",
+      "aria-label": bundle.title,
+      children: [
+        /* @__PURE__ */ jsx2("h3", { className: "lb-bundle__title", children: bundle.title }),
+        bundle.discountLabel && /* @__PURE__ */ jsx2("span", { className: "lb-bundle__discount-badge", children: bundle.discountLabel }),
+        /* @__PURE__ */ jsx2("p", { className: "lb-bundle__instructions", children: bundle.minQuantity && bundle.maxQuantity ? `Select ${bundle.minQuantity}\u2013${bundle.maxQuantity} items` : bundle.minQuantity ? `Select at least ${bundle.minQuantity} items` : bundle.maxQuantity ? `Select up to ${bundle.maxQuantity} items` : "Select your items" }),
+        /* @__PURE__ */ jsx2("div", { className: "lb-bundle__products lb-bundle__products--selectable", children: bundle.products.map((product) => {
+          const defaultVariant = product.variants.nodes.find((v) => v.availableForSale) ?? product.variants.nodes[0];
+          if (!defaultVariant) return null;
+          const key = `${product.id}:${defaultVariant.id}`;
+          const selected = selections.get(key);
+          return /* @__PURE__ */ jsxs2(
+            "div",
+            {
+              className: `lb-bundle__product lb-bundle__product--selectable ${selected ? "lb-bundle__product--selected" : ""}`,
+              children: [
+                product.featuredImage && /* @__PURE__ */ jsx2(
+                  "img",
+                  {
+                    src: product.featuredImage.url,
+                    alt: product.featuredImage.altText ?? product.title,
+                    className: "lb-bundle__product-image",
+                    loading: "lazy"
+                  }
+                ),
+                /* @__PURE__ */ jsxs2("div", { className: "lb-bundle__product-info", children: [
+                  /* @__PURE__ */ jsx2("p", { className: "lb-bundle__product-title", children: product.title }),
+                  /* @__PURE__ */ jsx2("p", { className: "lb-bundle__product-price", children: formatMoney2(defaultVariant.price.amount, currency) })
+                ] }),
+                /* @__PURE__ */ jsx2("div", { className: "lb-bundle__product-actions", children: selected ? /* @__PURE__ */ jsxs2("div", { className: "lb-bundle__quantity-control", children: [
+                  /* @__PURE__ */ jsx2(
+                    "button",
+                    {
+                      "aria-label": `Decrease ${product.title}`,
+                      onClick: () => updateQuantity(product.id, defaultVariant.id, selected.quantity - 1),
+                      children: "\u2212"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx2("span", { children: selected.quantity }),
+                  /* @__PURE__ */ jsx2(
+                    "button",
+                    {
+                      "aria-label": `Increase ${product.title}`,
+                      onClick: () => updateQuantity(product.id, defaultVariant.id, selected.quantity + 1),
+                      children: "+"
+                    }
+                  )
+                ] }) : /* @__PURE__ */ jsx2(
+                  "button",
+                  {
+                    className: "lb-bundle__select-btn",
+                    onClick: () => toggleProduct(product.id, defaultVariant),
+                    disabled: !defaultVariant.availableForSale,
+                    children: defaultVariant.availableForSale ? "Select" : "Sold out"
+                  }
+                ) })
+              ]
+            },
+            product.id
+          );
+        }) }),
+        validation.message && /* @__PURE__ */ jsx2("p", { className: "lb-bundle__validation", role: "status", children: validation.message }),
+        cartError && /* @__PURE__ */ jsx2("p", { className: "lb-bundle__error", role: "alert", children: cartError }),
+        /* @__PURE__ */ jsx2(
+          "button",
+          {
+            className: "lb-bundle__cta",
+            onClick: handleAddToCart,
+            disabled: cartLoading || !validation.valid,
+            "aria-busy": cartLoading,
+            children: cartLoading ? "Adding..." : bundle.widgetConfig.ctaText ?? `Add ${totalQuantity} Items to Cart`
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/VolumeBundle.tsx
+import { useState as useState5, useCallback as useCallback5 } from "react";
+import {
+  formatMoney as formatMoney3,
+  calculateTierSavings,
+  getActiveTier
+} from "@lime-bundles/core";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function VolumeBundle(props) {
+  const {
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    cartId,
+    cartApi,
+    appUrl,
+    analyticsEnabled,
+    onAddToCart,
+    onError,
+    className
+  } = props;
+  const { bundle, loading, error: loadError } = useBundleData({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid
+  });
+  const { addToCart, loading: cartLoading, error: cartError } = useCart({
+    shopDomain,
+    storefrontAccessToken,
+    bundleGid,
+    bundleType: "volume",
+    cartId,
+    cartApi
+  });
+  const { elementRef, trackAddToCart } = useAnalytics({
+    shopDomain,
+    appUrl: appUrl ?? `https://${shopDomain}`,
+    bundleGid,
+    bundleType: "volume",
+    enabled: analyticsEnabled !== false
+  });
+  const [quantity, setQuantity] = useState5(1);
+  const product = bundle?.products[0];
+  const basePrice = product ? parseFloat(product.priceRange.minVariantPrice.amount) : 0;
+  const currency = product?.priceRange.minVariantPrice.currencyCode ?? "USD";
+  const tierSavings = bundle ? calculateTierSavings(bundle.volumeTiers, basePrice, quantity) : [];
+  const activeTier = bundle ? getActiveTier(bundle.volumeTiers, quantity) : null;
+  const handleAddToCart = useCallback5(async () => {
+    if (!bundle || !product) return;
+    const variant = product.variants.nodes.find((v) => v.availableForSale);
+    if (!variant) return;
+    const items = [
+      { variantId: variant.id, quantity }
+    ];
+    const result = await addToCart(items);
+    if (result.success) {
+      const unitPrice = activeTier ? basePrice * (1 - activeTier.discountValue / 100) : basePrice;
+      trackAddToCart({
+        productId: product.id,
+        quantity,
+        totalPrice: Math.round(unitPrice * quantity * 100) / 100
+      });
+      onAddToCart?.(items);
+    }
+  }, [bundle, product, quantity, activeTier, basePrice, addToCart, trackAddToCart, onAddToCart]);
+  if (loading) {
+    return /* @__PURE__ */ jsxs3("div", { className: `lb-bundle lb-bundle--loading ${className ?? ""}`, children: [
+      /* @__PURE__ */ jsx3("div", { className: "lb-skeleton lb-skeleton--title" }),
+      /* @__PURE__ */ jsx3("div", { className: "lb-skeleton lb-skeleton--tiers" })
+    ] });
+  }
+  if (loadError || !bundle || !product) {
+    if (onError) onError(loadError ?? "Bundle not found");
+    return null;
+  }
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      ref: elementRef,
+      className: `lb-bundle lb-bundle--volume ${className ?? ""}`,
+      role: "region",
+      "aria-label": bundle.title,
+      children: [
+        /* @__PURE__ */ jsx3("h3", { className: "lb-bundle__title", children: bundle.title }),
+        /* @__PURE__ */ jsxs3("div", { className: "lb-bundle__product lb-bundle__product--volume", children: [
+          product.featuredImage && /* @__PURE__ */ jsx3(
+            "img",
+            {
+              src: product.featuredImage.url,
+              alt: product.featuredImage.altText ?? product.title,
+              className: "lb-bundle__product-image",
+              loading: "lazy"
+            }
+          ),
+          /* @__PURE__ */ jsxs3("div", { className: "lb-bundle__product-info", children: [
+            /* @__PURE__ */ jsx3("p", { className: "lb-bundle__product-title", children: product.title }),
+            /* @__PURE__ */ jsxs3("p", { className: "lb-bundle__product-price", children: [
+              formatMoney3(basePrice, currency),
+              " each"
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx3("div", { className: "lb-bundle__tiers", role: "table", "aria-label": "Volume discounts", children: tierSavings.map((ts) => /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            className: `lb-bundle__tier ${ts.isActive ? "lb-bundle__tier--active" : ""}`,
+            role: "row",
+            children: [
+              /* @__PURE__ */ jsxs3("span", { className: "lb-bundle__tier-quantity", role: "cell", children: [
+                ts.tier.minQuantity,
+                "+ items"
+              ] }),
+              /* @__PURE__ */ jsxs3("span", { className: "lb-bundle__tier-price", role: "cell", children: [
+                formatMoney3(ts.unitPrice, currency),
+                " each"
+              ] }),
+              /* @__PURE__ */ jsxs3("span", { className: "lb-bundle__tier-savings", role: "cell", children: [
+                "Save ",
+                ts.savingsPercent.toFixed(0),
+                "%"
+              ] }),
+              ts.tier.label && /* @__PURE__ */ jsx3("span", { className: "lb-bundle__tier-label", role: "cell", children: ts.tier.label })
+            ]
+          },
+          ts.tier.minQuantity
+        )) }),
+        /* @__PURE__ */ jsxs3("div", { className: "lb-bundle__quantity-selector", children: [
+          /* @__PURE__ */ jsx3("label", { htmlFor: `lb-qty-${bundle.id}`, children: "Quantity" }),
+          /* @__PURE__ */ jsxs3("div", { className: "lb-bundle__quantity-control", children: [
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                "aria-label": "Decrease quantity",
+                onClick: () => setQuantity((q) => Math.max(1, q - 1)),
+                children: "\u2212"
+              }
+            ),
+            /* @__PURE__ */ jsx3(
+              "input",
+              {
+                id: `lb-qty-${bundle.id}`,
+                type: "number",
+                min: 1,
+                value: quantity,
+                onChange: (e) => {
+                  const val = parseInt(e.target.value, 10);
+                  if (!isNaN(val) && val > 0) setQuantity(val);
+                },
+                className: "lb-bundle__quantity-input"
+              }
+            ),
+            /* @__PURE__ */ jsx3(
+              "button",
+              {
+                "aria-label": "Increase quantity",
+                onClick: () => setQuantity((q) => q + 1),
+                children: "+"
+              }
+            )
+          ] })
+        ] }),
+        cartError && /* @__PURE__ */ jsx3("p", { className: "lb-bundle__error", role: "alert", children: cartError }),
+        /* @__PURE__ */ jsx3(
+          "button",
+          {
+            className: "lb-bundle__cta",
+            onClick: handleAddToCart,
+            disabled: cartLoading,
+            "aria-busy": cartLoading,
+            children: cartLoading ? "Adding..." : bundle.widgetConfig.ctaText ?? `Add ${quantity} to Cart`
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  FixedBundle,
+  MixMatchBundle,
+  VolumeBundle,
+  useAnalytics,
+  useBundleData,
+  useCart
+};
+//# sourceMappingURL=index.js.map