@behio/storefront-sdk 2.9.0 → 2.10.0

package/dist/react.d.mts

@@ -4153,6 +4153,13 @@ declare function useCart(options?: UseCartOptions): {
     updateQuantity: (itemId: string, quantity: number) => Promise<Cart>;
     removeItem: (itemId: string) => Promise<Cart>;
     clear: () => Promise<void>;
+    addBundle: (bundle: string | {
+        id: string;
+    } | {
+        slug: string;
+    }, quantity?: number) => Promise<Cart>;
+    updateBundleQuantity: (lineId: string, quantity: number) => Promise<Cart>;
+    removeBundle: (lineId: string) => Promise<Cart>;
     applyDiscount: (code: string) => Promise<Cart>;
     removeDiscount: () => Promise<Cart>;
     merge: () => Promise<Cart>;
@@ -4161,6 +4168,7 @@ declare function useCart(options?: UseCartOptions): {
     isAdding: boolean;
     isUpdating: boolean;
     isRemoving: boolean;
+    isUpdatingBundle: boolean;
 };
 
 interface UseCartCountOptions {

package/dist/react.d.ts

@@ -4153,6 +4153,13 @@ declare function useCart(options?: UseCartOptions): {
     updateQuantity: (itemId: string, quantity: number) => Promise<Cart>;
     removeItem: (itemId: string) => Promise<Cart>;
     clear: () => Promise<void>;
+    addBundle: (bundle: string | {
+        id: string;
+    } | {
+        slug: string;
+    }, quantity?: number) => Promise<Cart>;
+    updateBundleQuantity: (lineId: string, quantity: number) => Promise<Cart>;
+    removeBundle: (lineId: string) => Promise<Cart>;
     applyDiscount: (code: string) => Promise<Cart>;
     removeDiscount: () => Promise<Cart>;
     merge: () => Promise<Cart>;
@@ -4161,6 +4168,7 @@ declare function useCart(options?: UseCartOptions): {
     isAdding: boolean;
     isUpdating: boolean;
     isRemoving: boolean;
+    isUpdatingBundle: boolean;
 };
 
 interface UseCartCountOptions {

package/dist/react.js

@@ -2799,6 +2799,16 @@ function useCart(options) {
     queryClient.setQueryData([...CART_KEY], result);
     void refreshBundleQueries(queryClient);
   };
+  (0, import_react5.useEffect)(
+    () => client.on("cart:updated", (data) => {
+      if (!data || typeof data !== "object" || !("items" in data)) return;
+      const session = client.getCartSession();
+      if (session) storage.set(STORAGE_KEYS.CART_SESSION, session);
+      void acceptCart(data);
+    }),
+    // acceptCart only closes over queryClient, which is stable per provider.
+    [client, queryClient, storage]
+  );
   const addMutation = (0, import_react_query12.useMutation)({
     mutationFn: async ({ productId, quantity }) => {
       return unwrap(client.cart.addItem({ productId, quantity: quantity ?? 1 }));
@@ -2831,6 +2841,26 @@ function useCart(options) {
       queryClient.invalidateQueries({ queryKey: [...CART_KEY] });
     }
   });
+  const acceptBundleCart = async (result) => {
+    const session = result.newSessionToken ?? result.sessionToken;
+    if (session) storage.set(STORAGE_KEYS.CART_SESSION, session);
+    await acceptCart(result);
+  };
+  const addBundleMutation = (0, import_react_query12.useMutation)({
+    mutationFn: async ({ bundle, quantity }) => unwrap(client.cart.addBundle(bundle, quantity ?? 1)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
+  const updateBundleMutation = (0, import_react_query12.useMutation)({
+    mutationFn: async ({ lineId, quantity }) => unwrap(client.cart.updateBundleQuantity(lineId, quantity)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
+  const removeBundleMutation = (0, import_react_query12.useMutation)({
+    mutationFn: async (lineId) => unwrap(client.cart.removeBundle(lineId)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
   const clearMutation = (0, import_react_query12.useMutation)({
     mutationFn: () => unwrap(client.cart.clear()),
     onMutate: cancelCartRead,
@@ -2879,6 +2909,18 @@ function useCart(options) {
     () => clearMutation.mutateAsync(),
     [clearMutation]
   );
+  const addBundle = (0, import_react5.useCallback)(
+    (bundle, quantity) => addBundleMutation.mutateAsync({ bundle, quantity }),
+    [addBundleMutation]
+  );
+  const updateBundleQuantity = (0, import_react5.useCallback)(
+    (lineId, quantity) => updateBundleMutation.mutateAsync({ lineId, quantity }),
+    [updateBundleMutation]
+  );
+  const removeBundle = (0, import_react5.useCallback)(
+    (lineId) => removeBundleMutation.mutateAsync(lineId),
+    [removeBundleMutation]
+  );
   const applyDiscount = (0, import_react5.useCallback)(
     (code) => applyDiscountMutation.mutateAsync(code),
     [applyDiscountMutation]
@@ -2900,6 +2942,9 @@ function useCart(options) {
     updateQuantity,
     removeItem,
     clear,
+    addBundle,
+    updateBundleQuantity,
+    removeBundle,
     applyDiscount,
     removeDiscount,
     merge,
@@ -2909,7 +2954,8 @@ function useCart(options) {
     // Mutation states
     isAdding: addMutation.isPending,
     isUpdating: updateMutation.isPending,
-    isRemoving: removeMutation.isPending
+    isRemoving: removeMutation.isPending,
+    isUpdatingBundle: addBundleMutation.isPending || updateBundleMutation.isPending || removeBundleMutation.isPending
   };
 }
 

package/dist/react.mjs

@@ -2658,7 +2658,7 @@ function useSearch(query, options) {
 }
 
 // src/react/hooks/use-cart.ts
-import { useCallback as useCallback3 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect3 } from "react";
 import { useQuery as useQuery10, useMutation, useQueryClient } from "@tanstack/react-query";
 
 // src/react/utils/refresh-bundle-queries.ts
@@ -2689,6 +2689,16 @@ function useCart(options) {
     queryClient.setQueryData([...CART_KEY], result);
     void refreshBundleQueries(queryClient);
   };
+  useEffect3(
+    () => client.on("cart:updated", (data) => {
+      if (!data || typeof data !== "object" || !("items" in data)) return;
+      const session = client.getCartSession();
+      if (session) storage.set(STORAGE_KEYS.CART_SESSION, session);
+      void acceptCart(data);
+    }),
+    // acceptCart only closes over queryClient, which is stable per provider.
+    [client, queryClient, storage]
+  );
   const addMutation = useMutation({
     mutationFn: async ({ productId, quantity }) => {
       return unwrap(client.cart.addItem({ productId, quantity: quantity ?? 1 }));
@@ -2721,6 +2731,26 @@ function useCart(options) {
       queryClient.invalidateQueries({ queryKey: [...CART_KEY] });
     }
   });
+  const acceptBundleCart = async (result) => {
+    const session = result.newSessionToken ?? result.sessionToken;
+    if (session) storage.set(STORAGE_KEYS.CART_SESSION, session);
+    await acceptCart(result);
+  };
+  const addBundleMutation = useMutation({
+    mutationFn: async ({ bundle, quantity }) => unwrap(client.cart.addBundle(bundle, quantity ?? 1)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
+  const updateBundleMutation = useMutation({
+    mutationFn: async ({ lineId, quantity }) => unwrap(client.cart.updateBundleQuantity(lineId, quantity)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
+  const removeBundleMutation = useMutation({
+    mutationFn: async (lineId) => unwrap(client.cart.removeBundle(lineId)),
+    onMutate: cancelCartRead,
+    onSuccess: acceptBundleCart
+  });
   const clearMutation = useMutation({
     mutationFn: () => unwrap(client.cart.clear()),
     onMutate: cancelCartRead,
@@ -2769,6 +2799,18 @@ function useCart(options) {
     () => clearMutation.mutateAsync(),
     [clearMutation]
   );
+  const addBundle = useCallback3(
+    (bundle, quantity) => addBundleMutation.mutateAsync({ bundle, quantity }),
+    [addBundleMutation]
+  );
+  const updateBundleQuantity = useCallback3(
+    (lineId, quantity) => updateBundleMutation.mutateAsync({ lineId, quantity }),
+    [updateBundleMutation]
+  );
+  const removeBundle = useCallback3(
+    (lineId) => removeBundleMutation.mutateAsync(lineId),
+    [removeBundleMutation]
+  );
   const applyDiscount = useCallback3(
     (code) => applyDiscountMutation.mutateAsync(code),
     [applyDiscountMutation]
@@ -2790,6 +2832,9 @@ function useCart(options) {
     updateQuantity,
     removeItem,
     clear,
+    addBundle,
+    updateBundleQuantity,
+    removeBundle,
     applyDiscount,
     removeDiscount,
     merge,
@@ -2799,7 +2844,8 @@ function useCart(options) {
     // Mutation states
     isAdding: addMutation.isPending,
     isUpdating: updateMutation.isPending,
-    isRemoving: removeMutation.isPending
+    isRemoving: removeMutation.isPending,
+    isUpdatingBundle: addBundleMutation.isPending || updateBundleMutation.isPending || removeBundleMutation.isPending
   };
 }
 
@@ -3064,7 +3110,7 @@ function useAddresses(options) {
 }
 
 // src/react/hooks/use-address-autocomplete.ts
-import { useState as useState4, useEffect as useEffect3, useRef as useRef2, useCallback as useCallback7 } from "react";
+import { useState as useState4, useEffect as useEffect4, useRef as useRef2, useCallback as useCallback7 } from "react";
 import { useQuery as useQuery15 } from "@tanstack/react-query";
 var AC_KEY = ["behio", "address-autocomplete"];
 function useAddressAutocomplete(options) {
@@ -3075,7 +3121,7 @@ function useAddressAutocomplete(options) {
   const [selected, setSelected] = useState4(null);
   const [isSelecting, setIsSelecting] = useState4(false);
   const timerRef = useRef2(void 0);
-  useEffect3(() => {
+  useEffect4(() => {
     if (timerRef.current) clearTimeout(timerRef.current);
     if (query.length < minChars) {
       setDebouncedQuery("");
@@ -3503,14 +3549,14 @@ function usePaymentMethods(options) {
 }
 
 // src/react/hooks/use-personal-offers.ts
-import { useCallback as useCallback8, useEffect as useEffect4, useState as useState5 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect5, useState as useState5 } from "react";
 import { useMutation as useMutation10, useQuery as useQuery26, useQueryClient as useQueryClient12 } from "@tanstack/react-query";
 function usePersonalOffers(options) {
   const { client } = useBehio();
   const queryClient = useQueryClient12();
   const [polledVid, setPolledVid] = useState5(null);
   const explicitVid = options?.visitorId;
-  useEffect4(() => {
+  useEffect5(() => {
     if (explicitVid) return;
     const read = () => {
       const vid = client.getAnalyticsVisitorId();
@@ -3562,7 +3608,7 @@ function usePersonalOffers(options) {
 }
 
 // src/react/hooks/use-visitor-messages.ts
-import { useCallback as useCallback9, useEffect as useEffect5, useRef as useRef3, useState as useState6 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect6, useRef as useRef3, useState as useState6 } from "react";
 import { useQuery as useQuery27, useQueryClient as useQueryClient13 } from "@tanstack/react-query";
 function useVisitorMessages(options) {
   const { client } = useBehio();
@@ -3570,7 +3616,7 @@ function useVisitorMessages(options) {
   const [polledVid, setPolledVid] = useState6(null);
   const seenRef = useRef3(/* @__PURE__ */ new Set());
   const explicitVid = options?.visitorId;
-  useEffect5(() => {
+  useEffect6(() => {
     if (explicitVid) return;
     const read = () => {
       const vid = client.getAnalyticsVisitorId();
@@ -3607,7 +3653,7 @@ function useVisitorMessages(options) {
   );
   const onMessage = options?.onMessage;
   const dispatchDom = options?.dispatchDomEvents !== false;
-  useEffect5(() => {
+  useEffect6(() => {
     for (const message of data?.items ?? []) {
       if (seenRef.current.has(message.id)) continue;
       seenRef.current.add(message.id);
@@ -4093,7 +4139,7 @@ function CurrencySwitcher({
 }
 
 // src/react/components/storefront-scripts.tsx
-import { useEffect as useEffect6, useMemo as useMemo5, useRef as useRef4, useState as useState10 } from "react";
+import { useEffect as useEffect7, useMemo as useMemo5, useRef as useRef4, useState as useState10 } from "react";
 
 // src/react/hooks/use-consent.ts
 import { useQuery as useQuery35, useMutation as useMutation16, useQueryClient as useQueryClient16 } from "@tanstack/react-query";
@@ -4185,7 +4231,7 @@ function injectHtml(target, html, start = false) {
 function StorefrontScripts({ visitorId: visitorIdProp, initialScripts } = {}) {
   const { data } = useShopScripts({ enabled: initialScripts === void 0, initialData: initialScripts ? { scripts: initialScripts } : void 0 });
   const [visitorId, setVisitorId] = useState10(visitorIdProp ?? "");
-  useEffect6(() => {
+  useEffect7(() => {
     if (visitorIdProp) return;
     try {
       const v = localStorage.getItem(VISITOR_KEY);
@@ -4205,7 +4251,7 @@ function StorefrontScripts({ visitorId: visitorIdProp, initialScripts } = {}) {
     [scripts]
   );
   const activeConsented = useRef4(/* @__PURE__ */ new Set());
-  useEffect6(() => {
+  useEffect7(() => {
     if (typeof document === "undefined") return;
     const nextConsented = new Set(scripts.filter((s) => s.consentRequired).map((s) => s.id));
     const revoked = [...activeConsented.current].some((id) => !nextConsented.has(id));
@@ -4229,7 +4275,7 @@ function StorefrontScripts({ visitorId: visitorIdProp, initialScripts } = {}) {
 }
 
 // src/react/components/behio-analytics.tsx
-import { useEffect as useEffect7 } from "react";
+import { useEffect as useEffect8 } from "react";
 
 // src/react/hooks/use-behio-client.ts
 function useBehioClient() {
@@ -4239,7 +4285,7 @@ function useBehioClient() {
 // src/react/components/behio-analytics.tsx
 function BehioAnalyticsTracker() {
   const client = useBehioClient();
-  useEffect7(() => {
+  useEffect8(() => {
     if (typeof window === "undefined") return;
     const w = window;
     if (w.__behioAnalytics) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@behio/storefront-sdk",
-  "version": "2.9.0",
+  "version": "2.10.0",
   "description": "TypeScript SDK for Behio headless e-commerce: core client + React hooks",
   "author": "Behio",
   "license": "MIT",