@cimplify/sdk 0.54.0 → 0.55.0
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/advanced.d.mts +1 -1
- package/dist/advanced.d.ts +1 -1
- package/dist/advanced.js +20 -20
- package/dist/advanced.mjs +1 -1
- package/dist/{chunk-EJUKGJTZ.js → chunk-6W3AH4QW.js} +2 -2
- package/dist/{chunk-NEK7CVE2.mjs → chunk-F4WS3OIF.mjs} +1 -1
- package/dist/{chunk-B3Y4C4A7.mjs → chunk-I4IXPQIX.mjs} +7 -4
- package/dist/{chunk-YJLOOC3L.js → chunk-JGBDWEPJ.js} +7 -4
- package/dist/chunk-JYPLT56O.js +272 -0
- package/dist/{chunk-IJ32BXKZ.js → chunk-MW7ICTVK.js} +35 -35
- package/dist/{chunk-6QZQQRBB.mjs → chunk-SQ7U3BWY.mjs} +1 -1
- package/dist/chunk-XYI4NXWG.mjs +259 -0
- package/dist/{client-D1Gknspz.d.mts → client-Bhvlelij.d.mts} +1 -1
- package/dist/{client-Bj2apl_y.d.mts → client-DKg-5OWu.d.mts} +16 -1
- package/dist/{client-306peWZ0.d.ts → client-Dfg_hmkP.d.ts} +16 -1
- package/dist/{client-C2bKMy5g.d.ts → client-DlGJqSDd.d.ts} +1 -1
- package/dist/index.d.mts +18 -3
- package/dist/index.d.ts +18 -3
- package/dist/index.js +160 -72
- package/dist/index.mjs +91 -3
- package/dist/react.d.mts +52 -5
- package/dist/react.d.ts +52 -5
- package/dist/react.js +592 -512
- package/dist/react.mjs +136 -58
- package/dist/server.d.mts +43 -3
- package/dist/server.d.ts +43 -3
- package/dist/server.js +170 -3
- package/dist/server.mjs +163 -3
- package/dist/{ads-C2c2Aald.d.mts → sign-in-TL01-awQ.d.mts} +17 -1
- package/dist/{ads-C2c2Aald.d.ts → sign-in-TL01-awQ.d.ts} +17 -1
- package/dist/styles.css +1 -1
- package/dist/testing/suite.d.mts +2 -2
- package/dist/testing/suite.d.ts +2 -2
- package/dist/testing/suite.js +22 -22
- package/dist/testing/suite.mjs +3 -3
- package/dist/testing.d.mts +2 -2
- package/dist/testing.d.ts +2 -2
- package/dist/testing.js +78 -78
- package/dist/testing.mjs +4 -4
- package/package.json +2 -1
- package/registry/account.json +1 -1
- package/dist/chunk-MN4PNKJA.js +0 -129
- package/dist/chunk-NRDRVZ62.mjs +0 -119
package/dist/react.js
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
|
-
var
|
|
5
|
-
var
|
|
6
|
-
var
|
|
4
|
+
var chunkJYPLT56O_js = require('./chunk-JYPLT56O.js');
|
|
5
|
+
var chunkMW7ICTVK_js = require('./chunk-MW7ICTVK.js');
|
|
6
|
+
var chunkJGBDWEPJ_js = require('./chunk-JGBDWEPJ.js');
|
|
7
7
|
var chunk7Y2O3E4D_js = require('./chunk-7Y2O3E4D.js');
|
|
8
8
|
var chunkXA3ZNR75_js = require('./chunk-XA3ZNR75.js');
|
|
9
9
|
require('./chunk-OWW5GUSB.js');
|
|
10
|
-
var
|
|
10
|
+
var React11 = require('react');
|
|
11
11
|
var jsxRuntime = require('react/jsx-runtime');
|
|
12
12
|
var clsx = require('clsx');
|
|
13
13
|
var tailwindMerge = require('tailwind-merge');
|
|
@@ -26,7 +26,7 @@ var input = require('@base-ui/react/input');
|
|
|
26
26
|
|
|
27
27
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
28
28
|
|
|
29
|
-
var
|
|
29
|
+
var React11__default = /*#__PURE__*/_interopDefault(React11);
|
|
30
30
|
|
|
31
31
|
// src/ads/identity.ts
|
|
32
32
|
var COOKIE_NAME = "_cimplify_uid";
|
|
@@ -203,7 +203,7 @@ function deriveAdsApiUrl() {
|
|
|
203
203
|
}
|
|
204
204
|
return "https://api.cimplify.io";
|
|
205
205
|
}
|
|
206
|
-
var AdContext =
|
|
206
|
+
var AdContext = React11.createContext({
|
|
207
207
|
siteId: null,
|
|
208
208
|
config: null,
|
|
209
209
|
isLoading: true,
|
|
@@ -211,7 +211,7 @@ var AdContext = React10.createContext({
|
|
|
211
211
|
apiBase: "https://api.cimplify.io"
|
|
212
212
|
});
|
|
213
213
|
function useAds() {
|
|
214
|
-
return
|
|
214
|
+
return React11.useContext(AdContext);
|
|
215
215
|
}
|
|
216
216
|
function AdProvider({
|
|
217
217
|
siteId,
|
|
@@ -220,10 +220,10 @@ function AdProvider({
|
|
|
220
220
|
children
|
|
221
221
|
}) {
|
|
222
222
|
const resolvedApiBase = apiBase || deriveAdsApiUrl();
|
|
223
|
-
const [config, setConfig] =
|
|
224
|
-
const [isLoading, setIsLoading] =
|
|
225
|
-
const [identity, setIdentity] =
|
|
226
|
-
|
|
223
|
+
const [config, setConfig] = React11.useState(null);
|
|
224
|
+
const [isLoading, setIsLoading] = React11.useState(true);
|
|
225
|
+
const [identity, setIdentity] = React11.useState(null);
|
|
226
|
+
React11.useEffect(() => {
|
|
227
227
|
const userIdentity = getUserIdentity(authenticatedAccountId);
|
|
228
228
|
setIdentity(userIdentity);
|
|
229
229
|
fetch(`${resolvedApiBase}/ads/config/${siteId}`).then((r) => r.json()).then((data) => {
|
|
@@ -246,11 +246,11 @@ function Ad({
|
|
|
246
246
|
onClick
|
|
247
247
|
}) {
|
|
248
248
|
const { siteId, config, isLoading, identity, apiBase } = useAds();
|
|
249
|
-
const [ad, setAd] =
|
|
250
|
-
const [error, setError] =
|
|
251
|
-
const impressionTracked =
|
|
252
|
-
const containerRef =
|
|
253
|
-
|
|
249
|
+
const [ad, setAd] = React11.useState(null);
|
|
250
|
+
const [error, setError] = React11.useState(false);
|
|
251
|
+
const impressionTracked = React11.useRef(false);
|
|
252
|
+
const containerRef = React11.useRef(null);
|
|
253
|
+
React11.useEffect(() => {
|
|
254
254
|
if (isLoading || !config?.enabled || !siteId || !identity) return;
|
|
255
255
|
const path = typeof window !== "undefined" ? window.location.pathname : "/";
|
|
256
256
|
const referrer = typeof document !== "undefined" ? document.referrer : "";
|
|
@@ -293,7 +293,7 @@ function Ad({
|
|
|
293
293
|
}
|
|
294
294
|
}).catch(() => setError(true));
|
|
295
295
|
}, [siteId, config, isLoading, slot, identity, apiBase]);
|
|
296
|
-
|
|
296
|
+
React11.useEffect(() => {
|
|
297
297
|
if (!ad || impressionTracked.current || typeof window === "undefined" || !identity) return;
|
|
298
298
|
const observer = new IntersectionObserver(
|
|
299
299
|
([entry]) => {
|
|
@@ -622,7 +622,7 @@ function applyCartPatch(base, patch) {
|
|
|
622
622
|
}
|
|
623
623
|
}
|
|
624
624
|
function useCollectionStore(collection) {
|
|
625
|
-
return
|
|
625
|
+
return React11.useSyncExternalStore(
|
|
626
626
|
(listener) => collection.subscribe(listener),
|
|
627
627
|
() => collection.getSnapshot(),
|
|
628
628
|
() => collection.getSnapshot()
|
|
@@ -992,7 +992,7 @@ function useCart(options = {}) {
|
|
|
992
992
|
const locationId = options.locationId ?? client.getLocationId();
|
|
993
993
|
const currency = options.currency ?? context?.currency ?? "USD";
|
|
994
994
|
const optimisticEnabled = context?.optimistic ?? true;
|
|
995
|
-
const entry =
|
|
995
|
+
const entry = React11.useMemo(
|
|
996
996
|
() => getOrCreateStore({
|
|
997
997
|
client,
|
|
998
998
|
locationId,
|
|
@@ -1002,44 +1002,44 @@ function useCart(options = {}) {
|
|
|
1002
1002
|
[client, currency, locationId, optimisticEnabled]
|
|
1003
1003
|
);
|
|
1004
1004
|
const view = useCollectionStore(entry.collection);
|
|
1005
|
-
|
|
1005
|
+
React11.useEffect(() => {
|
|
1006
1006
|
void ensureInitialized(entry);
|
|
1007
1007
|
}, [entry]);
|
|
1008
|
-
const addItem =
|
|
1008
|
+
const addItem = React11.useCallback(
|
|
1009
1009
|
async (product, quantity, addOptions) => {
|
|
1010
1010
|
await performAddItem(entry, product, quantity ?? 1, addOptions ?? {});
|
|
1011
1011
|
},
|
|
1012
1012
|
[entry]
|
|
1013
1013
|
);
|
|
1014
|
-
const removeItem =
|
|
1014
|
+
const removeItem = React11.useCallback(
|
|
1015
1015
|
async (itemId) => {
|
|
1016
1016
|
await performRemoveItem(entry, itemId);
|
|
1017
1017
|
},
|
|
1018
1018
|
[entry]
|
|
1019
1019
|
);
|
|
1020
|
-
const updateQuantity =
|
|
1020
|
+
const updateQuantity = React11.useCallback(
|
|
1021
1021
|
async (itemId, quantity) => {
|
|
1022
1022
|
await performUpdateQuantity(entry, itemId, quantity);
|
|
1023
1023
|
},
|
|
1024
1024
|
[entry]
|
|
1025
1025
|
);
|
|
1026
|
-
const clearCart =
|
|
1026
|
+
const clearCart = React11.useCallback(async () => {
|
|
1027
1027
|
await performClear(entry);
|
|
1028
1028
|
}, [entry]);
|
|
1029
|
-
const sync =
|
|
1029
|
+
const sync = React11.useCallback(async () => {
|
|
1030
1030
|
await syncFromServer(entry);
|
|
1031
1031
|
}, [entry]);
|
|
1032
|
-
const reorder =
|
|
1032
|
+
const reorder = React11.useCallback(
|
|
1033
1033
|
async (orderId) => {
|
|
1034
1034
|
return performReorder(entry, orderId);
|
|
1035
1035
|
},
|
|
1036
1036
|
[entry]
|
|
1037
1037
|
);
|
|
1038
|
-
const itemCount =
|
|
1038
|
+
const itemCount = React11.useMemo(
|
|
1039
1039
|
() => view.items.reduce((sum, item) => sum + item.quantity, 0),
|
|
1040
1040
|
[view.items]
|
|
1041
1041
|
);
|
|
1042
|
-
return
|
|
1042
|
+
return React11.useMemo(
|
|
1043
1043
|
() => ({
|
|
1044
1044
|
items: view.items,
|
|
1045
1045
|
itemCount,
|
|
@@ -1085,7 +1085,7 @@ var DEFAULT_COUNTRY = "US";
|
|
|
1085
1085
|
function createDefaultClient() {
|
|
1086
1086
|
const processRef = globalThis.process;
|
|
1087
1087
|
const envPublicKey = processRef?.env?.NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY || "";
|
|
1088
|
-
return
|
|
1088
|
+
return chunkMW7ICTVK_js.createCimplifyClient({ publicKey: envPublicKey });
|
|
1089
1089
|
}
|
|
1090
1090
|
function getStoredLocationId() {
|
|
1091
1091
|
if (typeof window === "undefined" || !window.localStorage) {
|
|
@@ -1142,30 +1142,30 @@ function resolveInitialLocation(locations) {
|
|
|
1142
1142
|
}
|
|
1143
1143
|
return locations[0];
|
|
1144
1144
|
}
|
|
1145
|
-
var CimplifyClientContext =
|
|
1146
|
-
var CimplifyStateContext =
|
|
1145
|
+
var CimplifyClientContext = React11.createContext(null);
|
|
1146
|
+
var CimplifyStateContext = React11.createContext(null);
|
|
1147
1147
|
function CimplifyProvider({
|
|
1148
1148
|
client,
|
|
1149
1149
|
children,
|
|
1150
1150
|
onLocationChange,
|
|
1151
1151
|
optimistic = true
|
|
1152
1152
|
}) {
|
|
1153
|
-
const resolvedClient =
|
|
1154
|
-
const onLocationChangeRef =
|
|
1155
|
-
const [business, setBusiness] =
|
|
1156
|
-
const [locations, setLocations] =
|
|
1157
|
-
const [currentLocation, setCurrentLocationState] =
|
|
1158
|
-
const [isReady, setIsReady] =
|
|
1159
|
-
|
|
1153
|
+
const resolvedClient = React11.useMemo(() => client ?? createDefaultClient(), [client]);
|
|
1154
|
+
const onLocationChangeRef = React11.useRef(onLocationChange);
|
|
1155
|
+
const [business, setBusiness] = React11.useState(null);
|
|
1156
|
+
const [locations, setLocations] = React11.useState([]);
|
|
1157
|
+
const [currentLocation, setCurrentLocationState] = React11.useState(null);
|
|
1158
|
+
const [isReady, setIsReady] = React11.useState(false);
|
|
1159
|
+
React11.useEffect(() => {
|
|
1160
1160
|
onLocationChangeRef.current = onLocationChange;
|
|
1161
1161
|
}, [onLocationChange]);
|
|
1162
1162
|
const baseCurrency = business?.default_currency || DEFAULT_CURRENCY;
|
|
1163
|
-
const [displayCurrencyOverride, setDisplayCurrencyOverride] =
|
|
1163
|
+
const [displayCurrencyOverride, setDisplayCurrencyOverride] = React11.useState(
|
|
1164
1164
|
() => getStoredDisplayCurrency()
|
|
1165
1165
|
);
|
|
1166
|
-
const [fxRate, setFxRate] =
|
|
1166
|
+
const [fxRate, setFxRate] = React11.useState(null);
|
|
1167
1167
|
const displayCurrency = displayCurrencyOverride && displayCurrencyOverride !== baseCurrency ? displayCurrencyOverride : baseCurrency;
|
|
1168
|
-
const setDisplayCurrency =
|
|
1168
|
+
const setDisplayCurrency = React11.useCallback(
|
|
1169
1169
|
(currency) => {
|
|
1170
1170
|
const normalized = currency?.trim().toUpperCase() || null;
|
|
1171
1171
|
if (normalized && !chunkXA3ZNR75_js.isSupportedCurrency(normalized)) {
|
|
@@ -1179,7 +1179,7 @@ function CimplifyProvider({
|
|
|
1179
1179
|
},
|
|
1180
1180
|
[baseCurrency]
|
|
1181
1181
|
);
|
|
1182
|
-
|
|
1182
|
+
React11.useEffect(() => {
|
|
1183
1183
|
if (displayCurrency === baseCurrency) {
|
|
1184
1184
|
setFxRate(null);
|
|
1185
1185
|
return;
|
|
@@ -1204,7 +1204,7 @@ function CimplifyProvider({
|
|
|
1204
1204
|
clearInterval(intervalId);
|
|
1205
1205
|
};
|
|
1206
1206
|
}, [resolvedClient, baseCurrency, displayCurrency]);
|
|
1207
|
-
const convertPrice =
|
|
1207
|
+
const convertPrice = React11.useCallback(
|
|
1208
1208
|
(amount) => {
|
|
1209
1209
|
const num = typeof amount === "string" ? parseFloat(amount) : amount;
|
|
1210
1210
|
if (isNaN(num)) return 0;
|
|
@@ -1213,7 +1213,7 @@ function CimplifyProvider({
|
|
|
1213
1213
|
},
|
|
1214
1214
|
[fxRate, displayCurrency, baseCurrency]
|
|
1215
1215
|
);
|
|
1216
|
-
const setCurrentLocation =
|
|
1216
|
+
const setCurrentLocation = React11.useCallback(
|
|
1217
1217
|
(location) => {
|
|
1218
1218
|
const previousLocationId = resolvedClient.getLocationId();
|
|
1219
1219
|
if (previousLocationId && previousLocationId !== location.id) {
|
|
@@ -1226,7 +1226,7 @@ function CimplifyProvider({
|
|
|
1226
1226
|
},
|
|
1227
1227
|
[resolvedClient]
|
|
1228
1228
|
);
|
|
1229
|
-
|
|
1229
|
+
React11.useEffect(() => {
|
|
1230
1230
|
let cancelled = false;
|
|
1231
1231
|
async function bootstrap() {
|
|
1232
1232
|
setIsReady(false);
|
|
@@ -1271,7 +1271,7 @@ function CimplifyProvider({
|
|
|
1271
1271
|
cancelled = true;
|
|
1272
1272
|
};
|
|
1273
1273
|
}, [resolvedClient]);
|
|
1274
|
-
const clientContextValue =
|
|
1274
|
+
const clientContextValue = React11.useMemo(
|
|
1275
1275
|
() => ({
|
|
1276
1276
|
client: resolvedClient,
|
|
1277
1277
|
business,
|
|
@@ -1291,7 +1291,7 @@ function CimplifyProvider({
|
|
|
1291
1291
|
optimistic
|
|
1292
1292
|
]
|
|
1293
1293
|
);
|
|
1294
|
-
const stateContextValue =
|
|
1294
|
+
const stateContextValue = React11.useMemo(
|
|
1295
1295
|
() => ({
|
|
1296
1296
|
currentLocation,
|
|
1297
1297
|
setCurrentLocation,
|
|
@@ -1312,20 +1312,20 @@ function CimplifyProvider({
|
|
|
1312
1312
|
return /* @__PURE__ */ jsxRuntime.jsx(CimplifyClientContext.Provider, { value: clientContextValue, children: /* @__PURE__ */ jsxRuntime.jsx(CimplifyStateContext.Provider, { value: stateContextValue, children }) });
|
|
1313
1313
|
}
|
|
1314
1314
|
function useCimplify() {
|
|
1315
|
-
const clientContext =
|
|
1316
|
-
const stateContext =
|
|
1315
|
+
const clientContext = React11.useContext(CimplifyClientContext);
|
|
1316
|
+
const stateContext = React11.useContext(CimplifyStateContext);
|
|
1317
1317
|
if (!clientContext || !stateContext) {
|
|
1318
1318
|
throw new Error("useCimplify must be used within CimplifyProvider");
|
|
1319
1319
|
}
|
|
1320
|
-
return
|
|
1320
|
+
return React11.useMemo(
|
|
1321
1321
|
() => ({ ...clientContext, ...stateContext }),
|
|
1322
1322
|
[clientContext, stateContext]
|
|
1323
1323
|
);
|
|
1324
1324
|
}
|
|
1325
1325
|
function useOptionalCimplify() {
|
|
1326
|
-
const clientContext =
|
|
1327
|
-
const stateContext =
|
|
1328
|
-
return
|
|
1326
|
+
const clientContext = React11.useContext(CimplifyClientContext);
|
|
1327
|
+
const stateContext = React11.useContext(CimplifyStateContext);
|
|
1328
|
+
return React11.useMemo(() => {
|
|
1329
1329
|
if (!clientContext || !stateContext) {
|
|
1330
1330
|
return null;
|
|
1331
1331
|
}
|
|
@@ -1333,14 +1333,14 @@ function useOptionalCimplify() {
|
|
|
1333
1333
|
}, [clientContext, stateContext]);
|
|
1334
1334
|
}
|
|
1335
1335
|
function useCimplifyClient() {
|
|
1336
|
-
const context =
|
|
1336
|
+
const context = React11.useContext(CimplifyClientContext);
|
|
1337
1337
|
if (!context) {
|
|
1338
1338
|
throw new Error("useCimplifyClient must be used within CimplifyProvider");
|
|
1339
1339
|
}
|
|
1340
1340
|
return context;
|
|
1341
1341
|
}
|
|
1342
1342
|
function useOptionalCimplifyClient() {
|
|
1343
|
-
return
|
|
1343
|
+
return React11.useContext(CimplifyClientContext);
|
|
1344
1344
|
}
|
|
1345
1345
|
function shellColors(isDark) {
|
|
1346
1346
|
return {
|
|
@@ -1391,34 +1391,34 @@ function CimplifyCheckout({
|
|
|
1391
1391
|
appearance,
|
|
1392
1392
|
className
|
|
1393
1393
|
}) {
|
|
1394
|
-
const resolvedOrderTypes =
|
|
1394
|
+
const resolvedOrderTypes = React11.useMemo(
|
|
1395
1395
|
() => orderTypes && orderTypes.length > 0 ? orderTypes : ["pickup", "delivery"],
|
|
1396
1396
|
[orderTypes]
|
|
1397
1397
|
);
|
|
1398
|
-
const resolvedDefaultOrderType =
|
|
1398
|
+
const resolvedDefaultOrderType = React11.useMemo(() => {
|
|
1399
1399
|
if (defaultOrderType && resolvedOrderTypes.includes(defaultOrderType)) {
|
|
1400
1400
|
return defaultOrderType;
|
|
1401
1401
|
}
|
|
1402
1402
|
return resolvedOrderTypes[0] || "pickup";
|
|
1403
1403
|
}, [defaultOrderType, resolvedOrderTypes]);
|
|
1404
|
-
const [orderType, setOrderType] =
|
|
1405
|
-
const [status, setStatus] =
|
|
1406
|
-
const [statusText, setStatusText] =
|
|
1407
|
-
const [isSubmitting, setIsSubmitting] =
|
|
1408
|
-
const [isInitializing, setIsInitializing] =
|
|
1409
|
-
const [errorMessage, setErrorMessage] =
|
|
1410
|
-
const [resolvedBusinessId, setResolvedBusinessId] =
|
|
1411
|
-
const [resolvedCartId, setResolvedCartId] =
|
|
1412
|
-
const [resolvedCart, setResolvedCart] =
|
|
1413
|
-
const checkoutMountRef =
|
|
1414
|
-
const elementsRef =
|
|
1415
|
-
const activeCheckoutRef =
|
|
1416
|
-
const initialAppearanceRef =
|
|
1417
|
-
const hasWarnedInlineAppearanceRef =
|
|
1418
|
-
const isMountedRef =
|
|
1404
|
+
const [orderType, setOrderType] = React11.useState(resolvedDefaultOrderType);
|
|
1405
|
+
const [status, setStatus] = React11.useState(null);
|
|
1406
|
+
const [statusText, setStatusText] = React11.useState("");
|
|
1407
|
+
const [isSubmitting, setIsSubmitting] = React11.useState(false);
|
|
1408
|
+
const [isInitializing, setIsInitializing] = React11.useState(false);
|
|
1409
|
+
const [errorMessage, setErrorMessage] = React11.useState(null);
|
|
1410
|
+
const [resolvedBusinessId, setResolvedBusinessId] = React11.useState(businessId ?? null);
|
|
1411
|
+
const [resolvedCartId, setResolvedCartId] = React11.useState(cartId ?? null);
|
|
1412
|
+
const [resolvedCart, setResolvedCart] = React11.useState(null);
|
|
1413
|
+
const checkoutMountRef = React11.useRef(null);
|
|
1414
|
+
const elementsRef = React11.useRef(null);
|
|
1415
|
+
const activeCheckoutRef = React11.useRef(null);
|
|
1416
|
+
const initialAppearanceRef = React11.useRef(appearance);
|
|
1417
|
+
const hasWarnedInlineAppearanceRef = React11.useRef(false);
|
|
1418
|
+
const isMountedRef = React11.useRef(true);
|
|
1419
1419
|
const isTestMode = client.isTestMode();
|
|
1420
1420
|
const cimplifyCtx = useOptionalCimplify();
|
|
1421
|
-
const fxOptions =
|
|
1421
|
+
const fxOptions = React11.useMemo(() => {
|
|
1422
1422
|
if (!cimplifyCtx?.fxRate) return void 0;
|
|
1423
1423
|
if (cimplifyCtx.displayCurrency === cimplifyCtx.baseCurrency) return void 0;
|
|
1424
1424
|
return {
|
|
@@ -1426,29 +1426,29 @@ function CimplifyCheckout({
|
|
|
1426
1426
|
convertPrice: cimplifyCtx.convertPrice
|
|
1427
1427
|
};
|
|
1428
1428
|
}, [cimplifyCtx?.fxRate, cimplifyCtx?.displayCurrency, cimplifyCtx?.baseCurrency, cimplifyCtx?.convertPrice]);
|
|
1429
|
-
const fxOptionsRef =
|
|
1429
|
+
const fxOptionsRef = React11.useRef(fxOptions);
|
|
1430
1430
|
fxOptionsRef.current = fxOptions;
|
|
1431
|
-
const resolvedCartRef =
|
|
1431
|
+
const resolvedCartRef = React11.useRef(resolvedCart);
|
|
1432
1432
|
resolvedCartRef.current = resolvedCart;
|
|
1433
1433
|
const isDark = appearance?.theme === "dark";
|
|
1434
|
-
const emitStatus =
|
|
1434
|
+
const emitStatus = React11__default.default.useEffectEvent(
|
|
1435
1435
|
(nextStatus, context = {}) => {
|
|
1436
1436
|
setStatus(nextStatus);
|
|
1437
1437
|
setStatusText(context.display_text || "");
|
|
1438
1438
|
onStatusChange?.(nextStatus, context);
|
|
1439
1439
|
}
|
|
1440
1440
|
);
|
|
1441
|
-
const fireError =
|
|
1441
|
+
const fireError = React11__default.default.useEffectEvent(
|
|
1442
1442
|
(error) => {
|
|
1443
1443
|
onError?.(error);
|
|
1444
1444
|
}
|
|
1445
1445
|
);
|
|
1446
|
-
|
|
1446
|
+
React11.useEffect(() => {
|
|
1447
1447
|
if (!resolvedOrderTypes.includes(orderType)) {
|
|
1448
1448
|
setOrderType(resolvedDefaultOrderType);
|
|
1449
1449
|
}
|
|
1450
1450
|
}, [resolvedOrderTypes, resolvedDefaultOrderType, orderType]);
|
|
1451
|
-
|
|
1451
|
+
React11.useEffect(() => {
|
|
1452
1452
|
if (appearance && appearance !== initialAppearanceRef.current && !hasWarnedInlineAppearanceRef.current) {
|
|
1453
1453
|
hasWarnedInlineAppearanceRef.current = true;
|
|
1454
1454
|
console.warn(
|
|
@@ -1456,7 +1456,7 @@ function CimplifyCheckout({
|
|
|
1456
1456
|
);
|
|
1457
1457
|
}
|
|
1458
1458
|
}, [appearance]);
|
|
1459
|
-
|
|
1459
|
+
React11.useEffect(() => {
|
|
1460
1460
|
let cancelled = false;
|
|
1461
1461
|
async function bootstrap() {
|
|
1462
1462
|
const needsBusinessResolve = !businessId;
|
|
@@ -1527,14 +1527,14 @@ function CimplifyCheckout({
|
|
|
1527
1527
|
cancelled = true;
|
|
1528
1528
|
};
|
|
1529
1529
|
}, [businessId, cartId, client]);
|
|
1530
|
-
|
|
1530
|
+
React11.useEffect(() => {
|
|
1531
1531
|
return () => {
|
|
1532
1532
|
isMountedRef.current = false;
|
|
1533
1533
|
activeCheckoutRef.current?.abort();
|
|
1534
1534
|
activeCheckoutRef.current = null;
|
|
1535
1535
|
};
|
|
1536
1536
|
}, []);
|
|
1537
|
-
const handleSubmit =
|
|
1537
|
+
const handleSubmit = React11__default.default.useEffectEvent(async () => {
|
|
1538
1538
|
if (isSubmitting || isInitializing || !resolvedCartId) {
|
|
1539
1539
|
if (!resolvedCartId && !isInitializing) {
|
|
1540
1540
|
const message = "Your cart is empty. Add items before checkout.";
|
|
@@ -1579,7 +1579,7 @@ function CimplifyCheckout({
|
|
|
1579
1579
|
}
|
|
1580
1580
|
}
|
|
1581
1581
|
});
|
|
1582
|
-
|
|
1582
|
+
React11.useEffect(() => {
|
|
1583
1583
|
if (!resolvedBusinessId) {
|
|
1584
1584
|
elementsRef.current = null;
|
|
1585
1585
|
return;
|
|
@@ -1625,7 +1625,7 @@ function CimplifyCheckout({
|
|
|
1625
1625
|
resolvedDefaultOrderType,
|
|
1626
1626
|
submitLabel
|
|
1627
1627
|
]);
|
|
1628
|
-
|
|
1628
|
+
React11.useEffect(() => {
|
|
1629
1629
|
if (!resolvedCart || !elementsRef.current) return;
|
|
1630
1630
|
const checkoutElement = elementsRef.current.getElement("checkout");
|
|
1631
1631
|
if (checkoutElement) {
|
|
@@ -1666,6 +1666,8 @@ function CimplifyAccount({
|
|
|
1666
1666
|
client: clientProp,
|
|
1667
1667
|
linkUrl,
|
|
1668
1668
|
section,
|
|
1669
|
+
businessId: businessIdProp,
|
|
1670
|
+
merchantName,
|
|
1669
1671
|
appearance,
|
|
1670
1672
|
onLogout,
|
|
1671
1673
|
className
|
|
@@ -1673,19 +1675,17 @@ function CimplifyAccount({
|
|
|
1673
1675
|
const context = useOptionalCimplify();
|
|
1674
1676
|
const client = clientProp ?? context?.client;
|
|
1675
1677
|
const resolvedLinkUrl = linkUrl || DEFAULT_LINK_URL;
|
|
1676
|
-
const
|
|
1677
|
-
const
|
|
1678
|
-
const [
|
|
1679
|
-
const
|
|
1678
|
+
const resolvedBusinessId = businessIdProp || client?.getBusinessId?.() || "";
|
|
1679
|
+
const iframeRef = React11.useRef(null);
|
|
1680
|
+
const [height, setHeight] = React11.useState(400);
|
|
1681
|
+
const [isReady, setIsReady] = React11.useState(false);
|
|
1682
|
+
const iframeSrc = React11.useMemo(() => {
|
|
1680
1683
|
const path = section ? `/elements/account/${section}` : "/elements/account";
|
|
1681
1684
|
const url = new URL(path, resolvedLinkUrl);
|
|
1682
|
-
if (
|
|
1683
|
-
const businessId = client.getBusinessId?.() ?? "";
|
|
1684
|
-
if (businessId) url.searchParams.set("businessId", businessId);
|
|
1685
|
-
}
|
|
1685
|
+
if (resolvedBusinessId) url.searchParams.set("businessId", resolvedBusinessId);
|
|
1686
1686
|
return url.toString();
|
|
1687
|
-
}, [resolvedLinkUrl, section,
|
|
1688
|
-
|
|
1687
|
+
}, [resolvedLinkUrl, section, resolvedBusinessId]);
|
|
1688
|
+
React11.useEffect(() => {
|
|
1689
1689
|
function handleMessage(event) {
|
|
1690
1690
|
if (!event.data || typeof event.data !== "object") return;
|
|
1691
1691
|
if (iframeRef.current?.contentWindow && event.source !== iframeRef.current.contentWindow) {
|
|
@@ -1720,7 +1720,9 @@ function CimplifyAccount({
|
|
|
1720
1720
|
{
|
|
1721
1721
|
type: "init",
|
|
1722
1722
|
token: token ?? void 0,
|
|
1723
|
-
appearance: appearance ?? void 0
|
|
1723
|
+
appearance: appearance ?? void 0,
|
|
1724
|
+
businessId: resolvedBusinessId || void 0,
|
|
1725
|
+
merchantName: merchantName ?? void 0
|
|
1724
1726
|
},
|
|
1725
1727
|
resolvedLinkUrl
|
|
1726
1728
|
);
|
|
@@ -1753,6 +1755,82 @@ function CimplifyAccount({
|
|
|
1753
1755
|
}
|
|
1754
1756
|
);
|
|
1755
1757
|
}
|
|
1758
|
+
var BASE_CLASSES = "inline-flex items-center justify-center gap-2 font-medium text-sm rounded-md transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed";
|
|
1759
|
+
var VARIANT_CLASSES = {
|
|
1760
|
+
primary: "bg-emerald-600 text-white hover:bg-emerald-700 px-4 py-2.5 border border-transparent",
|
|
1761
|
+
outline: "bg-white text-zinc-900 hover:bg-zinc-50 px-4 py-2.5 border border-zinc-300",
|
|
1762
|
+
dark: "bg-zinc-900 text-white hover:bg-zinc-800 px-4 py-2.5 border border-zinc-800",
|
|
1763
|
+
text: "bg-transparent text-emerald-700 hover:text-emerald-800 px-2 py-1"
|
|
1764
|
+
};
|
|
1765
|
+
function CimplifySignInButton({
|
|
1766
|
+
variant = "primary",
|
|
1767
|
+
label,
|
|
1768
|
+
className,
|
|
1769
|
+
disabled,
|
|
1770
|
+
fullWidth,
|
|
1771
|
+
onSuccess,
|
|
1772
|
+
onError,
|
|
1773
|
+
...signInOpts
|
|
1774
|
+
}) {
|
|
1775
|
+
const [busy, setBusy] = React11.useState(false);
|
|
1776
|
+
const onClick = React11.useCallback(async () => {
|
|
1777
|
+
if (busy || disabled) return;
|
|
1778
|
+
setBusy(true);
|
|
1779
|
+
await chunkJYPLT56O_js.startSignIn({
|
|
1780
|
+
...signInOpts,
|
|
1781
|
+
onSuccess: () => {
|
|
1782
|
+
setBusy(false);
|
|
1783
|
+
onSuccess?.();
|
|
1784
|
+
},
|
|
1785
|
+
onError: (e) => {
|
|
1786
|
+
setBusy(false);
|
|
1787
|
+
onError?.(e);
|
|
1788
|
+
}
|
|
1789
|
+
});
|
|
1790
|
+
}, [busy, disabled, signInOpts, onSuccess, onError]);
|
|
1791
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1792
|
+
"button",
|
|
1793
|
+
{
|
|
1794
|
+
type: "button",
|
|
1795
|
+
onClick,
|
|
1796
|
+
disabled: disabled || busy,
|
|
1797
|
+
className: cn(BASE_CLASSES, VARIANT_CLASSES[variant], fullWidth && "w-full", className),
|
|
1798
|
+
"data-cimplify-signin": true,
|
|
1799
|
+
children: [
|
|
1800
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "inline-flex", style: { width: 16, height: 16 }, children: /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.4, strokeLinecap: "round", strokeLinejoin: "round", children: [
|
|
1801
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 13.5a4 4 0 0 0 5.6 0l3-3a4 4 0 0 0-5.6-5.6L11.5 6.4" }),
|
|
1802
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14 10.5a4 4 0 0 0-5.6 0l-3 3a4 4 0 0 0 5.6 5.6l1.5-1.5" })
|
|
1803
|
+
] }) }),
|
|
1804
|
+
label ?? (busy ? "Signing in\u2026" : "Continue with Cimplify")
|
|
1805
|
+
]
|
|
1806
|
+
}
|
|
1807
|
+
);
|
|
1808
|
+
}
|
|
1809
|
+
function useCimplifySession(options) {
|
|
1810
|
+
const sessionUri = options?.sessionUri ?? "/auth/session";
|
|
1811
|
+
const [session, setSession] = React11.useState(null);
|
|
1812
|
+
const [loading, setLoading] = React11.useState(true);
|
|
1813
|
+
const fetchSession = React11.useCallback(async () => {
|
|
1814
|
+
setLoading(true);
|
|
1815
|
+
try {
|
|
1816
|
+
const res = await fetch(sessionUri, { credentials: "include" });
|
|
1817
|
+
if (!res.ok) {
|
|
1818
|
+
setSession(null);
|
|
1819
|
+
return;
|
|
1820
|
+
}
|
|
1821
|
+
const body = await res.json().catch(() => null);
|
|
1822
|
+
setSession(body?.sub ? body : null);
|
|
1823
|
+
} catch {
|
|
1824
|
+
setSession(null);
|
|
1825
|
+
} finally {
|
|
1826
|
+
setLoading(false);
|
|
1827
|
+
}
|
|
1828
|
+
}, [sessionUri]);
|
|
1829
|
+
React11.useEffect(() => {
|
|
1830
|
+
void fetchSession();
|
|
1831
|
+
}, [fetchSession]);
|
|
1832
|
+
return { session, loading, refresh: fetchSession };
|
|
1833
|
+
}
|
|
1756
1834
|
function Price({ amount, currency, className, prefix }) {
|
|
1757
1835
|
const context = useOptionalCimplify();
|
|
1758
1836
|
const resolvedCurrency = currency ?? context?.displayCurrency ?? "USD";
|
|
@@ -1787,9 +1865,9 @@ function createCachedQuery(config) {
|
|
|
1787
1865
|
}
|
|
1788
1866
|
const enabled = options.enabled ?? true;
|
|
1789
1867
|
const locationId = client.getLocationId();
|
|
1790
|
-
const previousLocationRef =
|
|
1791
|
-
const requestIdRef =
|
|
1792
|
-
const optionsRef =
|
|
1868
|
+
const previousLocationRef = React11.useRef(locationId);
|
|
1869
|
+
const requestIdRef = React11.useRef(0);
|
|
1870
|
+
const optionsRef = React11.useRef(options);
|
|
1793
1871
|
optionsRef.current = options;
|
|
1794
1872
|
if (config.locationSensitive && previousLocationRef.current !== locationId) {
|
|
1795
1873
|
cache.clear();
|
|
@@ -1799,10 +1877,10 @@ function createCachedQuery(config) {
|
|
|
1799
1877
|
sweep();
|
|
1800
1878
|
const cacheKey2 = config.key(client, options);
|
|
1801
1879
|
const cached = cache.get(cacheKey2);
|
|
1802
|
-
const [data, setData] =
|
|
1803
|
-
const [isLoading, setIsLoading] =
|
|
1804
|
-
const [error, setError] =
|
|
1805
|
-
const load =
|
|
1880
|
+
const [data, setData] = React11.useState(cached?.data ?? null);
|
|
1881
|
+
const [isLoading, setIsLoading] = React11.useState(enabled && !cached);
|
|
1882
|
+
const [error, setError] = React11.useState(null);
|
|
1883
|
+
const load = React11.useCallback(
|
|
1806
1884
|
async (force = false) => {
|
|
1807
1885
|
if (!enabled) {
|
|
1808
1886
|
setIsLoading(false);
|
|
@@ -1845,10 +1923,10 @@ function createCachedQuery(config) {
|
|
|
1845
1923
|
},
|
|
1846
1924
|
[cacheKey2, client, enabled]
|
|
1847
1925
|
);
|
|
1848
|
-
|
|
1926
|
+
React11.useEffect(() => {
|
|
1849
1927
|
void load(false);
|
|
1850
1928
|
}, [load]);
|
|
1851
|
-
const refetch =
|
|
1929
|
+
const refetch = React11.useCallback(async () => {
|
|
1852
1930
|
cache.delete(cacheKey2);
|
|
1853
1931
|
await load(true);
|
|
1854
1932
|
}, [cacheKey2, load]);
|
|
@@ -1978,25 +2056,25 @@ function useOrder(orderId, options = {}) {
|
|
|
1978
2056
|
if (!client) {
|
|
1979
2057
|
throw new Error("useOrder must be used within CimplifyProvider or passed { client }.");
|
|
1980
2058
|
}
|
|
1981
|
-
const normalizedOrderId =
|
|
2059
|
+
const normalizedOrderId = React11.useMemo(() => (orderId || "").trim(), [orderId]);
|
|
1982
2060
|
const enabled = options.enabled ?? true;
|
|
1983
2061
|
const poll = options.poll ?? false;
|
|
1984
2062
|
const pollInterval = options.pollInterval ?? 5e3;
|
|
1985
|
-
const requestIdRef =
|
|
1986
|
-
const previousStatusRef =
|
|
1987
|
-
const onStatusChangeRef =
|
|
2063
|
+
const requestIdRef = React11.useRef(0);
|
|
2064
|
+
const previousStatusRef = React11.useRef(null);
|
|
2065
|
+
const onStatusChangeRef = React11.useRef(options.onStatusChange);
|
|
1988
2066
|
onStatusChangeRef.current = options.onStatusChange;
|
|
1989
|
-
const cacheKey2 =
|
|
2067
|
+
const cacheKey2 = React11.useMemo(
|
|
1990
2068
|
() => buildOrderCacheKey(client, normalizedOrderId),
|
|
1991
2069
|
[client, normalizedOrderId]
|
|
1992
2070
|
);
|
|
1993
2071
|
const cached = orderCache.get(cacheKey2);
|
|
1994
|
-
const [order, setOrder] =
|
|
1995
|
-
const [isLoading, setIsLoading] =
|
|
2072
|
+
const [order, setOrder] = React11.useState(cached?.order ?? null);
|
|
2073
|
+
const [isLoading, setIsLoading] = React11.useState(
|
|
1996
2074
|
enabled && normalizedOrderId.length > 0 && !cached
|
|
1997
2075
|
);
|
|
1998
|
-
const [error, setError] =
|
|
1999
|
-
const load =
|
|
2076
|
+
const [error, setError] = React11.useState(null);
|
|
2077
|
+
const load = React11.useCallback(
|
|
2000
2078
|
async (force = false) => {
|
|
2001
2079
|
if (!enabled || normalizedOrderId.length === 0) {
|
|
2002
2080
|
setOrder(null);
|
|
@@ -2055,11 +2133,11 @@ function useOrder(orderId, options = {}) {
|
|
|
2055
2133
|
},
|
|
2056
2134
|
[cacheKey2, client, enabled, normalizedOrderId]
|
|
2057
2135
|
);
|
|
2058
|
-
|
|
2136
|
+
React11.useEffect(() => {
|
|
2059
2137
|
void load(false);
|
|
2060
2138
|
}, [load]);
|
|
2061
2139
|
const isTerminal = order ? TERMINAL_STATUSES.has(order.status) : false;
|
|
2062
|
-
|
|
2140
|
+
React11.useEffect(() => {
|
|
2063
2141
|
if (!poll || !enabled || normalizedOrderId.length === 0 || isTerminal) {
|
|
2064
2142
|
return;
|
|
2065
2143
|
}
|
|
@@ -2070,7 +2148,7 @@ function useOrder(orderId, options = {}) {
|
|
|
2070
2148
|
window.clearInterval(timer);
|
|
2071
2149
|
};
|
|
2072
2150
|
}, [enabled, isTerminal, load, normalizedOrderId, poll, pollInterval]);
|
|
2073
|
-
const refetch =
|
|
2151
|
+
const refetch = React11.useCallback(async () => {
|
|
2074
2152
|
orderCache.delete(cacheKey2);
|
|
2075
2153
|
await load(true);
|
|
2076
2154
|
}, [cacheKey2, load]);
|
|
@@ -2121,10 +2199,10 @@ function useLocations(options = {}) {
|
|
|
2121
2199
|
};
|
|
2122
2200
|
}
|
|
2123
2201
|
const client = options.client;
|
|
2124
|
-
const [locations, setLocations] =
|
|
2125
|
-
const [currentLocation, setCurrentLocationState] =
|
|
2126
|
-
const [isLoading, setIsLoading] =
|
|
2127
|
-
const setCurrentLocation =
|
|
2202
|
+
const [locations, setLocations] = React11.useState([]);
|
|
2203
|
+
const [currentLocation, setCurrentLocationState] = React11.useState(null);
|
|
2204
|
+
const [isLoading, setIsLoading] = React11.useState(true);
|
|
2205
|
+
const setCurrentLocation = React11.useCallback(
|
|
2128
2206
|
(location) => {
|
|
2129
2207
|
setCurrentLocationState(location);
|
|
2130
2208
|
if (client) {
|
|
@@ -2134,7 +2212,7 @@ function useLocations(options = {}) {
|
|
|
2134
2212
|
},
|
|
2135
2213
|
[client]
|
|
2136
2214
|
);
|
|
2137
|
-
|
|
2215
|
+
React11.useEffect(() => {
|
|
2138
2216
|
if (!client) {
|
|
2139
2217
|
setLocations([]);
|
|
2140
2218
|
setCurrentLocationState(null);
|
|
@@ -2238,14 +2316,14 @@ function useSearch(options = {}) {
|
|
|
2238
2316
|
const minLength = Math.max(0, options.minLength ?? 2);
|
|
2239
2317
|
const debounceMs = Math.max(0, options.debounceMs ?? 300);
|
|
2240
2318
|
const limit = Math.max(1, options.limit ?? 20);
|
|
2241
|
-
const [query, setQueryState] =
|
|
2242
|
-
const [results, setResults] =
|
|
2243
|
-
const [isLoading, setIsLoading] =
|
|
2244
|
-
const [error, setError] =
|
|
2245
|
-
const requestIdRef =
|
|
2246
|
-
const timerRef =
|
|
2319
|
+
const [query, setQueryState] = React11.useState("");
|
|
2320
|
+
const [results, setResults] = React11.useState([]);
|
|
2321
|
+
const [isLoading, setIsLoading] = React11.useState(false);
|
|
2322
|
+
const [error, setError] = React11.useState(null);
|
|
2323
|
+
const requestIdRef = React11.useRef(0);
|
|
2324
|
+
const timerRef = React11.useRef(null);
|
|
2247
2325
|
const tagsSignature = options.tags?.join(",") ?? "";
|
|
2248
|
-
|
|
2326
|
+
React11.useEffect(() => {
|
|
2249
2327
|
if (timerRef.current) {
|
|
2250
2328
|
clearTimeout(timerRef.current);
|
|
2251
2329
|
timerRef.current = null;
|
|
@@ -2300,10 +2378,10 @@ function useSearch(options = {}) {
|
|
|
2300
2378
|
}
|
|
2301
2379
|
};
|
|
2302
2380
|
}, [client, debounceMs, limit, minLength, options.category, options.taxonomy, tagsSignature, options.featured, options.in_stock, options.min_price, options.max_price, options.sort_by, options.sort_order, query]);
|
|
2303
|
-
const setQuery =
|
|
2381
|
+
const setQuery = React11.useCallback((nextQuery) => {
|
|
2304
2382
|
setQueryState(nextQuery);
|
|
2305
2383
|
}, []);
|
|
2306
|
-
const clear =
|
|
2384
|
+
const clear = React11.useCallback(() => {
|
|
2307
2385
|
requestIdRef.current += 1;
|
|
2308
2386
|
if (timerRef.current) {
|
|
2309
2387
|
clearTimeout(timerRef.current);
|
|
@@ -2394,34 +2472,34 @@ function useQuote(input, options = {}) {
|
|
|
2394
2472
|
const autoRefresh = options.autoRefresh ?? true;
|
|
2395
2473
|
const refreshBeforeExpiryMs = Math.max(0, options.refreshBeforeExpiryMs ?? 3e4);
|
|
2396
2474
|
const locationId = client.getLocationId();
|
|
2397
|
-
const requestIdRef =
|
|
2398
|
-
const debounceTimerRef =
|
|
2475
|
+
const requestIdRef = React11.useRef(0);
|
|
2476
|
+
const debounceTimerRef = React11.useRef(null);
|
|
2399
2477
|
const inputSignature = buildQuoteInputSignature(input);
|
|
2400
|
-
const normalizedInput =
|
|
2478
|
+
const normalizedInput = React11.useMemo(() => {
|
|
2401
2479
|
if (!input) {
|
|
2402
2480
|
return null;
|
|
2403
2481
|
}
|
|
2404
2482
|
const normalized = normalizeInput(input, locationId);
|
|
2405
2483
|
return normalized.product_id.length > 0 ? normalized : null;
|
|
2406
2484
|
}, [inputSignature, locationId]);
|
|
2407
|
-
const cacheKey2 =
|
|
2485
|
+
const cacheKey2 = React11.useMemo(
|
|
2408
2486
|
() => buildQuoteCacheKey(client, locationId, inputSignature),
|
|
2409
2487
|
[client, inputSignature, locationId]
|
|
2410
2488
|
);
|
|
2411
2489
|
const cached = quoteCache.get(cacheKey2);
|
|
2412
|
-
const [quote, setQuote] =
|
|
2413
|
-
const [isLoading, setIsLoading] =
|
|
2414
|
-
const [error, setError] =
|
|
2415
|
-
const [isExpired, setIsExpired] =
|
|
2416
|
-
const [messages, setMessages] =
|
|
2417
|
-
const quoteExpiryTimestamp =
|
|
2490
|
+
const [quote, setQuote] = React11.useState(cached?.quote ?? null);
|
|
2491
|
+
const [isLoading, setIsLoading] = React11.useState(enabled && normalizedInput !== null && !cached);
|
|
2492
|
+
const [error, setError] = React11.useState(null);
|
|
2493
|
+
const [isExpired, setIsExpired] = React11.useState(isQuoteExpired(cached?.quote ?? null));
|
|
2494
|
+
const [messages, setMessages] = React11.useState(cached?.quote?.ui_messages ?? []);
|
|
2495
|
+
const quoteExpiryTimestamp = React11.useMemo(() => {
|
|
2418
2496
|
if (!quote?.expires_at) {
|
|
2419
2497
|
return Number.NaN;
|
|
2420
2498
|
}
|
|
2421
2499
|
const expiresAt = Date.parse(quote.expires_at);
|
|
2422
2500
|
return Number.isFinite(expiresAt) ? expiresAt : Number.NaN;
|
|
2423
2501
|
}, [quote?.expires_at]);
|
|
2424
|
-
const load =
|
|
2502
|
+
const load = React11.useCallback(
|
|
2425
2503
|
async (force = false) => {
|
|
2426
2504
|
if (!enabled || !normalizedInput) {
|
|
2427
2505
|
setQuote(null);
|
|
@@ -2481,7 +2559,7 @@ function useQuote(input, options = {}) {
|
|
|
2481
2559
|
},
|
|
2482
2560
|
[cacheKey2, client, enabled, normalizedInput]
|
|
2483
2561
|
);
|
|
2484
|
-
|
|
2562
|
+
React11.useEffect(() => {
|
|
2485
2563
|
if (debounceTimerRef.current) {
|
|
2486
2564
|
clearTimeout(debounceTimerRef.current);
|
|
2487
2565
|
}
|
|
@@ -2500,7 +2578,7 @@ function useQuote(input, options = {}) {
|
|
|
2500
2578
|
}
|
|
2501
2579
|
};
|
|
2502
2580
|
}, [load, cacheKey2, enabled, normalizedInput]);
|
|
2503
|
-
const refresh =
|
|
2581
|
+
const refresh = React11.useCallback(async () => {
|
|
2504
2582
|
if (!enabled || !normalizedInput) {
|
|
2505
2583
|
return;
|
|
2506
2584
|
}
|
|
@@ -2537,7 +2615,7 @@ function useQuote(input, options = {}) {
|
|
|
2537
2615
|
}
|
|
2538
2616
|
}
|
|
2539
2617
|
}, [cacheKey2, client, enabled, load, normalizedInput, quote]);
|
|
2540
|
-
|
|
2618
|
+
React11.useEffect(() => {
|
|
2541
2619
|
if (!Number.isFinite(quoteExpiryTimestamp)) {
|
|
2542
2620
|
setIsExpired(false);
|
|
2543
2621
|
return;
|
|
@@ -2713,9 +2791,9 @@ function useValidateDiscount(options = {}) {
|
|
|
2713
2791
|
if (!client) {
|
|
2714
2792
|
throw new Error("useValidateDiscount must be used within CimplifyProvider or passed { client }.");
|
|
2715
2793
|
}
|
|
2716
|
-
const [isValidating, setIsValidating] =
|
|
2717
|
-
const [error, setError] =
|
|
2718
|
-
const validate =
|
|
2794
|
+
const [isValidating, setIsValidating] = React11.useState(false);
|
|
2795
|
+
const [error, setError] = React11.useState(null);
|
|
2796
|
+
const validate = React11.useCallback(
|
|
2719
2797
|
async (code, orderSubtotal, locationId) => {
|
|
2720
2798
|
setError(null);
|
|
2721
2799
|
setIsValidating(true);
|
|
@@ -2762,7 +2840,7 @@ function useProductPrice(input) {
|
|
|
2762
2840
|
compositePrice,
|
|
2763
2841
|
bundleTotalPrice
|
|
2764
2842
|
} = input;
|
|
2765
|
-
return
|
|
2843
|
+
return React11.useMemo(() => {
|
|
2766
2844
|
let unitPrice;
|
|
2767
2845
|
if (bundleTotalPrice != null) {
|
|
2768
2846
|
unitPrice = bundleTotalPrice;
|
|
@@ -2811,10 +2889,10 @@ function useOrders(options = {}) {
|
|
|
2811
2889
|
function useSubscriptions(options = {}) {
|
|
2812
2890
|
const { client } = useCimplifyClient();
|
|
2813
2891
|
const { status, enabled = true } = options;
|
|
2814
|
-
const [subscriptions, setSubscriptions] =
|
|
2815
|
-
const [isLoading, setIsLoading] =
|
|
2816
|
-
const [error, setError] =
|
|
2817
|
-
const fetch2 =
|
|
2892
|
+
const [subscriptions, setSubscriptions] = React11.useState([]);
|
|
2893
|
+
const [isLoading, setIsLoading] = React11.useState(false);
|
|
2894
|
+
const [error, setError] = React11.useState(null);
|
|
2895
|
+
const fetch2 = React11.useCallback(async () => {
|
|
2818
2896
|
if (!enabled) return;
|
|
2819
2897
|
setIsLoading(true);
|
|
2820
2898
|
setError(null);
|
|
@@ -2832,7 +2910,7 @@ function useSubscriptions(options = {}) {
|
|
|
2832
2910
|
setIsLoading(false);
|
|
2833
2911
|
}
|
|
2834
2912
|
}, [client, enabled, status]);
|
|
2835
|
-
|
|
2913
|
+
React11.useEffect(() => {
|
|
2836
2914
|
void fetch2();
|
|
2837
2915
|
}, [fetch2]);
|
|
2838
2916
|
return { subscriptions, isLoading, error, refetch: fetch2 };
|
|
@@ -2841,10 +2919,10 @@ function useSubscription(id, options = {}) {
|
|
|
2841
2919
|
const { client } = useCimplifyClient();
|
|
2842
2920
|
const { enabled = true } = options;
|
|
2843
2921
|
const normalizedId = (id || "").trim();
|
|
2844
|
-
const [subscription, setSubscription] =
|
|
2845
|
-
const [isLoading, setIsLoading] =
|
|
2846
|
-
const [error, setError] =
|
|
2847
|
-
const fetch2 =
|
|
2922
|
+
const [subscription, setSubscription] = React11.useState(null);
|
|
2923
|
+
const [isLoading, setIsLoading] = React11.useState(false);
|
|
2924
|
+
const [error, setError] = React11.useState(null);
|
|
2925
|
+
const fetch2 = React11.useCallback(async () => {
|
|
2848
2926
|
if (!enabled || !normalizedId) return;
|
|
2849
2927
|
setIsLoading(true);
|
|
2850
2928
|
setError(null);
|
|
@@ -2861,25 +2939,25 @@ function useSubscription(id, options = {}) {
|
|
|
2861
2939
|
setIsLoading(false);
|
|
2862
2940
|
}
|
|
2863
2941
|
}, [client, enabled, normalizedId]);
|
|
2864
|
-
|
|
2942
|
+
React11.useEffect(() => {
|
|
2865
2943
|
void fetch2();
|
|
2866
2944
|
}, [fetch2]);
|
|
2867
|
-
const cancel =
|
|
2945
|
+
const cancel = React11.useCallback(async (reason) => {
|
|
2868
2946
|
if (!normalizedId) return;
|
|
2869
2947
|
await client.subscriptions.cancel(normalizedId, reason);
|
|
2870
2948
|
void fetch2();
|
|
2871
2949
|
}, [client, normalizedId, fetch2]);
|
|
2872
|
-
const pause =
|
|
2950
|
+
const pause = React11.useCallback(async () => {
|
|
2873
2951
|
if (!normalizedId) return;
|
|
2874
2952
|
await client.subscriptions.pause(normalizedId);
|
|
2875
2953
|
void fetch2();
|
|
2876
2954
|
}, [client, normalizedId, fetch2]);
|
|
2877
|
-
const resume =
|
|
2955
|
+
const resume = React11.useCallback(async () => {
|
|
2878
2956
|
if (!normalizedId) return;
|
|
2879
2957
|
await client.subscriptions.resume(normalizedId);
|
|
2880
2958
|
void fetch2();
|
|
2881
2959
|
}, [client, normalizedId, fetch2]);
|
|
2882
|
-
const skipNext =
|
|
2960
|
+
const skipNext = React11.useCallback(async () => {
|
|
2883
2961
|
if (!normalizedId) return;
|
|
2884
2962
|
await client.subscriptions.skipNextRenewal(normalizedId);
|
|
2885
2963
|
void fetch2();
|
|
@@ -2983,7 +3061,7 @@ function useBookings(options = {}) {
|
|
|
2983
3061
|
const context = useOptionalCimplifyClient();
|
|
2984
3062
|
const client = options.client ?? context?.client;
|
|
2985
3063
|
const { data, isLoading, error, refetch } = bookingsQuery(options);
|
|
2986
|
-
const cancelBooking =
|
|
3064
|
+
const cancelBooking = React11.useCallback(
|
|
2987
3065
|
async (bookingId, reason) => {
|
|
2988
3066
|
if (!client) throw new Error("useBookings must be used within CimplifyProvider or passed { client }.");
|
|
2989
3067
|
const result = await client.scheduling.cancelBooking({
|
|
@@ -3039,14 +3117,14 @@ function useBillingPlans(productId, options = {}) {
|
|
|
3039
3117
|
throw new Error("useBillingPlans must be used within CimplifyProvider or passed { client }.");
|
|
3040
3118
|
}
|
|
3041
3119
|
const enabled = options.enabled ?? true;
|
|
3042
|
-
const requestIdRef =
|
|
3043
|
-
const [plans, setPlans] =
|
|
3044
|
-
const [isLoading, setIsLoading] =
|
|
3045
|
-
const [error, setError] =
|
|
3120
|
+
const requestIdRef = React11.useRef(0);
|
|
3121
|
+
const [plans, setPlans] = React11.useState([]);
|
|
3122
|
+
const [isLoading, setIsLoading] = React11.useState(enabled && !!productId);
|
|
3123
|
+
const [error, setError] = React11.useState(null);
|
|
3046
3124
|
const customerId = options.customerId;
|
|
3047
3125
|
const quantity = options.quantity;
|
|
3048
3126
|
const orderValue = options.orderValue;
|
|
3049
|
-
const load =
|
|
3127
|
+
const load = React11.useCallback(
|
|
3050
3128
|
async (force = false) => {
|
|
3051
3129
|
if (!enabled || !productId) {
|
|
3052
3130
|
setPlans([]);
|
|
@@ -3081,17 +3159,17 @@ function useBillingPlans(productId, options = {}) {
|
|
|
3081
3159
|
},
|
|
3082
3160
|
[client, enabled, productId, customerId, quantity, orderValue]
|
|
3083
3161
|
);
|
|
3084
|
-
|
|
3162
|
+
React11.useEffect(() => {
|
|
3085
3163
|
void load(false);
|
|
3086
3164
|
}, [load]);
|
|
3087
|
-
const refetch =
|
|
3165
|
+
const refetch = React11.useCallback(async () => {
|
|
3088
3166
|
await load(true);
|
|
3089
3167
|
}, [load]);
|
|
3090
|
-
const subscriptionPlans =
|
|
3168
|
+
const subscriptionPlans = React11.useMemo(
|
|
3091
3169
|
() => plans.filter((p) => p.plan_type === "subscription"),
|
|
3092
3170
|
[plans]
|
|
3093
3171
|
);
|
|
3094
|
-
const installmentPlans =
|
|
3172
|
+
const installmentPlans = React11.useMemo(
|
|
3095
3173
|
() => plans.filter((p) => p.plan_type === "installment"),
|
|
3096
3174
|
[plans]
|
|
3097
3175
|
);
|
|
@@ -3126,8 +3204,8 @@ function computeAvailableValues(variants, axes, selections) {
|
|
|
3126
3204
|
}
|
|
3127
3205
|
function useVariantSelector(options) {
|
|
3128
3206
|
const { variants, axes } = options;
|
|
3129
|
-
const [selectedValues, setSelectedValues] =
|
|
3130
|
-
const selectValue =
|
|
3207
|
+
const [selectedValues, setSelectedValues] = React11.useState({});
|
|
3208
|
+
const selectValue = React11.useCallback(
|
|
3131
3209
|
(axisId, valueId) => {
|
|
3132
3210
|
setSelectedValues((prev) => {
|
|
3133
3211
|
if (prev[axisId] === valueId) {
|
|
@@ -3140,16 +3218,16 @@ function useVariantSelector(options) {
|
|
|
3140
3218
|
},
|
|
3141
3219
|
[]
|
|
3142
3220
|
);
|
|
3143
|
-
const reset =
|
|
3144
|
-
const selectedVariant =
|
|
3221
|
+
const reset = React11.useCallback(() => setSelectedValues({}), []);
|
|
3222
|
+
const selectedVariant = React11.useMemo(
|
|
3145
3223
|
() => findMatchingVariant(variants, selectedValues),
|
|
3146
3224
|
[variants, selectedValues]
|
|
3147
3225
|
);
|
|
3148
|
-
const variantImage =
|
|
3226
|
+
const variantImage = React11.useMemo(
|
|
3149
3227
|
() => selectedVariant?.images?.[0] ?? null,
|
|
3150
3228
|
[selectedVariant]
|
|
3151
3229
|
);
|
|
3152
|
-
const availableValues =
|
|
3230
|
+
const availableValues = React11.useMemo(
|
|
3153
3231
|
() => computeAvailableValues(variants, axes, selectedValues),
|
|
3154
3232
|
[variants, axes, selectedValues]
|
|
3155
3233
|
);
|
|
@@ -3175,7 +3253,7 @@ function useActivityState(options = {}) {
|
|
|
3175
3253
|
const context = useOptionalCimplifyClient();
|
|
3176
3254
|
const client = options.client ?? context?.client;
|
|
3177
3255
|
const { data, isLoading, error, refetch } = activityStateQuery(options);
|
|
3178
|
-
const dismissMessage =
|
|
3256
|
+
const dismissMessage = React11.useCallback(
|
|
3179
3257
|
async (code) => {
|
|
3180
3258
|
if (!client) return;
|
|
3181
3259
|
const result = await client.activity.dismissMessage(code);
|
|
@@ -3277,31 +3355,31 @@ var WS_PATH = "/api/v1/support/conversation/ws";
|
|
|
3277
3355
|
function useChat(options = {}) {
|
|
3278
3356
|
const context = useOptionalCimplifyClient();
|
|
3279
3357
|
const client = options.client ?? context?.client;
|
|
3280
|
-
const [messages, setMessages] =
|
|
3281
|
-
const [isLoading, setIsLoading] =
|
|
3282
|
-
const [isSending, setIsSending] =
|
|
3283
|
-
const [error, setError] =
|
|
3284
|
-
const [conversationOpened, setConversationOpened] =
|
|
3285
|
-
const pollRef =
|
|
3286
|
-
const lastActivityRef =
|
|
3287
|
-
const openedRef =
|
|
3288
|
-
const messagesRef =
|
|
3289
|
-
const clientRef =
|
|
3290
|
-
const wsRef =
|
|
3291
|
-
const wsReconnectAttemptRef =
|
|
3292
|
-
const wsReconnectTimerRef =
|
|
3358
|
+
const [messages, setMessages] = React11.useState([]);
|
|
3359
|
+
const [isLoading, setIsLoading] = React11.useState(false);
|
|
3360
|
+
const [isSending, setIsSending] = React11.useState(false);
|
|
3361
|
+
const [error, setError] = React11.useState(null);
|
|
3362
|
+
const [conversationOpened, setConversationOpened] = React11.useState(false);
|
|
3363
|
+
const pollRef = React11.useRef(null);
|
|
3364
|
+
const lastActivityRef = React11.useRef(Date.now());
|
|
3365
|
+
const openedRef = React11.useRef(false);
|
|
3366
|
+
const messagesRef = React11.useRef([]);
|
|
3367
|
+
const clientRef = React11.useRef(client);
|
|
3368
|
+
const wsRef = React11.useRef(null);
|
|
3369
|
+
const wsReconnectAttemptRef = React11.useRef(0);
|
|
3370
|
+
const wsReconnectTimerRef = React11.useRef(null);
|
|
3293
3371
|
messagesRef.current = messages;
|
|
3294
3372
|
clientRef.current = client;
|
|
3295
3373
|
const pollInterval = options.pollInterval ?? POLL_INTERVAL_MS;
|
|
3296
3374
|
const pollIdleInterval = options.pollIdleInterval ?? POLL_IDLE_INTERVAL_MS;
|
|
3297
|
-
const appendMessages =
|
|
3375
|
+
const appendMessages = React11.useCallback((incoming) => {
|
|
3298
3376
|
setMessages((prev) => {
|
|
3299
3377
|
const ids = new Set(prev.map((m) => m.id));
|
|
3300
3378
|
const fresh = incoming.filter((m) => !ids.has(m.id));
|
|
3301
3379
|
return fresh.length > 0 ? [...prev, ...fresh] : prev;
|
|
3302
3380
|
});
|
|
3303
3381
|
}, []);
|
|
3304
|
-
const pollMessages =
|
|
3382
|
+
const pollMessages = React11.useCallback(async () => {
|
|
3305
3383
|
const c = clientRef.current;
|
|
3306
3384
|
if (!c) return;
|
|
3307
3385
|
if (Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS) return;
|
|
@@ -3314,18 +3392,18 @@ function useChat(options = {}) {
|
|
|
3314
3392
|
appendMessages(result.value);
|
|
3315
3393
|
}
|
|
3316
3394
|
}, [appendMessages]);
|
|
3317
|
-
const startPolling =
|
|
3395
|
+
const startPolling = React11.useCallback(() => {
|
|
3318
3396
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
3319
3397
|
const interval = Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS ? pollIdleInterval : pollInterval;
|
|
3320
3398
|
pollRef.current = setInterval(pollMessages, interval);
|
|
3321
3399
|
}, [pollMessages, pollInterval, pollIdleInterval]);
|
|
3322
|
-
const stopPolling =
|
|
3400
|
+
const stopPolling = React11.useCallback(() => {
|
|
3323
3401
|
if (pollRef.current) {
|
|
3324
3402
|
clearInterval(pollRef.current);
|
|
3325
3403
|
pollRef.current = null;
|
|
3326
3404
|
}
|
|
3327
3405
|
}, []);
|
|
3328
|
-
const connectWebSocket =
|
|
3406
|
+
const connectWebSocket = React11.useCallback(() => {
|
|
3329
3407
|
const c = clientRef.current;
|
|
3330
3408
|
if (!c || typeof WebSocket === "undefined") {
|
|
3331
3409
|
startPolling();
|
|
@@ -3366,7 +3444,7 @@ function useChat(options = {}) {
|
|
|
3366
3444
|
};
|
|
3367
3445
|
wsRef.current = ws;
|
|
3368
3446
|
}, [appendMessages, startPolling, stopPolling, pollMessages]);
|
|
3369
|
-
|
|
3447
|
+
React11.useEffect(() => {
|
|
3370
3448
|
return () => {
|
|
3371
3449
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
3372
3450
|
if (wsReconnectTimerRef.current) clearTimeout(wsReconnectTimerRef.current);
|
|
@@ -3376,7 +3454,7 @@ function useChat(options = {}) {
|
|
|
3376
3454
|
}
|
|
3377
3455
|
};
|
|
3378
3456
|
}, []);
|
|
3379
|
-
const openConversation =
|
|
3457
|
+
const openConversation = React11.useCallback(async () => {
|
|
3380
3458
|
if (openedRef.current || !client) return;
|
|
3381
3459
|
openedRef.current = true;
|
|
3382
3460
|
setIsLoading(true);
|
|
@@ -3392,7 +3470,7 @@ function useChat(options = {}) {
|
|
|
3392
3470
|
}
|
|
3393
3471
|
setIsLoading(false);
|
|
3394
3472
|
}, [client, connectWebSocket]);
|
|
3395
|
-
const send =
|
|
3473
|
+
const send = React11.useCallback(
|
|
3396
3474
|
async (content) => {
|
|
3397
3475
|
if (!client || !content.trim()) return;
|
|
3398
3476
|
setError(null);
|
|
@@ -3426,7 +3504,7 @@ function useChat(options = {}) {
|
|
|
3426
3504
|
},
|
|
3427
3505
|
[client, openConversation]
|
|
3428
3506
|
);
|
|
3429
|
-
const startConversation =
|
|
3507
|
+
const startConversation = React11.useCallback(
|
|
3430
3508
|
async (starterText) => {
|
|
3431
3509
|
await openConversation();
|
|
3432
3510
|
if (starterText) {
|
|
@@ -3445,15 +3523,15 @@ function useChat(options = {}) {
|
|
|
3445
3523
|
startConversation
|
|
3446
3524
|
};
|
|
3447
3525
|
}
|
|
3448
|
-
var ElementsContext =
|
|
3526
|
+
var ElementsContext = React11.createContext({
|
|
3449
3527
|
elements: null,
|
|
3450
3528
|
isReady: false
|
|
3451
3529
|
});
|
|
3452
3530
|
function useElements() {
|
|
3453
|
-
return
|
|
3531
|
+
return React11.useContext(ElementsContext).elements;
|
|
3454
3532
|
}
|
|
3455
3533
|
function useElementsReady() {
|
|
3456
|
-
return
|
|
3534
|
+
return React11.useContext(ElementsContext).isReady;
|
|
3457
3535
|
}
|
|
3458
3536
|
function ElementsProvider({
|
|
3459
3537
|
client,
|
|
@@ -3461,10 +3539,10 @@ function ElementsProvider({
|
|
|
3461
3539
|
options,
|
|
3462
3540
|
children
|
|
3463
3541
|
}) {
|
|
3464
|
-
const [elements, setElements] =
|
|
3465
|
-
const [isReady, setIsReady] =
|
|
3466
|
-
const initialOptionsRef =
|
|
3467
|
-
|
|
3542
|
+
const [elements, setElements] = React11.useState(null);
|
|
3543
|
+
const [isReady, setIsReady] = React11.useState(false);
|
|
3544
|
+
const initialOptionsRef = React11.useRef(options);
|
|
3545
|
+
React11.useEffect(() => {
|
|
3468
3546
|
let cancelled = false;
|
|
3469
3547
|
let instance = null;
|
|
3470
3548
|
setIsReady(false);
|
|
@@ -3505,34 +3583,34 @@ function AuthElement({
|
|
|
3505
3583
|
onRequiresOtp,
|
|
3506
3584
|
onError
|
|
3507
3585
|
}) {
|
|
3508
|
-
const containerRef =
|
|
3509
|
-
const elementRef =
|
|
3586
|
+
const containerRef = React11.useRef(null);
|
|
3587
|
+
const elementRef = React11.useRef(null);
|
|
3510
3588
|
const elements = useElements();
|
|
3511
|
-
const onReadyRef =
|
|
3512
|
-
const onAuthenticatedRef =
|
|
3513
|
-
const onRequiresOtpRef =
|
|
3514
|
-
const onErrorRef =
|
|
3515
|
-
|
|
3589
|
+
const onReadyRef = React11.useRef(onReady);
|
|
3590
|
+
const onAuthenticatedRef = React11.useRef(onAuthenticated);
|
|
3591
|
+
const onRequiresOtpRef = React11.useRef(onRequiresOtp);
|
|
3592
|
+
const onErrorRef = React11.useRef(onError);
|
|
3593
|
+
React11.useEffect(() => {
|
|
3516
3594
|
onReadyRef.current = onReady;
|
|
3517
3595
|
onAuthenticatedRef.current = onAuthenticated;
|
|
3518
3596
|
onRequiresOtpRef.current = onRequiresOtp;
|
|
3519
3597
|
onErrorRef.current = onError;
|
|
3520
3598
|
}, [onReady, onAuthenticated, onRequiresOtp, onError]);
|
|
3521
|
-
|
|
3599
|
+
React11.useEffect(() => {
|
|
3522
3600
|
if (!elements || !containerRef.current) return;
|
|
3523
|
-
const element = elements.create(
|
|
3601
|
+
const element = elements.create(chunkJGBDWEPJ_js.ELEMENT_TYPES.AUTH, { prefillEmail });
|
|
3524
3602
|
elementRef.current = element;
|
|
3525
|
-
element.on(
|
|
3603
|
+
element.on(chunkJGBDWEPJ_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
3526
3604
|
element.on(
|
|
3527
|
-
|
|
3605
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.AUTHENTICATED,
|
|
3528
3606
|
(data) => onAuthenticatedRef.current?.(data)
|
|
3529
3607
|
);
|
|
3530
3608
|
element.on(
|
|
3531
|
-
|
|
3609
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.REQUIRES_OTP,
|
|
3532
3610
|
(data) => onRequiresOtpRef.current?.(data)
|
|
3533
3611
|
);
|
|
3534
3612
|
element.on(
|
|
3535
|
-
|
|
3613
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.ERROR,
|
|
3536
3614
|
(data) => onErrorRef.current?.(data)
|
|
3537
3615
|
);
|
|
3538
3616
|
element.mount(containerRef.current);
|
|
@@ -3548,28 +3626,28 @@ function AddressElement({
|
|
|
3548
3626
|
onChange,
|
|
3549
3627
|
onError
|
|
3550
3628
|
}) {
|
|
3551
|
-
const containerRef =
|
|
3552
|
-
const elementRef =
|
|
3629
|
+
const containerRef = React11.useRef(null);
|
|
3630
|
+
const elementRef = React11.useRef(null);
|
|
3553
3631
|
const elements = useElements();
|
|
3554
|
-
const onReadyRef =
|
|
3555
|
-
const onChangeRef =
|
|
3556
|
-
const onErrorRef =
|
|
3557
|
-
|
|
3632
|
+
const onReadyRef = React11.useRef(onReady);
|
|
3633
|
+
const onChangeRef = React11.useRef(onChange);
|
|
3634
|
+
const onErrorRef = React11.useRef(onError);
|
|
3635
|
+
React11.useEffect(() => {
|
|
3558
3636
|
onReadyRef.current = onReady;
|
|
3559
3637
|
onChangeRef.current = onChange;
|
|
3560
3638
|
onErrorRef.current = onError;
|
|
3561
3639
|
}, [onReady, onChange, onError]);
|
|
3562
|
-
|
|
3640
|
+
React11.useEffect(() => {
|
|
3563
3641
|
if (!elements || !containerRef.current) return;
|
|
3564
|
-
const element = elements.create(
|
|
3642
|
+
const element = elements.create(chunkJGBDWEPJ_js.ELEMENT_TYPES.ADDRESS, { mode });
|
|
3565
3643
|
elementRef.current = element;
|
|
3566
|
-
element.on(
|
|
3644
|
+
element.on(chunkJGBDWEPJ_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
3567
3645
|
element.on(
|
|
3568
|
-
|
|
3646
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.CHANGE,
|
|
3569
3647
|
(data) => onChangeRef.current?.(data)
|
|
3570
3648
|
);
|
|
3571
3649
|
element.on(
|
|
3572
|
-
|
|
3650
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.ERROR,
|
|
3573
3651
|
(data) => onErrorRef.current?.(data)
|
|
3574
3652
|
);
|
|
3575
3653
|
element.mount(containerRef.current);
|
|
@@ -3586,28 +3664,28 @@ function PaymentElement({
|
|
|
3586
3664
|
onChange,
|
|
3587
3665
|
onError
|
|
3588
3666
|
}) {
|
|
3589
|
-
const containerRef =
|
|
3590
|
-
const elementRef =
|
|
3667
|
+
const containerRef = React11.useRef(null);
|
|
3668
|
+
const elementRef = React11.useRef(null);
|
|
3591
3669
|
const elements = useElements();
|
|
3592
|
-
const onReadyRef =
|
|
3593
|
-
const onChangeRef =
|
|
3594
|
-
const onErrorRef =
|
|
3595
|
-
|
|
3670
|
+
const onReadyRef = React11.useRef(onReady);
|
|
3671
|
+
const onChangeRef = React11.useRef(onChange);
|
|
3672
|
+
const onErrorRef = React11.useRef(onError);
|
|
3673
|
+
React11.useEffect(() => {
|
|
3596
3674
|
onReadyRef.current = onReady;
|
|
3597
3675
|
onChangeRef.current = onChange;
|
|
3598
3676
|
onErrorRef.current = onError;
|
|
3599
3677
|
}, [onReady, onChange, onError]);
|
|
3600
|
-
|
|
3678
|
+
React11.useEffect(() => {
|
|
3601
3679
|
if (!elements || !containerRef.current) return;
|
|
3602
|
-
const element = elements.create(
|
|
3680
|
+
const element = elements.create(chunkJGBDWEPJ_js.ELEMENT_TYPES.PAYMENT, { amount, currency });
|
|
3603
3681
|
elementRef.current = element;
|
|
3604
|
-
element.on(
|
|
3682
|
+
element.on(chunkJGBDWEPJ_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
3605
3683
|
element.on(
|
|
3606
|
-
|
|
3684
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.CHANGE,
|
|
3607
3685
|
(data) => onChangeRef.current?.(data)
|
|
3608
3686
|
);
|
|
3609
3687
|
element.on(
|
|
3610
|
-
|
|
3688
|
+
chunkJGBDWEPJ_js.EVENT_TYPES.ERROR,
|
|
3611
3689
|
(data) => onErrorRef.current?.(data)
|
|
3612
3690
|
);
|
|
3613
3691
|
element.mount(containerRef.current);
|
|
@@ -3617,8 +3695,8 @@ function PaymentElement({
|
|
|
3617
3695
|
}
|
|
3618
3696
|
function useCheckout() {
|
|
3619
3697
|
const elements = useElements();
|
|
3620
|
-
const [isLoading, setIsLoading] =
|
|
3621
|
-
const submit =
|
|
3698
|
+
const [isLoading, setIsLoading] = React11.useState(false);
|
|
3699
|
+
const submit = React11.useCallback(
|
|
3622
3700
|
async (data) => {
|
|
3623
3701
|
if (!elements) {
|
|
3624
3702
|
return { success: false, error: { code: "NO_ELEMENTS", message: "Elements not initialized" } };
|
|
@@ -3632,7 +3710,7 @@ function useCheckout() {
|
|
|
3632
3710
|
},
|
|
3633
3711
|
[elements]
|
|
3634
3712
|
);
|
|
3635
|
-
const process =
|
|
3713
|
+
const process = React11.useCallback(
|
|
3636
3714
|
async (options) => {
|
|
3637
3715
|
if (!elements) {
|
|
3638
3716
|
return {
|
|
@@ -3726,13 +3804,13 @@ function VariantSelector({
|
|
|
3726
3804
|
className,
|
|
3727
3805
|
classNames
|
|
3728
3806
|
}) {
|
|
3729
|
-
const [axisSelections, setAxisSelections] =
|
|
3730
|
-
const initialized =
|
|
3731
|
-
const idPrefix =
|
|
3732
|
-
|
|
3807
|
+
const [axisSelections, setAxisSelections] = React11.useState({});
|
|
3808
|
+
const initialized = React11.useRef(false);
|
|
3809
|
+
const idPrefix = React11.useId();
|
|
3810
|
+
React11.useEffect(() => {
|
|
3733
3811
|
initialized.current = false;
|
|
3734
3812
|
}, [variants]);
|
|
3735
|
-
|
|
3813
|
+
React11.useEffect(() => {
|
|
3736
3814
|
if (initialized.current) return;
|
|
3737
3815
|
if (!variants || variants.length === 0) return;
|
|
3738
3816
|
const defaultVariant = variants.find((v) => v.is_default) || variants[0];
|
|
@@ -3747,7 +3825,7 @@ function VariantSelector({
|
|
|
3747
3825
|
setAxisSelections(initial);
|
|
3748
3826
|
}
|
|
3749
3827
|
}, [variants, onVariantChange]);
|
|
3750
|
-
|
|
3828
|
+
React11.useEffect(() => {
|
|
3751
3829
|
if (!initialized.current) return;
|
|
3752
3830
|
if (!variantAxes || variantAxes.length === 0) return;
|
|
3753
3831
|
const match = variants.find((v) => {
|
|
@@ -3867,7 +3945,7 @@ function VariantSelector({
|
|
|
3867
3945
|
{
|
|
3868
3946
|
"data-cimplify-variant-name": true,
|
|
3869
3947
|
className: cn("flex-1 min-w-0 text-sm", classNames?.name),
|
|
3870
|
-
children:
|
|
3948
|
+
children: chunkJYPLT56O_js.getVariantDisplayName(variant, productName)
|
|
3871
3949
|
}
|
|
3872
3950
|
),
|
|
3873
3951
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-variant-pricing": true, className: cn("text-sm text-muted-foreground", classNames?.pricing), children: [
|
|
@@ -3890,12 +3968,12 @@ function AddOnSelector({
|
|
|
3890
3968
|
className,
|
|
3891
3969
|
classNames
|
|
3892
3970
|
}) {
|
|
3893
|
-
const selectedSet =
|
|
3894
|
-
const isOptionSelected =
|
|
3971
|
+
const selectedSet = React11.useMemo(() => new Set(selectedOptions), [selectedOptions]);
|
|
3972
|
+
const isOptionSelected = React11.useCallback(
|
|
3895
3973
|
(optionId) => selectedSet.has(optionId),
|
|
3896
3974
|
[selectedSet]
|
|
3897
3975
|
);
|
|
3898
|
-
const handleCheckedChange =
|
|
3976
|
+
const handleCheckedChange = React11.useCallback(
|
|
3899
3977
|
(addOn, optionId, checked) => {
|
|
3900
3978
|
const isSelected = selectedSet.has(optionId);
|
|
3901
3979
|
if (addOn.is_mutually_exclusive || !addOn.is_multiple_allowed) {
|
|
@@ -4071,9 +4149,9 @@ function BundleSelector({
|
|
|
4071
4149
|
className,
|
|
4072
4150
|
classNames
|
|
4073
4151
|
}) {
|
|
4074
|
-
const [variantChoices, setVariantChoices] =
|
|
4075
|
-
const lastComponentIds =
|
|
4076
|
-
|
|
4152
|
+
const [variantChoices, setVariantChoices] = React11.useState({});
|
|
4153
|
+
const lastComponentIds = React11.useRef("");
|
|
4154
|
+
React11.useEffect(() => {
|
|
4077
4155
|
const ids = components.map((c) => c.id).sort().join();
|
|
4078
4156
|
if (ids === lastComponentIds.current) return;
|
|
4079
4157
|
lastComponentIds.current = ids;
|
|
@@ -4090,20 +4168,20 @@ function BundleSelector({
|
|
|
4090
4168
|
}
|
|
4091
4169
|
setVariantChoices(defaults);
|
|
4092
4170
|
}, [components]);
|
|
4093
|
-
const selections =
|
|
4171
|
+
const selections = React11.useMemo(() => {
|
|
4094
4172
|
return components.map((comp) => ({
|
|
4095
4173
|
component_id: comp.id,
|
|
4096
4174
|
variant_id: variantChoices[comp.id],
|
|
4097
4175
|
quantity: comp.quantity
|
|
4098
4176
|
}));
|
|
4099
4177
|
}, [components, variantChoices]);
|
|
4100
|
-
|
|
4178
|
+
React11.useEffect(() => {
|
|
4101
4179
|
onSelectionsChange(selections);
|
|
4102
4180
|
}, [selections, onSelectionsChange]);
|
|
4103
|
-
|
|
4181
|
+
React11.useEffect(() => {
|
|
4104
4182
|
onReady?.(components.length > 0 && selections.length > 0);
|
|
4105
4183
|
}, [components, selections, onReady]);
|
|
4106
|
-
const totalPrice =
|
|
4184
|
+
const totalPrice = React11.useMemo(() => {
|
|
4107
4185
|
if (pricingType === "fixed" && bundlePrice) {
|
|
4108
4186
|
return chunk7Y2O3E4D_js.parsePrice(bundlePrice);
|
|
4109
4187
|
}
|
|
@@ -4118,10 +4196,10 @@ function BundleSelector({
|
|
|
4118
4196
|
}
|
|
4119
4197
|
return componentsTotal;
|
|
4120
4198
|
}, [components, variantChoices, pricingType, bundlePrice, discountValue]);
|
|
4121
|
-
|
|
4199
|
+
React11.useEffect(() => {
|
|
4122
4200
|
onPriceChange?.(totalPrice);
|
|
4123
4201
|
}, [totalPrice, onPriceChange]);
|
|
4124
|
-
const handleVariantChange =
|
|
4202
|
+
const handleVariantChange = React11.useCallback(
|
|
4125
4203
|
(componentId, variantId) => {
|
|
4126
4204
|
setVariantChoices((prev) => ({ ...prev, [componentId]: variantId }));
|
|
4127
4205
|
},
|
|
@@ -4202,9 +4280,9 @@ function BundleComponentCard({
|
|
|
4202
4280
|
onVariantChange,
|
|
4203
4281
|
classNames
|
|
4204
4282
|
}) {
|
|
4205
|
-
const idPrefix =
|
|
4283
|
+
const idPrefix = React11.useId();
|
|
4206
4284
|
const showVariantPicker = component.allow_variant_choice && component.available_variants.length > 1;
|
|
4207
|
-
const displayPrice =
|
|
4285
|
+
const displayPrice = React11.useMemo(
|
|
4208
4286
|
() => getComponentPrice(component, selectedVariantId),
|
|
4209
4287
|
[component, selectedVariantId]
|
|
4210
4288
|
);
|
|
@@ -4352,11 +4430,11 @@ function CompositeSelector({
|
|
|
4352
4430
|
classNames
|
|
4353
4431
|
}) {
|
|
4354
4432
|
const { client } = useCimplifyClient();
|
|
4355
|
-
const [groupSelections, setGroupSelections] =
|
|
4356
|
-
const [priceResult, setPriceResult] =
|
|
4357
|
-
const [isPriceLoading, setIsPriceLoading] =
|
|
4358
|
-
const [priceError, setPriceError] =
|
|
4359
|
-
const selections =
|
|
4433
|
+
const [groupSelections, setGroupSelections] = React11.useState({});
|
|
4434
|
+
const [priceResult, setPriceResult] = React11.useState(null);
|
|
4435
|
+
const [isPriceLoading, setIsPriceLoading] = React11.useState(false);
|
|
4436
|
+
const [priceError, setPriceError] = React11.useState(false);
|
|
4437
|
+
const selections = React11.useMemo(() => {
|
|
4360
4438
|
const result = [];
|
|
4361
4439
|
for (const groupSels of Object.values(groupSelections)) {
|
|
4362
4440
|
for (const [componentId, qty] of Object.entries(groupSels)) {
|
|
@@ -4367,13 +4445,13 @@ function CompositeSelector({
|
|
|
4367
4445
|
}
|
|
4368
4446
|
return result;
|
|
4369
4447
|
}, [groupSelections]);
|
|
4370
|
-
|
|
4448
|
+
React11.useEffect(() => {
|
|
4371
4449
|
onSelectionsChange(selections);
|
|
4372
4450
|
}, [selections, onSelectionsChange]);
|
|
4373
|
-
|
|
4451
|
+
React11.useEffect(() => {
|
|
4374
4452
|
onPriceChange?.(priceResult);
|
|
4375
4453
|
}, [priceResult, onPriceChange]);
|
|
4376
|
-
const allGroupsSatisfied =
|
|
4454
|
+
const allGroupsSatisfied = React11.useMemo(() => {
|
|
4377
4455
|
for (const group of groups) {
|
|
4378
4456
|
const groupSels = groupSelections[group.id] || {};
|
|
4379
4457
|
const totalSelected = Object.values(groupSels).reduce((sum, q) => sum + q, 0);
|
|
@@ -4381,17 +4459,17 @@ function CompositeSelector({
|
|
|
4381
4459
|
}
|
|
4382
4460
|
return true;
|
|
4383
4461
|
}, [groups, groupSelections]);
|
|
4384
|
-
const sortedGroups =
|
|
4462
|
+
const sortedGroups = React11.useMemo(
|
|
4385
4463
|
() => [...groups].sort((a, b) => a.display_order - b.display_order).map((group) => ({
|
|
4386
4464
|
...group,
|
|
4387
4465
|
_sortedComponents: group.components.filter((component) => component.is_available && !component.is_archived).sort((a, b) => a.display_order - b.display_order)
|
|
4388
4466
|
})),
|
|
4389
4467
|
[groups]
|
|
4390
4468
|
);
|
|
4391
|
-
|
|
4469
|
+
React11.useEffect(() => {
|
|
4392
4470
|
onReady?.(allGroupsSatisfied);
|
|
4393
4471
|
}, [allGroupsSatisfied, onReady]);
|
|
4394
|
-
|
|
4472
|
+
React11.useEffect(() => {
|
|
4395
4473
|
if (skipPriceFetch || !allGroupsSatisfied || selections.length === 0) return;
|
|
4396
4474
|
let cancelled = false;
|
|
4397
4475
|
const timer = setTimeout(() => {
|
|
@@ -4418,7 +4496,7 @@ function CompositeSelector({
|
|
|
4418
4496
|
clearTimeout(timer);
|
|
4419
4497
|
};
|
|
4420
4498
|
}, [selections, allGroupsSatisfied, compositeId, client, skipPriceFetch]);
|
|
4421
|
-
const toggleComponent =
|
|
4499
|
+
const toggleComponent = React11.useCallback(
|
|
4422
4500
|
(group, component) => {
|
|
4423
4501
|
setGroupSelections((prev) => {
|
|
4424
4502
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -4446,7 +4524,7 @@ function CompositeSelector({
|
|
|
4446
4524
|
},
|
|
4447
4525
|
[]
|
|
4448
4526
|
);
|
|
4449
|
-
const updateQuantity =
|
|
4527
|
+
const updateQuantity = React11.useCallback(
|
|
4450
4528
|
(group, componentId, newValue) => {
|
|
4451
4529
|
setGroupSelections((prev) => {
|
|
4452
4530
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -5025,7 +5103,7 @@ function DatePicker({
|
|
|
5025
5103
|
classNames,
|
|
5026
5104
|
"aria-label": ariaLabel
|
|
5027
5105
|
}) {
|
|
5028
|
-
const [open, setOpen] =
|
|
5106
|
+
const [open, setOpen] = React11.useState(false);
|
|
5029
5107
|
const selected = parseValue(value);
|
|
5030
5108
|
const disabledMatchers = [];
|
|
5031
5109
|
if (minDate) disabledMatchers.push({ before: minDate });
|
|
@@ -5179,9 +5257,9 @@ function TimePicker({
|
|
|
5179
5257
|
classNames,
|
|
5180
5258
|
"aria-label": ariaLabel
|
|
5181
5259
|
}) {
|
|
5182
|
-
const [open, setOpen] =
|
|
5260
|
+
const [open, setOpen] = React11.useState(false);
|
|
5183
5261
|
const parsed = parseHHmm(value);
|
|
5184
|
-
const options =
|
|
5262
|
+
const options = React11.useMemo(
|
|
5185
5263
|
() => buildOptions(minTime, maxTime, stepMinutes),
|
|
5186
5264
|
[minTime, maxTime, stepMinutes]
|
|
5187
5265
|
);
|
|
@@ -5270,13 +5348,13 @@ function CustomerInputFields({
|
|
|
5270
5348
|
const clientContext = useOptionalCimplifyClient();
|
|
5271
5349
|
if (fields.length === 0) return null;
|
|
5272
5350
|
const sorted = [...fields].sort((a, b) => a.display_order - b.display_order);
|
|
5273
|
-
const setValue =
|
|
5351
|
+
const setValue = React11.useCallback(
|
|
5274
5352
|
(fieldId, value) => {
|
|
5275
5353
|
onChange({ ...values, [fieldId]: value });
|
|
5276
5354
|
},
|
|
5277
5355
|
[values, onChange]
|
|
5278
5356
|
);
|
|
5279
|
-
const defaultFileUpload =
|
|
5357
|
+
const defaultFileUpload = React11.useCallback(
|
|
5280
5358
|
async (file) => {
|
|
5281
5359
|
if (onFileUpload) return onFileUpload(file, {});
|
|
5282
5360
|
if (!clientContext?.client) throw new Error("No upload provider available");
|
|
@@ -5340,12 +5418,12 @@ function FieldInput({
|
|
|
5340
5418
|
classNames?.input
|
|
5341
5419
|
);
|
|
5342
5420
|
switch (field.field_type) {
|
|
5343
|
-
case
|
|
5344
|
-
case
|
|
5421
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Text:
|
|
5422
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Url:
|
|
5345
5423
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5346
5424
|
"input",
|
|
5347
5425
|
{
|
|
5348
|
-
type: field.field_type ===
|
|
5426
|
+
type: field.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.Url ? "url" : "text",
|
|
5349
5427
|
value: typeof value === "string" ? value : "",
|
|
5350
5428
|
onChange: (e) => onValueChange(e.target.value),
|
|
5351
5429
|
placeholder: field.placeholder,
|
|
@@ -5354,7 +5432,7 @@ function FieldInput({
|
|
|
5354
5432
|
className: inputClass
|
|
5355
5433
|
}
|
|
5356
5434
|
);
|
|
5357
|
-
case
|
|
5435
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Textarea:
|
|
5358
5436
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5359
5437
|
"textarea",
|
|
5360
5438
|
{
|
|
@@ -5367,7 +5445,7 @@ function FieldInput({
|
|
|
5367
5445
|
className: cn(inputClass, "resize-none", classNames?.textarea)
|
|
5368
5446
|
}
|
|
5369
5447
|
);
|
|
5370
|
-
case
|
|
5448
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Number:
|
|
5371
5449
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5372
5450
|
"input",
|
|
5373
5451
|
{
|
|
@@ -5381,7 +5459,7 @@ function FieldInput({
|
|
|
5381
5459
|
className: inputClass
|
|
5382
5460
|
}
|
|
5383
5461
|
);
|
|
5384
|
-
case
|
|
5462
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Select:
|
|
5385
5463
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
5386
5464
|
"select",
|
|
5387
5465
|
{
|
|
@@ -5395,7 +5473,7 @@ function FieldInput({
|
|
|
5395
5473
|
]
|
|
5396
5474
|
}
|
|
5397
5475
|
);
|
|
5398
|
-
case
|
|
5476
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Radio:
|
|
5399
5477
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-2", classNames?.radioGroup), children: (field.options || []).map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
5400
5478
|
"label",
|
|
5401
5479
|
{
|
|
@@ -5420,7 +5498,7 @@ function FieldInput({
|
|
|
5420
5498
|
},
|
|
5421
5499
|
opt
|
|
5422
5500
|
)) });
|
|
5423
|
-
case
|
|
5501
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Checkbox:
|
|
5424
5502
|
return /* @__PURE__ */ jsxRuntime.jsxs("label", { className: cn("flex items-center gap-2 text-sm cursor-pointer", classNames?.checkboxLabel), children: [
|
|
5425
5503
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5426
5504
|
"input",
|
|
@@ -5433,7 +5511,7 @@ function FieldInput({
|
|
|
5433
5511
|
),
|
|
5434
5512
|
field.placeholder || field.name
|
|
5435
5513
|
] });
|
|
5436
|
-
case
|
|
5514
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Color:
|
|
5437
5515
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5438
5516
|
"input",
|
|
5439
5517
|
{
|
|
@@ -5443,7 +5521,7 @@ function FieldInput({
|
|
|
5443
5521
|
className: cn("w-12 h-10 rounded-md border border-input cursor-pointer", classNames?.colorInput)
|
|
5444
5522
|
}
|
|
5445
5523
|
);
|
|
5446
|
-
case
|
|
5524
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Date:
|
|
5447
5525
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5448
5526
|
DatePicker,
|
|
5449
5527
|
{
|
|
@@ -5454,8 +5532,8 @@ function FieldInput({
|
|
|
5454
5532
|
"aria-label": field.name
|
|
5455
5533
|
}
|
|
5456
5534
|
);
|
|
5457
|
-
case
|
|
5458
|
-
case
|
|
5535
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.File:
|
|
5536
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Image:
|
|
5459
5537
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5460
5538
|
FileUploadInput,
|
|
5461
5539
|
{
|
|
@@ -5466,7 +5544,7 @@ function FieldInput({
|
|
|
5466
5544
|
classNames
|
|
5467
5545
|
}
|
|
5468
5546
|
);
|
|
5469
|
-
case
|
|
5547
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Email:
|
|
5470
5548
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5471
5549
|
"input",
|
|
5472
5550
|
{
|
|
@@ -5478,7 +5556,7 @@ function FieldInput({
|
|
|
5478
5556
|
className: inputClass
|
|
5479
5557
|
}
|
|
5480
5558
|
);
|
|
5481
|
-
case
|
|
5559
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.DateTime: {
|
|
5482
5560
|
const stringValue = typeof value === "string" ? value : "";
|
|
5483
5561
|
const [datePart, timePartRaw] = stringValue.includes("T") ? stringValue.split("T", 2) : [stringValue, ""];
|
|
5484
5562
|
const timePart = (timePartRaw ?? "").slice(0, 5);
|
|
@@ -5517,7 +5595,7 @@ function FieldInput({
|
|
|
5517
5595
|
)
|
|
5518
5596
|
] });
|
|
5519
5597
|
}
|
|
5520
|
-
case
|
|
5598
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Time:
|
|
5521
5599
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5522
5600
|
TimePicker,
|
|
5523
5601
|
{
|
|
@@ -5528,7 +5606,7 @@ function FieldInput({
|
|
|
5528
5606
|
"aria-label": field.name
|
|
5529
5607
|
}
|
|
5530
5608
|
);
|
|
5531
|
-
case
|
|
5609
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.MultiSelect:
|
|
5532
5610
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5533
5611
|
MultiSelectInput,
|
|
5534
5612
|
{
|
|
@@ -5538,7 +5616,7 @@ function FieldInput({
|
|
|
5538
5616
|
classNames
|
|
5539
5617
|
}
|
|
5540
5618
|
);
|
|
5541
|
-
case
|
|
5619
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.DateRange:
|
|
5542
5620
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5543
5621
|
DateRangeInput,
|
|
5544
5622
|
{
|
|
@@ -5548,7 +5626,7 @@ function FieldInput({
|
|
|
5548
5626
|
classNames
|
|
5549
5627
|
}
|
|
5550
5628
|
);
|
|
5551
|
-
case
|
|
5629
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Address:
|
|
5552
5630
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5553
5631
|
AddressInput,
|
|
5554
5632
|
{
|
|
@@ -5559,7 +5637,7 @@ function FieldInput({
|
|
|
5559
5637
|
inputClass
|
|
5560
5638
|
}
|
|
5561
5639
|
);
|
|
5562
|
-
case
|
|
5640
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Location:
|
|
5563
5641
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5564
5642
|
LocationInput,
|
|
5565
5643
|
{
|
|
@@ -5570,7 +5648,7 @@ function FieldInput({
|
|
|
5570
5648
|
inputClass
|
|
5571
5649
|
}
|
|
5572
5650
|
);
|
|
5573
|
-
case
|
|
5651
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Phone:
|
|
5574
5652
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5575
5653
|
PhoneInput,
|
|
5576
5654
|
{
|
|
@@ -5581,7 +5659,7 @@ function FieldInput({
|
|
|
5581
5659
|
inputClass
|
|
5582
5660
|
}
|
|
5583
5661
|
);
|
|
5584
|
-
case
|
|
5662
|
+
case chunkJYPLT56O_js.INPUT_FIELD_TYPE.Signature:
|
|
5585
5663
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5586
5664
|
SignatureInput,
|
|
5587
5665
|
{
|
|
@@ -5611,10 +5689,10 @@ function FileUploadInput({
|
|
|
5611
5689
|
onFileUpload,
|
|
5612
5690
|
classNames
|
|
5613
5691
|
}) {
|
|
5614
|
-
const [isUploading, setIsUploading] =
|
|
5692
|
+
const [isUploading, setIsUploading] = React11__default.default.useState(false);
|
|
5615
5693
|
const fileUrl = typeof value === "string" ? value : void 0;
|
|
5616
5694
|
const acceptedFormats = field.validation?.accepted_formats;
|
|
5617
|
-
const accept = acceptedFormats ? acceptedFormats.map((f) => `.${f}`).join(",") : field.field_type ===
|
|
5695
|
+
const accept = acceptedFormats ? acceptedFormats.map((f) => `.${f}`).join(",") : field.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.Image ? "image/*" : void 0;
|
|
5618
5696
|
const handleFile = async (file) => {
|
|
5619
5697
|
if (!onFileUpload) return;
|
|
5620
5698
|
if (field.validation?.max_size_mb) {
|
|
@@ -5632,7 +5710,7 @@ function FileUploadInput({
|
|
|
5632
5710
|
}
|
|
5633
5711
|
};
|
|
5634
5712
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-2", classNames?.fileInput), children: fileUrl ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
|
|
5635
|
-
field.field_type ===
|
|
5713
|
+
field.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.Image && /* @__PURE__ */ jsxRuntime.jsx("img", { src: fileUrl, alt: "Uploaded", className: "w-16 h-16 object-cover rounded-md border border-border" }),
|
|
5636
5714
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-foreground truncate", children: fileUrl.split("/").pop() }) }),
|
|
5637
5715
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
5638
5716
|
"button",
|
|
@@ -5658,7 +5736,7 @@ function FileUploadInput({
|
|
|
5658
5736
|
}
|
|
5659
5737
|
),
|
|
5660
5738
|
isUploading ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: "Uploading..." }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
5661
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: field.placeholder || `Upload ${field.field_type ===
|
|
5739
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm text-muted-foreground", children: field.placeholder || `Upload ${field.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.Image ? "image" : "file"}` }),
|
|
5662
5740
|
acceptedFormats && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground/60 mt-1", children: [
|
|
5663
5741
|
acceptedFormats.map((f) => f.toUpperCase()).join(", "),
|
|
5664
5742
|
field.validation?.max_size_mb && ` \xB7 Max ${field.validation.max_size_mb}MB`
|
|
@@ -5761,22 +5839,22 @@ function AddressInput({
|
|
|
5761
5839
|
}) {
|
|
5762
5840
|
const clientContext = useOptionalCimplifyClient();
|
|
5763
5841
|
const addr = value && typeof value === "object" ? value : null;
|
|
5764
|
-
const [inputText, setInputText] =
|
|
5765
|
-
const [suggestions, setSuggestions] =
|
|
5766
|
-
const [isOpen, setIsOpen] =
|
|
5767
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
5768
|
-
const debounceRef =
|
|
5769
|
-
const seqRef =
|
|
5770
|
-
const sessionTokenRef =
|
|
5771
|
-
const blurTimeoutRef =
|
|
5772
|
-
|
|
5842
|
+
const [inputText, setInputText] = React11__default.default.useState(addr?.formatted_address ?? "");
|
|
5843
|
+
const [suggestions, setSuggestions] = React11__default.default.useState([]);
|
|
5844
|
+
const [isOpen, setIsOpen] = React11__default.default.useState(false);
|
|
5845
|
+
const [highlightedIndex, setHighlightedIndex] = React11__default.default.useState(-1);
|
|
5846
|
+
const debounceRef = React11__default.default.useRef(null);
|
|
5847
|
+
const seqRef = React11__default.default.useRef(0);
|
|
5848
|
+
const sessionTokenRef = React11__default.default.useRef(createSessionToken());
|
|
5849
|
+
const blurTimeoutRef = React11__default.default.useRef(null);
|
|
5850
|
+
React11__default.default.useEffect(() => {
|
|
5773
5851
|
return () => {
|
|
5774
5852
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5775
5853
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
5776
5854
|
seqRef.current += 1;
|
|
5777
5855
|
};
|
|
5778
5856
|
}, []);
|
|
5779
|
-
const fetchSuggestions =
|
|
5857
|
+
const fetchSuggestions = React11__default.default.useCallback(async (query) => {
|
|
5780
5858
|
const client = clientContext?.client;
|
|
5781
5859
|
if (!client || query.length < 3) {
|
|
5782
5860
|
setSuggestions([]);
|
|
@@ -5800,7 +5878,7 @@ function AddressInput({
|
|
|
5800
5878
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5801
5879
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
5802
5880
|
};
|
|
5803
|
-
const selectSuggestion =
|
|
5881
|
+
const selectSuggestion = React11__default.default.useCallback(async (suggestion) => {
|
|
5804
5882
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5805
5883
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
5806
5884
|
const fallback = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -5903,22 +5981,22 @@ function LocationInput({
|
|
|
5903
5981
|
}) {
|
|
5904
5982
|
const clientContext = useOptionalCimplifyClient();
|
|
5905
5983
|
const loc = value && typeof value === "object" ? value : null;
|
|
5906
|
-
const [inputText, setInputText] =
|
|
5907
|
-
const [suggestions, setSuggestions] =
|
|
5908
|
-
const [isOpen, setIsOpen] =
|
|
5909
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
5910
|
-
const debounceRef =
|
|
5911
|
-
const seqRef =
|
|
5912
|
-
const sessionTokenRef =
|
|
5913
|
-
const blurTimeoutRef =
|
|
5914
|
-
|
|
5984
|
+
const [inputText, setInputText] = React11__default.default.useState(loc?.label ?? "");
|
|
5985
|
+
const [suggestions, setSuggestions] = React11__default.default.useState([]);
|
|
5986
|
+
const [isOpen, setIsOpen] = React11__default.default.useState(false);
|
|
5987
|
+
const [highlightedIndex, setHighlightedIndex] = React11__default.default.useState(-1);
|
|
5988
|
+
const debounceRef = React11__default.default.useRef(null);
|
|
5989
|
+
const seqRef = React11__default.default.useRef(0);
|
|
5990
|
+
const sessionTokenRef = React11__default.default.useRef(createSessionToken());
|
|
5991
|
+
const blurTimeoutRef = React11__default.default.useRef(null);
|
|
5992
|
+
React11__default.default.useEffect(() => {
|
|
5915
5993
|
return () => {
|
|
5916
5994
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5917
5995
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
5918
5996
|
seqRef.current += 1;
|
|
5919
5997
|
};
|
|
5920
5998
|
}, []);
|
|
5921
|
-
const fetchSuggestions =
|
|
5999
|
+
const fetchSuggestions = React11__default.default.useCallback(async (query) => {
|
|
5922
6000
|
const client = clientContext?.client;
|
|
5923
6001
|
if (!client || query.length < 3) {
|
|
5924
6002
|
setSuggestions([]);
|
|
@@ -5942,7 +6020,7 @@ function LocationInput({
|
|
|
5942
6020
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5943
6021
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
5944
6022
|
};
|
|
5945
|
-
const selectSuggestion =
|
|
6023
|
+
const selectSuggestion = React11__default.default.useCallback(async (suggestion) => {
|
|
5946
6024
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
5947
6025
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
5948
6026
|
const label = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -6031,8 +6109,8 @@ function PhoneInput({
|
|
|
6031
6109
|
inputClass
|
|
6032
6110
|
}) {
|
|
6033
6111
|
const phone = value && typeof value === "object" ? value : null;
|
|
6034
|
-
const [code, setCode] =
|
|
6035
|
-
const [number, setNumber] =
|
|
6112
|
+
const [code, setCode] = React11__default.default.useState(phone?.country_code ?? "+1");
|
|
6113
|
+
const [number, setNumber] = React11__default.default.useState(phone?.number ?? "");
|
|
6036
6114
|
const update = (nextCode, nextNumber) => {
|
|
6037
6115
|
setCode(nextCode);
|
|
6038
6116
|
setNumber(nextNumber);
|
|
@@ -6077,8 +6155,8 @@ function SignatureInput({
|
|
|
6077
6155
|
classNames
|
|
6078
6156
|
}) {
|
|
6079
6157
|
const sig = value && typeof value === "object" ? value : null;
|
|
6080
|
-
const canvasRef =
|
|
6081
|
-
const isDrawing =
|
|
6158
|
+
const canvasRef = React11__default.default.useRef(null);
|
|
6159
|
+
const isDrawing = React11__default.default.useRef(false);
|
|
6082
6160
|
const getCtx = () => canvasRef.current?.getContext("2d") ?? null;
|
|
6083
6161
|
const startDraw = (e) => {
|
|
6084
6162
|
const ctx = getCtx();
|
|
@@ -6254,7 +6332,7 @@ function SlotPicker({
|
|
|
6254
6332
|
}
|
|
6255
6333
|
);
|
|
6256
6334
|
const rawSlots = slotsProp ?? fetched;
|
|
6257
|
-
const slots =
|
|
6335
|
+
const slots = React11.useMemo(() => {
|
|
6258
6336
|
if (!hideElapsedSlots) return rawSlots;
|
|
6259
6337
|
const cutoff = Date.now() + minLeadMinutes * 6e4;
|
|
6260
6338
|
return rawSlots.filter((slot) => {
|
|
@@ -6392,9 +6470,9 @@ function DateSlotPicker({
|
|
|
6392
6470
|
className,
|
|
6393
6471
|
classNames
|
|
6394
6472
|
}) {
|
|
6395
|
-
const [offset, setOffset] =
|
|
6396
|
-
const [selectedDate, setSelectedDate] =
|
|
6397
|
-
const dateRange =
|
|
6473
|
+
const [offset, setOffset] = React11.useState(0);
|
|
6474
|
+
const [selectedDate, setSelectedDate] = React11.useState(toDateString(/* @__PURE__ */ new Date()));
|
|
6475
|
+
const dateRange = React11.useMemo(() => {
|
|
6398
6476
|
const today = /* @__PURE__ */ new Date();
|
|
6399
6477
|
const start = addDays(today, offset);
|
|
6400
6478
|
const dates = [];
|
|
@@ -6417,25 +6495,25 @@ function DateSlotPicker({
|
|
|
6417
6495
|
}
|
|
6418
6496
|
);
|
|
6419
6497
|
const days = availabilityProp ?? fetchedDays;
|
|
6420
|
-
const availabilityMap =
|
|
6498
|
+
const availabilityMap = React11.useMemo(() => {
|
|
6421
6499
|
const map = /* @__PURE__ */ new Map();
|
|
6422
6500
|
for (const day of days) {
|
|
6423
6501
|
map.set(day.date, day);
|
|
6424
6502
|
}
|
|
6425
6503
|
return map;
|
|
6426
6504
|
}, [days]);
|
|
6427
|
-
const handlePrev =
|
|
6505
|
+
const handlePrev = React11.useCallback(() => {
|
|
6428
6506
|
setOffset((prev) => Math.max(0, prev - daysToShow));
|
|
6429
6507
|
}, [daysToShow]);
|
|
6430
|
-
const handleNext =
|
|
6508
|
+
const handleNext = React11.useCallback(() => {
|
|
6431
6509
|
setOffset((prev) => prev + daysToShow);
|
|
6432
6510
|
}, [daysToShow]);
|
|
6433
|
-
const handleDateChange =
|
|
6511
|
+
const handleDateChange = React11.useCallback((value) => {
|
|
6434
6512
|
if (typeof value === "string") {
|
|
6435
6513
|
setSelectedDate(value);
|
|
6436
6514
|
}
|
|
6437
6515
|
}, []);
|
|
6438
|
-
const handleSlotSelect =
|
|
6516
|
+
const handleSlotSelect = React11.useCallback(
|
|
6439
6517
|
(slot) => {
|
|
6440
6518
|
onSlotSelect?.(slot, selectedDate);
|
|
6441
6519
|
},
|
|
@@ -6551,22 +6629,22 @@ function ProductCustomizer({
|
|
|
6551
6629
|
className,
|
|
6552
6630
|
classNames
|
|
6553
6631
|
}) {
|
|
6554
|
-
const [quantity, setQuantity] =
|
|
6555
|
-
const [isAdded, setIsAdded] =
|
|
6556
|
-
const [isSubmitting, setIsSubmitting] =
|
|
6557
|
-
const [selectedVariantId, setSelectedVariantId] =
|
|
6558
|
-
const [selectedVariant, setSelectedVariant] =
|
|
6559
|
-
const [selectedAddOnOptionIds, setSelectedAddOnOptionIds] =
|
|
6560
|
-
const [compositeSelections, setCompositeSelections] =
|
|
6561
|
-
const [compositePrice, setCompositePrice] =
|
|
6562
|
-
const [compositeReady, setCompositeReady] =
|
|
6563
|
-
const [bundleSelections, setBundleSelections] =
|
|
6564
|
-
const [bundleTotalPrice, setBundleTotalPrice] =
|
|
6565
|
-
const [bundleReady, setBundleReady] =
|
|
6566
|
-
const [selectedBillingPlan, setSelectedBillingPlan] =
|
|
6567
|
-
const [customerInputValues, setCustomerInputValues] =
|
|
6568
|
-
const [specialInstructions, setSpecialInstructions] =
|
|
6569
|
-
const [selectedSlot, setSelectedSlot] =
|
|
6632
|
+
const [quantity, setQuantity] = React11.useState(product.min_order_quantity ?? 1);
|
|
6633
|
+
const [isAdded, setIsAdded] = React11.useState(false);
|
|
6634
|
+
const [isSubmitting, setIsSubmitting] = React11.useState(false);
|
|
6635
|
+
const [selectedVariantId, setSelectedVariantId] = React11.useState();
|
|
6636
|
+
const [selectedVariant, setSelectedVariant] = React11.useState();
|
|
6637
|
+
const [selectedAddOnOptionIds, setSelectedAddOnOptionIds] = React11.useState([]);
|
|
6638
|
+
const [compositeSelections, setCompositeSelections] = React11.useState([]);
|
|
6639
|
+
const [compositePrice, setCompositePrice] = React11.useState(null);
|
|
6640
|
+
const [compositeReady, setCompositeReady] = React11.useState(false);
|
|
6641
|
+
const [bundleSelections, setBundleSelections] = React11.useState([]);
|
|
6642
|
+
const [bundleTotalPrice, setBundleTotalPrice] = React11.useState(null);
|
|
6643
|
+
const [bundleReady, setBundleReady] = React11.useState(false);
|
|
6644
|
+
const [selectedBillingPlan, setSelectedBillingPlan] = React11.useState(null);
|
|
6645
|
+
const [customerInputValues, setCustomerInputValues] = React11.useState({});
|
|
6646
|
+
const [specialInstructions, setSpecialInstructions] = React11.useState("");
|
|
6647
|
+
const [selectedSlot, setSelectedSlot] = React11.useState(null);
|
|
6570
6648
|
const cart = useCart();
|
|
6571
6649
|
const productType = product.type || "product";
|
|
6572
6650
|
const isComposite = productType === "composite";
|
|
@@ -6576,7 +6654,7 @@ function ProductCustomizer({
|
|
|
6576
6654
|
const isStandard = !isComposite && !isBundle;
|
|
6577
6655
|
const hasVariants = isStandard && product.variants && product.variants.length > 0;
|
|
6578
6656
|
const hasAddOns = isStandard && product.add_ons && product.add_ons.length > 0;
|
|
6579
|
-
|
|
6657
|
+
React11.useEffect(() => {
|
|
6580
6658
|
setQuantity(product.min_order_quantity ?? 1);
|
|
6581
6659
|
setIsAdded(false);
|
|
6582
6660
|
setIsSubmitting(false);
|
|
@@ -6594,7 +6672,7 @@ function ProductCustomizer({
|
|
|
6594
6672
|
setSpecialInstructions("");
|
|
6595
6673
|
setSelectedSlot(null);
|
|
6596
6674
|
}, [product.id, product.min_order_quantity]);
|
|
6597
|
-
const selectedAddOnOptions =
|
|
6675
|
+
const selectedAddOnOptions = React11.useMemo(() => {
|
|
6598
6676
|
if (!product.add_ons) return [];
|
|
6599
6677
|
const options = [];
|
|
6600
6678
|
for (const addOn of product.add_ons) {
|
|
@@ -6606,11 +6684,11 @@ function ProductCustomizer({
|
|
|
6606
6684
|
}
|
|
6607
6685
|
return options;
|
|
6608
6686
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
6609
|
-
const normalizedAddOnOptionIds =
|
|
6687
|
+
const normalizedAddOnOptionIds = React11.useMemo(() => {
|
|
6610
6688
|
if (selectedAddOnOptionIds.length === 0) return [];
|
|
6611
6689
|
return Array.from(new Set(selectedAddOnOptionIds.map((id) => id.trim()).filter(Boolean))).sort();
|
|
6612
6690
|
}, [selectedAddOnOptionIds]);
|
|
6613
|
-
const localTotalPrice =
|
|
6691
|
+
const localTotalPrice = React11.useMemo(() => {
|
|
6614
6692
|
if (isComposite && compositePrice) {
|
|
6615
6693
|
return chunk7Y2O3E4D_js.parsePrice(compositePrice.final_price) * quantity;
|
|
6616
6694
|
}
|
|
@@ -6628,7 +6706,7 @@ function ProductCustomizer({
|
|
|
6628
6706
|
}
|
|
6629
6707
|
return price * quantity;
|
|
6630
6708
|
}, [product.default_price, selectedVariant, selectedAddOnOptions, quantity, isComposite, compositePrice, isBundle, bundleTotalPrice]);
|
|
6631
|
-
const requiredAddOnsSatisfied =
|
|
6709
|
+
const requiredAddOnsSatisfied = React11.useMemo(() => {
|
|
6632
6710
|
if (!product.add_ons) return true;
|
|
6633
6711
|
for (const addOn of product.add_ons) {
|
|
6634
6712
|
if (addOn.is_required) {
|
|
@@ -6643,7 +6721,7 @@ function ProductCustomizer({
|
|
|
6643
6721
|
}
|
|
6644
6722
|
return true;
|
|
6645
6723
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
6646
|
-
const quoteInput =
|
|
6724
|
+
const quoteInput = React11.useMemo(
|
|
6647
6725
|
() => ({
|
|
6648
6726
|
productId: product.id,
|
|
6649
6727
|
quantity,
|
|
@@ -6654,7 +6732,7 @@ function ProductCustomizer({
|
|
|
6654
6732
|
}),
|
|
6655
6733
|
[product.id, quantity, selectedVariantId, normalizedAddOnOptionIds, isBundle, bundleSelections, isComposite, compositeSelections]
|
|
6656
6734
|
);
|
|
6657
|
-
const requiredInputsSatisfied =
|
|
6735
|
+
const requiredInputsSatisfied = React11.useMemo(() => {
|
|
6658
6736
|
if (!product.input_fields || product.input_fields.length === 0) return true;
|
|
6659
6737
|
return product.input_fields.every((field) => {
|
|
6660
6738
|
if (!field.is_required) return true;
|
|
@@ -6667,7 +6745,7 @@ function ProductCustomizer({
|
|
|
6667
6745
|
enabled: quoteEnabled
|
|
6668
6746
|
});
|
|
6669
6747
|
const quoteId = quote?.quote_id;
|
|
6670
|
-
const quotedTotalPrice =
|
|
6748
|
+
const quotedTotalPrice = React11.useMemo(() => {
|
|
6671
6749
|
if (!quote) return void 0;
|
|
6672
6750
|
const priceInfo = quote.quoted_total_price_info ?? quote.final_price_info;
|
|
6673
6751
|
const perUnit = priceInfo.pre_tax_price;
|
|
@@ -6675,7 +6753,7 @@ function ProductCustomizer({
|
|
|
6675
6753
|
return chunk7Y2O3E4D_js.parsePrice(perUnit) * quantity;
|
|
6676
6754
|
}, [quote, quantity]);
|
|
6677
6755
|
const displayTotalPrice = quotedTotalPrice ?? localTotalPrice;
|
|
6678
|
-
const handleVariantChange =
|
|
6756
|
+
const handleVariantChange = React11.useCallback(
|
|
6679
6757
|
(variantId, variant) => {
|
|
6680
6758
|
setSelectedVariantId(variantId);
|
|
6681
6759
|
setSelectedVariant(variant);
|
|
@@ -6683,9 +6761,9 @@ function ProductCustomizer({
|
|
|
6683
6761
|
},
|
|
6684
6762
|
[onVariantChange]
|
|
6685
6763
|
);
|
|
6686
|
-
const addedTimerRef =
|
|
6687
|
-
|
|
6688
|
-
const handleAddToCart =
|
|
6764
|
+
const addedTimerRef = React11.useRef(void 0);
|
|
6765
|
+
React11.useEffect(() => () => clearTimeout(addedTimerRef.current), []);
|
|
6766
|
+
const handleAddToCart = React11.useCallback(async () => {
|
|
6689
6767
|
if (isSubmitting) return;
|
|
6690
6768
|
setIsSubmitting(true);
|
|
6691
6769
|
const options = {
|
|
@@ -6910,14 +6988,14 @@ function ProductImageGallery({
|
|
|
6910
6988
|
aspectRatio = "4/3",
|
|
6911
6989
|
className
|
|
6912
6990
|
}) {
|
|
6913
|
-
const normalizedImages =
|
|
6991
|
+
const normalizedImages = React11.useMemo(
|
|
6914
6992
|
() => images.filter(
|
|
6915
6993
|
(image) => typeof image === "string" && image.trim().length > 0
|
|
6916
6994
|
),
|
|
6917
6995
|
[images]
|
|
6918
6996
|
);
|
|
6919
|
-
const [selectedImage, setSelectedImage] =
|
|
6920
|
-
|
|
6997
|
+
const [selectedImage, setSelectedImage] = React11.useState(0);
|
|
6998
|
+
React11.useEffect(() => {
|
|
6921
6999
|
setSelectedImage(0);
|
|
6922
7000
|
}, [normalizedImages.length, productName]);
|
|
6923
7001
|
if (normalizedImages.length === 0) {
|
|
@@ -7000,9 +7078,9 @@ function StoreVideo({
|
|
|
7000
7078
|
lazy = true,
|
|
7001
7079
|
className
|
|
7002
7080
|
}) {
|
|
7003
|
-
const ref =
|
|
7004
|
-
const [inView, setInView] =
|
|
7005
|
-
|
|
7081
|
+
const ref = React11.useRef(null);
|
|
7082
|
+
const [inView, setInView] = React11.useState(!lazy);
|
|
7083
|
+
React11.useEffect(() => {
|
|
7006
7084
|
if (!lazy || inView) return;
|
|
7007
7085
|
const node = ref.current;
|
|
7008
7086
|
if (!node || typeof IntersectionObserver === "undefined") {
|
|
@@ -7090,8 +7168,8 @@ function ProductModel3D({
|
|
|
7090
7168
|
cameraControls = true,
|
|
7091
7169
|
className
|
|
7092
7170
|
}) {
|
|
7093
|
-
const [ready, setReady] =
|
|
7094
|
-
|
|
7171
|
+
const [ready, setReady] = React11.useState(false);
|
|
7172
|
+
React11.useEffect(() => {
|
|
7095
7173
|
let cancelled = false;
|
|
7096
7174
|
ensureModelViewer().then(
|
|
7097
7175
|
() => {
|
|
@@ -7110,7 +7188,7 @@ function ProductModel3D({
|
|
|
7110
7188
|
"data-cimplify-product-model-3d": true,
|
|
7111
7189
|
className,
|
|
7112
7190
|
style: { position: "relative", overflow: "hidden", ...ASPECT_STYLES3[aspectRatio] },
|
|
7113
|
-
children: ready ?
|
|
7191
|
+
children: ready ? React11__default.default.createElement("model-viewer", {
|
|
7114
7192
|
src,
|
|
7115
7193
|
"ios-src": iosSrc,
|
|
7116
7194
|
alt,
|
|
@@ -7121,12 +7199,12 @@ function ProductModel3D({
|
|
|
7121
7199
|
"auto-rotate": autoRotate || void 0,
|
|
7122
7200
|
"shadow-intensity": "1",
|
|
7123
7201
|
style: { width: "100%", height: "100%", backgroundColor: "transparent" }
|
|
7124
|
-
}) : poster ?
|
|
7202
|
+
}) : poster ? React11__default.default.createElement("img", {
|
|
7125
7203
|
src: poster,
|
|
7126
7204
|
alt: alt ?? "",
|
|
7127
7205
|
"data-cimplify-product-model-3d-loading": true,
|
|
7128
7206
|
style: { width: "100%", height: "100%", objectFit: "cover" }
|
|
7129
|
-
}) :
|
|
7207
|
+
}) : React11__default.default.createElement("div", {
|
|
7130
7208
|
"data-cimplify-product-model-3d-loading": true,
|
|
7131
7209
|
style: { width: "100%", height: "100%", backgroundColor: "var(--muted, #f3f4f6)" }
|
|
7132
7210
|
})
|
|
@@ -7154,12 +7232,12 @@ function MediaGallery({
|
|
|
7154
7232
|
aspectRatio = "4/3",
|
|
7155
7233
|
className
|
|
7156
7234
|
}) {
|
|
7157
|
-
const validItems =
|
|
7235
|
+
const validItems = React11.useMemo(
|
|
7158
7236
|
() => items.filter((i) => typeof i.src === "string" && i.src.trim().length > 0),
|
|
7159
7237
|
[items]
|
|
7160
7238
|
);
|
|
7161
|
-
const [selected, setSelected] =
|
|
7162
|
-
|
|
7239
|
+
const [selected, setSelected] = React11.useState(0);
|
|
7240
|
+
React11.useEffect(() => {
|
|
7163
7241
|
setSelected(0);
|
|
7164
7242
|
}, [validItems.length, productName]);
|
|
7165
7243
|
if (validItems.length === 0) return null;
|
|
@@ -7280,7 +7358,7 @@ function CartLineItemRow({
|
|
|
7280
7358
|
const isOptimistic = item.isOptimistic === true;
|
|
7281
7359
|
const lineTotal = chunk7Y2O3E4D_js.parsePrice(unitPrice) * item.quantity;
|
|
7282
7360
|
const imageUrl = item.product.image_url;
|
|
7283
|
-
const variantLabel = item.variant ?
|
|
7361
|
+
const variantLabel = item.variant ? chunkJYPLT56O_js.getVariantDisplayName(item.variant, item.product.name) : null;
|
|
7284
7362
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
7285
7363
|
"div",
|
|
7286
7364
|
{
|
|
@@ -7380,7 +7458,7 @@ function CartLineItemRow({
|
|
|
7380
7458
|
input.field_name,
|
|
7381
7459
|
":"
|
|
7382
7460
|
] }),
|
|
7383
|
-
/* @__PURE__ */ jsxRuntime.jsx("dd", { "data-cimplify-cart-input-value": true, className: "text-foreground m-0 truncate", children: input.field_type ===
|
|
7461
|
+
/* @__PURE__ */ jsxRuntime.jsx("dd", { "data-cimplify-cart-input-value": true, className: "text-foreground m-0 truncate", children: input.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.File || input.field_type === chunkJYPLT56O_js.INPUT_FIELD_TYPE.Image ? String(input.value).split("/").pop() || "Uploaded file" : String(input.value) })
|
|
7384
7462
|
] }, input.field_id)) }),
|
|
7385
7463
|
(item.lineType === "service" || item.product.type === "service") && item.scheduledStart && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-cart-service-info": true, className: cn("mt-1.5 flex items-center gap-1.5 text-xs text-muted-foreground", classNames?.serviceInfo), children: [
|
|
7386
7464
|
/* @__PURE__ */ jsxRuntime.jsx("svg", { className: "w-3.5 h-3.5 shrink-0", fill: "none", stroke: "currentColor", strokeWidth: "2", viewBox: "0 0 24 24", "aria-hidden": true, children: /* @__PURE__ */ jsxRuntime.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" }) }),
|
|
@@ -7724,7 +7802,7 @@ function ProductSheet({
|
|
|
7724
7802
|
}
|
|
7725
7803
|
);
|
|
7726
7804
|
}
|
|
7727
|
-
const [selectedVariant, setSelectedVariant] =
|
|
7805
|
+
const [selectedVariant, setSelectedVariant] = React11.useState(
|
|
7728
7806
|
void 0
|
|
7729
7807
|
);
|
|
7730
7808
|
const variantImages = selectedVariant?.images?.filter(Boolean) ?? [];
|
|
@@ -7936,7 +8014,7 @@ function FoodProductCard({
|
|
|
7936
8014
|
const tags = product.tags || [];
|
|
7937
8015
|
const isSignature = product.metadata?.is_signature === true;
|
|
7938
8016
|
const isNew = product.metadata?.is_new === true;
|
|
7939
|
-
const isComposite = product.type ===
|
|
8017
|
+
const isComposite = product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Composite;
|
|
7940
8018
|
return /* @__PURE__ */ jsxRuntime.jsxs(CardShell, { product, renderLink, className, children: [
|
|
7941
8019
|
/* @__PURE__ */ jsxRuntime.jsxs(CardImage, { src: image, alt: product.name, aspectRatio: "square", renderImage, children: [
|
|
7942
8020
|
isSignature && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "absolute top-3 left-3 inline-flex items-center gap-1 text-[11px] font-semibold tracking-wide bg-amber-50 text-amber-700 border border-amber-200/60 px-2 py-0.5 rounded-md", children: [
|
|
@@ -8689,26 +8767,26 @@ var BUILT_IN_CARDS = {
|
|
|
8689
8767
|
["composite" /* Composite */]: CompositeProductCard,
|
|
8690
8768
|
["subscription" /* Subscription */]: SubscriptionCard
|
|
8691
8769
|
};
|
|
8692
|
-
var RENTAL_UNITS = /* @__PURE__ */ new Set([
|
|
8693
|
-
var LEASE_UNITS = /* @__PURE__ */ new Set([
|
|
8770
|
+
var RENTAL_UNITS = /* @__PURE__ */ new Set([chunkJYPLT56O_js.DURATION_UNIT.Days, chunkJYPLT56O_js.DURATION_UNIT.Hours]);
|
|
8771
|
+
var LEASE_UNITS = /* @__PURE__ */ new Set([chunkJYPLT56O_js.DURATION_UNIT.Weeks, chunkJYPLT56O_js.DURATION_UNIT.Months, chunkJYPLT56O_js.DURATION_UNIT.Years]);
|
|
8694
8772
|
function resolveCardVariant(product) {
|
|
8695
|
-
if (product.type ===
|
|
8773
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Bundle) {
|
|
8696
8774
|
return "bundle" /* Bundle */;
|
|
8697
8775
|
}
|
|
8698
|
-
if (product.type ===
|
|
8776
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Composite) {
|
|
8699
8777
|
return "composite" /* Composite */;
|
|
8700
8778
|
}
|
|
8701
8779
|
if (product.quantity_pricing && product.quantity_pricing.length > 1) {
|
|
8702
8780
|
return "wholesale" /* Wholesale */;
|
|
8703
8781
|
}
|
|
8704
|
-
if (product.type ===
|
|
8782
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Digital) {
|
|
8705
8783
|
return "digital" /* Digital */;
|
|
8706
8784
|
}
|
|
8707
|
-
if (product.type ===
|
|
8785
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Service) {
|
|
8708
8786
|
if (product.duration_unit && RENTAL_UNITS.has(product.duration_unit)) {
|
|
8709
8787
|
return "rental" /* Rental */;
|
|
8710
8788
|
}
|
|
8711
|
-
if (product.duration_unit ===
|
|
8789
|
+
if (product.duration_unit === chunkJYPLT56O_js.DURATION_UNIT.Nights) {
|
|
8712
8790
|
return "accommodation" /* Accommodation */;
|
|
8713
8791
|
}
|
|
8714
8792
|
if (product.duration_unit && LEASE_UNITS.has(product.duration_unit)) {
|
|
@@ -8719,10 +8797,10 @@ function resolveCardVariant(product) {
|
|
|
8719
8797
|
}
|
|
8720
8798
|
return "standard" /* Standard */;
|
|
8721
8799
|
}
|
|
8722
|
-
if (product.render_hint ===
|
|
8800
|
+
if (product.render_hint === chunkJYPLT56O_js.RENDER_HINT.Food) {
|
|
8723
8801
|
return "food" /* Food */;
|
|
8724
8802
|
}
|
|
8725
|
-
if (product.render_hint ===
|
|
8803
|
+
if (product.render_hint === chunkJYPLT56O_js.RENDER_HINT.Physical) {
|
|
8726
8804
|
return "retail" /* Retail */;
|
|
8727
8805
|
}
|
|
8728
8806
|
return "retail" /* Retail */;
|
|
@@ -8743,22 +8821,22 @@ function ProductCard({
|
|
|
8743
8821
|
classNames
|
|
8744
8822
|
}) {
|
|
8745
8823
|
const mode = displayMode ?? product.display_mode ?? "card";
|
|
8746
|
-
const [isOpen, setIsOpen] =
|
|
8747
|
-
const [shouldFetch, setShouldFetch] =
|
|
8824
|
+
const [isOpen, setIsOpen] = React11.useState(false);
|
|
8825
|
+
const [shouldFetch, setShouldFetch] = React11.useState(false);
|
|
8748
8826
|
const { product: productDetails } = useProduct(
|
|
8749
8827
|
product.slug ?? product.id,
|
|
8750
8828
|
{ enabled: shouldFetch || isOpen }
|
|
8751
8829
|
);
|
|
8752
|
-
const handlePrefetch =
|
|
8830
|
+
const handlePrefetch = React11.useCallback(() => {
|
|
8753
8831
|
setShouldFetch(true);
|
|
8754
8832
|
}, []);
|
|
8755
|
-
const handleOpenChange =
|
|
8833
|
+
const handleOpenChange = React11.useCallback((open) => {
|
|
8756
8834
|
setIsOpen(open);
|
|
8757
8835
|
if (open) {
|
|
8758
8836
|
setShouldFetch(true);
|
|
8759
8837
|
}
|
|
8760
8838
|
}, []);
|
|
8761
|
-
const handleClose =
|
|
8839
|
+
const handleClose = React11.useCallback(() => {
|
|
8762
8840
|
setIsOpen(false);
|
|
8763
8841
|
}, []);
|
|
8764
8842
|
const imageUrl = product.image_url || product.images?.[0];
|
|
@@ -8887,13 +8965,13 @@ function ProductGrid({
|
|
|
8887
8965
|
className,
|
|
8888
8966
|
classNames
|
|
8889
8967
|
}) {
|
|
8890
|
-
const rawId =
|
|
8968
|
+
const rawId = React11__default.default.useId();
|
|
8891
8969
|
const gridId = `cimplify-grid-${rawId.replace(/:/g, "")}`;
|
|
8892
8970
|
const sm = columns?.sm ?? 1;
|
|
8893
8971
|
const md = columns?.md ?? 2;
|
|
8894
8972
|
const lg = columns?.lg ?? 3;
|
|
8895
8973
|
const xl = columns?.xl ?? 4;
|
|
8896
|
-
const css =
|
|
8974
|
+
const css = React11__default.default.useMemo(
|
|
8897
8975
|
() => [
|
|
8898
8976
|
`#${gridId}{display:grid;grid-template-columns:repeat(${sm},1fr);gap:1rem}`,
|
|
8899
8977
|
`@media(min-width:768px){#${gridId}{grid-template-columns:repeat(${md},1fr)}}`,
|
|
@@ -8971,12 +9049,12 @@ function SearchInput({
|
|
|
8971
9049
|
className,
|
|
8972
9050
|
classNames
|
|
8973
9051
|
}) {
|
|
8974
|
-
const mergedOptions =
|
|
9052
|
+
const mergedOptions = React11.useMemo(
|
|
8975
9053
|
() => categoryId ? { ...searchOptions, category: categoryId } : searchOptions ?? {},
|
|
8976
9054
|
[searchOptions, categoryId]
|
|
8977
9055
|
);
|
|
8978
9056
|
const { results, isLoading, query, setQuery, clear } = useSearch(mergedOptions);
|
|
8979
|
-
const handleValueChange =
|
|
9057
|
+
const handleValueChange = React11.useCallback(
|
|
8980
9058
|
(value) => {
|
|
8981
9059
|
setQuery(value);
|
|
8982
9060
|
},
|
|
@@ -9075,7 +9153,7 @@ function CategoryFilter({
|
|
|
9075
9153
|
classNames
|
|
9076
9154
|
}) {
|
|
9077
9155
|
const { categories, isLoading } = useCategories();
|
|
9078
|
-
const handleValueChange =
|
|
9156
|
+
const handleValueChange = React11.useCallback(
|
|
9079
9157
|
(value) => {
|
|
9080
9158
|
onSelect(value === ALL_VALUE ? null : String(value));
|
|
9081
9159
|
},
|
|
@@ -9142,10 +9220,10 @@ function DiscountInput({
|
|
|
9142
9220
|
className,
|
|
9143
9221
|
classNames
|
|
9144
9222
|
}) {
|
|
9145
|
-
const [code, setCode] =
|
|
9146
|
-
const [appliedValidation, setAppliedValidation] =
|
|
9223
|
+
const [code, setCode] = React11.useState("");
|
|
9224
|
+
const [appliedValidation, setAppliedValidation] = React11.useState(null);
|
|
9147
9225
|
const { validate, isValidating, error } = useValidateDiscount();
|
|
9148
|
-
const handleApply =
|
|
9226
|
+
const handleApply = React11.useCallback(async () => {
|
|
9149
9227
|
const trimmed = code.trim();
|
|
9150
9228
|
if (!trimmed) return;
|
|
9151
9229
|
const result = await validate(trimmed, orderSubtotal, locationId);
|
|
@@ -9158,12 +9236,12 @@ function DiscountInput({
|
|
|
9158
9236
|
}
|
|
9159
9237
|
}
|
|
9160
9238
|
}, [code, validate, orderSubtotal, locationId, onApply]);
|
|
9161
|
-
const handleClear =
|
|
9239
|
+
const handleClear = React11.useCallback(() => {
|
|
9162
9240
|
setCode("");
|
|
9163
9241
|
setAppliedValidation(null);
|
|
9164
9242
|
onClear?.();
|
|
9165
9243
|
}, [onClear]);
|
|
9166
|
-
const handleKeyDown =
|
|
9244
|
+
const handleKeyDown = React11.useCallback(
|
|
9167
9245
|
(e) => {
|
|
9168
9246
|
if (e.key === "Enter") {
|
|
9169
9247
|
void handleApply();
|
|
@@ -9254,7 +9332,7 @@ function CategoryGrid({
|
|
|
9254
9332
|
enabled: categoriesProp === void 0
|
|
9255
9333
|
});
|
|
9256
9334
|
const categories = categoriesProp ?? fetched;
|
|
9257
|
-
const rawId =
|
|
9335
|
+
const rawId = React11__default.default.useId();
|
|
9258
9336
|
const gridId = `cimplify-cat-grid-${rawId.replace(/:/g, "")}`;
|
|
9259
9337
|
const sm = columns?.sm ?? 2;
|
|
9260
9338
|
const md = columns?.md ?? 3;
|
|
@@ -9480,7 +9558,7 @@ function OrderSummary({
|
|
|
9480
9558
|
/* @__PURE__ */ jsxRuntime.jsx("p", { children: order.delivery_address })
|
|
9481
9559
|
] }),
|
|
9482
9560
|
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-order-items": true, className: classNames?.items, children: order.items.map(
|
|
9483
|
-
(item) => renderLineItem ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
9561
|
+
(item) => renderLineItem ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderLineItem(item) }, item.id) : /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-line-item": true, className: classNames?.lineItem, children: [
|
|
9484
9562
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-line-info": true, children: [
|
|
9485
9563
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-order-line-qty": true, children: [
|
|
9486
9564
|
item.quantity,
|
|
@@ -10138,13 +10216,13 @@ function BookingPage({
|
|
|
10138
10216
|
const { addItem } = useCart();
|
|
10139
10217
|
const { client } = useCimplifyClient();
|
|
10140
10218
|
const isReschedule = existingBooking !== void 0;
|
|
10141
|
-
const [step, setStep] =
|
|
10142
|
-
const [selectedSlot, setSelectedSlot] =
|
|
10143
|
-
const [selectedDate, setSelectedDate] =
|
|
10144
|
-
const [selectedStaffId, setSelectedStaffId] =
|
|
10145
|
-
const [selectedResourceId, setSelectedResourceId] =
|
|
10146
|
-
const [isSubmitting, setIsSubmitting] =
|
|
10147
|
-
const [error, setError] =
|
|
10219
|
+
const [step, setStep] = React11.useState(STEP.SELECT_SLOT);
|
|
10220
|
+
const [selectedSlot, setSelectedSlot] = React11.useState(null);
|
|
10221
|
+
const [selectedDate, setSelectedDate] = React11.useState(null);
|
|
10222
|
+
const [selectedStaffId, setSelectedStaffId] = React11.useState(null);
|
|
10223
|
+
const [selectedResourceId, setSelectedResourceId] = React11.useState(null);
|
|
10224
|
+
const [isSubmitting, setIsSubmitting] = React11.useState(false);
|
|
10225
|
+
const [error, setError] = React11.useState(null);
|
|
10148
10226
|
const hasResourceStep = resources && resources.length > 0;
|
|
10149
10227
|
const hasStaffStep = staff && staff.length > 0;
|
|
10150
10228
|
const depositType = product?.deposit_type;
|
|
@@ -10152,7 +10230,7 @@ function BookingPage({
|
|
|
10152
10230
|
const hasDeposit = depositType !== void 0 && depositType !== "none" && depositAmount !== void 0 && chunk7Y2O3E4D_js.parsePrice(depositAmount) !== 0;
|
|
10153
10231
|
const cancellationMinutes = product?.cancellation_window_minutes;
|
|
10154
10232
|
const noShowFee = product?.no_show_fee;
|
|
10155
|
-
const handleSlotSelect =
|
|
10233
|
+
const handleSlotSelect = React11.useCallback(
|
|
10156
10234
|
(slot, date) => {
|
|
10157
10235
|
setSelectedSlot(slot);
|
|
10158
10236
|
setSelectedDate(date);
|
|
@@ -10167,7 +10245,7 @@ function BookingPage({
|
|
|
10167
10245
|
},
|
|
10168
10246
|
[hasResourceStep, hasStaffStep]
|
|
10169
10247
|
);
|
|
10170
|
-
const handleResourceSelect =
|
|
10248
|
+
const handleResourceSelect = React11.useCallback(
|
|
10171
10249
|
(resourceId) => {
|
|
10172
10250
|
setSelectedResourceId(resourceId);
|
|
10173
10251
|
if (hasStaffStep) {
|
|
@@ -10178,11 +10256,11 @@ function BookingPage({
|
|
|
10178
10256
|
},
|
|
10179
10257
|
[hasStaffStep]
|
|
10180
10258
|
);
|
|
10181
|
-
const handleStaffSelect =
|
|
10259
|
+
const handleStaffSelect = React11.useCallback((staffId) => {
|
|
10182
10260
|
setSelectedStaffId(staffId);
|
|
10183
10261
|
setStep(STEP.CONFIRM);
|
|
10184
10262
|
}, []);
|
|
10185
|
-
const handleBack =
|
|
10263
|
+
const handleBack = React11.useCallback(() => {
|
|
10186
10264
|
setError(null);
|
|
10187
10265
|
if (step === STEP.CONFIRM && hasStaffStep) {
|
|
10188
10266
|
setStep(STEP.SELECT_STAFF);
|
|
@@ -10196,7 +10274,7 @@ function BookingPage({
|
|
|
10196
10274
|
onBack?.();
|
|
10197
10275
|
}
|
|
10198
10276
|
}, [step, hasStaffStep, hasResourceStep, onBack]);
|
|
10199
|
-
const handleConfirm =
|
|
10277
|
+
const handleConfirm = React11.useCallback(async () => {
|
|
10200
10278
|
if (!selectedSlot || !selectedDate) return;
|
|
10201
10279
|
setIsSubmitting(true);
|
|
10202
10280
|
setError(null);
|
|
@@ -10398,9 +10476,9 @@ function BookingsPage({
|
|
|
10398
10476
|
className,
|
|
10399
10477
|
classNames
|
|
10400
10478
|
}) {
|
|
10401
|
-
const [filter, setFilter] =
|
|
10402
|
-
const [selectedBooking, setSelectedBooking] =
|
|
10403
|
-
const handleBookingClick =
|
|
10479
|
+
const [filter, setFilter] = React11.useState("all");
|
|
10480
|
+
const [selectedBooking, setSelectedBooking] = React11.useState(null);
|
|
10481
|
+
const handleBookingClick = React11.useCallback(
|
|
10404
10482
|
(booking) => {
|
|
10405
10483
|
if (onBookingNavigate) {
|
|
10406
10484
|
onBookingNavigate(booking);
|
|
@@ -10410,7 +10488,7 @@ function BookingsPage({
|
|
|
10410
10488
|
},
|
|
10411
10489
|
[onBookingNavigate]
|
|
10412
10490
|
);
|
|
10413
|
-
const handleBack =
|
|
10491
|
+
const handleBack = React11.useCallback(() => {
|
|
10414
10492
|
setSelectedBooking(null);
|
|
10415
10493
|
}, []);
|
|
10416
10494
|
if (selectedBooking && !onBookingNavigate) {
|
|
@@ -10640,7 +10718,7 @@ function DefaultCatalogueLayout({
|
|
|
10640
10718
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No products found" }),
|
|
10641
10719
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try adjusting your filters" })
|
|
10642
10720
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4", children: products.map(
|
|
10643
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
10721
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
10644
10722
|
ProductCard,
|
|
10645
10723
|
{
|
|
10646
10724
|
product,
|
|
@@ -10747,7 +10825,7 @@ function CompactCatalogueLayout({
|
|
|
10747
10825
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No items found" }),
|
|
10748
10826
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different category or search" })
|
|
10749
10827
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-5", children: products.map(
|
|
10750
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
10828
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
10751
10829
|
ProductCard,
|
|
10752
10830
|
{
|
|
10753
10831
|
product,
|
|
@@ -10770,8 +10848,8 @@ var BUILT_IN_LAYOUTS = {
|
|
|
10770
10848
|
["compact" /* Compact */]: CompactCatalogueLayout
|
|
10771
10849
|
};
|
|
10772
10850
|
function useDebounce(value, delay) {
|
|
10773
|
-
const [debounced, setDebounced] =
|
|
10774
|
-
|
|
10851
|
+
const [debounced, setDebounced] = React11__default.default.useState(value);
|
|
10852
|
+
React11__default.default.useEffect(() => {
|
|
10775
10853
|
const timer = setTimeout(() => setDebounced(value), delay);
|
|
10776
10854
|
return () => clearTimeout(timer);
|
|
10777
10855
|
}, [value, delay]);
|
|
@@ -10795,15 +10873,15 @@ function CataloguePage({
|
|
|
10795
10873
|
className,
|
|
10796
10874
|
classNames
|
|
10797
10875
|
}) {
|
|
10798
|
-
const [selectedCategory, setSelectedCategory] =
|
|
10799
|
-
const [searchQuery, setSearchQuery] =
|
|
10800
|
-
const [sortBy, setSortBy] =
|
|
10801
|
-
const [sortOrder, setSortOrder] =
|
|
10802
|
-
const [inStockOnly, setInStockOnly] =
|
|
10803
|
-
const [selectedTags, setSelectedTags] =
|
|
10804
|
-
const [minPrice, setMinPrice] =
|
|
10805
|
-
const [maxPrice, setMaxPrice] =
|
|
10806
|
-
const [page, setPage] =
|
|
10876
|
+
const [selectedCategory, setSelectedCategory] = React11.useState(null);
|
|
10877
|
+
const [searchQuery, setSearchQuery] = React11.useState("");
|
|
10878
|
+
const [sortBy, setSortBy] = React11.useState(defaultSort?.by ?? "created_at");
|
|
10879
|
+
const [sortOrder, setSortOrder] = React11.useState(defaultSort?.order ?? "desc");
|
|
10880
|
+
const [inStockOnly, setInStockOnly] = React11.useState(false);
|
|
10881
|
+
const [selectedTags, setSelectedTags] = React11.useState([]);
|
|
10882
|
+
const [minPrice, setMinPrice] = React11.useState("");
|
|
10883
|
+
const [maxPrice, setMaxPrice] = React11.useState("");
|
|
10884
|
+
const [page, setPage] = React11.useState(1);
|
|
10807
10885
|
const debouncedSearch = useDebounce(searchQuery, 300);
|
|
10808
10886
|
const { products: fetchedProducts, isLoading, pagination } = useProducts({
|
|
10809
10887
|
enabled: productsProp === void 0,
|
|
@@ -10824,22 +10902,22 @@ function CataloguePage({
|
|
|
10824
10902
|
const products = productsProp ?? fetchedProducts;
|
|
10825
10903
|
const categories = categoriesProp ?? fetchedCategories;
|
|
10826
10904
|
const totalPages = pagination?.total_pages ?? 1;
|
|
10827
|
-
const handleCategoryChange =
|
|
10905
|
+
const handleCategoryChange = React11.useCallback((id) => {
|
|
10828
10906
|
setSelectedCategory(id);
|
|
10829
10907
|
setPage(1);
|
|
10830
10908
|
}, []);
|
|
10831
|
-
const handleSortChange =
|
|
10909
|
+
const handleSortChange = React11.useCallback((by, order) => {
|
|
10832
10910
|
setSortBy(by);
|
|
10833
10911
|
setSortOrder(order);
|
|
10834
10912
|
setPage(1);
|
|
10835
10913
|
}, []);
|
|
10836
|
-
const handleTagToggle =
|
|
10914
|
+
const handleTagToggle = React11.useCallback((tag) => {
|
|
10837
10915
|
setSelectedTags(
|
|
10838
10916
|
(prev) => prev.includes(tag) ? prev.filter((t) => t !== tag) : [...prev, tag]
|
|
10839
10917
|
);
|
|
10840
10918
|
setPage(1);
|
|
10841
10919
|
}, []);
|
|
10842
|
-
const handlePriceRangeChange =
|
|
10920
|
+
const handlePriceRangeChange = React11.useCallback((min, max) => {
|
|
10843
10921
|
setMinPrice(min);
|
|
10844
10922
|
setMaxPrice(max);
|
|
10845
10923
|
setPage(1);
|
|
@@ -11662,25 +11740,25 @@ function resolveTemplateKey(product) {
|
|
|
11662
11740
|
if (typeof metaTemplate === "string" && metaTemplate.trim()) {
|
|
11663
11741
|
return metaTemplate.trim();
|
|
11664
11742
|
}
|
|
11665
|
-
if (product.type ===
|
|
11743
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Bundle) {
|
|
11666
11744
|
return "bundle" /* Bundle */;
|
|
11667
11745
|
}
|
|
11668
|
-
if (product.type ===
|
|
11746
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Composite) {
|
|
11669
11747
|
return "composite" /* Composite */;
|
|
11670
11748
|
}
|
|
11671
11749
|
if (product.quantity_pricing && product.quantity_pricing.length > 1) {
|
|
11672
11750
|
return "wholesale" /* Wholesale */;
|
|
11673
11751
|
}
|
|
11674
|
-
if (product.type ===
|
|
11752
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Service) {
|
|
11675
11753
|
return "service" /* Service */;
|
|
11676
11754
|
}
|
|
11677
|
-
if (product.type ===
|
|
11755
|
+
if (product.type === chunkJYPLT56O_js.PRODUCT_TYPE.Digital) {
|
|
11678
11756
|
return "digital" /* Digital */;
|
|
11679
11757
|
}
|
|
11680
|
-
if (product.render_hint ===
|
|
11758
|
+
if (product.render_hint === chunkJYPLT56O_js.RENDER_HINT.Food) {
|
|
11681
11759
|
return "food" /* Food */;
|
|
11682
11760
|
}
|
|
11683
|
-
if (product.render_hint ===
|
|
11761
|
+
if (product.render_hint === chunkJYPLT56O_js.RENDER_HINT.Physical) {
|
|
11684
11762
|
return "physical" /* Physical */;
|
|
11685
11763
|
}
|
|
11686
11764
|
return "default" /* Default */;
|
|
@@ -11943,36 +12021,36 @@ function CartPage({
|
|
|
11943
12021
|
}
|
|
11944
12022
|
) });
|
|
11945
12023
|
}
|
|
11946
|
-
var CartDrawerContext =
|
|
12024
|
+
var CartDrawerContext = React11.createContext(null);
|
|
11947
12025
|
function useCartDrawer() {
|
|
11948
|
-
const ctx =
|
|
12026
|
+
const ctx = React11.useContext(CartDrawerContext);
|
|
11949
12027
|
if (!ctx) {
|
|
11950
12028
|
throw new Error("useCartDrawer must be used within <CartDrawerProvider>");
|
|
11951
12029
|
}
|
|
11952
12030
|
return ctx;
|
|
11953
12031
|
}
|
|
11954
12032
|
function CartDrawerProvider({ children, openOnAdd = true }) {
|
|
11955
|
-
const [isOpen, setIsOpen] =
|
|
12033
|
+
const [isOpen, setIsOpen] = React11.useState(false);
|
|
11956
12034
|
const cart = useCart();
|
|
11957
|
-
const lastPendingRef =
|
|
11958
|
-
const open =
|
|
11959
|
-
const close =
|
|
11960
|
-
const toggle =
|
|
11961
|
-
|
|
12035
|
+
const lastPendingRef = React11.useRef(0);
|
|
12036
|
+
const open = React11.useCallback(() => setIsOpen(true), []);
|
|
12037
|
+
const close = React11.useCallback(() => setIsOpen(false), []);
|
|
12038
|
+
const toggle = React11.useCallback(() => setIsOpen((v) => !v), []);
|
|
12039
|
+
React11.useEffect(() => {
|
|
11962
12040
|
if (!openOnAdd) return;
|
|
11963
12041
|
if (cart.pendingOpCount > lastPendingRef.current && cart.pendingOpCount > 0) {
|
|
11964
12042
|
setIsOpen(true);
|
|
11965
12043
|
}
|
|
11966
12044
|
lastPendingRef.current = cart.pendingOpCount;
|
|
11967
12045
|
}, [cart.pendingOpCount, openOnAdd]);
|
|
11968
|
-
const value =
|
|
12046
|
+
const value = React11.useMemo(() => ({ isOpen, open, close, toggle }), [isOpen, open, close, toggle]);
|
|
11969
12047
|
return /* @__PURE__ */ jsxRuntime.jsx(CartDrawerContext.Provider, { value, children });
|
|
11970
12048
|
}
|
|
11971
12049
|
function useAnimatedNumber(target, durationMs = 250) {
|
|
11972
|
-
const [value, setValue] =
|
|
11973
|
-
const fromRef =
|
|
11974
|
-
const startRef =
|
|
11975
|
-
|
|
12050
|
+
const [value, setValue] = React11.useState(target);
|
|
12051
|
+
const fromRef = React11.useRef(target);
|
|
12052
|
+
const startRef = React11.useRef(null);
|
|
12053
|
+
React11.useEffect(() => {
|
|
11976
12054
|
fromRef.current = value;
|
|
11977
12055
|
startRef.current = null;
|
|
11978
12056
|
let raf = 0;
|
|
@@ -12000,7 +12078,7 @@ function CartDrawer({
|
|
|
12000
12078
|
const cart = useCart();
|
|
12001
12079
|
const subtotalNum = chunk7Y2O3E4D_js.parsePrice(cart.subtotal);
|
|
12002
12080
|
const animatedSubtotal = useAnimatedNumber(subtotalNum);
|
|
12003
|
-
|
|
12081
|
+
React11.useEffect(() => {
|
|
12004
12082
|
if (!isOpen) return;
|
|
12005
12083
|
const original = document.body.style.overflow;
|
|
12006
12084
|
document.body.style.overflow = "hidden";
|
|
@@ -12205,9 +12283,9 @@ function DefaultCollectionLayout({
|
|
|
12205
12283
|
onQuickAdd,
|
|
12206
12284
|
className
|
|
12207
12285
|
}) {
|
|
12208
|
-
const [searchQuery, setSearchQuery] =
|
|
12209
|
-
const [activeTag, setActiveTag] =
|
|
12210
|
-
const collectionTags =
|
|
12286
|
+
const [searchQuery, setSearchQuery] = React11.useState("");
|
|
12287
|
+
const [activeTag, setActiveTag] = React11.useState(null);
|
|
12288
|
+
const collectionTags = React11.useMemo(() => {
|
|
12211
12289
|
const tagSet = /* @__PURE__ */ new Set();
|
|
12212
12290
|
for (const p of products) {
|
|
12213
12291
|
if (p.tags) {
|
|
@@ -12216,7 +12294,7 @@ function DefaultCollectionLayout({
|
|
|
12216
12294
|
}
|
|
12217
12295
|
return Array.from(tagSet).slice(0, 6);
|
|
12218
12296
|
}, [products]);
|
|
12219
|
-
const filtered =
|
|
12297
|
+
const filtered = React11.useMemo(() => {
|
|
12220
12298
|
let result = products;
|
|
12221
12299
|
if (searchQuery.trim().length >= 2) {
|
|
12222
12300
|
const q = searchQuery.toLowerCase();
|
|
@@ -12291,7 +12369,7 @@ function DefaultCollectionLayout({
|
|
|
12291
12369
|
] })
|
|
12292
12370
|
] }),
|
|
12293
12371
|
filtered.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", children: filtered.map(
|
|
12294
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
12372
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12295
12373
|
ProductCard,
|
|
12296
12374
|
{
|
|
12297
12375
|
product,
|
|
@@ -12344,7 +12422,7 @@ function FeaturedCollectionLayout({
|
|
|
12344
12422
|
] })
|
|
12345
12423
|
] }),
|
|
12346
12424
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: products.map(
|
|
12347
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
12425
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12348
12426
|
ProductCard,
|
|
12349
12427
|
{
|
|
12350
12428
|
product,
|
|
@@ -12366,10 +12444,10 @@ function CatalogueCollectionLayout({
|
|
|
12366
12444
|
onQuickAdd,
|
|
12367
12445
|
className
|
|
12368
12446
|
}) {
|
|
12369
|
-
const [searchQuery, setSearchQuery] =
|
|
12370
|
-
const [activeCategory, setActiveCategory] =
|
|
12371
|
-
const [sortBy, setSortBy] =
|
|
12372
|
-
const categories =
|
|
12447
|
+
const [searchQuery, setSearchQuery] = React11.useState("");
|
|
12448
|
+
const [activeCategory, setActiveCategory] = React11.useState(null);
|
|
12449
|
+
const [sortBy, setSortBy] = React11.useState("default");
|
|
12450
|
+
const categories = React11.useMemo(() => {
|
|
12373
12451
|
const cats = /* @__PURE__ */ new Map();
|
|
12374
12452
|
for (const p of products) {
|
|
12375
12453
|
if (p.category_id && p.tags) {
|
|
@@ -12380,7 +12458,7 @@ function CatalogueCollectionLayout({
|
|
|
12380
12458
|
}
|
|
12381
12459
|
return Array.from(cats.values()).slice(0, 8);
|
|
12382
12460
|
}, [products]);
|
|
12383
|
-
const filtered =
|
|
12461
|
+
const filtered = React11.useMemo(() => {
|
|
12384
12462
|
let result = products;
|
|
12385
12463
|
if (searchQuery.trim().length >= 2) {
|
|
12386
12464
|
const q = searchQuery.toLowerCase();
|
|
@@ -12468,7 +12546,7 @@ function CatalogueCollectionLayout({
|
|
|
12468
12546
|
] })
|
|
12469
12547
|
] }),
|
|
12470
12548
|
filtered.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4", children: filtered.map(
|
|
12471
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
12549
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12472
12550
|
ProductCard,
|
|
12473
12551
|
{
|
|
12474
12552
|
product,
|
|
@@ -12647,13 +12725,13 @@ function OrderHistoryPage({
|
|
|
12647
12725
|
className,
|
|
12648
12726
|
classNames
|
|
12649
12727
|
}) {
|
|
12650
|
-
const [statusFilter, setStatusFilter] =
|
|
12651
|
-
const [selectedOrder, setSelectedOrder] =
|
|
12652
|
-
const handleTabChange =
|
|
12728
|
+
const [statusFilter, setStatusFilter] = React11.useState(void 0);
|
|
12729
|
+
const [selectedOrder, setSelectedOrder] = React11.useState(null);
|
|
12730
|
+
const handleTabChange = React11.useCallback((value) => {
|
|
12653
12731
|
const filter = STATUS_FILTERS.find((f) => f.tabValue === value);
|
|
12654
12732
|
setStatusFilter(filter?.value);
|
|
12655
12733
|
}, []);
|
|
12656
|
-
const handleOrderClick =
|
|
12734
|
+
const handleOrderClick = React11.useCallback(
|
|
12657
12735
|
(order) => {
|
|
12658
12736
|
if (onOrderNavigate) {
|
|
12659
12737
|
onOrderNavigate(order);
|
|
@@ -12663,7 +12741,7 @@ function OrderHistoryPage({
|
|
|
12663
12741
|
},
|
|
12664
12742
|
[onOrderNavigate]
|
|
12665
12743
|
);
|
|
12666
|
-
const handleBack =
|
|
12744
|
+
const handleBack = React11.useCallback(() => {
|
|
12667
12745
|
setSelectedOrder(null);
|
|
12668
12746
|
}, []);
|
|
12669
12747
|
const activeTabValue = STATUS_FILTERS.find((f) => f.value === statusFilter)?.tabValue ?? "all";
|
|
@@ -12848,7 +12926,7 @@ function DefaultSearchLayout({
|
|
|
12848
12926
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
12849
12927
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
12850
12928
|
] }) : results.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4", children: results.map(
|
|
12851
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
12929
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12852
12930
|
ProductCard,
|
|
12853
12931
|
{
|
|
12854
12932
|
product,
|
|
@@ -12950,7 +13028,7 @@ function CompactSearchLayout({
|
|
|
12950
13028
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
12951
13029
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
12952
13030
|
] }) : results.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-5", children: results.map(
|
|
12953
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
13031
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React11__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12954
13032
|
ProductCard,
|
|
12955
13033
|
{
|
|
12956
13034
|
product,
|
|
@@ -13281,11 +13359,11 @@ function DeliveryEstimate({
|
|
|
13281
13359
|
}) {
|
|
13282
13360
|
const context = useOptionalCimplifyClient();
|
|
13283
13361
|
const client = context?.client ?? null;
|
|
13284
|
-
const [result, setResult] =
|
|
13285
|
-
const [isLoading, setIsLoading] =
|
|
13286
|
-
const [error, setError] =
|
|
13287
|
-
const requestIdRef =
|
|
13288
|
-
|
|
13362
|
+
const [result, setResult] = React11.useState(null);
|
|
13363
|
+
const [isLoading, setIsLoading] = React11.useState(true);
|
|
13364
|
+
const [error, setError] = React11.useState(null);
|
|
13365
|
+
const requestIdRef = React11.useRef(0);
|
|
13366
|
+
React11.useEffect(() => {
|
|
13289
13367
|
if (!client) return;
|
|
13290
13368
|
const nextRequestId = ++requestIdRef.current;
|
|
13291
13369
|
setIsLoading(true);
|
|
@@ -13366,10 +13444,10 @@ function CurrencySelector({
|
|
|
13366
13444
|
}) {
|
|
13367
13445
|
const context = useOptionalCimplifyClient();
|
|
13368
13446
|
const client = context?.client ?? null;
|
|
13369
|
-
const [rates, setRates] =
|
|
13370
|
-
const [isLoadingRates, setIsLoadingRates] =
|
|
13371
|
-
const requestIdRef =
|
|
13372
|
-
|
|
13447
|
+
const [rates, setRates] = React11.useState({});
|
|
13448
|
+
const [isLoadingRates, setIsLoadingRates] = React11.useState(false);
|
|
13449
|
+
const requestIdRef = React11.useRef(0);
|
|
13450
|
+
React11.useEffect(() => {
|
|
13373
13451
|
if (!showRate || !baseCurrency || !client) return;
|
|
13374
13452
|
const targets = currencies.filter((c) => c !== baseCurrency);
|
|
13375
13453
|
if (targets.length === 0) return;
|
|
@@ -13432,11 +13510,11 @@ function ChatWidget({
|
|
|
13432
13510
|
}) {
|
|
13433
13511
|
const context = useOptionalCimplifyClient();
|
|
13434
13512
|
const client = clientProp ?? context?.client;
|
|
13435
|
-
const [open, setOpen] =
|
|
13436
|
-
const [unread, setUnread] =
|
|
13513
|
+
const [open, setOpen] = React11.useState(defaultOpen);
|
|
13514
|
+
const [unread, setUnread] = React11.useState(0);
|
|
13437
13515
|
const { messages, isLoading, isSending, error, isActive, send, startConversation } = useChat({ client, pollInterval });
|
|
13438
|
-
const prevCountRef =
|
|
13439
|
-
|
|
13516
|
+
const prevCountRef = React11.useRef(messages.length);
|
|
13517
|
+
React11.useEffect(() => {
|
|
13440
13518
|
if (!open && messages.length > prevCountRef.current) {
|
|
13441
13519
|
const newMessages = messages.slice(prevCountRef.current);
|
|
13442
13520
|
const incomingCount = newMessages.filter(
|
|
@@ -13446,11 +13524,11 @@ function ChatWidget({
|
|
|
13446
13524
|
}
|
|
13447
13525
|
prevCountRef.current = messages.length;
|
|
13448
13526
|
}, [messages, open]);
|
|
13449
|
-
const handleOpen =
|
|
13527
|
+
const handleOpen = React11.useCallback(() => {
|
|
13450
13528
|
setOpen(true);
|
|
13451
13529
|
setUnread(0);
|
|
13452
13530
|
}, []);
|
|
13453
|
-
const handleClose =
|
|
13531
|
+
const handleClose = React11.useCallback(() => setOpen(false), []);
|
|
13454
13532
|
const isLeft = position === "bottom-left";
|
|
13455
13533
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
13456
13534
|
"div",
|
|
@@ -13692,8 +13770,8 @@ function MessageList({
|
|
|
13692
13770
|
isSending,
|
|
13693
13771
|
className
|
|
13694
13772
|
}) {
|
|
13695
|
-
const bottomRef =
|
|
13696
|
-
|
|
13773
|
+
const bottomRef = React11.useRef(null);
|
|
13774
|
+
React11.useEffect(() => {
|
|
13697
13775
|
bottomRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
13698
13776
|
}, [messages.length, isSending]);
|
|
13699
13777
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -13753,9 +13831,9 @@ function ChatInput({
|
|
|
13753
13831
|
onSend,
|
|
13754
13832
|
className
|
|
13755
13833
|
}) {
|
|
13756
|
-
const [value, setValue] =
|
|
13757
|
-
const textareaRef =
|
|
13758
|
-
const handleSend =
|
|
13834
|
+
const [value, setValue] = React11.useState("");
|
|
13835
|
+
const textareaRef = React11.useRef(null);
|
|
13836
|
+
const handleSend = React11.useCallback(() => {
|
|
13759
13837
|
const trimmed = value.trim();
|
|
13760
13838
|
if (!trimmed || isSending) return;
|
|
13761
13839
|
setValue("");
|
|
@@ -13764,7 +13842,7 @@ function ChatInput({
|
|
|
13764
13842
|
}
|
|
13765
13843
|
onSend(trimmed);
|
|
13766
13844
|
}, [value, isSending, onSend]);
|
|
13767
|
-
const handleKeyDown =
|
|
13845
|
+
const handleKeyDown = React11.useCallback(
|
|
13768
13846
|
(e) => {
|
|
13769
13847
|
if (e.key === "Enter" && !e.shiftKey) {
|
|
13770
13848
|
e.preventDefault();
|
|
@@ -13773,7 +13851,7 @@ function ChatInput({
|
|
|
13773
13851
|
},
|
|
13774
13852
|
[handleSend]
|
|
13775
13853
|
);
|
|
13776
|
-
const handleInput =
|
|
13854
|
+
const handleInput = React11.useCallback(() => {
|
|
13777
13855
|
const el = textareaRef.current;
|
|
13778
13856
|
if (!el) return;
|
|
13779
13857
|
el.style.height = "auto";
|
|
@@ -13906,7 +13984,7 @@ function SparkleIcon({ className }) {
|
|
|
13906
13984
|
|
|
13907
13985
|
Object.defineProperty(exports, "getVariantDisplayName", {
|
|
13908
13986
|
enumerable: true,
|
|
13909
|
-
get: function () { return
|
|
13987
|
+
get: function () { return chunkJYPLT56O_js.getVariantDisplayName; }
|
|
13910
13988
|
});
|
|
13911
13989
|
exports.AccommodationCard = AccommodationCard;
|
|
13912
13990
|
exports.Ad = Ad;
|
|
@@ -13941,6 +14019,7 @@ exports.CheckoutPage = CheckoutPage;
|
|
|
13941
14019
|
exports.CimplifyAccount = CimplifyAccount;
|
|
13942
14020
|
exports.CimplifyCheckout = CimplifyCheckout;
|
|
13943
14021
|
exports.CimplifyProvider = CimplifyProvider;
|
|
14022
|
+
exports.CimplifySignInButton = CimplifySignInButton;
|
|
13944
14023
|
exports.CollectionPage = CollectionPage;
|
|
13945
14024
|
exports.CollectionTemplate = CollectionTemplate;
|
|
13946
14025
|
exports.CompactCartLayout = CompactCartLayout;
|
|
@@ -14038,6 +14117,7 @@ exports.useChat = useChat;
|
|
|
14038
14117
|
exports.useCheckout = useCheckout;
|
|
14039
14118
|
exports.useCimplify = useCimplify;
|
|
14040
14119
|
exports.useCimplifyClient = useCimplifyClient;
|
|
14120
|
+
exports.useCimplifySession = useCimplifySession;
|
|
14041
14121
|
exports.useCollection = useCollection;
|
|
14042
14122
|
exports.useCollections = useCollections;
|
|
14043
14123
|
exports.useDeals = useDeals;
|