@commercengine/checkout 0.1.5 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/store.cjs DELETED
@@ -1,266 +0,0 @@
1
- let _commercengine_js = require("@commercengine/js");
2
- let zustand_middleware = require("zustand/middleware");
3
- let zustand_vanilla = require("zustand/vanilla");
4
-
5
- //#region src/store.ts
6
- /**
7
- * Commerce Engine Checkout - Universal Store
8
- *
9
- * Framework-agnostic state management using Zustand vanilla.
10
- * This is the core store that all framework bindings use.
11
- *
12
- * ## Architecture
13
- *
14
- * - **Singleton**: One store instance shared across all components/routes
15
- * - **Non-blocking**: Checkout iframe loads asynchronously in the background
16
- * - **SSR-safe**: Initialization is skipped on server, only runs on client
17
- * - **Zero CWV impact**: Hidden iframe, no layout shifts, no main thread blocking
18
- *
19
- * ## Lifecycle
20
- *
21
- * 1. `initCheckout()` creates a hidden iframe and returns immediately
22
- * 2. Iframe loads in background (non-blocking)
23
- * 3. `onReady` callback fires when checkout is ready
24
- * 4. `useCheckout()` can be called from any component to access state
25
- * 5. Same instance persists across route changes (SPA navigation)
26
- *
27
- * @commercengine/checkout
28
- */
29
- const DEFAULT_STATE = {
30
- checkout: null,
31
- isReady: false,
32
- isOpen: false,
33
- cartCount: 0,
34
- cartTotal: 0,
35
- cartCurrency: "INR",
36
- isLoggedIn: false,
37
- user: null
38
- };
39
- /**
40
- * Vanilla Zustand store for checkout state
41
- *
42
- * This is framework-agnostic and can be used directly or via framework bindings.
43
- *
44
- * @example Direct usage (vanilla JS)
45
- * ```ts
46
- * import { checkoutStore } from "@commercengine/checkout";
47
- *
48
- * // Initialize
49
- * checkoutStore.getState().init({ storeId: "...", apiKey: "..." });
50
- *
51
- * // Get current state
52
- * const { cartCount, isReady } = checkoutStore.getState();
53
- *
54
- * // Subscribe to changes
55
- * checkoutStore.subscribe((state) => {
56
- * console.log("Cart count:", state.cartCount);
57
- * });
58
- *
59
- * // Call actions
60
- * checkoutStore.getState().openCart();
61
- * ```
62
- */
63
- const checkoutStore = (0, zustand_vanilla.createStore)()((0, zustand_middleware.subscribeWithSelector)((set, get) => ({
64
- ...DEFAULT_STATE,
65
- init: (config) => {
66
- if (typeof window === "undefined") return;
67
- const existing = get().checkout;
68
- if (existing) existing.destroy();
69
- set({ checkout: new _commercengine_js.Checkout({
70
- ...config,
71
- onReady: () => {
72
- set({ isReady: true });
73
- config.onReady?.();
74
- },
75
- onOpen: () => {
76
- set({ isOpen: true });
77
- config.onOpen?.();
78
- },
79
- onClose: () => {
80
- set({ isOpen: false });
81
- config.onClose?.();
82
- },
83
- onCartUpdate: (cart) => {
84
- set({
85
- cartCount: cart.count,
86
- cartTotal: cart.total,
87
- cartCurrency: cart.currency
88
- });
89
- config.onCartUpdate?.(cart);
90
- },
91
- onComplete: (order) => {
92
- config.onComplete?.(order);
93
- },
94
- onLogin: (data) => {
95
- if (data.user) set({
96
- user: data.user,
97
- isLoggedIn: data.user.isLoggedIn
98
- });
99
- config.onLogin?.(data);
100
- },
101
- onLogout: (data) => {
102
- set({
103
- user: data.user ?? null,
104
- isLoggedIn: false
105
- });
106
- config.onLogout?.(data);
107
- },
108
- onTokenRefresh: (data) => {
109
- config.onTokenRefresh?.(data);
110
- },
111
- onSessionError: () => {
112
- set({
113
- user: null,
114
- isLoggedIn: false
115
- });
116
- config.onSessionError?.();
117
- },
118
- onError: (error) => {
119
- set({ isReady: true });
120
- config.onError?.(error);
121
- }
122
- }) });
123
- },
124
- destroy: () => {
125
- const { checkout } = get();
126
- if (checkout) checkout.destroy();
127
- set(DEFAULT_STATE);
128
- },
129
- openCart: () => {
130
- get().checkout?.openCart();
131
- },
132
- openCheckout: () => {
133
- get().checkout?.openCheckout();
134
- },
135
- close: () => {
136
- get().checkout?.close();
137
- },
138
- addToCart: (productId, variantId, quantity) => {
139
- get().checkout?.addToCart(productId, variantId, quantity);
140
- },
141
- updateTokens: (accessToken, refreshToken) => {
142
- get().checkout?.updateTokens(accessToken, refreshToken);
143
- }
144
- })));
145
- /**
146
- * Initialize checkout
147
- *
148
- * @example
149
- * ```ts
150
- * import { initCheckout } from "@commercengine/checkout";
151
- *
152
- * initCheckout({
153
- * storeId: "store_xxx",
154
- * apiKey: "ak_xxx",
155
- * onComplete: (order) => console.log("Order placed:", order.orderNumber),
156
- * });
157
- * ```
158
- */
159
- function initCheckout(config) {
160
- checkoutStore.getState().init(config);
161
- }
162
- /**
163
- * Destroy checkout instance
164
- *
165
- * @example
166
- * ```ts
167
- * import { destroyCheckout } from "@commercengine/checkout";
168
- *
169
- * destroyCheckout();
170
- * ```
171
- */
172
- function destroyCheckout() {
173
- checkoutStore.getState().destroy();
174
- }
175
- /**
176
- * Get checkout state and methods (non-reactive)
177
- *
178
- * Use this outside of reactive frameworks or when you don't need reactivity.
179
- *
180
- * @example
181
- * ```ts
182
- * import { getCheckout } from "@commercengine/checkout";
183
- *
184
- * document.getElementById("cart-btn").onclick = () => {
185
- * getCheckout().openCart();
186
- * };
187
- *
188
- * // Check state
189
- * if (getCheckout().isReady) {
190
- * console.log("Cart has", getCheckout().cartCount, "items");
191
- * }
192
- * ```
193
- */
194
- function getCheckout() {
195
- const state = checkoutStore.getState();
196
- return {
197
- isReady: state.isReady,
198
- isOpen: state.isOpen,
199
- cartCount: state.cartCount,
200
- cartTotal: state.cartTotal,
201
- cartCurrency: state.cartCurrency,
202
- isLoggedIn: state.isLoggedIn,
203
- user: state.user,
204
- openCart: state.openCart,
205
- openCheckout: state.openCheckout,
206
- close: state.close,
207
- addToCart: state.addToCart,
208
- updateTokens: state.updateTokens
209
- };
210
- }
211
- /**
212
- * Subscribe to checkout state changes
213
- *
214
- * @example
215
- * ```ts
216
- * import { subscribeToCheckout } from "@commercengine/checkout";
217
- *
218
- * // Subscribe to all changes
219
- * const unsubscribe = subscribeToCheckout((state) => {
220
- * console.log("State changed:", state);
221
- * });
222
- *
223
- * // Subscribe to specific state with selector
224
- * const unsubscribe = subscribeToCheckout(
225
- * (state) => state.cartCount,
226
- * (cartCount) => console.log("Cart count:", cartCount)
227
- * );
228
- *
229
- * // Cleanup
230
- * unsubscribe();
231
- * ```
232
- */
233
- const subscribeToCheckout = checkoutStore.subscribe;
234
-
235
- //#endregion
236
- Object.defineProperty(exports, 'checkoutStore', {
237
- enumerable: true,
238
- get: function () {
239
- return checkoutStore;
240
- }
241
- });
242
- Object.defineProperty(exports, 'destroyCheckout', {
243
- enumerable: true,
244
- get: function () {
245
- return destroyCheckout;
246
- }
247
- });
248
- Object.defineProperty(exports, 'getCheckout', {
249
- enumerable: true,
250
- get: function () {
251
- return getCheckout;
252
- }
253
- });
254
- Object.defineProperty(exports, 'initCheckout', {
255
- enumerable: true,
256
- get: function () {
257
- return initCheckout;
258
- }
259
- });
260
- Object.defineProperty(exports, 'subscribeToCheckout', {
261
- enumerable: true,
262
- get: function () {
263
- return subscribeToCheckout;
264
- }
265
- });
266
- //# sourceMappingURL=store.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"store.cjs","names":["Checkout"],"sources":["../src/store.ts"],"sourcesContent":["/**\n * Commerce Engine Checkout - Universal Store\n *\n * Framework-agnostic state management using Zustand vanilla.\n * This is the core store that all framework bindings use.\n *\n * ## Architecture\n *\n * - **Singleton**: One store instance shared across all components/routes\n * - **Non-blocking**: Checkout iframe loads asynchronously in the background\n * - **SSR-safe**: Initialization is skipped on server, only runs on client\n * - **Zero CWV impact**: Hidden iframe, no layout shifts, no main thread blocking\n *\n * ## Lifecycle\n *\n * 1. `initCheckout()` creates a hidden iframe and returns immediately\n * 2. Iframe loads in background (non-blocking)\n * 3. `onReady` callback fires when checkout is ready\n * 4. `useCheckout()` can be called from any component to access state\n * 5. Same instance persists across route changes (SPA navigation)\n *\n * @commercengine/checkout\n */\n\nimport {\n type AuthLoginData,\n type AuthLogoutData,\n type AuthRefreshData,\n type CartData,\n Checkout,\n type CheckoutConfig,\n type ErrorData,\n type OrderData,\n type UserInfo,\n} from \"@commercengine/js\";\nimport { subscribeWithSelector } from \"zustand/middleware\";\nimport { createStore } from \"zustand/vanilla\";\n\n// =============================================================================\n// TYPES\n// =============================================================================\n\n/**\n * Checkout state\n */\nexport interface CheckoutState {\n /** Internal checkout instance */\n checkout: Checkout | null;\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 /** Whether user is logged in */\n isLoggedIn: boolean;\n /** Current user info (null if not logged in) */\n user: UserInfo | null;\n}\n\n/**\n * Checkout actions\n */\nexport interface CheckoutActions {\n /**\n * Initialize checkout with configuration\n * Call this once at app startup\n */\n init: (config: CheckoutConfig) => void;\n\n /**\n * Destroy checkout instance and reset state\n */\n destroy: () => void;\n\n /**\n * Open the cart drawer\n */\n openCart: () => void;\n\n /**\n * Open the checkout drawer directly (for Buy Now flow)\n */\n openCheckout: () => void;\n\n /**\n * Close the checkout overlay\n */\n close: () => void;\n\n /**\n * Add item to cart\n * @param productId - Product ID (required)\n * @param variantId - Variant ID (required, null for non-variant products)\n * @param quantity - Quantity to add (default: 1)\n */\n addToCart: (productId: string, variantId: string | null, quantity?: number) => void;\n\n /**\n * Update authentication tokens\n * Use this when user logs in/out on the parent site\n */\n updateTokens: (accessToken: string, refreshToken?: string) => void;\n}\n\n/**\n * Complete checkout store type\n */\nexport type CheckoutStore = CheckoutState & CheckoutActions;\n\n// =============================================================================\n// DEFAULT STATE\n// =============================================================================\n\nconst DEFAULT_STATE: CheckoutState = {\n checkout: null,\n isReady: false,\n isOpen: false,\n cartCount: 0,\n cartTotal: 0,\n cartCurrency: \"INR\",\n isLoggedIn: false,\n user: null,\n};\n\n// =============================================================================\n// STORE\n// =============================================================================\n\n/**\n * Vanilla Zustand store for checkout state\n *\n * This is framework-agnostic and can be used directly or via framework bindings.\n *\n * @example Direct usage (vanilla JS)\n * ```ts\n * import { checkoutStore } from \"@commercengine/checkout\";\n *\n * // Initialize\n * checkoutStore.getState().init({ storeId: \"...\", apiKey: \"...\" });\n *\n * // Get current state\n * const { cartCount, isReady } = checkoutStore.getState();\n *\n * // Subscribe to changes\n * checkoutStore.subscribe((state) => {\n * console.log(\"Cart count:\", state.cartCount);\n * });\n *\n * // Call actions\n * checkoutStore.getState().openCart();\n * ```\n */\nexport const checkoutStore = createStore<CheckoutStore>()(\n subscribeWithSelector((set, get) => ({\n // State\n ...DEFAULT_STATE,\n\n // Actions\n init: (config) => {\n // Skip on server\n if (typeof window === \"undefined\") return;\n\n // Destroy existing instance if reinitializing\n const existing = get().checkout;\n if (existing) {\n existing.destroy();\n }\n\n // Create new checkout instance with callbacks that update store\n const checkout = new Checkout({\n ...config,\n onReady: () => {\n set({ isReady: true });\n config.onReady?.();\n },\n onOpen: () => {\n set({ isOpen: true });\n config.onOpen?.();\n },\n onClose: () => {\n set({ isOpen: false });\n config.onClose?.();\n },\n onCartUpdate: (cart: CartData) => {\n set({\n cartCount: cart.count,\n cartTotal: cart.total,\n cartCurrency: cart.currency,\n });\n config.onCartUpdate?.(cart);\n },\n onComplete: (order: OrderData) => {\n config.onComplete?.(order);\n },\n onLogin: (data: AuthLoginData) => {\n if (data.user) {\n set({ user: data.user, isLoggedIn: data.user.isLoggedIn });\n }\n config.onLogin?.(data);\n },\n onLogout: (data: AuthLogoutData) => {\n // On logout, user becomes anonymous\n set({ user: data.user ?? null, isLoggedIn: false });\n config.onLogout?.(data);\n },\n onTokenRefresh: (data: AuthRefreshData) => {\n config.onTokenRefresh?.(data);\n },\n onSessionError: () => {\n // Session corrupted - clear user state\n set({ user: null, isLoggedIn: false });\n config.onSessionError?.();\n },\n onError: (error: ErrorData) => {\n // Still set ready so buttons are enabled (error drawer will show)\n set({ isReady: true });\n config.onError?.(error);\n },\n });\n\n set({ checkout });\n },\n\n destroy: () => {\n const { checkout } = get();\n if (checkout) {\n checkout.destroy();\n }\n set(DEFAULT_STATE);\n },\n\n openCart: () => {\n get().checkout?.openCart();\n },\n\n openCheckout: () => {\n get().checkout?.openCheckout();\n },\n\n close: () => {\n get().checkout?.close();\n },\n\n addToCart: (productId, variantId, quantity) => {\n get().checkout?.addToCart(productId, variantId, quantity);\n },\n\n updateTokens: (accessToken, refreshToken) => {\n get().checkout?.updateTokens(accessToken, refreshToken);\n },\n }))\n);\n\n// =============================================================================\n// CONVENIENCE EXPORTS\n// =============================================================================\n\n/**\n * Initialize checkout\n *\n * @example\n * ```ts\n * import { initCheckout } from \"@commercengine/checkout\";\n *\n * initCheckout({\n * storeId: \"store_xxx\",\n * apiKey: \"ak_xxx\",\n * onComplete: (order) => console.log(\"Order placed:\", order.orderNumber),\n * });\n * ```\n */\nexport function initCheckout(config: CheckoutConfig): void {\n checkoutStore.getState().init(config);\n}\n\n/**\n * Destroy checkout instance\n *\n * @example\n * ```ts\n * import { destroyCheckout } from \"@commercengine/checkout\";\n *\n * destroyCheckout();\n * ```\n */\nexport function destroyCheckout(): void {\n checkoutStore.getState().destroy();\n}\n\n/**\n * Get checkout state and methods (non-reactive)\n *\n * Use this outside of reactive frameworks or when you don't need reactivity.\n *\n * @example\n * ```ts\n * import { getCheckout } from \"@commercengine/checkout\";\n *\n * document.getElementById(\"cart-btn\").onclick = () => {\n * getCheckout().openCart();\n * };\n *\n * // Check state\n * if (getCheckout().isReady) {\n * console.log(\"Cart has\", getCheckout().cartCount, \"items\");\n * }\n * ```\n */\nexport function getCheckout(): Omit<CheckoutStore, \"checkout\" | \"init\" | \"destroy\"> {\n const state = checkoutStore.getState();\n return {\n isReady: state.isReady,\n isOpen: state.isOpen,\n cartCount: state.cartCount,\n cartTotal: state.cartTotal,\n cartCurrency: state.cartCurrency,\n isLoggedIn: state.isLoggedIn,\n user: state.user,\n openCart: state.openCart,\n openCheckout: state.openCheckout,\n close: state.close,\n addToCart: state.addToCart,\n updateTokens: state.updateTokens,\n };\n}\n\n/**\n * Subscribe to checkout state changes\n *\n * @example\n * ```ts\n * import { subscribeToCheckout } from \"@commercengine/checkout\";\n *\n * // Subscribe to all changes\n * const unsubscribe = subscribeToCheckout((state) => {\n * console.log(\"State changed:\", state);\n * });\n *\n * // Subscribe to specific state with selector\n * const unsubscribe = subscribeToCheckout(\n * (state) => state.cartCount,\n * (cartCount) => console.log(\"Cart count:\", cartCount)\n * );\n *\n * // Cleanup\n * unsubscribe();\n * ```\n */\nexport const subscribeToCheckout = checkoutStore.subscribe;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsHA,MAAM,gBAA+B;CACnC,UAAU;CACV,SAAS;CACT,QAAQ;CACR,WAAW;CACX,WAAW;CACX,cAAc;CACd,YAAY;CACZ,MAAM;CACP;;;;;;;;;;;;;;;;;;;;;;;;;AA8BD,MAAa,kDAA4C,gDAChC,KAAK,SAAS;CAEnC,GAAG;CAGH,OAAO,WAAW;AAEhB,MAAI,OAAO,WAAW,YAAa;EAGnC,MAAM,WAAW,KAAK,CAAC;AACvB,MAAI,SACF,UAAS,SAAS;AAuDpB,MAAI,EAAE,UAnDW,IAAIA,2BAAS;GAC5B,GAAG;GACH,eAAe;AACb,QAAI,EAAE,SAAS,MAAM,CAAC;AACtB,WAAO,WAAW;;GAEpB,cAAc;AACZ,QAAI,EAAE,QAAQ,MAAM,CAAC;AACrB,WAAO,UAAU;;GAEnB,eAAe;AACb,QAAI,EAAE,QAAQ,OAAO,CAAC;AACtB,WAAO,WAAW;;GAEpB,eAAe,SAAmB;AAChC,QAAI;KACF,WAAW,KAAK;KAChB,WAAW,KAAK;KAChB,cAAc,KAAK;KACpB,CAAC;AACF,WAAO,eAAe,KAAK;;GAE7B,aAAa,UAAqB;AAChC,WAAO,aAAa,MAAM;;GAE5B,UAAU,SAAwB;AAChC,QAAI,KAAK,KACP,KAAI;KAAE,MAAM,KAAK;KAAM,YAAY,KAAK,KAAK;KAAY,CAAC;AAE5D,WAAO,UAAU,KAAK;;GAExB,WAAW,SAAyB;AAElC,QAAI;KAAE,MAAM,KAAK,QAAQ;KAAM,YAAY;KAAO,CAAC;AACnD,WAAO,WAAW,KAAK;;GAEzB,iBAAiB,SAA0B;AACzC,WAAO,iBAAiB,KAAK;;GAE/B,sBAAsB;AAEpB,QAAI;KAAE,MAAM;KAAM,YAAY;KAAO,CAAC;AACtC,WAAO,kBAAkB;;GAE3B,UAAU,UAAqB;AAE7B,QAAI,EAAE,SAAS,MAAM,CAAC;AACtB,WAAO,UAAU,MAAM;;GAE1B,CAAC,EAEc,CAAC;;CAGnB,eAAe;EACb,MAAM,EAAE,aAAa,KAAK;AAC1B,MAAI,SACF,UAAS,SAAS;AAEpB,MAAI,cAAc;;CAGpB,gBAAgB;AACd,OAAK,CAAC,UAAU,UAAU;;CAG5B,oBAAoB;AAClB,OAAK,CAAC,UAAU,cAAc;;CAGhC,aAAa;AACX,OAAK,CAAC,UAAU,OAAO;;CAGzB,YAAY,WAAW,WAAW,aAAa;AAC7C,OAAK,CAAC,UAAU,UAAU,WAAW,WAAW,SAAS;;CAG3D,eAAe,aAAa,iBAAiB;AAC3C,OAAK,CAAC,UAAU,aAAa,aAAa,aAAa;;CAE1D,EAAE,CACJ;;;;;;;;;;;;;;;AAoBD,SAAgB,aAAa,QAA8B;AACzD,eAAc,UAAU,CAAC,KAAK,OAAO;;;;;;;;;;;;AAavC,SAAgB,kBAAwB;AACtC,eAAc,UAAU,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;AAsBpC,SAAgB,cAAoE;CAClF,MAAM,QAAQ,cAAc,UAAU;AACtC,QAAO;EACL,SAAS,MAAM;EACf,QAAQ,MAAM;EACd,WAAW,MAAM;EACjB,WAAW,MAAM;EACjB,cAAc,MAAM;EACpB,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,UAAU,MAAM;EAChB,cAAc,MAAM;EACpB,OAAO,MAAM;EACb,WAAW,MAAM;EACjB,cAAc,MAAM;EACrB;;;;;;;;;;;;;;;;;;;;;;;;AAyBH,MAAa,sBAAsB,cAAc"}
package/dist/store.d.cts DELETED
@@ -1,178 +0,0 @@
1
- import { Checkout, CheckoutConfig, UserInfo } from "@commercengine/js";
2
- import * as zustand0 from "zustand";
3
-
4
- //#region src/store.d.ts
5
- /**
6
- * Checkout state
7
- */
8
- interface CheckoutState {
9
- /** Internal checkout instance */
10
- checkout: Checkout | null;
11
- /** Whether checkout is ready to use */
12
- isReady: boolean;
13
- /** Whether checkout overlay is currently open */
14
- isOpen: boolean;
15
- /** Number of items in cart */
16
- cartCount: number;
17
- /** Cart subtotal amount */
18
- cartTotal: number;
19
- /** Cart currency code */
20
- cartCurrency: string;
21
- /** Whether user is logged in */
22
- isLoggedIn: boolean;
23
- /** Current user info (null if not logged in) */
24
- user: UserInfo | null;
25
- }
26
- /**
27
- * Checkout actions
28
- */
29
- interface CheckoutActions {
30
- /**
31
- * Initialize checkout with configuration
32
- * Call this once at app startup
33
- */
34
- init: (config: CheckoutConfig) => void;
35
- /**
36
- * Destroy checkout instance and reset state
37
- */
38
- destroy: () => void;
39
- /**
40
- * Open the cart drawer
41
- */
42
- openCart: () => void;
43
- /**
44
- * Open the checkout drawer directly (for Buy Now flow)
45
- */
46
- openCheckout: () => void;
47
- /**
48
- * Close the checkout overlay
49
- */
50
- close: () => void;
51
- /**
52
- * Add item to cart
53
- * @param productId - Product ID (required)
54
- * @param variantId - Variant ID (required, null for non-variant products)
55
- * @param quantity - Quantity to add (default: 1)
56
- */
57
- addToCart: (productId: string, variantId: string | null, quantity?: number) => void;
58
- /**
59
- * Update authentication tokens
60
- * Use this when user logs in/out on the parent site
61
- */
62
- updateTokens: (accessToken: string, refreshToken?: string) => void;
63
- }
64
- /**
65
- * Complete checkout store type
66
- */
67
- type CheckoutStore = CheckoutState & CheckoutActions;
68
- /**
69
- * Vanilla Zustand store for checkout state
70
- *
71
- * This is framework-agnostic and can be used directly or via framework bindings.
72
- *
73
- * @example Direct usage (vanilla JS)
74
- * ```ts
75
- * import { checkoutStore } from "@commercengine/checkout";
76
- *
77
- * // Initialize
78
- * checkoutStore.getState().init({ storeId: "...", apiKey: "..." });
79
- *
80
- * // Get current state
81
- * const { cartCount, isReady } = checkoutStore.getState();
82
- *
83
- * // Subscribe to changes
84
- * checkoutStore.subscribe((state) => {
85
- * console.log("Cart count:", state.cartCount);
86
- * });
87
- *
88
- * // Call actions
89
- * checkoutStore.getState().openCart();
90
- * ```
91
- */
92
- declare const checkoutStore: Omit<zustand0.StoreApi<CheckoutStore>, "subscribe"> & {
93
- subscribe: {
94
- (listener: (selectedState: CheckoutStore, previousSelectedState: CheckoutStore) => void): () => void;
95
- <U>(selector: (state: CheckoutStore) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
96
- equalityFn?: ((a: U, b: U) => boolean) | undefined;
97
- fireImmediately?: boolean;
98
- } | undefined): () => void;
99
- };
100
- };
101
- /**
102
- * Initialize checkout
103
- *
104
- * @example
105
- * ```ts
106
- * import { initCheckout } from "@commercengine/checkout";
107
- *
108
- * initCheckout({
109
- * storeId: "store_xxx",
110
- * apiKey: "ak_xxx",
111
- * onComplete: (order) => console.log("Order placed:", order.orderNumber),
112
- * });
113
- * ```
114
- */
115
- declare function initCheckout(config: CheckoutConfig): void;
116
- /**
117
- * Destroy checkout instance
118
- *
119
- * @example
120
- * ```ts
121
- * import { destroyCheckout } from "@commercengine/checkout";
122
- *
123
- * destroyCheckout();
124
- * ```
125
- */
126
- declare function destroyCheckout(): void;
127
- /**
128
- * Get checkout state and methods (non-reactive)
129
- *
130
- * Use this outside of reactive frameworks or when you don't need reactivity.
131
- *
132
- * @example
133
- * ```ts
134
- * import { getCheckout } from "@commercengine/checkout";
135
- *
136
- * document.getElementById("cart-btn").onclick = () => {
137
- * getCheckout().openCart();
138
- * };
139
- *
140
- * // Check state
141
- * if (getCheckout().isReady) {
142
- * console.log("Cart has", getCheckout().cartCount, "items");
143
- * }
144
- * ```
145
- */
146
- declare function getCheckout(): Omit<CheckoutStore, "checkout" | "init" | "destroy">;
147
- /**
148
- * Subscribe to checkout state changes
149
- *
150
- * @example
151
- * ```ts
152
- * import { subscribeToCheckout } from "@commercengine/checkout";
153
- *
154
- * // Subscribe to all changes
155
- * const unsubscribe = subscribeToCheckout((state) => {
156
- * console.log("State changed:", state);
157
- * });
158
- *
159
- * // Subscribe to specific state with selector
160
- * const unsubscribe = subscribeToCheckout(
161
- * (state) => state.cartCount,
162
- * (cartCount) => console.log("Cart count:", cartCount)
163
- * );
164
- *
165
- * // Cleanup
166
- * unsubscribe();
167
- * ```
168
- */
169
- declare const subscribeToCheckout: {
170
- (listener: (selectedState: CheckoutStore, previousSelectedState: CheckoutStore) => void): () => void;
171
- <U>(selector: (state: CheckoutStore) => U, listener: (selectedState: U, previousSelectedState: U) => void, options?: {
172
- equalityFn?: ((a: U, b: U) => boolean) | undefined;
173
- fireImmediately?: boolean;
174
- } | undefined): () => void;
175
- };
176
- //#endregion
177
- export { destroyCheckout as a, subscribeToCheckout as c, checkoutStore as i, CheckoutState as n, getCheckout as o, CheckoutStore as r, initCheckout as s, CheckoutActions as t };
178
- //# sourceMappingURL=store.d.cts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"store.d.cts","names":[],"sources":["../src/store.ts"],"mappings":";;;;;;;UA6CiB,aAAA;EAqCf;EAnCA,QAAA,EAAU,QAAA;EA6CV;EA3CA,OAAA;EAmDY;EAjDZ,MAAA;EAiDyD;EA/CzD,SAAA;EAqDe;EAnDf,SAAA;EAmDyD;EAjDzD,YAAA;EAuDU;EArDV,UAAA;;EAEA,IAAA,EAAM,QAAA;AAAA;AAgGR;;;AAAA,UA1FiB,eAAA;EA0FS;;;;EArFxB,IAAA,GAAO,MAAA,EAAQ,cAAA;;;;EAKf,OAAA;;;;EAKA,QAAA;EA2EwB;;;EAtExB,YAAA;;;;EAKA,KAAA;;;;;;;EAQA,SAAA,GAAY,SAAA,UAAmB,SAAA,iBAA0B,QAAA;;;;;EAMzD,YAAA,GAAe,WAAA,UAAqB,YAAA;AAAA;;;;KAM1B,aAAA,GAAgB,aAAA,GAAgB,eAAA;;;AAoK5C;;;;;AAcA;;;;;AAuBA;;;;;AAwCA;;;;;;;cApMa,aAAA,EAAa,IAAA,CAAA,QAAA,CAAA,QAAA,CAAA,aAAA;;;;;;;;;;;;;;;;;;;;;;;iBAuHV,YAAA,CAAa,MAAA,EAAQ,cAAA;;;;;;;;;;;iBAcrB,eAAA,CAAA;;;;;;;;;;;;;;;;;;;;iBAuBA,WAAA,CAAA,GAAe,IAAA,CAAK,aAAA;;;;;;;;;;;;;;;;;;;;;;;cAwCvB,mBAAA;EAAA"}
package/dist/svelte.cjs DELETED
@@ -1,99 +0,0 @@
1
- const require_store = require('./store.cjs');
2
- let svelte_store = require("svelte/store");
3
-
4
- //#region src/svelte.ts
5
- /**
6
- * Get current checkout value from Zustand store
7
- */
8
- function getCheckoutValue() {
9
- const state = require_store.checkoutStore.getState();
10
- return {
11
- isReady: state.isReady,
12
- isOpen: state.isOpen,
13
- cartCount: state.cartCount,
14
- cartTotal: state.cartTotal,
15
- cartCurrency: state.cartCurrency,
16
- isLoggedIn: state.isLoggedIn,
17
- user: state.user,
18
- openCart: state.openCart,
19
- openCheckout: state.openCheckout,
20
- close: state.close,
21
- addToCart: state.addToCart,
22
- updateTokens: state.updateTokens
23
- };
24
- }
25
- /**
26
- * Svelte readable store for checkout state and actions
27
- *
28
- * Syncs with the Zustand store automatically.
29
- *
30
- * @example
31
- * ```svelte
32
- * <script>
33
- * import { checkout } from "@commercengine/checkout/svelte";
34
- * <\/script>
35
- *
36
- * <button on:click={() => $checkout.openCart()} disabled={!$checkout.isReady}>
37
- * Cart ({$checkout.cartCount})
38
- * </button>
39
- * ```
40
- */
41
- const checkout = (0, svelte_store.readable)(getCheckoutValue(), (set) => {
42
- return require_store.checkoutStore.subscribe(() => {
43
- set(getCheckoutValue());
44
- });
45
- });
46
- /**
47
- * Individual store for cart count (for fine-grained reactivity)
48
- *
49
- * @example
50
- * ```svelte
51
- * <script>
52
- * import { cartCount } from "@commercengine/checkout/svelte";
53
- * <\/script>
54
- *
55
- * <span class="badge">{$cartCount}</span>
56
- * ```
57
- */
58
- const cartCount = (0, svelte_store.readable)(require_store.checkoutStore.getState().cartCount, (set) => {
59
- return require_store.checkoutStore.subscribe((state, prevState) => {
60
- if (state.cartCount !== prevState.cartCount) set(state.cartCount);
61
- });
62
- });
63
- /**
64
- * Individual store for cart total
65
- */
66
- const cartTotal = (0, svelte_store.readable)(require_store.checkoutStore.getState().cartTotal, (set) => {
67
- return require_store.checkoutStore.subscribe((state, prevState) => {
68
- if (state.cartTotal !== prevState.cartTotal) set(state.cartTotal);
69
- });
70
- });
71
- /**
72
- * Individual store for ready state
73
- */
74
- const isReady = (0, svelte_store.readable)(require_store.checkoutStore.getState().isReady, (set) => {
75
- return require_store.checkoutStore.subscribe((state, prevState) => {
76
- if (state.isReady !== prevState.isReady) set(state.isReady);
77
- });
78
- });
79
- /**
80
- * Individual store for open state
81
- */
82
- const isOpen = (0, svelte_store.readable)(require_store.checkoutStore.getState().isOpen, (set) => {
83
- return require_store.checkoutStore.subscribe((state, prevState) => {
84
- if (state.isOpen !== prevState.isOpen) set(state.isOpen);
85
- });
86
- });
87
-
88
- //#endregion
89
- exports.cartCount = cartCount;
90
- exports.cartTotal = cartTotal;
91
- exports.checkout = checkout;
92
- exports.checkoutStore = require_store.checkoutStore;
93
- exports.destroyCheckout = require_store.destroyCheckout;
94
- exports.getCheckout = require_store.getCheckout;
95
- exports.initCheckout = require_store.initCheckout;
96
- exports.isOpen = isOpen;
97
- exports.isReady = isReady;
98
- exports.subscribeToCheckout = require_store.subscribeToCheckout;
99
- //# sourceMappingURL=svelte.cjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"svelte.cjs","names":["checkoutStore"],"sources":["../src/svelte.ts"],"sourcesContent":["/**\n * Commerce Engine Checkout - Svelte Binding\n *\n * Svelte stores for checkout integration with automatic reactivity.\n *\n * @example\n * ```svelte\n * <script>\n * import { checkout, initCheckout } from \"@commercengine/checkout/svelte\";\n * import { onMount } from \"svelte\";\n *\n * // Initialize once at app root (+layout.svelte)\n * onMount(() => {\n * initCheckout({\n * storeId: \"store_xxx\",\n * apiKey: \"ak_xxx\",\n * });\n * });\n * </script>\n *\n * <button on:click={() => $checkout.openCart()} disabled={!$checkout.isReady}>\n * Cart ({$checkout.cartCount})\n * </button>\n * ```\n *\n * @packageDocumentation\n */\n\nimport type { UserInfo } from \"@commercengine/js\";\nimport { type Readable, readable } from \"svelte/store\";\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 * Checkout store value type\n */\nexport interface CheckoutValue {\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 /** Whether user is logged in */\n isLoggedIn: boolean;\n /** Current user info (null if not logged in) */\n user: UserInfo | null;\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// STORES\n// =============================================================================\n\n/**\n * Get current checkout value from Zustand store\n */\nfunction getCheckoutValue(): CheckoutValue {\n const state = checkoutStore.getState();\n return {\n isReady: state.isReady,\n isOpen: state.isOpen,\n cartCount: state.cartCount,\n cartTotal: state.cartTotal,\n cartCurrency: state.cartCurrency,\n isLoggedIn: state.isLoggedIn,\n user: state.user,\n openCart: state.openCart,\n openCheckout: state.openCheckout,\n close: state.close,\n addToCart: state.addToCart,\n updateTokens: state.updateTokens,\n };\n}\n\n/**\n * Svelte readable store for checkout state and actions\n *\n * Syncs with the Zustand store automatically.\n *\n * @example\n * ```svelte\n * <script>\n * import { checkout } from \"@commercengine/checkout/svelte\";\n * </script>\n *\n * <button on:click={() => $checkout.openCart()} disabled={!$checkout.isReady}>\n * Cart ({$checkout.cartCount})\n * </button>\n * ```\n */\nexport const checkout: Readable<CheckoutValue> = readable(getCheckoutValue(), (set) => {\n // Subscribe to Zustand store and update Svelte store\n return checkoutStore.subscribe(() => {\n set(getCheckoutValue());\n });\n});\n\n/**\n * Individual store for cart count (for fine-grained reactivity)\n *\n * @example\n * ```svelte\n * <script>\n * import { cartCount } from \"@commercengine/checkout/svelte\";\n * </script>\n *\n * <span class=\"badge\">{$cartCount}</span>\n * ```\n */\nexport const cartCount: Readable<number> = readable(checkoutStore.getState().cartCount, (set) => {\n return checkoutStore.subscribe((state, prevState) => {\n if (state.cartCount !== prevState.cartCount) {\n set(state.cartCount);\n }\n });\n});\n\n/**\n * Individual store for cart total\n */\nexport const cartTotal: Readable<number> = readable(checkoutStore.getState().cartTotal, (set) => {\n return checkoutStore.subscribe((state, prevState) => {\n if (state.cartTotal !== prevState.cartTotal) {\n set(state.cartTotal);\n }\n });\n});\n\n/**\n * Individual store for ready state\n */\nexport const isReady: Readable<boolean> = readable(checkoutStore.getState().isReady, (set) => {\n return checkoutStore.subscribe((state, prevState) => {\n if (state.isReady !== prevState.isReady) {\n set(state.isReady);\n }\n });\n});\n\n/**\n * Individual store for open state\n */\nexport const isOpen: Readable<boolean> = readable(checkoutStore.getState().isOpen, (set) => {\n return checkoutStore.subscribe((state, prevState) => {\n if (state.isOpen !== prevState.isOpen) {\n set(state.isOpen);\n }\n });\n});\n"],"mappings":";;;;;;;AAwGA,SAAS,mBAAkC;CACzC,MAAM,QAAQA,4BAAc,UAAU;AACtC,QAAO;EACL,SAAS,MAAM;EACf,QAAQ,MAAM;EACd,WAAW,MAAM;EACjB,WAAW,MAAM;EACjB,cAAc,MAAM;EACpB,YAAY,MAAM;EAClB,MAAM,MAAM;EACZ,UAAU,MAAM;EAChB,cAAc,MAAM;EACpB,OAAO,MAAM;EACb,WAAW,MAAM;EACjB,cAAc,MAAM;EACrB;;;;;;;;;;;;;;;;;;AAmBH,MAAa,sCAA6C,kBAAkB,GAAG,QAAQ;AAErF,QAAOA,4BAAc,gBAAgB;AACnC,MAAI,kBAAkB,CAAC;GACvB;EACF;;;;;;;;;;;;;AAcF,MAAa,uCAAuCA,4BAAc,UAAU,CAAC,YAAY,QAAQ;AAC/F,QAAOA,4BAAc,WAAW,OAAO,cAAc;AACnD,MAAI,MAAM,cAAc,UAAU,UAChC,KAAI,MAAM,UAAU;GAEtB;EACF;;;;AAKF,MAAa,uCAAuCA,4BAAc,UAAU,CAAC,YAAY,QAAQ;AAC/F,QAAOA,4BAAc,WAAW,OAAO,cAAc;AACnD,MAAI,MAAM,cAAc,UAAU,UAChC,KAAI,MAAM,UAAU;GAEtB;EACF;;;;AAKF,MAAa,qCAAsCA,4BAAc,UAAU,CAAC,UAAU,QAAQ;AAC5F,QAAOA,4BAAc,WAAW,OAAO,cAAc;AACnD,MAAI,MAAM,YAAY,UAAU,QAC9B,KAAI,MAAM,QAAQ;GAEpB;EACF;;;;AAKF,MAAa,oCAAqCA,4BAAc,UAAU,CAAC,SAAS,QAAQ;AAC1F,QAAOA,4BAAc,WAAW,OAAO,cAAc;AACnD,MAAI,MAAM,WAAW,UAAU,OAC7B,KAAI,MAAM,OAAO;GAEnB;EACF"}
package/dist/svelte.d.cts DELETED
@@ -1,79 +0,0 @@
1
- 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";
2
- import { AddToCartItem, AuthLoginData, AuthLogoutData, AuthMode, AuthRefreshData, CartData, Channel, CheckoutConfig, CheckoutEventType, Environment, ErrorData, LoginMethod, OrderData, QuickBuyConfig, SessionMode, UserInfo, UserInfo as UserInfo$1 } from "@commercengine/js";
3
- import { Readable } from "svelte/store";
4
-
5
- //#region src/svelte.d.ts
6
- /**
7
- * Checkout store value type
8
- */
9
- interface CheckoutValue {
10
- /** Whether checkout is ready to use */
11
- isReady: boolean;
12
- /** Whether checkout overlay is currently open */
13
- isOpen: boolean;
14
- /** Number of items in cart */
15
- cartCount: number;
16
- /** Cart subtotal amount */
17
- cartTotal: number;
18
- /** Cart currency code */
19
- cartCurrency: string;
20
- /** Whether user is logged in */
21
- isLoggedIn: boolean;
22
- /** Current user info (null if not logged in) */
23
- user: UserInfo$1 | null;
24
- /** Open the cart drawer */
25
- openCart: () => void;
26
- /** Open the checkout drawer directly */
27
- openCheckout: () => void;
28
- /** Close the checkout overlay */
29
- close: () => void;
30
- /** Add item to cart */
31
- addToCart: (productId: string, variantId: string | null, quantity?: number) => void;
32
- /** Update authentication tokens */
33
- updateTokens: (accessToken: string, refreshToken?: string) => void;
34
- }
35
- /**
36
- * Svelte readable store for checkout state and actions
37
- *
38
- * Syncs with the Zustand store automatically.
39
- *
40
- * @example
41
- * ```svelte
42
- * <script>
43
- * import { checkout } from "@commercengine/checkout/svelte";
44
- * </script>
45
- *
46
- * <button on:click={() => $checkout.openCart()} disabled={!$checkout.isReady}>
47
- * Cart ({$checkout.cartCount})
48
- * </button>
49
- * ```
50
- */
51
- declare const checkout: Readable<CheckoutValue>;
52
- /**
53
- * Individual store for cart count (for fine-grained reactivity)
54
- *
55
- * @example
56
- * ```svelte
57
- * <script>
58
- * import { cartCount } from "@commercengine/checkout/svelte";
59
- * </script>
60
- *
61
- * <span class="badge">{$cartCount}</span>
62
- * ```
63
- */
64
- declare const cartCount: Readable<number>;
65
- /**
66
- * Individual store for cart total
67
- */
68
- declare const cartTotal: Readable<number>;
69
- /**
70
- * Individual store for ready state
71
- */
72
- declare const isReady: Readable<boolean>;
73
- /**
74
- * Individual store for open state
75
- */
76
- declare const isOpen: Readable<boolean>;
77
- //#endregion
78
- 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, CheckoutValue, type Environment, type ErrorData, type LoginMethod, type OrderData, type QuickBuyConfig, type SessionMode, type UserInfo, cartCount, cartTotal, checkout, checkoutStore, destroyCheckout, getCheckout, initCheckout, isOpen, isReady, subscribeToCheckout };
79
- //# sourceMappingURL=svelte.d.cts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"svelte.d.cts","names":[],"sources":["../src/svelte.ts"],"mappings":";;;;;;;;UAsEiB,aAAA;EA6Ff;EA3FA,OAAA;EAqFsB;EAnFtB,MAAA;EA8FW;EA5FX,SAAA;;EAEA,SAAA;EA0F8B;EAxF9B,YAAA;EAyGA;EAvGA,UAAA;EAiGoB;EA/FpB,IAAA,EAAM,UAAA;EA0GK;EAxGX,QAAA;;EAEA,YAAA;EAsG2B;EApG3B,KAAA;;EAEA,SAAA,GAAY,SAAA,UAAmB,SAAA,iBAA0B,QAAA;;EAEzD,YAAA,GAAe,WAAA,UAAqB,YAAA;AAAA;;;;;;;;;;;;;;;;;cA4CzB,QAAA,EAAU,QAAA,CAAS,aAAA;;;;;;;;;;;;;cAmBnB,SAAA,EAAW,QAAA;;;;cAWX,SAAA,EAAW,QAAA;;;;cAWX,OAAA,EAAS,QAAA;;;;cAWT,MAAA,EAAQ,QAAA"}