@cimplify/sdk 0.9.7 → 0.9.9

package/dist/react.js

@@ -799,14 +799,6 @@ var CatalogueQueries = class {
   async getBundles() {
     return safe(this.client.get("/api/v1/catalogue/bundles"));
   }
-  async getBundle(id) {
-    const encodedId = encodeURIComponent(id);
-    return safe(this.client.get(`/api/v1/catalogue/bundles/${encodedId}`));
-  }
-  async getBundleBySlug(slug) {
-    const encodedSlug = encodeURIComponent(slug);
-    return safe(this.client.get(`/api/v1/catalogue/bundles/slug/${encodedSlug}`));
-  }
   async searchBundles(query, limit = 20) {
     const path = withQuery("/api/v1/catalogue/bundles", { search: query, limit });
     return safe(this.client.get(path));
@@ -815,18 +807,6 @@ var CatalogueQueries = class {
     const path = withQuery("/api/v1/catalogue/composites", { limit: options?.limit });
     return safe(this.client.get(path));
   }
-  async getComposite(id) {
-    const encodedId = encodeURIComponent(id);
-    return safe(this.client.get(`/api/v1/catalogue/composites/${encodedId}`));
-  }
-  async getCompositeByProductId(productId) {
-    const encodedId = encodeURIComponent(productId);
-    return safe(
-      this.client.get(
-        `/api/v1/catalogue/composites/by-product/${encodedId}`
-      )
-    );
-  }
   async calculateCompositePrice(compositeId, selections, locationId) {
     const encodedId = encodeURIComponent(compositeId);
     return safe(
@@ -6019,256 +5999,6 @@ function useCollection(idOrSlug, options = {}) {
   }, [cacheKey, load]);
   return { collection, products, isLoading, error, refetch };
 }
-var bundleCache = /* @__PURE__ */ new Map();
-var bundleInflight = /* @__PURE__ */ new Map();
-function isLikelySlug3(value) {
-  return /^[a-z0-9-]+$/.test(value);
-}
-function buildBundleCacheKey(client, locationId, idOrSlug) {
-  return JSON.stringify({
-    key: client.getPublicKey(),
-    location_id: locationId || "__none__",
-    bundle: idOrSlug
-  });
-}
-function useBundle(idOrSlug, options = {}) {
-  const context = useOptionalCimplify();
-  const client = options.client ?? context?.client;
-  if (!client) {
-    throw new Error("useBundle must be used within CimplifyProvider or passed { client }.");
-  }
-  const enabled = options.enabled ?? true;
-  const locationId = client.getLocationId();
-  const previousLocationIdRef = React3.useRef(locationId);
-  const requestIdRef = React3.useRef(0);
-  const normalizedIdOrSlug = React3.useMemo(() => (idOrSlug || "").trim(), [idOrSlug]);
-  const cacheKey = React3.useMemo(
-    () => buildBundleCacheKey(client, locationId, normalizedIdOrSlug),
-    [client, locationId, normalizedIdOrSlug]
-  );
-  const cached = bundleCache.get(cacheKey);
-  const [bundle, setBundle] = React3.useState(cached?.bundle ?? null);
-  const [isLoading, setIsLoading] = React3.useState(
-    enabled && normalizedIdOrSlug.length > 0 && !cached
-  );
-  const [error, setError] = React3.useState(null);
-  React3.useEffect(() => {
-    if (previousLocationIdRef.current !== locationId) {
-      bundleCache.clear();
-      bundleInflight.clear();
-      previousLocationIdRef.current = locationId;
-    }
-  }, [locationId]);
-  const load = React3.useCallback(
-    async (force = false) => {
-      if (!enabled || normalizedIdOrSlug.length === 0) {
-        setBundle(null);
-        setIsLoading(false);
-        return;
-      }
-      const nextRequestId = ++requestIdRef.current;
-      setError(null);
-      if (!force) {
-        const cacheEntry = bundleCache.get(cacheKey);
-        if (cacheEntry) {
-          setBundle(cacheEntry.bundle);
-          setIsLoading(false);
-          return;
-        }
-      }
-      setIsLoading(true);
-      try {
-        const existing = bundleInflight.get(cacheKey);
-        const promise = existing ?? (async () => {
-          const result = isLikelySlug3(normalizedIdOrSlug) ? await client.catalogue.getBundleBySlug(normalizedIdOrSlug) : await client.catalogue.getBundle(normalizedIdOrSlug);
-          if (!result.ok) {
-            throw result.error;
-          }
-          return result.value;
-        })();
-        if (!existing) {
-          bundleInflight.set(cacheKey, promise);
-          promise.finally(() => {
-            bundleInflight.delete(cacheKey);
-          }).catch(() => void 0);
-        }
-        const value = await promise;
-        bundleCache.set(cacheKey, { bundle: value });
-        if (nextRequestId === requestIdRef.current) {
-          setBundle(value);
-          setError(null);
-        }
-      } catch (loadError) {
-        if (nextRequestId === requestIdRef.current) {
-          setError(loadError);
-        }
-      } finally {
-        if (nextRequestId === requestIdRef.current) {
-          setIsLoading(false);
-        }
-      }
-    },
-    [cacheKey, client, enabled, normalizedIdOrSlug]
-  );
-  React3.useEffect(() => {
-    void load(false);
-  }, [load]);
-  const refetch = React3.useCallback(async () => {
-    bundleCache.delete(cacheKey);
-    await load(true);
-  }, [cacheKey, load]);
-  return { bundle, isLoading, error, refetch };
-}
-var compositeCache = /* @__PURE__ */ new Map();
-var compositeInflight = /* @__PURE__ */ new Map();
-function shouldFetchByProductId(idOrProductId, byProductId) {
-  if (typeof byProductId === "boolean") {
-    return byProductId;
-  }
-  return idOrProductId.startsWith("prod_");
-}
-function buildCompositeCacheKey(client, locationId, idOrProductId, byProductId) {
-  return JSON.stringify({
-    key: client.getPublicKey(),
-    location_id: locationId || "__none__",
-    composite: idOrProductId,
-    by_product_id: byProductId
-  });
-}
-function useComposite(idOrProductId, options = {}) {
-  const context = useOptionalCimplify();
-  const client = options.client ?? context?.client;
-  if (!client) {
-    throw new Error("useComposite must be used within CimplifyProvider or passed { client }.");
-  }
-  const enabled = options.enabled ?? true;
-  const locationId = client.getLocationId();
-  const previousLocationIdRef = React3.useRef(locationId);
-  const requestIdRef = React3.useRef(0);
-  const priceRequestIdRef = React3.useRef(0);
-  const normalizedIdOrProductId = React3.useMemo(
-    () => (idOrProductId || "").trim(),
-    [idOrProductId]
-  );
-  const byProductId = React3.useMemo(
-    () => shouldFetchByProductId(normalizedIdOrProductId, options.byProductId),
-    [normalizedIdOrProductId, options.byProductId]
-  );
-  const cacheKey = React3.useMemo(
-    () => buildCompositeCacheKey(client, locationId, normalizedIdOrProductId, byProductId),
-    [byProductId, client, locationId, normalizedIdOrProductId]
-  );
-  const cached = compositeCache.get(cacheKey);
-  const [composite, setComposite] = React3.useState(cached?.composite ?? null);
-  const [isLoading, setIsLoading] = React3.useState(
-    enabled && normalizedIdOrProductId.length > 0 && !cached
-  );
-  const [error, setError] = React3.useState(null);
-  const [priceResult, setPriceResult] = React3.useState(null);
-  const [isPriceLoading, setIsPriceLoading] = React3.useState(false);
-  React3.useEffect(() => {
-    if (previousLocationIdRef.current !== locationId) {
-      compositeCache.clear();
-      compositeInflight.clear();
-      previousLocationIdRef.current = locationId;
-    }
-  }, [locationId]);
-  const load = React3.useCallback(
-    async (force = false) => {
-      if (!enabled || normalizedIdOrProductId.length === 0) {
-        setComposite(null);
-        setPriceResult(null);
-        setIsLoading(false);
-        return;
-      }
-      const nextRequestId = ++requestIdRef.current;
-      setError(null);
-      if (!force) {
-        const cacheEntry = compositeCache.get(cacheKey);
-        if (cacheEntry) {
-          setComposite(cacheEntry.composite);
-          setIsLoading(false);
-          return;
-        }
-      }
-      setIsLoading(true);
-      try {
-        const existing = compositeInflight.get(cacheKey);
-        const promise = existing ?? (async () => {
-          const result = byProductId ? await client.catalogue.getCompositeByProductId(normalizedIdOrProductId) : await client.catalogue.getComposite(normalizedIdOrProductId);
-          if (!result.ok) {
-            throw result.error;
-          }
-          return result.value;
-        })();
-        if (!existing) {
-          compositeInflight.set(cacheKey, promise);
-          promise.finally(() => {
-            compositeInflight.delete(cacheKey);
-          }).catch(() => void 0);
-        }
-        const value = await promise;
-        compositeCache.set(cacheKey, { composite: value });
-        if (nextRequestId === requestIdRef.current) {
-          setComposite(value);
-          setPriceResult(null);
-          setError(null);
-        }
-      } catch (loadError) {
-        if (nextRequestId === requestIdRef.current) {
-          setError(loadError);
-        }
-      } finally {
-        if (nextRequestId === requestIdRef.current) {
-          setIsLoading(false);
-        }
-      }
-    },
-    [byProductId, cacheKey, client, enabled, normalizedIdOrProductId]
-  );
-  React3.useEffect(() => {
-    void load(false);
-  }, [load]);
-  const calculatePrice = React3.useCallback(
-    async (selections, overrideLocationId) => {
-      if (!composite) {
-        return null;
-      }
-      const nextRequestId = ++priceRequestIdRef.current;
-      setIsPriceLoading(true);
-      try {
-        const result = await client.catalogue.calculateCompositePrice(
-          composite.id,
-          selections,
-          overrideLocationId
-        );
-        if (!result.ok) {
-          throw result.error;
-        }
-        if (nextRequestId === priceRequestIdRef.current) {
-          setPriceResult(result.value);
-          setError(null);
-        }
-        return result.value;
-      } catch (loadError) {
-        if (nextRequestId === priceRequestIdRef.current) {
-          setError(loadError);
-        }
-        return null;
-      } finally {
-        if (nextRequestId === priceRequestIdRef.current) {
-          setIsPriceLoading(false);
-        }
-      }
-    },
-    [client, composite]
-  );
-  const refetch = React3.useCallback(async () => {
-    compositeCache.delete(cacheKey);
-    await load(true);
-  }, [cacheKey, load]);
-  return { composite, isLoading, error, refetch, calculatePrice, priceResult, isPriceLoading };
-}
 function useSearch(options = {}) {
   const context = useOptionalCimplify();
   const client = options.client ?? context?.client;
@@ -7022,15 +6752,122 @@ function AddOnSelector({
     ] }, addOn.id);
   }) });
 }
+function BundleSelector({
+  components,
+  bundlePrice,
+  discountValue,
+  onSelectionsChange,
+  onReady,
+  className
+}) {
+  const [variantChoices, setVariantChoices] = React3.useState({});
+  React3.useEffect(() => {
+    const defaults = {};
+    for (const comp of components) {
+      if (comp.variant_id) {
+        defaults[comp.id] = comp.variant_id;
+      } else if (comp.available_variants.length > 0) {
+        const defaultVariant = comp.available_variants.find((v) => v.is_default) || comp.available_variants[0];
+        if (defaultVariant) {
+          defaults[comp.id] = defaultVariant.id;
+        }
+      }
+    }
+    setVariantChoices(defaults);
+  }, [components]);
+  const selections = React3.useMemo(() => {
+    return components.map((comp) => ({
+      component_id: comp.id,
+      variant_id: variantChoices[comp.id],
+      quantity: comp.quantity
+    }));
+  }, [components, variantChoices]);
+  React3.useEffect(() => {
+    onSelectionsChange(selections);
+  }, [selections, onSelectionsChange]);
+  React3.useEffect(() => {
+    onReady?.(components.length > 0 && selections.length > 0);
+  }, [components, selections, onReady]);
+  const handleVariantChange = React3.useCallback(
+    (componentId, variantId) => {
+      setVariantChoices((prev) => ({ ...prev, [componentId]: variantId }));
+    },
+    []
+  );
+  if (components.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-selector": true, className, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { "data-cimplify-bundle-heading": true, children: "Included in this bundle" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-components": true, children: components.map((comp) => /* @__PURE__ */ jsxRuntime.jsx(
+      BundleComponentCard,
+      {
+        component: comp,
+        selectedVariantId: variantChoices[comp.id],
+        onVariantChange: (variantId) => handleVariantChange(comp.id, variantId)
+      },
+      comp.id
+    )) }),
+    bundlePrice && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-summary": true, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Bundle price" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: bundlePrice })
+    ] }),
+    discountValue && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-savings": true, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "You save" }),
+      /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: discountValue })
+    ] })
+  ] });
+}
+function BundleComponentCard({
+  component,
+  selectedVariantId,
+  onVariantChange
+}) {
+  const showVariantPicker = component.allow_variant_choice && component.available_variants.length > 1;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-component": true, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-component-header": true, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+      component.quantity > 1 && /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-bundle-component-qty": true, children: [
+        "\xD7",
+        component.quantity
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { "data-cimplify-bundle-component-name": true, children: component.product_name })
+    ] }) }),
+    showVariantPicker && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-variant-picker": true, children: component.available_variants.map((variant) => {
+      const isSelected = selectedVariantId === variant.id;
+      const adjustment = parsePrice(variant.price_adjustment);
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          type: "button",
+          "aria-selected": isSelected,
+          onClick: () => onVariantChange(variant.id),
+          "data-cimplify-bundle-variant-option": true,
+          "data-selected": isSelected || void 0,
+          children: [
+            variant.display_name,
+            adjustment !== 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-bundle-variant-adjustment": true, children: [
+              adjustment > 0 ? "+" : "",
+              /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: variant.price_adjustment })
+            ] })
+          ]
+        },
+        variant.id
+      );
+    }) })
+  ] });
+}
 function CompositeSelector({
-  productId,
+  compositeId,
+  groups,
   onSelectionsChange,
   onPriceChange,
   onReady,
   className
 }) {
-  const { composite, isLoading, error, calculatePrice, priceResult, isPriceLoading } = useComposite(productId);
+  const { client } = useCimplify();
   const [groupSelections, setGroupSelections] = React3.useState({});
+  const [priceResult, setPriceResult] = React3.useState(null);
+  const [isPriceLoading, setIsPriceLoading] = React3.useState(false);
   const selections = React3.useMemo(() => {
     const result = [];
     for (const groupSels of Object.values(groupSelections)) {
@@ -7049,22 +6886,32 @@ function CompositeSelector({
     onPriceChange?.(priceResult);
   }, [priceResult, onPriceChange]);
   const allGroupsSatisfied = React3.useMemo(() => {
-    if (!composite) return false;
-    for (const group of composite.groups) {
+    for (const group of groups) {
       const groupSels = groupSelections[group.id] || {};
       const totalSelected = Object.values(groupSels).reduce((sum, q) => sum + q, 0);
       if (totalSelected < group.min_selections) return false;
     }
     return true;
-  }, [composite, groupSelections]);
+  }, [groups, groupSelections]);
   React3.useEffect(() => {
     onReady?.(allGroupsSatisfied);
   }, [allGroupsSatisfied, onReady]);
   React3.useEffect(() => {
-    if (allGroupsSatisfied && selections.length > 0) {
-      void calculatePrice(selections);
-    }
-  }, [selections, allGroupsSatisfied, calculatePrice]);
+    if (!allGroupsSatisfied || selections.length === 0) return;
+    let cancelled = false;
+    setIsPriceLoading(true);
+    void client.catalogue.calculateCompositePrice(compositeId, selections).then((result) => {
+      if (cancelled) return;
+      if (result.ok) {
+        setPriceResult(result.value);
+      }
+    }).finally(() => {
+      if (!cancelled) setIsPriceLoading(false);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [selections, allGroupsSatisfied, compositeId, client]);
   const toggleComponent = React3.useCallback(
     (group, component) => {
       setGroupSelections((prev) => {
@@ -7112,14 +6959,11 @@ function CompositeSelector({
     },
     []
   );
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-composite-selector": true, "data-loading": true, className, children: "Loading options..." });
-  }
-  if (error || !composite) {
+  if (groups.length === 0) {
     return null;
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-composite-selector": true, className, children: [
-    composite.groups.sort((a, b) => a.display_order - b.display_order).map((group) => {
+    [...groups].sort((a, b) => a.display_order - b.display_order).map((group) => {
       const groupSels = groupSelections[group.id] || {};
       const totalSelected = Object.values(groupSels).reduce((sum, q) => sum + q, 0);
       const minMet = totalSelected >= group.min_selections;
@@ -7139,7 +6983,7 @@ function CompositeSelector({
         /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-composite-components": true, children: group.components.filter((c) => c.is_available && !c.is_archived).sort((a, b) => a.display_order - b.display_order).map((component) => {
           const qty = groupSels[component.id] || 0;
           const isSelected = qty > 0;
-          const displayName = component.display_name || component.product_id || component.id;
+          const displayName = component.display_name || component.id;
           return /* @__PURE__ */ jsxRuntime.jsxs(
             "button",
             {
@@ -7213,118 +7057,6 @@ function CompositeSelector({
     isPriceLoading && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-composite-calculating": true, children: "Calculating price..." })
   ] });
 }
-function BundleSelector({
-  bundleIdOrSlug,
-  onSelectionsChange,
-  onReady,
-  className
-}) {
-  const { bundle, isLoading, error } = useBundle(bundleIdOrSlug);
-  const [variantChoices, setVariantChoices] = React3.useState({});
-  React3.useEffect(() => {
-    if (!bundle) return;
-    const defaults = {};
-    for (const comp of bundle.components) {
-      if (comp.component.variant_id) {
-        defaults[comp.component.id] = comp.component.variant_id;
-      } else if (comp.variants.length > 0) {
-        const defaultVariant = comp.variants.find((v) => v.is_default) || comp.variants[0];
-        if (defaultVariant) {
-          defaults[comp.component.id] = defaultVariant.id;
-        }
-      }
-    }
-    setVariantChoices(defaults);
-  }, [bundle]);
-  const selections = React3.useMemo(() => {
-    if (!bundle) return [];
-    return bundle.components.map((comp) => ({
-      component_id: comp.component.id,
-      variant_id: variantChoices[comp.component.id],
-      quantity: comp.component.quantity
-    }));
-  }, [bundle, variantChoices]);
-  React3.useEffect(() => {
-    onSelectionsChange(selections);
-  }, [selections, onSelectionsChange]);
-  React3.useEffect(() => {
-    onReady?.(bundle != null && selections.length > 0);
-  }, [bundle, selections, onReady]);
-  const handleVariantChange = React3.useCallback(
-    (componentId, variantId) => {
-      setVariantChoices((prev) => ({ ...prev, [componentId]: variantId }));
-    },
-    []
-  );
-  if (isLoading) {
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-selector": true, "data-loading": true, className, children: "Loading bundle..." });
-  }
-  if (error || !bundle) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-selector": true, className, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { "data-cimplify-bundle-heading": true, children: "Included in this bundle" }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-components": true, children: bundle.components.map((comp) => /* @__PURE__ */ jsxRuntime.jsx(
-      BundleComponentCard,
-      {
-        data: comp,
-        selectedVariantId: variantChoices[comp.component.id],
-        onVariantChange: (variantId) => handleVariantChange(comp.component.id, variantId)
-      },
-      comp.component.id
-    )) }),
-    bundle.bundle_price && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-summary": true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Bundle price" }),
-      /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: bundle.bundle_price })
-    ] }),
-    bundle.discount_value && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-savings": true, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("span", { children: "You save" }),
-      /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: bundle.discount_value })
-    ] })
-  ] });
-}
-function BundleComponentCard({
-  data,
-  selectedVariantId,
-  onVariantChange
-}) {
-  const { component, product, variants } = data;
-  const showVariantPicker = component.allow_variant_choice && variants.length > 1;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-component": true, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-bundle-component-header": true, children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        component.quantity > 1 && /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-bundle-component-qty": true, children: [
-          "\xD7",
-          component.quantity
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { "data-cimplify-bundle-component-name": true, children: product.name })
-      ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: product.default_price })
-    ] }),
-    showVariantPicker && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-bundle-variant-picker": true, children: variants.map((variant) => {
-      const isSelected = selectedVariantId === variant.id;
-      const adjustment = parsePrice(variant.price_adjustment);
-      return /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          type: "button",
-          "aria-selected": isSelected,
-          onClick: () => onVariantChange(variant.id),
-          "data-cimplify-bundle-variant-option": true,
-          "data-selected": isSelected || void 0,
-          children: [
-            getVariantDisplayName(variant, product.name),
-            adjustment !== 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-bundle-variant-adjustment": true, children: [
-              adjustment > 0 ? "+" : "",
-              /* @__PURE__ */ jsxRuntime.jsx(Price, { amount: variant.price_adjustment })
-            ] })
-          ]
-        },
-        variant.id
-      );
-    }) })
-  ] });
-}
 function ProductCustomizer({
   product,
   onAddToCart,
@@ -7472,19 +7204,22 @@ function ProductCustomizer({
     }
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-customizer": true, className, children: [
-    isComposite && /* @__PURE__ */ jsxRuntime.jsx(
+    isComposite && product.groups && product.composite_id && /* @__PURE__ */ jsxRuntime.jsx(
       CompositeSelector,
       {
-        productId: product.id,
+        compositeId: product.composite_id,
+        groups: product.groups,
         onSelectionsChange: setCompositeSelections,
         onPriceChange: setCompositePrice,
         onReady: setCompositeReady
       }
     ),
-    isBundle && /* @__PURE__ */ jsxRuntime.jsx(
+    isBundle && product.components && /* @__PURE__ */ jsxRuntime.jsx(
       BundleSelector,
       {
-        bundleIdOrSlug: product.slug,
+        components: product.components,
+        bundlePrice: product.bundle_price,
+        discountValue: product.discount_value,
         onSelectionsChange: setBundleSelections,
         onReady: setBundleReady
       }
@@ -7728,14 +7463,12 @@ exports.QuantitySelector = QuantitySelector;
 exports.VariantSelector = VariantSelector;
 exports.getVariantDisplayName = getVariantDisplayName;
 exports.useAds = useAds;
-exports.useBundle = useBundle;
 exports.useCart = useCart;
 exports.useCategories = useCategories;
 exports.useCheckout = useCheckout;
 exports.useCimplify = useCimplify;
 exports.useCollection = useCollection;
 exports.useCollections = useCollections;
-exports.useComposite = useComposite;
 exports.useElements = useElements;
 exports.useElementsReady = useElementsReady;
 exports.useLocations = useLocations;