@commercengine/checkout 0.1.0

package/dist/react.js

@@ -0,0 +1,100 @@
+import { a as subscribeToCheckout, i as initCheckout, n as destroyCheckout, r as getCheckout, t as checkoutStore } from "./store.js";
+import { useStore } from "zustand";
+import { useShallow } from "zustand/react/shallow";
+
+//#region src/react.ts
+/**
+* Commerce Engine Checkout - React Binding
+*
+* React hook for checkout integration with automatic state synchronization.
+*
+* @example
+* ```tsx
+* import { useCheckout, initCheckout } from "@commercengine/checkout/react";
+*
+* // Initialize once at app root
+* function App() {
+*   useEffect(() => {
+*     initCheckout({
+*       storeId: "store_xxx",
+*       apiKey: "ak_xxx",
+*       onComplete: (order) => router.push("/thank-you"),
+*     });
+*     return () => destroyCheckout();
+*   }, []);
+*
+*   return <>{children}</>;
+* }
+*
+* // Use anywhere - no provider needed
+* function Header() {
+*   const { cartCount, openCart, isReady } = useCheckout();
+*
+*   return (
+*     <button onClick={openCart} disabled={!isReady}>
+*       Cart ({cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @packageDocumentation
+*/
+/**
+* React hook for checkout integration
+*
+* Provides reactive access to checkout state and methods.
+* No provider required - works anywhere in your component tree.
+*
+* @returns Checkout state and methods
+*
+* @example Basic usage
+* ```tsx
+* function CartButton() {
+*   const { cartCount, openCart, isReady } = useCheckout();
+*
+*   return (
+*     <button onClick={openCart} disabled={!isReady}>
+*       Cart ({cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @example Add to cart
+* ```tsx
+* function ProductCard({ product }) {
+*   const { addToCart } = useCheckout();
+*
+*   return (
+*     <button onClick={() => addToCart(product.id, product.variantId, 1)}>
+*       Add to Cart
+*     </button>
+*   );
+* }
+* ```
+*/
+function useCheckout() {
+	const state = useStore(checkoutStore, useShallow((s) => ({
+		isReady: s.isReady,
+		isOpen: s.isOpen,
+		cartCount: s.cartCount,
+		cartTotal: s.cartTotal,
+		cartCurrency: s.cartCurrency
+	})));
+	const actions = useStore(checkoutStore, useShallow((s) => ({
+		openCart: s.openCart,
+		openCheckout: s.openCheckout,
+		close: s.close,
+		addToCart: s.addToCart,
+		updateTokens: s.updateTokens
+	})));
+	return {
+		...state,
+		...actions
+	};
+}
+
+//#endregion
+export { checkoutStore, destroyCheckout, getCheckout, initCheckout, subscribeToCheckout, useCheckout };
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","names":[],"sources":["../src/react.ts"],"sourcesContent":["/**\n * Commerce Engine Checkout - React Binding\n *\n * React hook for checkout integration with automatic state synchronization.\n *\n * @example\n * ```tsx\n * import { useCheckout, initCheckout } from \"@commercengine/checkout/react\";\n *\n * // Initialize once at app root\n * function App() {\n *   useEffect(() => {\n *     initCheckout({\n *       storeId: \"store_xxx\",\n *       apiKey: \"ak_xxx\",\n *       onComplete: (order) => router.push(\"/thank-you\"),\n *     });\n *     return () => destroyCheckout();\n *   }, []);\n *\n *   return <>{children}</>;\n * }\n *\n * // Use anywhere - no provider needed\n * function Header() {\n *   const { cartCount, openCart, isReady } = useCheckout();\n *\n *   return (\n *     <button onClick={openCart} disabled={!isReady}>\n *       Cart ({cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @packageDocumentation\n */\n\nimport { useStore } from \"zustand\";\nimport { useShallow } from \"zustand/react/shallow\";\nimport { type CheckoutActions, type CheckoutState, checkoutStore } from \"./store\";\n\n// Re-export types from @commercengine/js\nexport type {\n  AddToCartItem,\n  AuthLoginData,\n  AuthLogoutData,\n  AuthMode,\n  AuthRefreshData,\n  CartData,\n  Channel,\n  CheckoutConfig,\n  CheckoutEventType,\n  Environment,\n  ErrorData,\n  LoginMethod,\n  OrderData,\n  QuickBuyConfig,\n  SessionMode,\n  UserInfo,\n} from \"@commercengine/js\";\n// Re-export everything from vanilla for convenience\nexport {\n  type CheckoutActions,\n  type CheckoutState,\n  type CheckoutStore,\n  checkoutStore,\n  destroyCheckout,\n  getCheckout,\n  initCheckout,\n  subscribeToCheckout,\n} from \"./store\";\n\n// =============================================================================\n// TYPES\n// =============================================================================\n\n/**\n * Return type from useCheckout hook\n */\nexport interface UseCheckoutReturn {\n  /** Whether checkout is ready to use */\n  isReady: boolean;\n  /** Whether checkout overlay is currently open */\n  isOpen: boolean;\n  /** Number of items in cart */\n  cartCount: number;\n  /** Cart subtotal amount */\n  cartTotal: number;\n  /** Cart currency code */\n  cartCurrency: string;\n  /** Open the cart drawer */\n  openCart: () => void;\n  /** Open the checkout drawer directly */\n  openCheckout: () => void;\n  /** Close the checkout overlay */\n  close: () => void;\n  /** Add item to cart */\n  addToCart: (productId: string, variantId: string | null, quantity?: number) => void;\n  /** Update authentication tokens */\n  updateTokens: (accessToken: string, refreshToken?: string) => void;\n}\n\n// =============================================================================\n// HOOK\n// =============================================================================\n\n/**\n * React hook for checkout integration\n *\n * Provides reactive access to checkout state and methods.\n * No provider required - works anywhere in your component tree.\n *\n * @returns Checkout state and methods\n *\n * @example Basic usage\n * ```tsx\n * function CartButton() {\n *   const { cartCount, openCart, isReady } = useCheckout();\n *\n *   return (\n *     <button onClick={openCart} disabled={!isReady}>\n *       Cart ({cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @example Add to cart\n * ```tsx\n * function ProductCard({ product }) {\n *   const { addToCart } = useCheckout();\n *\n *   return (\n *     <button onClick={() => addToCart(product.id, product.variantId, 1)}>\n *       Add to Cart\n *     </button>\n *   );\n * }\n * ```\n */\nexport function useCheckout(): UseCheckoutReturn {\n  // Subscribe to state with shallow comparison to prevent unnecessary re-renders\n  const state = useStore(\n    checkoutStore,\n    useShallow((s: CheckoutState) => ({\n      isReady: s.isReady,\n      isOpen: s.isOpen,\n      cartCount: s.cartCount,\n      cartTotal: s.cartTotal,\n      cartCurrency: s.cartCurrency,\n    }))\n  );\n\n  // Actions are stable references from the store\n  const actions = useStore(\n    checkoutStore,\n    useShallow((s: CheckoutActions) => ({\n      openCart: s.openCart,\n      openCheckout: s.openCheckout,\n      close: s.close,\n      addToCart: s.addToCart,\n      updateTokens: s.updateTokens,\n    }))\n  );\n\n  return {\n    ...state,\n    ...actions,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6IA,SAAgB,cAAiC;CAE/C,MAAM,QAAQ,SACZ,eACA,YAAY,OAAsB;EAChC,SAAS,EAAE;EACX,QAAQ,EAAE;EACV,WAAW,EAAE;EACb,WAAW,EAAE;EACb,cAAc,EAAE;EACjB,EAAE,CACJ;CAGD,MAAM,UAAU,SACd,eACA,YAAY,OAAwB;EAClC,UAAU,EAAE;EACZ,cAAc,EAAE;EAChB,OAAO,EAAE;EACT,WAAW,EAAE;EACb,cAAc,EAAE;EACjB,EAAE,CACJ;AAED,QAAO;EACL,GAAG;EACH,GAAG;EACJ"}

package/dist/solid.cjs

@@ -0,0 +1,162 @@
+const require_store = require('./store.cjs');
+let solid_js = require("solid-js");
+
+//#region src/solid.ts
+/**
+* Commerce Engine Checkout - Solid Binding
+*
+* Solid.js primitive for checkout integration with fine-grained reactivity.
+*
+* @example
+* ```tsx
+* import { useCheckout, initCheckout } from "@commercengine/checkout/solid";
+* import { onMount, onCleanup } from "solid-js";
+*
+* // Initialize once at app root
+* function App() {
+*   onMount(() => {
+*     initCheckout({
+*       storeId: "store_xxx",
+*       apiKey: "ak_xxx",
+*     });
+*   });
+*
+*   return <>{props.children}</>;
+* }
+*
+* // Use anywhere
+* function Header() {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+*       Cart ({checkout.cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @packageDocumentation
+*/
+/**
+* Solid.js primitive for checkout integration
+*
+* Returns an object with reactive getters for state and methods for actions.
+* Uses Solid's fine-grained reactivity - components only re-render when
+* accessed values change.
+*
+* @returns Checkout state (reactive getters) and methods
+*
+* @example Basic usage
+* ```tsx
+* function CartButton() {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+*       Cart ({checkout.cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @example Add to cart
+* ```tsx
+* function ProductCard(props) {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>
+*       Add to Cart
+*     </button>
+*   );
+* }
+* ```
+*/
+function useCheckout() {
+	const initialState = require_store.checkoutStore.getState();
+	const [isReady, setIsReady] = (0, solid_js.createSignal)(initialState.isReady);
+	const [isOpen, setIsOpen] = (0, solid_js.createSignal)(initialState.isOpen);
+	const [cartCount, setCartCount] = (0, solid_js.createSignal)(initialState.cartCount);
+	const [cartTotal, setCartTotal] = (0, solid_js.createSignal)(initialState.cartTotal);
+	const [cartCurrency, setCartCurrency] = (0, solid_js.createSignal)(initialState.cartCurrency);
+	const unsubscribe = require_store.checkoutStore.subscribe((state) => {
+		setIsReady(state.isReady);
+		setIsOpen(state.isOpen);
+		setCartCount(state.cartCount);
+		setCartTotal(state.cartTotal);
+		setCartCurrency(state.cartCurrency);
+	});
+	(0, solid_js.onCleanup)(() => {
+		unsubscribe();
+	});
+	return {
+		get isReady() {
+			return isReady();
+		},
+		get isOpen() {
+			return isOpen();
+		},
+		get cartCount() {
+			return cartCount();
+		},
+		get cartTotal() {
+			return cartTotal();
+		},
+		get cartCurrency() {
+			return cartCurrency();
+		},
+		openCart: () => require_store.checkoutStore.getState().openCart(),
+		openCheckout: () => require_store.checkoutStore.getState().openCheckout(),
+		close: () => require_store.checkoutStore.getState().close(),
+		addToCart: (productId, variantId, quantity) => require_store.checkoutStore.getState().addToCart(productId, variantId, quantity),
+		updateTokens: (accessToken, refreshToken) => require_store.checkoutStore.getState().updateTokens(accessToken, refreshToken)
+	};
+}
+/**
+* Create a reactive signal for cart count only
+*
+* Use this when you only need cart count and want minimal re-renders.
+*
+* @example
+* ```tsx
+* function Badge() {
+*   const count = createCartCountSignal();
+*   return <span class="badge">{count()}</span>;
+* }
+* ```
+*/
+function createCartCountSignal() {
+	const [cartCount, setCartCount] = (0, solid_js.createSignal)(require_store.checkoutStore.getState().cartCount);
+	const unsubscribe = require_store.checkoutStore.subscribe((state, prevState) => {
+		if (state.cartCount !== prevState.cartCount) setCartCount(state.cartCount);
+	});
+	(0, solid_js.onCleanup)(() => {
+		unsubscribe();
+	});
+	return cartCount;
+}
+/**
+* Create a reactive signal for ready state only
+*/
+function createIsReadySignal() {
+	const [isReady, setIsReady] = (0, solid_js.createSignal)(require_store.checkoutStore.getState().isReady);
+	const unsubscribe = require_store.checkoutStore.subscribe((state, prevState) => {
+		if (state.isReady !== prevState.isReady) setIsReady(state.isReady);
+	});
+	(0, solid_js.onCleanup)(() => {
+		unsubscribe();
+	});
+	return isReady;
+}
+
+//#endregion
+exports.checkoutStore = require_store.checkoutStore;
+exports.createCartCountSignal = createCartCountSignal;
+exports.createIsReadySignal = createIsReadySignal;
+exports.destroyCheckout = require_store.destroyCheckout;
+exports.getCheckout = require_store.getCheckout;
+exports.initCheckout = require_store.initCheckout;
+exports.subscribeToCheckout = require_store.subscribeToCheckout;
+exports.useCheckout = useCheckout;
+//# sourceMappingURL=solid.cjs.map

package/dist/solid.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"solid.cjs","names":["checkoutStore"],"sources":["../src/solid.ts"],"sourcesContent":["/**\n * Commerce Engine Checkout - Solid Binding\n *\n * Solid.js primitive for checkout integration with fine-grained reactivity.\n *\n * @example\n * ```tsx\n * import { useCheckout, initCheckout } from \"@commercengine/checkout/solid\";\n * import { onMount, onCleanup } from \"solid-js\";\n *\n * // Initialize once at app root\n * function App() {\n *   onMount(() => {\n *     initCheckout({\n *       storeId: \"store_xxx\",\n *       apiKey: \"ak_xxx\",\n *     });\n *   });\n *\n *   return <>{props.children}</>;\n * }\n *\n * // Use anywhere\n * function Header() {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>\n *       Cart ({checkout.cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @packageDocumentation\n */\n\nimport { type Accessor, createSignal, onCleanup } from \"solid-js\";\nimport { checkoutStore } from \"./store\";\n\n// Re-export types from @commercengine/js\nexport type {\n  AddToCartItem,\n  AuthLoginData,\n  AuthLogoutData,\n  AuthMode,\n  AuthRefreshData,\n  CartData,\n  Channel,\n  CheckoutConfig,\n  CheckoutEventType,\n  Environment,\n  ErrorData,\n  LoginMethod,\n  OrderData,\n  QuickBuyConfig,\n  SessionMode,\n  UserInfo,\n} from \"@commercengine/js\";\n// Re-export everything from vanilla for convenience\nexport {\n  type CheckoutActions,\n  type CheckoutState,\n  type CheckoutStore,\n  checkoutStore,\n  destroyCheckout,\n  getCheckout,\n  initCheckout,\n  subscribeToCheckout,\n} from \"./store\";\n\n// =============================================================================\n// TYPES\n// =============================================================================\n\n/**\n * Return type from useCheckout\n *\n * State properties are getters that return reactive values.\n * Actions are regular functions.\n */\nexport interface UseCheckoutReturn {\n  /** Whether checkout is ready to use (reactive getter) */\n  readonly isReady: boolean;\n  /** Whether checkout overlay is currently open (reactive getter) */\n  readonly isOpen: boolean;\n  /** Number of items in cart (reactive getter) */\n  readonly cartCount: number;\n  /** Cart subtotal amount (reactive getter) */\n  readonly cartTotal: number;\n  /** Cart currency code (reactive getter) */\n  readonly cartCurrency: string;\n  /** Open the cart drawer */\n  openCart: () => void;\n  /** Open the checkout drawer directly */\n  openCheckout: () => void;\n  /** Close the checkout overlay */\n  close: () => void;\n  /** Add item to cart */\n  addToCart: (productId: string, variantId: string | null, quantity?: number) => void;\n  /** Update authentication tokens */\n  updateTokens: (accessToken: string, refreshToken?: string) => void;\n}\n\n// =============================================================================\n// PRIMITIVE\n// =============================================================================\n\n/**\n * Solid.js primitive for checkout integration\n *\n * Returns an object with reactive getters for state and methods for actions.\n * Uses Solid's fine-grained reactivity - components only re-render when\n * accessed values change.\n *\n * @returns Checkout state (reactive getters) and methods\n *\n * @example Basic usage\n * ```tsx\n * function CartButton() {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>\n *       Cart ({checkout.cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @example Add to cart\n * ```tsx\n * function ProductCard(props) {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>\n *       Add to Cart\n *     </button>\n *   );\n * }\n * ```\n */\nexport function useCheckout(): UseCheckoutReturn {\n  // Create signals for each piece of state\n  const initialState = checkoutStore.getState();\n\n  const [isReady, setIsReady] = createSignal(initialState.isReady);\n  const [isOpen, setIsOpen] = createSignal(initialState.isOpen);\n  const [cartCount, setCartCount] = createSignal(initialState.cartCount);\n  const [cartTotal, setCartTotal] = createSignal(initialState.cartTotal);\n  const [cartCurrency, setCartCurrency] = createSignal(initialState.cartCurrency);\n\n  // Subscribe to store changes\n  const unsubscribe = checkoutStore.subscribe((state) => {\n    setIsReady(state.isReady);\n    setIsOpen(state.isOpen);\n    setCartCount(state.cartCount);\n    setCartTotal(state.cartTotal);\n    setCartCurrency(state.cartCurrency);\n  });\n\n  // Cleanup on component unmount\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  // Return object with reactive getters\n  return {\n    get isReady() {\n      return isReady();\n    },\n    get isOpen() {\n      return isOpen();\n    },\n    get cartCount() {\n      return cartCount();\n    },\n    get cartTotal() {\n      return cartTotal();\n    },\n    get cartCurrency() {\n      return cartCurrency();\n    },\n    openCart: () => checkoutStore.getState().openCart(),\n    openCheckout: () => checkoutStore.getState().openCheckout(),\n    close: () => checkoutStore.getState().close(),\n    addToCart: (productId, variantId, quantity) =>\n      checkoutStore.getState().addToCart(productId, variantId, quantity),\n    updateTokens: (accessToken, refreshToken) =>\n      checkoutStore.getState().updateTokens(accessToken, refreshToken),\n  };\n}\n\n// =============================================================================\n// INDIVIDUAL SIGNALS (for fine-grained subscriptions)\n// =============================================================================\n\n/**\n * Create a reactive signal for cart count only\n *\n * Use this when you only need cart count and want minimal re-renders.\n *\n * @example\n * ```tsx\n * function Badge() {\n *   const count = createCartCountSignal();\n *   return <span class=\"badge\">{count()}</span>;\n * }\n * ```\n */\nexport function createCartCountSignal(): Accessor<number> {\n  const [cartCount, setCartCount] = createSignal(checkoutStore.getState().cartCount);\n\n  const unsubscribe = checkoutStore.subscribe((state, prevState) => {\n    if (state.cartCount !== prevState.cartCount) {\n      setCartCount(state.cartCount);\n    }\n  });\n\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  return cartCount;\n}\n\n/**\n * Create a reactive signal for ready state only\n */\nexport function createIsReadySignal(): Accessor<boolean> {\n  const [isReady, setIsReady] = createSignal(checkoutStore.getState().isReady);\n\n  const unsubscribe = checkoutStore.subscribe((state, prevState) => {\n    if (state.isReady !== prevState.isReady) {\n      setIsReady(state.isReady);\n    }\n  });\n\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  return isReady;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+IA,SAAgB,cAAiC;CAE/C,MAAM,eAAeA,4BAAc,UAAU;CAE7C,MAAM,CAAC,SAAS,yCAA2B,aAAa,QAAQ;CAChE,MAAM,CAAC,QAAQ,wCAA0B,aAAa,OAAO;CAC7D,MAAM,CAAC,WAAW,2CAA6B,aAAa,UAAU;CACtE,MAAM,CAAC,WAAW,2CAA6B,aAAa,UAAU;CACtE,MAAM,CAAC,cAAc,8CAAgC,aAAa,aAAa;CAG/E,MAAM,cAAcA,4BAAc,WAAW,UAAU;AACrD,aAAW,MAAM,QAAQ;AACzB,YAAU,MAAM,OAAO;AACvB,eAAa,MAAM,UAAU;AAC7B,eAAa,MAAM,UAAU;AAC7B,kBAAgB,MAAM,aAAa;GACnC;AAGF,+BAAgB;AACd,eAAa;GACb;AAGF,QAAO;EACL,IAAI,UAAU;AACZ,UAAO,SAAS;;EAElB,IAAI,SAAS;AACX,UAAO,QAAQ;;EAEjB,IAAI,YAAY;AACd,UAAO,WAAW;;EAEpB,IAAI,YAAY;AACd,UAAO,WAAW;;EAEpB,IAAI,eAAe;AACjB,UAAO,cAAc;;EAEvB,gBAAgBA,4BAAc,UAAU,CAAC,UAAU;EACnD,oBAAoBA,4BAAc,UAAU,CAAC,cAAc;EAC3D,aAAaA,4BAAc,UAAU,CAAC,OAAO;EAC7C,YAAY,WAAW,WAAW,aAChCA,4BAAc,UAAU,CAAC,UAAU,WAAW,WAAW,SAAS;EACpE,eAAe,aAAa,iBAC1BA,4BAAc,UAAU,CAAC,aAAa,aAAa,aAAa;EACnE;;;;;;;;;;;;;;;AAoBH,SAAgB,wBAA0C;CACxD,MAAM,CAAC,WAAW,2CAA6BA,4BAAc,UAAU,CAAC,UAAU;CAElF,MAAM,cAAcA,4BAAc,WAAW,OAAO,cAAc;AAChE,MAAI,MAAM,cAAc,UAAU,UAChC,cAAa,MAAM,UAAU;GAE/B;AAEF,+BAAgB;AACd,eAAa;GACb;AAEF,QAAO;;;;;AAMT,SAAgB,sBAAyC;CACvD,MAAM,CAAC,SAAS,yCAA2BA,4BAAc,UAAU,CAAC,QAAQ;CAE5E,MAAM,cAAcA,4BAAc,WAAW,OAAO,cAAc;AAChE,MAAI,MAAM,YAAY,UAAU,QAC9B,YAAW,MAAM,QAAQ;GAE3B;AAEF,+BAAgB;AACd,eAAa;GACb;AAEF,QAAO"}

package/dist/solid.d.cts

@@ -0,0 +1,92 @@
+import { a as destroyCheckout, c as subscribeToCheckout, i as checkoutStore, n as CheckoutState, o as getCheckout, r as CheckoutStore, s as initCheckout, t as CheckoutActions } from "./store.cjs";
+import { AddToCartItem, AuthLoginData, AuthLogoutData, AuthMode, AuthRefreshData, CartData, Channel, CheckoutConfig, CheckoutEventType, Environment, ErrorData, LoginMethod, OrderData, QuickBuyConfig, SessionMode, UserInfo } from "@commercengine/js";
+import { Accessor } from "solid-js";
+
+//#region src/solid.d.ts
+
+/**
+ * Return type from useCheckout
+ *
+ * State properties are getters that return reactive values.
+ * Actions are regular functions.
+ */
+interface UseCheckoutReturn {
+  /** Whether checkout is ready to use (reactive getter) */
+  readonly isReady: boolean;
+  /** Whether checkout overlay is currently open (reactive getter) */
+  readonly isOpen: boolean;
+  /** Number of items in cart (reactive getter) */
+  readonly cartCount: number;
+  /** Cart subtotal amount (reactive getter) */
+  readonly cartTotal: number;
+  /** Cart currency code (reactive getter) */
+  readonly cartCurrency: string;
+  /** Open the cart drawer */
+  openCart: () => void;
+  /** Open the checkout drawer directly */
+  openCheckout: () => void;
+  /** Close the checkout overlay */
+  close: () => void;
+  /** Add item to cart */
+  addToCart: (productId: string, variantId: string | null, quantity?: number) => void;
+  /** Update authentication tokens */
+  updateTokens: (accessToken: string, refreshToken?: string) => void;
+}
+/**
+ * Solid.js primitive for checkout integration
+ *
+ * Returns an object with reactive getters for state and methods for actions.
+ * Uses Solid's fine-grained reactivity - components only re-render when
+ * accessed values change.
+ *
+ * @returns Checkout state (reactive getters) and methods
+ *
+ * @example Basic usage
+ * ```tsx
+ * function CartButton() {
+ *   const checkout = useCheckout();
+ *
+ *   return (
+ *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+ *       Cart ({checkout.cartCount})
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * @example Add to cart
+ * ```tsx
+ * function ProductCard(props) {
+ *   const checkout = useCheckout();
+ *
+ *   return (
+ *     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>
+ *       Add to Cart
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+declare function useCheckout(): UseCheckoutReturn;
+/**
+ * Create a reactive signal for cart count only
+ *
+ * Use this when you only need cart count and want minimal re-renders.
+ *
+ * @example
+ * ```tsx
+ * function Badge() {
+ *   const count = createCartCountSignal();
+ *   return <span class="badge">{count()}</span>;
+ * }
+ * ```
+ */
+declare function createCartCountSignal(): Accessor<number>;
+/**
+ * Create a reactive signal for ready state only
+ */
+declare function createIsReadySignal(): Accessor<boolean>;
+//# sourceMappingURL=solid.d.ts.map
+//#endregion
+export { type AddToCartItem, type AuthLoginData, type AuthLogoutData, type AuthMode, type AuthRefreshData, type CartData, type Channel, type CheckoutActions, type CheckoutConfig, type CheckoutEventType, type CheckoutState, type CheckoutStore, type Environment, type ErrorData, type LoginMethod, type OrderData, type QuickBuyConfig, type SessionMode, UseCheckoutReturn, type UserInfo, checkoutStore, createCartCountSignal, createIsReadySignal, destroyCheckout, getCheckout, initCheckout, subscribeToCheckout, useCheckout };
+//# sourceMappingURL=solid.d.cts.map

package/dist/solid.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"solid.d.cts","names":[],"sources":["../src/solid.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;UAiFiB,iBAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA8DD,WAAA,CAAA,GAAe;;;;;;;;;;;;;;iBAoEf,qBAAA,CAAA,GAAyB;;;;iBAmBzB,mBAAA,CAAA,GAAuB"}

package/dist/solid.d.ts

@@ -0,0 +1,92 @@
+import { a as destroyCheckout, c as subscribeToCheckout, i as checkoutStore, n as CheckoutState, o as getCheckout, r as CheckoutStore, s as initCheckout, t as CheckoutActions } from "./store.js";
+import { AddToCartItem, AuthLoginData, AuthLogoutData, AuthMode, AuthRefreshData, CartData, Channel, CheckoutConfig, CheckoutEventType, Environment, ErrorData, LoginMethod, OrderData, QuickBuyConfig, SessionMode, UserInfo } from "@commercengine/js";
+import { Accessor } from "solid-js";
+
+//#region src/solid.d.ts
+
+/**
+ * Return type from useCheckout
+ *
+ * State properties are getters that return reactive values.
+ * Actions are regular functions.
+ */
+interface UseCheckoutReturn {
+  /** Whether checkout is ready to use (reactive getter) */
+  readonly isReady: boolean;
+  /** Whether checkout overlay is currently open (reactive getter) */
+  readonly isOpen: boolean;
+  /** Number of items in cart (reactive getter) */
+  readonly cartCount: number;
+  /** Cart subtotal amount (reactive getter) */
+  readonly cartTotal: number;
+  /** Cart currency code (reactive getter) */
+  readonly cartCurrency: string;
+  /** Open the cart drawer */
+  openCart: () => void;
+  /** Open the checkout drawer directly */
+  openCheckout: () => void;
+  /** Close the checkout overlay */
+  close: () => void;
+  /** Add item to cart */
+  addToCart: (productId: string, variantId: string | null, quantity?: number) => void;
+  /** Update authentication tokens */
+  updateTokens: (accessToken: string, refreshToken?: string) => void;
+}
+/**
+ * Solid.js primitive for checkout integration
+ *
+ * Returns an object with reactive getters for state and methods for actions.
+ * Uses Solid's fine-grained reactivity - components only re-render when
+ * accessed values change.
+ *
+ * @returns Checkout state (reactive getters) and methods
+ *
+ * @example Basic usage
+ * ```tsx
+ * function CartButton() {
+ *   const checkout = useCheckout();
+ *
+ *   return (
+ *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+ *       Cart ({checkout.cartCount})
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * @example Add to cart
+ * ```tsx
+ * function ProductCard(props) {
+ *   const checkout = useCheckout();
+ *
+ *   return (
+ *     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>
+ *       Add to Cart
+ *     </button>
+ *   );
+ * }
+ * ```
+ */
+declare function useCheckout(): UseCheckoutReturn;
+/**
+ * Create a reactive signal for cart count only
+ *
+ * Use this when you only need cart count and want minimal re-renders.
+ *
+ * @example
+ * ```tsx
+ * function Badge() {
+ *   const count = createCartCountSignal();
+ *   return <span class="badge">{count()}</span>;
+ * }
+ * ```
+ */
+declare function createCartCountSignal(): Accessor<number>;
+/**
+ * Create a reactive signal for ready state only
+ */
+declare function createIsReadySignal(): Accessor<boolean>;
+//# sourceMappingURL=solid.d.ts.map
+//#endregion
+export { type AddToCartItem, type AuthLoginData, type AuthLogoutData, type AuthMode, type AuthRefreshData, type CartData, type Channel, type CheckoutActions, type CheckoutConfig, type CheckoutEventType, type CheckoutState, type CheckoutStore, type Environment, type ErrorData, type LoginMethod, type OrderData, type QuickBuyConfig, type SessionMode, UseCheckoutReturn, type UserInfo, checkoutStore, createCartCountSignal, createIsReadySignal, destroyCheckout, getCheckout, initCheckout, subscribeToCheckout, useCheckout };
+//# sourceMappingURL=solid.d.ts.map

package/dist/solid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"solid.d.ts","names":[],"sources":["../src/solid.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;UAiFiB,iBAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iBA8DD,WAAA,CAAA,GAAe;;;;;;;;;;;;;;iBAoEf,qBAAA,CAAA,GAAyB;;;;iBAmBzB,mBAAA,CAAA,GAAuB"}

package/dist/solid.js

@@ -0,0 +1,155 @@
+import { a as subscribeToCheckout, i as initCheckout, n as destroyCheckout, r as getCheckout, t as checkoutStore } from "./store.js";
+import { createSignal, onCleanup } from "solid-js";
+
+//#region src/solid.ts
+/**
+* Commerce Engine Checkout - Solid Binding
+*
+* Solid.js primitive for checkout integration with fine-grained reactivity.
+*
+* @example
+* ```tsx
+* import { useCheckout, initCheckout } from "@commercengine/checkout/solid";
+* import { onMount, onCleanup } from "solid-js";
+*
+* // Initialize once at app root
+* function App() {
+*   onMount(() => {
+*     initCheckout({
+*       storeId: "store_xxx",
+*       apiKey: "ak_xxx",
+*     });
+*   });
+*
+*   return <>{props.children}</>;
+* }
+*
+* // Use anywhere
+* function Header() {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+*       Cart ({checkout.cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @packageDocumentation
+*/
+/**
+* Solid.js primitive for checkout integration
+*
+* Returns an object with reactive getters for state and methods for actions.
+* Uses Solid's fine-grained reactivity - components only re-render when
+* accessed values change.
+*
+* @returns Checkout state (reactive getters) and methods
+*
+* @example Basic usage
+* ```tsx
+* function CartButton() {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>
+*       Cart ({checkout.cartCount})
+*     </button>
+*   );
+* }
+* ```
+*
+* @example Add to cart
+* ```tsx
+* function ProductCard(props) {
+*   const checkout = useCheckout();
+*
+*   return (
+*     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>
+*       Add to Cart
+*     </button>
+*   );
+* }
+* ```
+*/
+function useCheckout() {
+	const initialState = checkoutStore.getState();
+	const [isReady, setIsReady] = createSignal(initialState.isReady);
+	const [isOpen, setIsOpen] = createSignal(initialState.isOpen);
+	const [cartCount, setCartCount] = createSignal(initialState.cartCount);
+	const [cartTotal, setCartTotal] = createSignal(initialState.cartTotal);
+	const [cartCurrency, setCartCurrency] = createSignal(initialState.cartCurrency);
+	const unsubscribe = checkoutStore.subscribe((state) => {
+		setIsReady(state.isReady);
+		setIsOpen(state.isOpen);
+		setCartCount(state.cartCount);
+		setCartTotal(state.cartTotal);
+		setCartCurrency(state.cartCurrency);
+	});
+	onCleanup(() => {
+		unsubscribe();
+	});
+	return {
+		get isReady() {
+			return isReady();
+		},
+		get isOpen() {
+			return isOpen();
+		},
+		get cartCount() {
+			return cartCount();
+		},
+		get cartTotal() {
+			return cartTotal();
+		},
+		get cartCurrency() {
+			return cartCurrency();
+		},
+		openCart: () => checkoutStore.getState().openCart(),
+		openCheckout: () => checkoutStore.getState().openCheckout(),
+		close: () => checkoutStore.getState().close(),
+		addToCart: (productId, variantId, quantity) => checkoutStore.getState().addToCart(productId, variantId, quantity),
+		updateTokens: (accessToken, refreshToken) => checkoutStore.getState().updateTokens(accessToken, refreshToken)
+	};
+}
+/**
+* Create a reactive signal for cart count only
+*
+* Use this when you only need cart count and want minimal re-renders.
+*
+* @example
+* ```tsx
+* function Badge() {
+*   const count = createCartCountSignal();
+*   return <span class="badge">{count()}</span>;
+* }
+* ```
+*/
+function createCartCountSignal() {
+	const [cartCount, setCartCount] = createSignal(checkoutStore.getState().cartCount);
+	const unsubscribe = checkoutStore.subscribe((state, prevState) => {
+		if (state.cartCount !== prevState.cartCount) setCartCount(state.cartCount);
+	});
+	onCleanup(() => {
+		unsubscribe();
+	});
+	return cartCount;
+}
+/**
+* Create a reactive signal for ready state only
+*/
+function createIsReadySignal() {
+	const [isReady, setIsReady] = createSignal(checkoutStore.getState().isReady);
+	const unsubscribe = checkoutStore.subscribe((state, prevState) => {
+		if (state.isReady !== prevState.isReady) setIsReady(state.isReady);
+	});
+	onCleanup(() => {
+		unsubscribe();
+	});
+	return isReady;
+}
+
+//#endregion
+export { checkoutStore, createCartCountSignal, createIsReadySignal, destroyCheckout, getCheckout, initCheckout, subscribeToCheckout, useCheckout };
+//# sourceMappingURL=solid.js.map

package/dist/solid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"solid.js","names":[],"sources":["../src/solid.ts"],"sourcesContent":["/**\n * Commerce Engine Checkout - Solid Binding\n *\n * Solid.js primitive for checkout integration with fine-grained reactivity.\n *\n * @example\n * ```tsx\n * import { useCheckout, initCheckout } from \"@commercengine/checkout/solid\";\n * import { onMount, onCleanup } from \"solid-js\";\n *\n * // Initialize once at app root\n * function App() {\n *   onMount(() => {\n *     initCheckout({\n *       storeId: \"store_xxx\",\n *       apiKey: \"ak_xxx\",\n *     });\n *   });\n *\n *   return <>{props.children}</>;\n * }\n *\n * // Use anywhere\n * function Header() {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>\n *       Cart ({checkout.cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @packageDocumentation\n */\n\nimport { type Accessor, createSignal, onCleanup } from \"solid-js\";\nimport { checkoutStore } from \"./store\";\n\n// Re-export types from @commercengine/js\nexport type {\n  AddToCartItem,\n  AuthLoginData,\n  AuthLogoutData,\n  AuthMode,\n  AuthRefreshData,\n  CartData,\n  Channel,\n  CheckoutConfig,\n  CheckoutEventType,\n  Environment,\n  ErrorData,\n  LoginMethod,\n  OrderData,\n  QuickBuyConfig,\n  SessionMode,\n  UserInfo,\n} from \"@commercengine/js\";\n// Re-export everything from vanilla for convenience\nexport {\n  type CheckoutActions,\n  type CheckoutState,\n  type CheckoutStore,\n  checkoutStore,\n  destroyCheckout,\n  getCheckout,\n  initCheckout,\n  subscribeToCheckout,\n} from \"./store\";\n\n// =============================================================================\n// TYPES\n// =============================================================================\n\n/**\n * Return type from useCheckout\n *\n * State properties are getters that return reactive values.\n * Actions are regular functions.\n */\nexport interface UseCheckoutReturn {\n  /** Whether checkout is ready to use (reactive getter) */\n  readonly isReady: boolean;\n  /** Whether checkout overlay is currently open (reactive getter) */\n  readonly isOpen: boolean;\n  /** Number of items in cart (reactive getter) */\n  readonly cartCount: number;\n  /** Cart subtotal amount (reactive getter) */\n  readonly cartTotal: number;\n  /** Cart currency code (reactive getter) */\n  readonly cartCurrency: string;\n  /** Open the cart drawer */\n  openCart: () => void;\n  /** Open the checkout drawer directly */\n  openCheckout: () => void;\n  /** Close the checkout overlay */\n  close: () => void;\n  /** Add item to cart */\n  addToCart: (productId: string, variantId: string | null, quantity?: number) => void;\n  /** Update authentication tokens */\n  updateTokens: (accessToken: string, refreshToken?: string) => void;\n}\n\n// =============================================================================\n// PRIMITIVE\n// =============================================================================\n\n/**\n * Solid.js primitive for checkout integration\n *\n * Returns an object with reactive getters for state and methods for actions.\n * Uses Solid's fine-grained reactivity - components only re-render when\n * accessed values change.\n *\n * @returns Checkout state (reactive getters) and methods\n *\n * @example Basic usage\n * ```tsx\n * function CartButton() {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.openCart()} disabled={!checkout.isReady}>\n *       Cart ({checkout.cartCount})\n *     </button>\n *   );\n * }\n * ```\n *\n * @example Add to cart\n * ```tsx\n * function ProductCard(props) {\n *   const checkout = useCheckout();\n *\n *   return (\n *     <button onClick={() => checkout.addToCart(props.product.id, props.product.variantId, 1)}>\n *       Add to Cart\n *     </button>\n *   );\n * }\n * ```\n */\nexport function useCheckout(): UseCheckoutReturn {\n  // Create signals for each piece of state\n  const initialState = checkoutStore.getState();\n\n  const [isReady, setIsReady] = createSignal(initialState.isReady);\n  const [isOpen, setIsOpen] = createSignal(initialState.isOpen);\n  const [cartCount, setCartCount] = createSignal(initialState.cartCount);\n  const [cartTotal, setCartTotal] = createSignal(initialState.cartTotal);\n  const [cartCurrency, setCartCurrency] = createSignal(initialState.cartCurrency);\n\n  // Subscribe to store changes\n  const unsubscribe = checkoutStore.subscribe((state) => {\n    setIsReady(state.isReady);\n    setIsOpen(state.isOpen);\n    setCartCount(state.cartCount);\n    setCartTotal(state.cartTotal);\n    setCartCurrency(state.cartCurrency);\n  });\n\n  // Cleanup on component unmount\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  // Return object with reactive getters\n  return {\n    get isReady() {\n      return isReady();\n    },\n    get isOpen() {\n      return isOpen();\n    },\n    get cartCount() {\n      return cartCount();\n    },\n    get cartTotal() {\n      return cartTotal();\n    },\n    get cartCurrency() {\n      return cartCurrency();\n    },\n    openCart: () => checkoutStore.getState().openCart(),\n    openCheckout: () => checkoutStore.getState().openCheckout(),\n    close: () => checkoutStore.getState().close(),\n    addToCart: (productId, variantId, quantity) =>\n      checkoutStore.getState().addToCart(productId, variantId, quantity),\n    updateTokens: (accessToken, refreshToken) =>\n      checkoutStore.getState().updateTokens(accessToken, refreshToken),\n  };\n}\n\n// =============================================================================\n// INDIVIDUAL SIGNALS (for fine-grained subscriptions)\n// =============================================================================\n\n/**\n * Create a reactive signal for cart count only\n *\n * Use this when you only need cart count and want minimal re-renders.\n *\n * @example\n * ```tsx\n * function Badge() {\n *   const count = createCartCountSignal();\n *   return <span class=\"badge\">{count()}</span>;\n * }\n * ```\n */\nexport function createCartCountSignal(): Accessor<number> {\n  const [cartCount, setCartCount] = createSignal(checkoutStore.getState().cartCount);\n\n  const unsubscribe = checkoutStore.subscribe((state, prevState) => {\n    if (state.cartCount !== prevState.cartCount) {\n      setCartCount(state.cartCount);\n    }\n  });\n\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  return cartCount;\n}\n\n/**\n * Create a reactive signal for ready state only\n */\nexport function createIsReadySignal(): Accessor<boolean> {\n  const [isReady, setIsReady] = createSignal(checkoutStore.getState().isReady);\n\n  const unsubscribe = checkoutStore.subscribe((state, prevState) => {\n    if (state.isReady !== prevState.isReady) {\n      setIsReady(state.isReady);\n    }\n  });\n\n  onCleanup(() => {\n    unsubscribe();\n  });\n\n  return isReady;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+IA,SAAgB,cAAiC;CAE/C,MAAM,eAAe,cAAc,UAAU;CAE7C,MAAM,CAAC,SAAS,cAAc,aAAa,aAAa,QAAQ;CAChE,MAAM,CAAC,QAAQ,aAAa,aAAa,aAAa,OAAO;CAC7D,MAAM,CAAC,WAAW,gBAAgB,aAAa,aAAa,UAAU;CACtE,MAAM,CAAC,WAAW,gBAAgB,aAAa,aAAa,UAAU;CACtE,MAAM,CAAC,cAAc,mBAAmB,aAAa,aAAa,aAAa;CAG/E,MAAM,cAAc,cAAc,WAAW,UAAU;AACrD,aAAW,MAAM,QAAQ;AACzB,YAAU,MAAM,OAAO;AACvB,eAAa,MAAM,UAAU;AAC7B,eAAa,MAAM,UAAU;AAC7B,kBAAgB,MAAM,aAAa;GACnC;AAGF,iBAAgB;AACd,eAAa;GACb;AAGF,QAAO;EACL,IAAI,UAAU;AACZ,UAAO,SAAS;;EAElB,IAAI,SAAS;AACX,UAAO,QAAQ;;EAEjB,IAAI,YAAY;AACd,UAAO,WAAW;;EAEpB,IAAI,YAAY;AACd,UAAO,WAAW;;EAEpB,IAAI,eAAe;AACjB,UAAO,cAAc;;EAEvB,gBAAgB,cAAc,UAAU,CAAC,UAAU;EACnD,oBAAoB,cAAc,UAAU,CAAC,cAAc;EAC3D,aAAa,cAAc,UAAU,CAAC,OAAO;EAC7C,YAAY,WAAW,WAAW,aAChC,cAAc,UAAU,CAAC,UAAU,WAAW,WAAW,SAAS;EACpE,eAAe,aAAa,iBAC1B,cAAc,UAAU,CAAC,aAAa,aAAa,aAAa;EACnE;;;;;;;;;;;;;;;AAoBH,SAAgB,wBAA0C;CACxD,MAAM,CAAC,WAAW,gBAAgB,aAAa,cAAc,UAAU,CAAC,UAAU;CAElF,MAAM,cAAc,cAAc,WAAW,OAAO,cAAc;AAChE,MAAI,MAAM,cAAc,UAAU,UAChC,cAAa,MAAM,UAAU;GAE/B;AAEF,iBAAgB;AACd,eAAa;GACb;AAEF,QAAO;;;;;AAMT,SAAgB,sBAAyC;CACvD,MAAM,CAAC,SAAS,cAAc,aAAa,cAAc,UAAU,CAAC,QAAQ;CAE5E,MAAM,cAAc,cAAc,WAAW,OAAO,cAAc;AAChE,MAAI,MAAM,YAAY,UAAU,QAC9B,YAAW,MAAM,QAAQ;GAE3B;AAEF,iBAAgB;AACd,eAAa;GACb;AAEF,QAAO"}