@cimplify/sdk 0.31.0 → 0.36.0

package/dist/react.mjs

@@ -1,9 +1,9 @@
 "use client";
-import { DURATION_UNIT, getVariantDisplayName, INPUT_FIELD_TYPE, PRODUCT_TYPE, createCimplifyClient, RENDER_HINT } from './chunk-46BDUSJX.mjs';
-export { getVariantDisplayName } from './chunk-46BDUSJX.mjs';
-import { ELEMENT_TYPES, EVENT_TYPES } from './chunk-3J4PPSMI.mjs';
-import { isSupportedCurrency, formatPrice, parsePrice, getUnitPriceAtQuantity, isOnSale, getDiscountPercentage, getBasePrice, getPriceRange, formatPriceRange } from './chunk-E3HC2YAE.mjs';
-import React10, { createContext, useRef, useState, useCallback, useEffect, useContext, useMemo, useSyncExternalStore, useId } from 'react';
+import { DURATION_UNIT, getVariantDisplayName, INPUT_FIELD_TYPE, PRODUCT_TYPE, createCimplifyClient, RENDER_HINT } from './chunk-2X6P5WJZ.mjs';
+export { getVariantDisplayName } from './chunk-2X6P5WJZ.mjs';
+import { ELEMENT_TYPES, EVENT_TYPES } from './chunk-TFHKVQLL.mjs';
+import { isSupportedCurrency, formatPrice, parsePrice, getUnitPriceAtQuantity, isOnSale, getDiscountPercentage, getBasePrice, getPriceRange, formatPriceRange } from './chunk-6TVQQYQ5.mjs';
+import React10, { createContext, useRef, useState, useCallback, useEffect, useContext, useMemo, useId, useSyncExternalStore } from 'react';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
@@ -398,19 +398,114 @@ function transformToCheckoutCart(cart, fx) {
     currency: fx?.displayCurrency ?? cart.pricing.currency
   };
 }
-var CART_STORAGE_PREFIX = "cimplify:cart:v2";
-var DEFAULT_TAX_RATE = 0;
-var cartStores = /* @__PURE__ */ new Map();
-function clearAllCartStores() {
-  for (const [, store] of cartStores) {
-    void store.clearCart();
+
+// src/internal/collection.ts
+function newOpId() {
+  if (typeof crypto !== "undefined" && crypto.randomUUID) {
+    return `op_${crypto.randomUUID()}`;
   }
-  cartStores.clear();
+  return `op_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
-function toNumber(value) {
-  if (typeof value === "number" && Number.isFinite(value)) {
-    return value;
+function createCollection(config) {
+  let base = config.initialBase ?? null;
+  let ops = [];
+  const listeners = /* @__PURE__ */ new Set();
+  let cachedView;
+  let cachedBaseRef;
+  let cachedOpsVersion = -1;
+  let opsVersion = 0;
+  function notify() {
+    for (const listener of listeners) {
+      listener();
+    }
   }
+  function recompute() {
+    if (cachedView !== void 0 && cachedBaseRef === base && cachedOpsVersion === opsVersion) {
+      return cachedView;
+    }
+    const view = config.toView(base, ops);
+    cachedView = view;
+    cachedBaseRef = base;
+    cachedOpsVersion = opsVersion;
+    return view;
+  }
+  return {
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => {
+        listeners.delete(listener);
+      };
+    },
+    getSnapshot() {
+      return recompute();
+    },
+    setBase(next) {
+      base = next;
+      opsVersion++;
+      notify();
+    },
+    enqueue(patch, idempotencyKey) {
+      const op = {
+        id: newOpId(),
+        idempotencyKey,
+        patch,
+        status: "pending",
+        attemptCount: 0,
+        enqueuedAt: Date.now()
+      };
+      ops = [...ops, op];
+      opsVersion++;
+      notify();
+      return op.id;
+    },
+    confirm(opId, newBase) {
+      const idx = ops.findIndex((op) => op.id === opId);
+      if (idx === -1 && newBase === void 0) {
+        return;
+      }
+      if (idx !== -1) {
+        ops = ops.filter((op) => op.id !== opId);
+      }
+      if (newBase !== void 0) {
+        base = newBase;
+      }
+      opsVersion++;
+      notify();
+    },
+    fail(opId, error) {
+      const idx = ops.findIndex((op) => op.id === opId);
+      if (idx === -1) return;
+      ops = ops.map(
+        (op, i) => i === idx ? {
+          ...op,
+          status: "failed",
+          attemptCount: op.attemptCount + 1,
+          lastError: error
+        } : op
+      );
+      opsVersion++;
+      notify();
+    },
+    remove(opId) {
+      const next = ops.filter((op) => op.id !== opId);
+      if (next.length === ops.length) return;
+      ops = next;
+      opsVersion++;
+      notify();
+    },
+    getOps() {
+      return ops;
+    },
+    getBase() {
+      return base;
+    }
+  };
+}
+
+// src/internal/cart-patches.ts
+var DEFAULT_TAX_RATE = 0;
+function toNumber(value) {
+  if (typeof value === "number" && Number.isFinite(value)) return value;
   if (typeof value === "string") {
     const parsed = Number.parseFloat(value);
     return Number.isFinite(parsed) ? parsed : 0;
@@ -421,30 +516,20 @@ function roundMoney(value) {
   return Math.max(0, Number(value.toFixed(2)));
 }
 function clampQuantity(quantity) {
-  if (!Number.isFinite(quantity)) {
-    return 1;
-  }
+  if (!Number.isFinite(quantity)) return 1;
   return Math.max(1, Math.floor(quantity));
 }
 function normalizeOptionIds(value) {
-  if (!value || value.length === 0) {
-    return void 0;
-  }
+  if (!value || value.length === 0) return void 0;
   const normalized = Array.from(
-    new Set(
-      value.map((entry) => entry.trim()).filter((entry) => entry.length > 0)
-    )
+    new Set(value.map((entry) => entry.trim()).filter((entry) => entry.length > 0))
   ).sort();
   return normalized.length > 0 ? normalized : void 0;
 }
 function buildLineKey(productId, options) {
   const parts = [productId];
-  if (options.locationId) {
-    parts.push(`l:${options.locationId}`);
-  }
-  if (options.variantId) {
-    parts.push(`v:${options.variantId}`);
-  }
+  if (options.locationId) parts.push(`l:${options.locationId}`);
+  if (options.variantId) parts.push(`v:${options.variantId}`);
   const addOnOptionIds = normalizeOptionIds(options.addOnOptionIds);
   if (addOnOptionIds && addOnOptionIds.length > 0) {
     parts.push(`a:${addOnOptionIds.join(",")}`);
@@ -455,61 +540,122 @@ function buildLineKey(productId, options) {
   if (options.compositeSelections && options.compositeSelections.length > 0) {
     parts.push(`c:${JSON.stringify(options.compositeSelections)}`);
   }
-  if (options.quoteId) {
-    parts.push(`q:${options.quoteId}`);
-  }
-  if (options.scheduledStart) {
-    parts.push(`ss:${options.scheduledStart}`);
-  }
-  if (options.staffId) {
-    parts.push(`st:${options.staffId}`);
-  }
-  if (options.resourceId) {
-    parts.push(`r:${options.resourceId}`);
-  }
+  if (options.quoteId) parts.push(`q:${options.quoteId}`);
+  if (options.scheduledStart) parts.push(`ss:${options.scheduledStart}`);
+  if (options.staffId) parts.push(`st:${options.staffId}`);
+  if (options.resourceId) parts.push(`r:${options.resourceId}`);
   return parts.join("|");
 }
+function lineKeyFromItem(item) {
+  return buildLineKey(item.product.id, {
+    locationId: item.locationId,
+    variantId: item.variantId,
+    quoteId: item.quoteId,
+    addOnOptionIds: item.addOnOptionIds,
+    bundleSelections: item.bundleSelections,
+    compositeSelections: item.compositeSelections,
+    scheduledStart: item.scheduledStart,
+    staffId: item.staffId
+  });
+}
+function attachInternalItemMetadata(item) {
+  return { ...item, _lineKey: lineKeyFromItem(item) };
+}
 function calculateLineSubtotal(item) {
   let unitPrice = parsePrice(item.product.default_price);
   if (item.variant?.price_adjustment) {
     unitPrice += parsePrice(item.variant.price_adjustment);
   }
   for (const option of item.addOnOptions || []) {
-    if (option.default_price) {
-      unitPrice += parsePrice(option.default_price);
-    }
+    if (option.default_price) unitPrice += parsePrice(option.default_price);
   }
   return roundMoney(unitPrice * item.quantity);
 }
 function calculateSummary(items) {
   const subtotal = roundMoney(items.reduce((sum, item) => sum + calculateLineSubtotal(item), 0));
   const tax = roundMoney(subtotal * DEFAULT_TAX_RATE);
-  return {
-    subtotal,
-    tax,
-    total: roundMoney(subtotal + tax)
-  };
+  return { subtotal, tax, total: roundMoney(subtotal + tax) };
 }
-function lineKeyFromItem(item) {
-  return buildLineKey(item.product.id, {
-    locationId: item.locationId,
-    variantId: item.variantId,
-    quoteId: item.quoteId,
-    addOnOptionIds: item.addOnOptionIds,
-    bundleSelections: item.bundleSelections,
-    compositeSelections: item.compositeSelections,
-    scheduledStart: item.scheduledStart,
-    staffId: item.staffId
-  });
+function applyCartPatch(base, patch) {
+  switch (patch.kind) {
+    case "add_item": {
+      const existingIndex = base.items.findIndex(
+        (item) => (item._lineKey ?? lineKeyFromItem(item)) === patch.lineKey
+      );
+      const nextItems = [...base.items];
+      if (existingIndex >= 0) {
+        const existing = nextItems[existingIndex];
+        nextItems[existingIndex] = {
+          ...existing,
+          quantity: existing.quantity + patch.tempItem.quantity
+        };
+      } else {
+        nextItems.push(patch.tempItem);
+      }
+      return { ...base, items: nextItems, ...calculateSummary(nextItems) };
+    }
+    case "remove_item": {
+      const nextItems = base.items.filter((item) => item.id !== patch.itemId);
+      return { ...base, items: nextItems, ...calculateSummary(nextItems) };
+    }
+    case "set_quantity": {
+      const resolved = clampQuantity(patch.quantity);
+      const nextItems = base.items.map(
+        (item) => item.id === patch.itemId ? { ...item, quantity: resolved } : item
+      );
+      return { ...base, items: nextItems, ...calculateSummary(nextItems) };
+    }
+    case "clear": {
+      return { ...base, items: [], subtotal: 0, tax: 0, total: 0 };
+    }
+  }
 }
-function attachInternalItemMetadata(item) {
-  return {
-    ...item,
-    _lineKey: lineKeyFromItem(item)
-  };
+function useCollectionStore(collection) {
+  return useSyncExternalStore(
+    (listener) => collection.subscribe(listener),
+    () => collection.getSnapshot(),
+    () => collection.getSnapshot()
+  );
+}
+
+// src/react/hooks/use-cart.ts
+var CART_STORAGE_PREFIX = "cimplify:cart:v3";
+var cartStores = /* @__PURE__ */ new Map();
+var ROLLBACK_VISIBLE_DELAY_MS = 3e3;
+function clearAllCartStores() {
+  for (const [, entry] of cartStores) {
+    entry.collection.setBase(emptyBase(entry.currency));
+    for (const handle of entry.failedOpRemovers) {
+      clearTimeout(handle);
+    }
+    entry.failedOpRemovers.clear();
+    if (entry.persistTimer) {
+      clearTimeout(entry.persistTimer);
+      entry.persistTimer = null;
+    }
+  }
+  cartStores.clear();
+}
+function emptyBase(currency, isLoading = true) {
+  return { items: [], subtotal: 0, tax: 0, total: 0, currency, isLoading };
+}
+function advanceBaseWithPatch(entry, patch) {
+  const current = entry.collection.getBase() ?? emptyBase(entry.currency, false);
+  entry.collection.setBase({ ...applyCartPatch(current, patch), isLoading: false });
+  persistBase(entry);
+}
+function buildStoreKey(client, locationId, isDemoMode) {
+  return [
+    client.getPublicKey() || "__demo__",
+    locationId || "__no_location__",
+    isDemoMode ? "demo" : "live"
+  ].join(":");
+}
+function buildStorageKey(storeKey) {
+  return `${CART_STORAGE_PREFIX}:${storeKey}`;
 }
 function stripInternalItemMetadata(item) {
-  const { _lineKey, ...rest } = item;
+  const { _lineKey, isOptimistic, ...rest } = item;
   return rest;
 }
 function toProductFromServerItem(item, businessId) {
@@ -528,12 +674,10 @@ function toProductFromServerItem(item, businessId) {
     is_active: item.is_available,
     created_at: item.created_at,
     updated_at: item.updated_at,
-    metadata: {
-      from_sdk: true
-    }
+    metadata: { from_sdk: true }
   };
 }
-function mapServerCart(serverCart) {
+function mapServerCart(serverCart, fallbackCurrency) {
   const items = serverCart.items.map((item) => {
     const variant = item.variant_info || item.variant_name ? {
       id: item.variant_info?.id || item.variant_id || "",
@@ -574,207 +718,219 @@ function mapServerCart(serverCart) {
     subtotal: roundMoney(toNumber(serverCart.pricing.subtotal)),
     tax: roundMoney(toNumber(serverCart.pricing.tax_amount)),
     total: roundMoney(toNumber(serverCart.pricing.total_price)),
-    currency: serverCart.pricing.currency || "USD"
+    currency: serverCart.pricing.currency || fallbackCurrency,
+    isLoading: false
   };
 }
-function buildStorageKey(storeKey) {
-  return `${CART_STORAGE_PREFIX}:${storeKey}`;
-}
-function createEmptySnapshot(currency) {
+function annotateOptimisticItems(base, ops) {
+  if (ops.length === 0) return base;
+  const optimisticIds = /* @__PURE__ */ new Set();
+  for (const op of ops) {
+    if (op.patch.kind === "add_item") {
+      optimisticIds.add(op.patch.tempItem.id);
+    }
+  }
+  if (optimisticIds.size === 0) return base;
   return {
-    items: [],
-    subtotal: 0,
-    tax: 0,
-    total: 0,
-    currency,
-    isLoading: true
+    ...base,
+    items: base.items.map(
+      (item) => optimisticIds.has(item.id) ? { ...item, isOptimistic: true } : item
+    )
   };
 }
-function createCartStore(params) {
-  const { client, storeKey, locationId, isDemoMode, currency } = params;
-  const storageKey = buildStorageKey(storeKey);
-  const listeners = /* @__PURE__ */ new Set();
-  let snapshot = createEmptySnapshot(currency);
-  let initialized = false;
-  let initializePromise = null;
-  let persistTimer = null;
-  function emit() {
-    listeners.forEach((listener) => {
-      listener();
-    });
-  }
-  function setSnapshot(nextSnapshot) {
-    snapshot = nextSnapshot;
-    schedulePersist();
-    emit();
-  }
-  function updateSnapshot(updater) {
-    setSnapshot(updater(snapshot));
+function deriveView(base, ops) {
+  const start = base ?? emptyBase("USD");
+  let folded = start;
+  for (const op of ops) {
+    folded = applyCartPatch(folded, op.patch);
   }
-  function persistSnapshot() {
-    if (typeof window === "undefined" || !window.localStorage) {
-      return;
-    }
+  folded = annotateOptimisticItems(folded, ops);
+  return {
+    ...folded,
+    isOptimistic: ops.length > 0,
+    pendingOpCount: ops.length
+  };
+}
+function persistBase(entry) {
+  if (typeof window === "undefined" || !window.localStorage) return;
+  if (entry.persistTimer) return;
+  entry.persistTimer = setTimeout(() => {
+    entry.persistTimer = null;
+    if (typeof window === "undefined" || !window.localStorage) return;
+    const base = entry.collection.getBase();
+    if (!base) return;
     try {
       window.localStorage.setItem(
-        storageKey,
+        entry.storageKey,
         JSON.stringify({
-          items: snapshot.items.map((item) => stripInternalItemMetadata(item)),
-          subtotal: snapshot.subtotal,
-          tax: snapshot.tax,
-          total: snapshot.total,
-          currency: snapshot.currency
+          items: base.items.map((item) => stripInternalItemMetadata(item)),
+          subtotal: base.subtotal,
+          tax: base.tax,
+          total: base.total,
+          currency: base.currency
         })
       );
     } catch {
     }
+  }, 100);
+}
+function hydrateFromStorage(entry) {
+  if (typeof window === "undefined" || !window.localStorage) return;
+  try {
+    const raw = window.localStorage.getItem(entry.storageKey);
+    if (!raw) return;
+    const parsed = JSON.parse(raw);
+    if (!parsed || !Array.isArray(parsed.items)) return;
+    const items = parsed.items.map((item) => attachInternalItemMetadata(item));
+    entry.collection.setBase({
+      items,
+      subtotal: toNumber(parsed.subtotal),
+      tax: toNumber(parsed.tax),
+      total: toNumber(parsed.total),
+      currency: typeof parsed.currency === "string" && parsed.currency ? parsed.currency : entry.currency,
+      isLoading: !entry.isDemoMode
+    });
+  } catch {
   }
-  function schedulePersist() {
-    if (persistTimer) {
-      return;
-    }
-    persistTimer = setTimeout(() => {
-      persistTimer = null;
-      persistSnapshot();
-    }, 100);
+}
+async function syncFromServer(entry) {
+  if (entry.isDemoMode) {
+    const base = entry.collection.getBase() ?? emptyBase(entry.currency);
+    entry.collection.setBase({ ...base, isLoading: false });
+    return;
   }
-  function hydrateFromStorage() {
-    if (typeof window === "undefined" || !window.localStorage) {
-      return;
-    }
-    try {
-      const raw = window.localStorage.getItem(storageKey);
-      if (!raw) {
-        return;
-      }
-      const parsed = JSON.parse(raw);
-      if (!parsed || !Array.isArray(parsed.items)) {
-        return;
-      }
-      snapshot = {
-        items: parsed.items.map((item) => attachInternalItemMetadata(item)),
-        subtotal: toNumber(parsed.subtotal),
-        tax: toNumber(parsed.tax),
-        total: toNumber(parsed.total),
-        currency: typeof parsed.currency === "string" && parsed.currency ? parsed.currency : currency,
-        isLoading: !isDemoMode
-      };
-      emit();
-    } catch {
-    }
+  if (entry.syncing) return;
+  entry.syncing = true;
+  try {
+    const result = await entry.client.cart.get();
+    if (!result.ok) throw result.error;
+    entry.collection.setBase(mapServerCart(result.value, entry.currency));
+    persistBase(entry);
+  } finally {
+    entry.syncing = false;
+  }
+}
+function emitMutationError(entry, operation, opId, idempotencyKey, error) {
+  entry.client.events.emit("mutation:error", {
+    service: "cart",
+    operation,
+    opId,
+    idempotencyKey,
+    error
+  });
+}
+function scheduleFailedOpRemoval(entry, opId) {
+  const handle = setTimeout(() => {
+    entry.failedOpRemovers.delete(handle);
+    entry.collection.remove(opId);
+  }, ROLLBACK_VISIBLE_DELAY_MS);
+  entry.failedOpRemovers.add(handle);
+}
+function getOrCreateStore(params) {
+  const { client, locationId, isDemoMode, currency, optimisticEnabled } = params;
+  const storeKey = buildStoreKey(client, locationId, isDemoMode);
+  const existing = cartStores.get(storeKey);
+  if (existing) {
+    existing.optimisticEnabled = optimisticEnabled;
+    return existing;
   }
-  async function sync() {
-    if (isDemoMode) {
-      updateSnapshot((current) => ({
-        ...current,
-        isLoading: false
-      }));
-      return;
-    }
-    updateSnapshot((current) => ({
-      ...current,
-      isLoading: true
-    }));
-    const result = await client.cart.get();
-    if (!result.ok) {
-      updateSnapshot((current) => ({
-        ...current,
-        isLoading: false
-      }));
-      throw result.error;
-    }
-    const next = mapServerCart(result.value);
-    setSnapshot({
-      ...next,
-      isLoading: false
-    });
+  const collection = createCollection({
+    applyPatch: applyCartPatch,
+    toView: (base, ops) => deriveView(base, ops),
+    initialBase: emptyBase(currency)
+  });
+  const entry = {
+    collection,
+    client,
+    storageKey: buildStorageKey(storeKey),
+    locationId,
+    currency,
+    isDemoMode,
+    optimisticEnabled,
+    initialized: false,
+    initializePromise: null,
+    persistTimer: null,
+    syncing: false,
+    failedOpRemovers: /* @__PURE__ */ new Set()
+  };
+  cartStores.set(storeKey, entry);
+  return entry;
+}
+async function ensureInitialized(entry) {
+  if (entry.initialized) {
+    if (entry.initializePromise) await entry.initializePromise;
+    return;
   }
-  async function maybeResolveQuoteId(product, quantity, options) {
-    if (options.quoteId) {
-      return options.quoteId;
-    }
-    const addOnOptionIds = normalizeOptionIds(options.addOnOptionIds);
-    const requiresQuote = Boolean(
-      options.variantId || addOnOptionIds && addOnOptionIds.length > 0 || options.bundleSelections && options.bundleSelections.length > 0 || options.compositeSelections && options.compositeSelections.length > 0
-    );
-    if (!requiresQuote || isDemoMode) {
-      return void 0;
-    }
-    const quoteResult = await client.catalogue.fetchQuote({
-      product_id: product.id,
-      quantity,
-      location_id: options.locationId || locationId || void 0,
-      variant_id: options.variantId,
-      add_on_option_ids: addOnOptionIds,
-      bundle_selections: options.bundleSelections,
-      composite_selections: options.compositeSelections
-    });
-    if (!quoteResult.ok) {
-      throw quoteResult.error;
-    }
-    return quoteResult.value.quote_id;
+  entry.initialized = true;
+  hydrateFromStorage(entry);
+  if (entry.isDemoMode) {
+    const base = entry.collection.getBase() ?? emptyBase(entry.currency);
+    entry.collection.setBase({ ...base, isLoading: false });
+    return;
   }
-  async function addItem(product, quantity = 1, options = {}) {
-    const resolvedQuantity = clampQuantity(quantity);
-    const normalizedOptions = {
-      ...options,
-      locationId: options.locationId || locationId || void 0,
-      addOnOptionIds: normalizeOptionIds(options.addOnOptionIds)
-    };
-    const maybeProductWithVariants = product;
-    if (Array.isArray(maybeProductWithVariants.variants) && maybeProductWithVariants.variants.length > 0 && !normalizedOptions.variantId) {
-      console.warn(
-        "[Cimplify] addItem() called without variantId for a product that has variants. Default variant pricing will be used."
-      );
-    }
-    const previousSnapshot = snapshot;
-    const lineKey = buildLineKey(product.id, normalizedOptions);
-    const optimisticItem = attachInternalItemMetadata({
-      id: `tmp_${Date.now()}_${Math.random().toString(36).slice(2, 10)}`,
-      product,
-      quantity: resolvedQuantity,
-      locationId: normalizedOptions.locationId,
-      variantId: normalizedOptions.variantId,
-      variant: normalizedOptions.variant,
-      quoteId: normalizedOptions.quoteId,
-      addOnOptionIds: normalizedOptions.addOnOptionIds,
-      addOnOptions: normalizedOptions.addOnOptions,
-      bundleSelections: normalizedOptions.bundleSelections,
-      compositeSelections: normalizedOptions.compositeSelections,
-      specialInstructions: normalizedOptions.specialInstructions,
-      scheduledStart: normalizedOptions.scheduledStart,
-      scheduledEnd: normalizedOptions.scheduledEnd,
-      staffId: normalizedOptions.staffId
-    });
-    updateSnapshot((current) => {
-      const existingIndex = current.items.findIndex(
-        (item) => (item._lineKey ?? lineKeyFromItem(item)) === lineKey
-      );
-      const nextItems = [...current.items];
-      if (existingIndex >= 0) {
-        const existing = nextItems[existingIndex];
-        nextItems[existingIndex] = {
-          ...existing,
-          quantity: existing.quantity + resolvedQuantity
-        };
-      } else {
-        nextItems.push(optimisticItem);
-      }
-      const summary = calculateSummary(nextItems);
-      return {
-        ...current,
-        items: nextItems,
-        subtotal: summary.subtotal,
-        tax: summary.tax,
-        total: summary.total
-      };
-    });
-    if (isDemoMode) {
-      return;
-    }
-    try {
-      const quoteId = await maybeResolveQuoteId(product, resolvedQuantity, normalizedOptions);
-      const result = await client.cart.addItem({
+  entry.initializePromise = syncFromServer(entry).catch(() => {
+    const base = entry.collection.getBase() ?? emptyBase(entry.currency);
+    entry.collection.setBase({ ...base, isLoading: false });
+  });
+  await entry.initializePromise;
+  entry.initializePromise = null;
+}
+async function maybeResolveQuoteId(entry, product, quantity, options) {
+  if (options.quoteId) return options.quoteId;
+  const addOnOptionIds = normalizeOptionIds(options.addOnOptionIds);
+  const requiresQuote = Boolean(
+    options.variantId || addOnOptionIds && addOnOptionIds.length > 0 || options.bundleSelections && options.bundleSelections.length > 0 || options.compositeSelections && options.compositeSelections.length > 0
+  );
+  if (!requiresQuote || entry.isDemoMode) return void 0;
+  const quoteResult = await entry.client.catalogue.fetchQuote({
+    product_id: product.id,
+    quantity,
+    location_id: options.locationId || entry.locationId || void 0,
+    variant_id: options.variantId,
+    add_on_option_ids: addOnOptionIds,
+    bundle_selections: options.bundleSelections,
+    composite_selections: options.compositeSelections
+  });
+  if (!quoteResult.ok) throw quoteResult.error;
+  return quoteResult.value.quote_id;
+}
+async function performAddItem(entry, product, quantity, options) {
+  const resolvedQuantity = clampQuantity(quantity);
+  const normalizedOptions = {
+    ...options,
+    locationId: options.locationId || entry.locationId || void 0,
+    addOnOptionIds: normalizeOptionIds(options.addOnOptionIds)
+  };
+  const lineKey = buildLineKey(product.id, normalizedOptions);
+  const tempItem = attachInternalItemMetadata({
+    id: `tmp_${Date.now()}_${Math.random().toString(36).slice(2, 10)}`,
+    product,
+    quantity: resolvedQuantity,
+    locationId: normalizedOptions.locationId,
+    variantId: normalizedOptions.variantId,
+    variant: normalizedOptions.variant,
+    quoteId: normalizedOptions.quoteId,
+    addOnOptionIds: normalizedOptions.addOnOptionIds,
+    addOnOptions: normalizedOptions.addOnOptions,
+    bundleSelections: normalizedOptions.bundleSelections,
+    compositeSelections: normalizedOptions.compositeSelections,
+    specialInstructions: normalizedOptions.specialInstructions,
+    scheduledStart: normalizedOptions.scheduledStart,
+    scheduledEnd: normalizedOptions.scheduledEnd,
+    staffId: normalizedOptions.staffId
+  });
+  const idempotencyKey = `idem_${typeof crypto !== "undefined" && crypto.randomUUID ? crypto.randomUUID() : `${Date.now()}_${Math.random().toString(36).slice(2, 10)}`}`;
+  const patch = { kind: "add_item", tempItem, lineKey };
+  if (entry.isDemoMode) {
+    advanceBaseWithPatch(entry, patch);
+    return;
+  }
+  const useOptimistic = entry.optimisticEnabled;
+  const opId = useOptimistic ? entry.collection.enqueue(patch, idempotencyKey) : null;
+  try {
+    const quoteId = await maybeResolveQuoteId(entry, product, resolvedQuantity, normalizedOptions);
+    const result = await entry.client.cart.addItem(
+      {
         item_id: product.id,
         quantity: resolvedQuantity,
         variant_id: normalizedOptions.variantId,
@@ -788,186 +944,103 @@ function createCartStore(params) {
         staff_id: normalizedOptions.staffId,
         resource_id: normalizedOptions.resourceId,
         customer_inputs: normalizedOptions.customerInputs
-      });
-      if (!result.ok) {
-        throw result.error;
-      }
-      await sync();
-    } catch (error) {
-      snapshot = previousSnapshot;
-      persistSnapshot();
-      emit();
-      throw error;
-    }
-  }
-  async function removeItem(itemId) {
-    const previousSnapshot = snapshot;
-    updateSnapshot((current) => {
-      const nextItems = current.items.filter((item) => item.id !== itemId);
-      const summary = calculateSummary(nextItems);
-      return {
-        ...current,
-        items: nextItems,
-        subtotal: summary.subtotal,
-        tax: summary.tax,
-        total: summary.total
-      };
-    });
-    if (isDemoMode) {
-      return;
-    }
-    try {
-      const result = await client.cart.removeItem(itemId);
-      if (!result.ok) {
-        throw result.error;
-      }
-      await sync();
-    } catch (error) {
-      snapshot = previousSnapshot;
-      persistSnapshot();
-      emit();
-      throw error;
-    }
+      },
+      { idempotencyKey }
+    );
+    if (!result.ok) throw result.error;
+    await syncFromServer(entry);
+    if (opId) entry.collection.confirm(opId);
+  } catch (error) {
+    const cimplifyError = error;
+    if (opId) {
+      entry.collection.fail(opId, cimplifyError);
+      emitMutationError(entry, "add_item", opId, idempotencyKey, cimplifyError);
+      scheduleFailedOpRemoval(entry, opId);
+    }
+    throw cimplifyError;
+  }
+}
+async function performRemoveItem(entry, itemId) {
+  const idempotencyKey = "";
+  const patch = { kind: "remove_item", itemId };
+  if (entry.isDemoMode) {
+    advanceBaseWithPatch(entry, patch);
+    return;
   }
-  async function updateQuantity(itemId, quantity) {
-    if (quantity <= 0) {
-      await removeItem(itemId);
-      return;
-    }
-    const resolvedQuantity = clampQuantity(quantity);
-    const previousSnapshot = snapshot;
-    updateSnapshot((current) => {
-      const nextItems = current.items.map(
-        (item) => item.id === itemId ? {
-          ...item,
-          quantity: resolvedQuantity
-        } : item
-      );
-      const summary = calculateSummary(nextItems);
-      return {
-        ...current,
-        items: nextItems,
-        subtotal: summary.subtotal,
-        tax: summary.tax,
-        total: summary.total
-      };
-    });
-    if (isDemoMode) {
-      return;
-    }
-    try {
-      const result = await client.cart.updateQuantity(itemId, resolvedQuantity);
-      if (!result.ok) {
-        throw result.error;
-      }
-      await sync();
-    } catch (error) {
-      snapshot = previousSnapshot;
-      persistSnapshot();
-      emit();
-      throw error;
-    }
-  }
-  async function clearCart() {
-    const previousSnapshot = snapshot;
-    updateSnapshot((current) => ({
-      ...current,
-      items: [],
-      subtotal: 0,
-      tax: 0,
-      total: 0
-    }));
-    if (isDemoMode) {
-      return;
-    }
-    try {
-      const result = await client.cart.clear();
-      if (!result.ok) {
-        throw result.error;
-      }
-      await sync();
-    } catch (error) {
-      snapshot = previousSnapshot;
-      persistSnapshot();
-      emit();
-      throw error;
-    }
+  const useOptimistic = entry.optimisticEnabled;
+  const opId = useOptimistic ? entry.collection.enqueue(patch, idempotencyKey) : null;
+  try {
+    const result = await entry.client.cart.removeItem(itemId);
+    if (!result.ok) throw result.error;
+    await syncFromServer(entry);
+    if (opId) entry.collection.confirm(opId);
+  } catch (error) {
+    const cimplifyError = error;
+    if (opId) {
+      entry.collection.fail(opId, cimplifyError);
+      emitMutationError(entry, "remove_item", opId, idempotencyKey, cimplifyError);
+      scheduleFailedOpRemoval(entry, opId);
+    }
+    throw cimplifyError;
+  }
+}
+async function performUpdateQuantity(entry, itemId, quantity) {
+  if (quantity <= 0) {
+    return performRemoveItem(entry, itemId);
+  }
+  const resolved = clampQuantity(quantity);
+  const idempotencyKey = "";
+  const patch = { kind: "set_quantity", itemId, quantity: resolved };
+  if (entry.isDemoMode) {
+    advanceBaseWithPatch(entry, patch);
+    return;
   }
-  async function initialize() {
-    if (initialized) {
-      if (initializePromise) {
-        await initializePromise;
-      }
-      return;
-    }
-    initialized = true;
-    hydrateFromStorage();
-    if (isDemoMode) {
-      updateSnapshot((current) => ({
-        ...current,
-        isLoading: false
-      }));
-      return;
-    }
-    initializePromise = sync().catch(() => {
-      updateSnapshot((current) => ({
-        ...current,
-        isLoading: false
-      }));
-    });
-    await initializePromise;
-    initializePromise = null;
+  const useOptimistic = entry.optimisticEnabled;
+  const opId = useOptimistic ? entry.collection.enqueue(patch, idempotencyKey) : null;
+  try {
+    const result = await entry.client.cart.updateQuantity(itemId, resolved);
+    if (!result.ok) throw result.error;
+    await syncFromServer(entry);
+    if (opId) entry.collection.confirm(opId);
+  } catch (error) {
+    const cimplifyError = error;
+    if (opId) {
+      entry.collection.fail(opId, cimplifyError);
+      emitMutationError(entry, "update_quantity", opId, idempotencyKey, cimplifyError);
+      scheduleFailedOpRemoval(entry, opId);
+    }
+    throw cimplifyError;
+  }
+}
+async function performClear(entry) {
+  const idempotencyKey = "";
+  const patch = { kind: "clear" };
+  if (entry.isDemoMode) {
+    advanceBaseWithPatch(entry, patch);
+    return;
   }
-  async function reorder(orderId) {
-    const result = await client.cart.reorderFromOrder(orderId);
-    if (!result.ok) {
-      throw result.error;
+  const useOptimistic = entry.optimisticEnabled;
+  const opId = useOptimistic ? entry.collection.enqueue(patch, idempotencyKey) : null;
+  try {
+    const result = await entry.client.cart.clear();
+    if (!result.ok) throw result.error;
+    await syncFromServer(entry);
+    if (opId) entry.collection.confirm(opId);
+  } catch (error) {
+    const cimplifyError = error;
+    if (opId) {
+      entry.collection.fail(opId, cimplifyError);
+      emitMutationError(entry, "clear", opId, idempotencyKey, cimplifyError);
+      scheduleFailedOpRemoval(entry, opId);
     }
-    await sync();
-    return result.value;
+    throw cimplifyError;
   }
-  return {
-    subscribe(listener) {
-      listeners.add(listener);
-      return () => {
-        listeners.delete(listener);
-      };
-    },
-    getSnapshot() {
-      return snapshot;
-    },
-    initialize,
-    addItem,
-    removeItem,
-    updateQuantity,
-    clearCart,
-    sync,
-    reorder
-  };
 }
-function getStoreKey(client, locationId, isDemoMode) {
-  return [
-    client.getPublicKey() || "__demo__",
-    locationId || "__no_location__",
-    isDemoMode ? "demo" : "live"
-  ].join(":");
-}
-function getOrCreateStore(params) {
-  const { client, locationId, isDemoMode, currency } = params;
-  const storeKey = getStoreKey(client, locationId, isDemoMode);
-  const existing = cartStores.get(storeKey);
-  if (existing) {
-    return existing;
-  }
-  const created = createCartStore({
-    client,
-    storeKey,
-    locationId,
-    isDemoMode,
-    currency
-  });
-  cartStores.set(storeKey, created);
-  return created;
+async function performReorder(entry, orderId) {
+  const result = await entry.client.cart.reorderFromOrder(orderId);
+  if (!result.ok) throw result.error;
+  await syncFromServer(entry);
+  return result.value;
 }
 function useCart(options = {}) {
   const context = useOptionalCimplifyClient();
@@ -978,77 +1051,92 @@ function useCart(options = {}) {
   const locationId = options.locationId ?? client.getLocationId();
   const isDemoMode = options.demoMode ?? context?.isDemoMode ?? client.getPublicKey().trim().length === 0;
   const currency = options.currency ?? context?.currency ?? "USD";
-  const store = useMemo(
+  const optimisticEnabled = context?.optimistic ?? true;
+  const entry = useMemo(
     () => getOrCreateStore({
       client,
       locationId,
       isDemoMode,
-      currency
+      currency,
+      optimisticEnabled
     }),
-    [client, currency, isDemoMode, locationId]
-  );
-  const snapshot = useSyncExternalStore(
-    store.subscribe,
-    store.getSnapshot,
-    store.getSnapshot
+    [client, currency, isDemoMode, locationId, optimisticEnabled]
   );
+  const view = useCollectionStore(entry.collection);
   useEffect(() => {
-    void store.initialize();
-  }, [store]);
+    void ensureInitialized(entry);
+  }, [entry]);
   const addItem = useCallback(
     async (product, quantity, addOptions) => {
-      await store.addItem(product, quantity, addOptions);
+      await performAddItem(entry, product, quantity ?? 1, addOptions ?? {});
     },
-    [store]
+    [entry]
   );
   const removeItem = useCallback(
     async (itemId) => {
-      await store.removeItem(itemId);
+      await performRemoveItem(entry, itemId);
     },
-    [store]
+    [entry]
   );
   const updateQuantity = useCallback(
     async (itemId, quantity) => {
-      await store.updateQuantity(itemId, quantity);
+      await performUpdateQuantity(entry, itemId, quantity);
     },
-    [store]
+    [entry]
   );
   const clearCart = useCallback(async () => {
-    await store.clearCart();
-  }, [store]);
+    await performClear(entry);
+  }, [entry]);
   const sync = useCallback(async () => {
-    try {
-      await store.sync();
-    } catch (syncError) {
-      throw syncError;
-    }
-  }, [store]);
+    await syncFromServer(entry);
+  }, [entry]);
   const reorder = useCallback(
     async (orderId) => {
-      return store.reorder(orderId);
+      return performReorder(entry, orderId);
     },
-    [store]
+    [entry]
   );
   const itemCount = useMemo(
-    () => snapshot.items.reduce((sum, item) => sum + item.quantity, 0),
-    [snapshot.items]
+    () => view.items.reduce((sum, item) => sum + item.quantity, 0),
+    [view.items]
+  );
+  return useMemo(
+    () => ({
+      items: view.items,
+      itemCount,
+      subtotal: view.subtotal,
+      tax: view.tax,
+      total: view.total,
+      currency: view.currency,
+      isEmpty: itemCount === 0,
+      isLoading: view.isLoading,
+      isOptimistic: view.isOptimistic,
+      pendingOpCount: view.pendingOpCount,
+      addItem,
+      removeItem,
+      updateQuantity,
+      clearCart,
+      sync,
+      reorder
+    }),
+    [
+      view.items,
+      itemCount,
+      view.subtotal,
+      view.tax,
+      view.total,
+      view.currency,
+      view.isLoading,
+      view.isOptimistic,
+      view.pendingOpCount,
+      addItem,
+      removeItem,
+      updateQuantity,
+      clearCart,
+      sync,
+      reorder
+    ]
   );
-  return useMemo(() => ({
-    items: snapshot.items,
-    itemCount,
-    subtotal: snapshot.subtotal,
-    tax: snapshot.tax,
-    total: snapshot.total,
-    currency: snapshot.currency,
-    isEmpty: itemCount === 0,
-    isLoading: snapshot.isLoading,
-    addItem,
-    removeItem,
-    updateQuantity,
-    clearCart,
-    sync,
-    reorder
-  }), [snapshot.items, itemCount, snapshot.subtotal, snapshot.tax, snapshot.total, snapshot.currency, snapshot.isLoading, addItem, removeItem, updateQuantity, clearCart, sync, reorder]);
 }
 var LOCATION_STORAGE_KEY = "cimplify_location_id";
 var DISPLAY_CURRENCY_STORAGE_KEY = "cimplify_display_currency";
@@ -1120,7 +1208,8 @@ var CimplifyStateContext = createContext(null);
 function CimplifyProvider({
   client,
   children,
-  onLocationChange
+  onLocationChange,
+  optimistic = true
 }) {
   const resolvedClient = useMemo(() => client ?? createDefaultClient(), [client]);
   const onLocationChangeRef = useRef(onLocationChange);
@@ -1264,7 +1353,8 @@ function CimplifyProvider({
       locations,
       isReady,
       isDemoMode,
-      baseCurrency
+      baseCurrency,
+      optimistic
     }),
     [
       resolvedClient,
@@ -1272,7 +1362,8 @@ function CimplifyProvider({
       baseCurrency,
       locations,
       isReady,
-      isDemoMode
+      isDemoMode,
+      optimistic
     ]
   );
   const stateContextValue = useMemo(
@@ -6350,85 +6441,94 @@ function CartLineItemRow({
   });
   const hasComposite = item.compositeSelections && item.compositeSelections.length > 0;
   const hasBundle = item.bundleSelections && item.bundleSelections.length > 0;
-  return /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-item": true, className: classNames?.item, children: [
-    /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-item-info": true, children: [
-      /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-name": true, className: classNames?.itemName, children: item.product.name }),
-      item.variant && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-variant": true, children: getVariantDisplayName(item.variant, item.product.name) }),
-      item.addOnOptions && item.addOnOptions.length > 0 && /* @__PURE__ */ jsxs("span", { "data-cimplify-cart-item-addons": true, children: [
-        "+ ",
-        item.addOnOptions.map((opt) => opt.name).join(", ")
-      ] }),
-      (hasComposite || hasBundle) && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-badge": true, children: hasComposite ? "Custom" : "Bundle" }),
-      item.specialInstructions && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-instructions": true, className: "text-xs text-muted-foreground", children: item.specialInstructions }),
-      item.customerInputs && item.customerInputs.length > 0 && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-customer-inputs": true, className: classNames?.customerInputs, children: item.customerInputs.map((input) => /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-input": true, children: [
-        /* @__PURE__ */ jsx("span", { "data-cimplify-cart-input-label": true, children: input.field_name }),
-        /* @__PURE__ */ jsx("span", { "data-cimplify-cart-input-value": true, children: input.field_type === INPUT_FIELD_TYPE.File || input.field_type === INPUT_FIELD_TYPE.Image ? String(input.value).split("/").pop() || "Uploaded file" : String(input.value) })
-      ] }, input.field_id)) }),
-      (item.lineType === "service" || item.product.type === "service") && item.scheduledStart && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-service-info": true, className: classNames?.serviceInfo, children: [
-        /* @__PURE__ */ jsxs("span", { children: [
-          "\u{1F4C5}",
-          " ",
-          new Date(item.scheduledStart).toLocaleDateString(),
-          " at ",
-          new Date(item.scheduledStart).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })
-        ] }),
-        item.confirmationCode && /* @__PURE__ */ jsxs("span", { children: [
-          "Confirmation: ",
-          item.confirmationCode
-        ] }),
-        item.serviceStatus && /* @__PURE__ */ jsx("span", { "data-status": item.serviceStatus, children: item.serviceStatus })
-      ] }),
-      (item.lineType === "digital" || item.product.type === "digital") && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-digital-info": true, className: classNames?.digitalInfo, children: /* @__PURE__ */ jsxs("span", { children: [
-        "\u26A1",
-        " Instant digital delivery"
-      ] }) }),
-      item.bundleResolved && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-bundle-breakdown": true, className: classNames?.bundleBreakdown, children: item.bundleResolved.selections.map((sel) => /* @__PURE__ */ jsxs("div", { "data-product-type": sel.product_type, children: [
-        /* @__PURE__ */ jsxs("span", { children: [
-          sel.quantity,
-          "\xD7 ",
-          sel.product_name
-        ] }),
-        sel.product_type === "service" && sel.scheduling?.scheduled_start && /* @__PURE__ */ jsxs("span", { children: [
-          " \u2014 ",
-          new Date(sel.scheduling.scheduled_start).toLocaleDateString()
-        ] }),
-        sel.product_type === "digital" && /* @__PURE__ */ jsx("span", { children: " \u2014 Digital" })
-      ] }, sel.component_id)) }),
-      item.compositeResolved && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-composite-breakdown": true, className: classNames?.compositeBreakdown, children: item.compositeResolved.selections.map((sel) => /* @__PURE__ */ jsxs("div", { "data-product-type": sel.product_type, children: [
-        /* @__PURE__ */ jsxs("span", { children: [
-          sel.quantity,
-          "\xD7 ",
-          sel.component_name
+  const isOptimistic = item.isOptimistic === true;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-cimplify-cart-item": true,
+      "data-optimistic": isOptimistic ? "true" : void 0,
+      className: classNames?.item,
+      children: [
+        /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-item-info": true, children: [
+          /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-name": true, className: classNames?.itemName, children: item.product.name }),
+          item.variant && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-variant": true, children: getVariantDisplayName(item.variant, item.product.name) }),
+          item.addOnOptions && item.addOnOptions.length > 0 && /* @__PURE__ */ jsxs("span", { "data-cimplify-cart-item-addons": true, children: [
+            "+ ",
+            item.addOnOptions.map((opt) => opt.name).join(", ")
+          ] }),
+          (hasComposite || hasBundle) && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-badge": true, children: hasComposite ? "Custom" : "Bundle" }),
+          item.specialInstructions && /* @__PURE__ */ jsx("span", { "data-cimplify-cart-item-instructions": true, className: "text-xs text-muted-foreground", children: item.specialInstructions }),
+          item.customerInputs && item.customerInputs.length > 0 && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-customer-inputs": true, className: classNames?.customerInputs, children: item.customerInputs.map((input) => /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-input": true, children: [
+            /* @__PURE__ */ jsx("span", { "data-cimplify-cart-input-label": true, children: input.field_name }),
+            /* @__PURE__ */ jsx("span", { "data-cimplify-cart-input-value": true, children: input.field_type === INPUT_FIELD_TYPE.File || input.field_type === INPUT_FIELD_TYPE.Image ? String(input.value).split("/").pop() || "Uploaded file" : String(input.value) })
+          ] }, input.field_id)) }),
+          (item.lineType === "service" || item.product.type === "service") && item.scheduledStart && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-service-info": true, className: classNames?.serviceInfo, children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              "\u{1F4C5}",
+              " ",
+              new Date(item.scheduledStart).toLocaleDateString(),
+              " at ",
+              new Date(item.scheduledStart).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" })
+            ] }),
+            item.confirmationCode && /* @__PURE__ */ jsxs("span", { children: [
+              "Confirmation: ",
+              item.confirmationCode
+            ] }),
+            item.serviceStatus && /* @__PURE__ */ jsx("span", { "data-status": item.serviceStatus, children: item.serviceStatus })
+          ] }),
+          (item.lineType === "digital" || item.product.type === "digital") && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-digital-info": true, className: classNames?.digitalInfo, children: /* @__PURE__ */ jsxs("span", { children: [
+            "\u26A1",
+            " Instant digital delivery"
+          ] }) }),
+          item.bundleResolved && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-bundle-breakdown": true, className: classNames?.bundleBreakdown, children: item.bundleResolved.selections.map((sel) => /* @__PURE__ */ jsxs("div", { "data-product-type": sel.product_type, children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              sel.quantity,
+              "\xD7 ",
+              sel.product_name
+            ] }),
+            sel.product_type === "service" && sel.scheduling?.scheduled_start && /* @__PURE__ */ jsxs("span", { children: [
+              " \u2014 ",
+              new Date(sel.scheduling.scheduled_start).toLocaleDateString()
+            ] }),
+            sel.product_type === "digital" && /* @__PURE__ */ jsx("span", { children: " \u2014 Digital" })
+          ] }, sel.component_id)) }),
+          item.compositeResolved && /* @__PURE__ */ jsx("div", { "data-cimplify-cart-composite-breakdown": true, className: classNames?.compositeBreakdown, children: item.compositeResolved.selections.map((sel) => /* @__PURE__ */ jsxs("div", { "data-product-type": sel.product_type, children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              sel.quantity,
+              "\xD7 ",
+              sel.component_name
+            ] }),
+            sel.product_type === "service" && sel.scheduling?.scheduled_start && /* @__PURE__ */ jsxs("span", { children: [
+              " \u2014 ",
+              new Date(sel.scheduling.scheduled_start).toLocaleDateString()
+            ] })
+          ] }, sel.component_id)) }),
+          /* @__PURE__ */ jsx(Price, { amount: unitPrice, className: classNames?.itemPrice })
         ] }),
-        sel.product_type === "service" && sel.scheduling?.scheduled_start && /* @__PURE__ */ jsxs("span", { children: [
-          " \u2014 ",
-          new Date(sel.scheduling.scheduled_start).toLocaleDateString()
+        /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-item-controls": true, className: classNames?.quantity, children: [
+          /* @__PURE__ */ jsx(
+            QuantitySelector,
+            {
+              value: item.quantity,
+              onChange: (qty) => onQuantityChange(item.id, qty),
+              min: 0
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              onClick: () => onRemove(item.id),
+              "data-cimplify-cart-item-remove": true,
+              className: classNames?.removeButton,
+              "aria-label": `Remove ${item.product.name}`,
+              children: "Remove"
+            }
+          )
         ] })
-      ] }, sel.component_id)) }),
-      /* @__PURE__ */ jsx(Price, { amount: unitPrice, className: classNames?.itemPrice })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-item-controls": true, className: classNames?.quantity, children: [
-      /* @__PURE__ */ jsx(
-        QuantitySelector,
-        {
-          value: item.quantity,
-          onChange: (qty) => onQuantityChange(item.id, qty),
-          min: 0
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          onClick: () => onRemove(item.id),
-          "data-cimplify-cart-item-remove": true,
-          className: classNames?.removeButton,
-          "aria-label": `Remove ${item.product.name}`,
-          children: "Remove"
-        }
-      )
-    ] })
-  ] });
+      ]
+    }
+  );
 }
 function CartSummary({
   cart: serverCart,
@@ -6439,7 +6539,18 @@ function CartSummary({
   className,
   classNames
 }) {
-  const { items, itemCount, subtotal, tax, total, isEmpty, removeItem, updateQuantity } = useCart();
+  const {
+    items,
+    itemCount,
+    subtotal,
+    tax,
+    total,
+    isEmpty,
+    isOptimistic,
+    pendingOpCount,
+    removeItem,
+    updateQuantity
+  } = useCart();
   const deliveryFee = serverCart?.delivery_fee;
   const serviceCharge = serverCart?.service_charge;
   const totalDiscounts = serverCart?.total_discounts;
@@ -6457,60 +6568,69 @@ function CartSummary({
       void updateQuantity(itemId, qty);
     }
   };
-  return /* @__PURE__ */ jsx("div", { "data-cimplify-cart-summary": true, className: cn(className, classNames?.root), children: isEmpty ? /* @__PURE__ */ jsx("div", { "data-cimplify-cart-empty": true, className: classNames?.empty, children: /* @__PURE__ */ jsx("p", { children: emptyMessage }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { "data-cimplify-cart-items": true, children: items.map((item) => /* @__PURE__ */ jsx(
-      CartLineItemRow,
-      {
-        item,
-        onRemove: handleRemove,
-        onQuantityChange: handleQuantityChange,
-        classNames
-      },
-      item.id
-    )) }),
-    /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-totals": true, className: classNames?.totals, children: [
-      /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-subtotal": true, className: classNames?.subtotal, children: [
-        /* @__PURE__ */ jsxs("span", { children: [
-          "Subtotal (",
-          itemCount,
-          " ",
-          itemCount === 1 ? "item" : "items",
-          ")"
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-cimplify-cart-summary": true,
+      "data-optimistic": isOptimistic ? "true" : void 0,
+      "data-pending-ops": pendingOpCount > 0 ? pendingOpCount : void 0,
+      className: cn(className, classNames?.root),
+      children: isEmpty ? /* @__PURE__ */ jsx("div", { "data-cimplify-cart-empty": true, className: classNames?.empty, children: /* @__PURE__ */ jsx("p", { children: emptyMessage }) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { "data-cimplify-cart-items": true, children: items.map((item) => /* @__PURE__ */ jsx(
+          CartLineItemRow,
+          {
+            item,
+            onRemove: handleRemove,
+            onQuantityChange: handleQuantityChange,
+            classNames
+          },
+          item.id
+        )) }),
+        /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-totals": true, className: classNames?.totals, children: [
+          /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-subtotal": true, className: classNames?.subtotal, children: [
+            /* @__PURE__ */ jsxs("span", { children: [
+              "Subtotal (",
+              itemCount,
+              " ",
+              itemCount === 1 ? "item" : "items",
+              ")"
+            ] }),
+            /* @__PURE__ */ jsx(Price, { amount: subtotal })
+          ] }),
+          totalDiscounts != null && parsePrice(totalDiscounts) > 0 && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-discount": true, className: classNames?.discount, children: [
+            /* @__PURE__ */ jsx("span", { children: "Discount" }),
+            /* @__PURE__ */ jsx(Price, { amount: totalDiscounts, prefix: "-" })
+          ] }),
+          deliveryFee != null && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-delivery-fee": true, className: classNames?.deliveryFee, children: [
+            /* @__PURE__ */ jsx("span", { children: "Delivery fee" }),
+            parsePrice(deliveryFee) > 0 ? /* @__PURE__ */ jsx(Price, { amount: deliveryFee }) : /* @__PURE__ */ jsx("span", { children: "Free delivery" })
+          ] }),
+          serviceCharge != null && parsePrice(serviceCharge) > 0 && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-service-charge": true, className: classNames?.serviceCharge, children: [
+            /* @__PURE__ */ jsx("span", { children: "Service charge" }),
+            /* @__PURE__ */ jsx(Price, { amount: serviceCharge })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-tax": true, className: classNames?.tax, children: [
+            /* @__PURE__ */ jsx("span", { children: "Tax" }),
+            /* @__PURE__ */ jsx(Price, { amount: tax })
+          ] }),
+          /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-total": true, className: classNames?.total, children: [
+            /* @__PURE__ */ jsx("span", { children: "Total" }),
+            /* @__PURE__ */ jsx(Price, { amount: total })
+          ] })
         ] }),
-        /* @__PURE__ */ jsx(Price, { amount: subtotal })
-      ] }),
-      totalDiscounts != null && parsePrice(totalDiscounts) > 0 && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-discount": true, className: classNames?.discount, children: [
-        /* @__PURE__ */ jsx("span", { children: "Discount" }),
-        /* @__PURE__ */ jsx(Price, { amount: totalDiscounts, prefix: "-" })
-      ] }),
-      deliveryFee != null && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-delivery-fee": true, className: classNames?.deliveryFee, children: [
-        /* @__PURE__ */ jsx("span", { children: "Delivery fee" }),
-        parsePrice(deliveryFee) > 0 ? /* @__PURE__ */ jsx(Price, { amount: deliveryFee }) : /* @__PURE__ */ jsx("span", { children: "Free delivery" })
-      ] }),
-      serviceCharge != null && parsePrice(serviceCharge) > 0 && /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-service-charge": true, className: classNames?.serviceCharge, children: [
-        /* @__PURE__ */ jsx("span", { children: "Service charge" }),
-        /* @__PURE__ */ jsx(Price, { amount: serviceCharge })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-tax": true, className: classNames?.tax, children: [
-        /* @__PURE__ */ jsx("span", { children: "Tax" }),
-        /* @__PURE__ */ jsx(Price, { amount: tax })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { "data-cimplify-cart-total": true, className: classNames?.total, children: [
-        /* @__PURE__ */ jsx("span", { children: "Total" }),
-        /* @__PURE__ */ jsx(Price, { amount: total })
+        onCheckout && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onCheckout,
+            "data-cimplify-cart-checkout": true,
+            className: classNames?.checkout,
+            children: "Proceed to Checkout"
+          }
+        )
       ] })
-    ] }),
-    onCheckout && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: onCheckout,
-        "data-cimplify-cart-checkout": true,
-        className: classNames?.checkout,
-        children: "Proceed to Checkout"
-      }
-    )
-  ] }) });
+    }
+  );
 }
 function AvailabilityBadge({
   product,