@cimplify/sdk 0.68.0 → 0.69.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/{chunk-TAKORJP4.mjs → chunk-5UYNERYE.mjs} +1 -1
- package/dist/{chunk-SXGFJEME.js → chunk-I4MP2XZS.js} +73 -7
- package/dist/{chunk-FVGVJ4TC.mjs → chunk-O3ECKVOM.mjs} +73 -7
- package/dist/{chunk-NGQCWFKF.js → chunk-TBSDZN2W.js} +2 -2
- package/dist/{client-CfeQRwhl.d.ts → client-CO2s-kxY.d.ts} +33 -17
- package/dist/{client-DlXfZy7N.d.ts → client-DUpz-PGs.d.ts} +1 -1
- package/dist/{client-CBE7ksYC.d.mts → client-DZ-nbVnb.d.mts} +1 -1
- package/dist/{client-Dyo3dvNy.d.mts → client-K_n5ceLI.d.mts} +33 -17
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/mock/cli.mjs +73 -7
- package/dist/mock/library.js +73 -7
- package/dist/mock/library.mjs +73 -7
- package/dist/mock/msw.js +73 -7
- package/dist/mock/msw.mjs +73 -7
- package/dist/react.d.mts +156 -2
- package/dist/react.d.ts +156 -2
- package/dist/react.js +1015 -472
- package/dist/react.mjs +609 -71
- package/dist/server.d.mts +2 -2
- package/dist/server.d.ts +2 -2
- package/dist/styles.css +1 -1
- package/dist/testing/msw.js +2 -2
- package/dist/testing/msw.mjs +1 -1
- package/dist/testing/suite.d.mts +2 -2
- package/dist/testing/suite.d.ts +2 -2
- package/dist/testing/suite.js +21 -21
- package/dist/testing/suite.mjs +2 -2
- package/dist/testing.d.mts +2 -2
- package/dist/testing.d.ts +2 -2
- package/dist/testing.js +77 -77
- package/dist/testing.mjs +3 -3
- package/package.json +1 -1
package/dist/react.js
CHANGED
|
@@ -7,7 +7,7 @@ var chunkWCSAZRNC_js = require('./chunk-WCSAZRNC.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 React14 = require('react');
|
|
11
11
|
var jsxRuntime = require('react/jsx-runtime');
|
|
12
12
|
var clsx = require('clsx');
|
|
13
13
|
var tailwindMerge = require('tailwind-merge');
|
|
@@ -27,7 +27,7 @@ var input = require('@base-ui/react/input');
|
|
|
27
27
|
|
|
28
28
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
29
29
|
|
|
30
|
-
var
|
|
30
|
+
var React14__default = /*#__PURE__*/_interopDefault(React14);
|
|
31
31
|
|
|
32
32
|
// src/ads/identity.ts
|
|
33
33
|
var COOKIE_NAME = "_cimplify_uid";
|
|
@@ -204,7 +204,7 @@ function deriveAdsApiUrl() {
|
|
|
204
204
|
}
|
|
205
205
|
return "https://api.cimplify.io";
|
|
206
206
|
}
|
|
207
|
-
var AdContext =
|
|
207
|
+
var AdContext = React14.createContext({
|
|
208
208
|
siteId: null,
|
|
209
209
|
config: null,
|
|
210
210
|
isLoading: true,
|
|
@@ -212,7 +212,7 @@ var AdContext = React12.createContext({
|
|
|
212
212
|
apiBase: "https://api.cimplify.io"
|
|
213
213
|
});
|
|
214
214
|
function useAds() {
|
|
215
|
-
return
|
|
215
|
+
return React14.useContext(AdContext);
|
|
216
216
|
}
|
|
217
217
|
function AdProvider({
|
|
218
218
|
siteId,
|
|
@@ -221,10 +221,10 @@ function AdProvider({
|
|
|
221
221
|
children
|
|
222
222
|
}) {
|
|
223
223
|
const resolvedApiBase = apiBase || deriveAdsApiUrl();
|
|
224
|
-
const [config, setConfig] =
|
|
225
|
-
const [isLoading, setIsLoading] =
|
|
226
|
-
const [identity, setIdentity] =
|
|
227
|
-
|
|
224
|
+
const [config, setConfig] = React14.useState(null);
|
|
225
|
+
const [isLoading, setIsLoading] = React14.useState(true);
|
|
226
|
+
const [identity, setIdentity] = React14.useState(null);
|
|
227
|
+
React14.useEffect(() => {
|
|
228
228
|
const userIdentity = getUserIdentity(authenticatedAccountId);
|
|
229
229
|
setIdentity(userIdentity);
|
|
230
230
|
fetch(`${resolvedApiBase}/ads/config/${siteId}`).then((r) => r.json()).then((data) => {
|
|
@@ -247,11 +247,11 @@ function Ad({
|
|
|
247
247
|
onClick
|
|
248
248
|
}) {
|
|
249
249
|
const { siteId, config, isLoading, identity, apiBase } = useAds();
|
|
250
|
-
const [ad, setAd] =
|
|
251
|
-
const [error, setError] =
|
|
252
|
-
const impressionTracked =
|
|
253
|
-
const containerRef =
|
|
254
|
-
|
|
250
|
+
const [ad, setAd] = React14.useState(null);
|
|
251
|
+
const [error, setError] = React14.useState(false);
|
|
252
|
+
const impressionTracked = React14.useRef(false);
|
|
253
|
+
const containerRef = React14.useRef(null);
|
|
254
|
+
React14.useEffect(() => {
|
|
255
255
|
if (isLoading || !config?.enabled || !siteId || !identity) return;
|
|
256
256
|
const path = typeof window !== "undefined" ? window.location.pathname : "/";
|
|
257
257
|
const referrer = typeof document !== "undefined" ? document.referrer : "";
|
|
@@ -294,7 +294,7 @@ function Ad({
|
|
|
294
294
|
}
|
|
295
295
|
}).catch(() => setError(true));
|
|
296
296
|
}, [siteId, config, isLoading, slot, identity, apiBase]);
|
|
297
|
-
|
|
297
|
+
React14.useEffect(() => {
|
|
298
298
|
if (!ad || impressionTracked.current || typeof window === "undefined" || !identity) return;
|
|
299
299
|
const observer = new IntersectionObserver(
|
|
300
300
|
([entry]) => {
|
|
@@ -623,7 +623,7 @@ function applyCartPatch(base, patch) {
|
|
|
623
623
|
}
|
|
624
624
|
}
|
|
625
625
|
function useCollectionStore(collection) {
|
|
626
|
-
return
|
|
626
|
+
return React14.useSyncExternalStore(
|
|
627
627
|
(listener) => collection.subscribe(listener),
|
|
628
628
|
() => collection.getSnapshot(),
|
|
629
629
|
() => collection.getSnapshot()
|
|
@@ -993,7 +993,7 @@ function useCart(options = {}) {
|
|
|
993
993
|
const locationId = options.locationId ?? client.getLocationId();
|
|
994
994
|
const currency = options.currency ?? context?.currency ?? "USD";
|
|
995
995
|
const optimisticEnabled = context?.optimistic ?? true;
|
|
996
|
-
const entry =
|
|
996
|
+
const entry = React14.useMemo(
|
|
997
997
|
() => getOrCreateStore({
|
|
998
998
|
client,
|
|
999
999
|
locationId,
|
|
@@ -1003,44 +1003,44 @@ function useCart(options = {}) {
|
|
|
1003
1003
|
[client, currency, locationId, optimisticEnabled]
|
|
1004
1004
|
);
|
|
1005
1005
|
const view = useCollectionStore(entry.collection);
|
|
1006
|
-
|
|
1006
|
+
React14.useEffect(() => {
|
|
1007
1007
|
void ensureInitialized(entry);
|
|
1008
1008
|
}, [entry]);
|
|
1009
|
-
const addItem =
|
|
1009
|
+
const addItem = React14.useCallback(
|
|
1010
1010
|
async (product, quantity, addOptions) => {
|
|
1011
1011
|
await performAddItem(entry, product, quantity ?? 1, addOptions ?? {});
|
|
1012
1012
|
},
|
|
1013
1013
|
[entry]
|
|
1014
1014
|
);
|
|
1015
|
-
const removeItem =
|
|
1015
|
+
const removeItem = React14.useCallback(
|
|
1016
1016
|
async (itemId) => {
|
|
1017
1017
|
await performRemoveItem(entry, itemId);
|
|
1018
1018
|
},
|
|
1019
1019
|
[entry]
|
|
1020
1020
|
);
|
|
1021
|
-
const updateQuantity =
|
|
1021
|
+
const updateQuantity = React14.useCallback(
|
|
1022
1022
|
async (itemId, quantity) => {
|
|
1023
1023
|
await performUpdateQuantity(entry, itemId, quantity);
|
|
1024
1024
|
},
|
|
1025
1025
|
[entry]
|
|
1026
1026
|
);
|
|
1027
|
-
const clearCart =
|
|
1027
|
+
const clearCart = React14.useCallback(async () => {
|
|
1028
1028
|
await performClear(entry);
|
|
1029
1029
|
}, [entry]);
|
|
1030
|
-
const sync =
|
|
1030
|
+
const sync = React14.useCallback(async () => {
|
|
1031
1031
|
await syncFromServer(entry);
|
|
1032
1032
|
}, [entry]);
|
|
1033
|
-
const reorder =
|
|
1033
|
+
const reorder = React14.useCallback(
|
|
1034
1034
|
async (orderId) => {
|
|
1035
1035
|
return performReorder(entry, orderId);
|
|
1036
1036
|
},
|
|
1037
1037
|
[entry]
|
|
1038
1038
|
);
|
|
1039
|
-
const itemCount =
|
|
1039
|
+
const itemCount = React14.useMemo(
|
|
1040
1040
|
() => view.items.reduce((sum, item) => sum + item.quantity, 0),
|
|
1041
1041
|
[view.items]
|
|
1042
1042
|
);
|
|
1043
|
-
return
|
|
1043
|
+
return React14.useMemo(
|
|
1044
1044
|
() => ({
|
|
1045
1045
|
items: view.items,
|
|
1046
1046
|
itemCount,
|
|
@@ -1143,30 +1143,30 @@ function resolveInitialLocation(locations) {
|
|
|
1143
1143
|
}
|
|
1144
1144
|
return locations[0];
|
|
1145
1145
|
}
|
|
1146
|
-
var CimplifyClientContext =
|
|
1147
|
-
var CimplifyStateContext =
|
|
1146
|
+
var CimplifyClientContext = React14.createContext(null);
|
|
1147
|
+
var CimplifyStateContext = React14.createContext(null);
|
|
1148
1148
|
function CimplifyProvider({
|
|
1149
1149
|
client,
|
|
1150
1150
|
children,
|
|
1151
1151
|
onLocationChange,
|
|
1152
1152
|
optimistic = true
|
|
1153
1153
|
}) {
|
|
1154
|
-
const resolvedClient =
|
|
1155
|
-
const onLocationChangeRef =
|
|
1156
|
-
const [business, setBusiness] =
|
|
1157
|
-
const [locations, setLocations] =
|
|
1158
|
-
const [currentLocation, setCurrentLocationState] =
|
|
1159
|
-
const [isReady, setIsReady] =
|
|
1160
|
-
|
|
1154
|
+
const resolvedClient = React14.useMemo(() => client ?? createDefaultClient(), [client]);
|
|
1155
|
+
const onLocationChangeRef = React14.useRef(onLocationChange);
|
|
1156
|
+
const [business, setBusiness] = React14.useState(null);
|
|
1157
|
+
const [locations, setLocations] = React14.useState([]);
|
|
1158
|
+
const [currentLocation, setCurrentLocationState] = React14.useState(null);
|
|
1159
|
+
const [isReady, setIsReady] = React14.useState(false);
|
|
1160
|
+
React14.useEffect(() => {
|
|
1161
1161
|
onLocationChangeRef.current = onLocationChange;
|
|
1162
1162
|
}, [onLocationChange]);
|
|
1163
1163
|
const baseCurrency = business?.default_currency || DEFAULT_CURRENCY;
|
|
1164
|
-
const [displayCurrencyOverride, setDisplayCurrencyOverride] =
|
|
1164
|
+
const [displayCurrencyOverride, setDisplayCurrencyOverride] = React14.useState(
|
|
1165
1165
|
() => getStoredDisplayCurrency()
|
|
1166
1166
|
);
|
|
1167
|
-
const [fxRate, setFxRate] =
|
|
1167
|
+
const [fxRate, setFxRate] = React14.useState(null);
|
|
1168
1168
|
const displayCurrency = displayCurrencyOverride && displayCurrencyOverride !== baseCurrency ? displayCurrencyOverride : baseCurrency;
|
|
1169
|
-
const setDisplayCurrency =
|
|
1169
|
+
const setDisplayCurrency = React14.useCallback(
|
|
1170
1170
|
(currency) => {
|
|
1171
1171
|
const normalized = currency?.trim().toUpperCase() || null;
|
|
1172
1172
|
if (normalized && !chunkXA3ZNR75_js.isSupportedCurrency(normalized)) {
|
|
@@ -1180,7 +1180,7 @@ function CimplifyProvider({
|
|
|
1180
1180
|
},
|
|
1181
1181
|
[baseCurrency]
|
|
1182
1182
|
);
|
|
1183
|
-
|
|
1183
|
+
React14.useEffect(() => {
|
|
1184
1184
|
if (displayCurrency === baseCurrency) {
|
|
1185
1185
|
setFxRate(null);
|
|
1186
1186
|
return;
|
|
@@ -1205,7 +1205,7 @@ function CimplifyProvider({
|
|
|
1205
1205
|
clearInterval(intervalId);
|
|
1206
1206
|
};
|
|
1207
1207
|
}, [resolvedClient, baseCurrency, displayCurrency]);
|
|
1208
|
-
const convertPrice =
|
|
1208
|
+
const convertPrice = React14.useCallback(
|
|
1209
1209
|
(amount) => {
|
|
1210
1210
|
const num = typeof amount === "string" ? parseFloat(amount) : amount;
|
|
1211
1211
|
if (isNaN(num)) return 0;
|
|
@@ -1214,7 +1214,7 @@ function CimplifyProvider({
|
|
|
1214
1214
|
},
|
|
1215
1215
|
[fxRate, displayCurrency, baseCurrency]
|
|
1216
1216
|
);
|
|
1217
|
-
const setCurrentLocation =
|
|
1217
|
+
const setCurrentLocation = React14.useCallback(
|
|
1218
1218
|
(location) => {
|
|
1219
1219
|
const previousLocationId = resolvedClient.getLocationId();
|
|
1220
1220
|
if (previousLocationId && previousLocationId !== location.id) {
|
|
@@ -1227,7 +1227,7 @@ function CimplifyProvider({
|
|
|
1227
1227
|
},
|
|
1228
1228
|
[resolvedClient]
|
|
1229
1229
|
);
|
|
1230
|
-
|
|
1230
|
+
React14.useEffect(() => {
|
|
1231
1231
|
let cancelled = false;
|
|
1232
1232
|
async function bootstrap() {
|
|
1233
1233
|
setIsReady(false);
|
|
@@ -1272,7 +1272,7 @@ function CimplifyProvider({
|
|
|
1272
1272
|
cancelled = true;
|
|
1273
1273
|
};
|
|
1274
1274
|
}, [resolvedClient]);
|
|
1275
|
-
const clientContextValue =
|
|
1275
|
+
const clientContextValue = React14.useMemo(
|
|
1276
1276
|
() => ({
|
|
1277
1277
|
client: resolvedClient,
|
|
1278
1278
|
business,
|
|
@@ -1292,7 +1292,7 @@ function CimplifyProvider({
|
|
|
1292
1292
|
optimistic
|
|
1293
1293
|
]
|
|
1294
1294
|
);
|
|
1295
|
-
const stateContextValue =
|
|
1295
|
+
const stateContextValue = React14.useMemo(
|
|
1296
1296
|
() => ({
|
|
1297
1297
|
currentLocation,
|
|
1298
1298
|
setCurrentLocation,
|
|
@@ -1313,20 +1313,20 @@ function CimplifyProvider({
|
|
|
1313
1313
|
return /* @__PURE__ */ jsxRuntime.jsx(CimplifyClientContext.Provider, { value: clientContextValue, children: /* @__PURE__ */ jsxRuntime.jsx(CimplifyStateContext.Provider, { value: stateContextValue, children }) });
|
|
1314
1314
|
}
|
|
1315
1315
|
function useCimplify() {
|
|
1316
|
-
const clientContext =
|
|
1317
|
-
const stateContext =
|
|
1316
|
+
const clientContext = React14.useContext(CimplifyClientContext);
|
|
1317
|
+
const stateContext = React14.useContext(CimplifyStateContext);
|
|
1318
1318
|
if (!clientContext || !stateContext) {
|
|
1319
1319
|
throw new Error("useCimplify must be used within CimplifyProvider");
|
|
1320
1320
|
}
|
|
1321
|
-
return
|
|
1321
|
+
return React14.useMemo(
|
|
1322
1322
|
() => ({ ...clientContext, ...stateContext }),
|
|
1323
1323
|
[clientContext, stateContext]
|
|
1324
1324
|
);
|
|
1325
1325
|
}
|
|
1326
1326
|
function useOptionalCimplify() {
|
|
1327
|
-
const clientContext =
|
|
1328
|
-
const stateContext =
|
|
1329
|
-
return
|
|
1327
|
+
const clientContext = React14.useContext(CimplifyClientContext);
|
|
1328
|
+
const stateContext = React14.useContext(CimplifyStateContext);
|
|
1329
|
+
return React14.useMemo(() => {
|
|
1330
1330
|
if (!clientContext || !stateContext) {
|
|
1331
1331
|
return null;
|
|
1332
1332
|
}
|
|
@@ -1334,14 +1334,14 @@ function useOptionalCimplify() {
|
|
|
1334
1334
|
}, [clientContext, stateContext]);
|
|
1335
1335
|
}
|
|
1336
1336
|
function useCimplifyClient() {
|
|
1337
|
-
const context =
|
|
1337
|
+
const context = React14.useContext(CimplifyClientContext);
|
|
1338
1338
|
if (!context) {
|
|
1339
1339
|
throw new Error("useCimplifyClient must be used within CimplifyProvider");
|
|
1340
1340
|
}
|
|
1341
1341
|
return context;
|
|
1342
1342
|
}
|
|
1343
1343
|
function useOptionalCimplifyClient() {
|
|
1344
|
-
return
|
|
1344
|
+
return React14.useContext(CimplifyClientContext);
|
|
1345
1345
|
}
|
|
1346
1346
|
function shellColors(isDark) {
|
|
1347
1347
|
return {
|
|
@@ -1392,34 +1392,34 @@ function CimplifyCheckout({
|
|
|
1392
1392
|
appearance,
|
|
1393
1393
|
className
|
|
1394
1394
|
}) {
|
|
1395
|
-
const resolvedOrderTypes =
|
|
1395
|
+
const resolvedOrderTypes = React14.useMemo(
|
|
1396
1396
|
() => orderTypes && orderTypes.length > 0 ? orderTypes : ["pickup", "delivery"],
|
|
1397
1397
|
[orderTypes]
|
|
1398
1398
|
);
|
|
1399
|
-
const resolvedDefaultOrderType =
|
|
1399
|
+
const resolvedDefaultOrderType = React14.useMemo(() => {
|
|
1400
1400
|
if (defaultOrderType && resolvedOrderTypes.includes(defaultOrderType)) {
|
|
1401
1401
|
return defaultOrderType;
|
|
1402
1402
|
}
|
|
1403
1403
|
return resolvedOrderTypes[0] || "pickup";
|
|
1404
1404
|
}, [defaultOrderType, resolvedOrderTypes]);
|
|
1405
|
-
const [orderType, setOrderType] =
|
|
1406
|
-
const [status, setStatus] =
|
|
1407
|
-
const [statusText, setStatusText] =
|
|
1408
|
-
const [isSubmitting, setIsSubmitting] =
|
|
1409
|
-
const [isInitializing, setIsInitializing] =
|
|
1410
|
-
const [errorMessage, setErrorMessage] =
|
|
1411
|
-
const [resolvedBusinessId, setResolvedBusinessId] =
|
|
1412
|
-
const [resolvedCartId, setResolvedCartId] =
|
|
1413
|
-
const [resolvedCart, setResolvedCart] =
|
|
1414
|
-
const checkoutMountRef =
|
|
1415
|
-
const elementsRef =
|
|
1416
|
-
const activeCheckoutRef =
|
|
1417
|
-
const initialAppearanceRef =
|
|
1418
|
-
const hasWarnedInlineAppearanceRef =
|
|
1419
|
-
const isMountedRef =
|
|
1405
|
+
const [orderType, setOrderType] = React14.useState(resolvedDefaultOrderType);
|
|
1406
|
+
const [status, setStatus] = React14.useState(null);
|
|
1407
|
+
const [statusText, setStatusText] = React14.useState("");
|
|
1408
|
+
const [isSubmitting, setIsSubmitting] = React14.useState(false);
|
|
1409
|
+
const [isInitializing, setIsInitializing] = React14.useState(false);
|
|
1410
|
+
const [errorMessage, setErrorMessage] = React14.useState(null);
|
|
1411
|
+
const [resolvedBusinessId, setResolvedBusinessId] = React14.useState(businessId ?? null);
|
|
1412
|
+
const [resolvedCartId, setResolvedCartId] = React14.useState(cartId ?? null);
|
|
1413
|
+
const [resolvedCart, setResolvedCart] = React14.useState(null);
|
|
1414
|
+
const checkoutMountRef = React14.useRef(null);
|
|
1415
|
+
const elementsRef = React14.useRef(null);
|
|
1416
|
+
const activeCheckoutRef = React14.useRef(null);
|
|
1417
|
+
const initialAppearanceRef = React14.useRef(appearance);
|
|
1418
|
+
const hasWarnedInlineAppearanceRef = React14.useRef(false);
|
|
1419
|
+
const isMountedRef = React14.useRef(true);
|
|
1420
1420
|
const isTestMode = client.isTestMode();
|
|
1421
1421
|
const cimplifyCtx = useOptionalCimplify();
|
|
1422
|
-
const fxOptions =
|
|
1422
|
+
const fxOptions = React14.useMemo(() => {
|
|
1423
1423
|
if (!cimplifyCtx?.fxRate) return void 0;
|
|
1424
1424
|
if (cimplifyCtx.displayCurrency === cimplifyCtx.baseCurrency) return void 0;
|
|
1425
1425
|
return {
|
|
@@ -1427,29 +1427,29 @@ function CimplifyCheckout({
|
|
|
1427
1427
|
convertPrice: cimplifyCtx.convertPrice
|
|
1428
1428
|
};
|
|
1429
1429
|
}, [cimplifyCtx?.fxRate, cimplifyCtx?.displayCurrency, cimplifyCtx?.baseCurrency, cimplifyCtx?.convertPrice]);
|
|
1430
|
-
const fxOptionsRef =
|
|
1430
|
+
const fxOptionsRef = React14.useRef(fxOptions);
|
|
1431
1431
|
fxOptionsRef.current = fxOptions;
|
|
1432
|
-
const resolvedCartRef =
|
|
1432
|
+
const resolvedCartRef = React14.useRef(resolvedCart);
|
|
1433
1433
|
resolvedCartRef.current = resolvedCart;
|
|
1434
1434
|
const isDark = appearance?.theme === "dark";
|
|
1435
|
-
const emitStatus =
|
|
1435
|
+
const emitStatus = React14__default.default.useEffectEvent(
|
|
1436
1436
|
(nextStatus, context = {}) => {
|
|
1437
1437
|
setStatus(nextStatus);
|
|
1438
1438
|
setStatusText(context.display_text || "");
|
|
1439
1439
|
onStatusChange?.(nextStatus, context);
|
|
1440
1440
|
}
|
|
1441
1441
|
);
|
|
1442
|
-
const fireError =
|
|
1442
|
+
const fireError = React14__default.default.useEffectEvent(
|
|
1443
1443
|
(error) => {
|
|
1444
1444
|
onError?.(error);
|
|
1445
1445
|
}
|
|
1446
1446
|
);
|
|
1447
|
-
|
|
1447
|
+
React14.useEffect(() => {
|
|
1448
1448
|
if (!resolvedOrderTypes.includes(orderType)) {
|
|
1449
1449
|
setOrderType(resolvedDefaultOrderType);
|
|
1450
1450
|
}
|
|
1451
1451
|
}, [resolvedOrderTypes, resolvedDefaultOrderType, orderType]);
|
|
1452
|
-
|
|
1452
|
+
React14.useEffect(() => {
|
|
1453
1453
|
if (appearance && appearance !== initialAppearanceRef.current && !hasWarnedInlineAppearanceRef.current) {
|
|
1454
1454
|
hasWarnedInlineAppearanceRef.current = true;
|
|
1455
1455
|
console.warn(
|
|
@@ -1457,7 +1457,7 @@ function CimplifyCheckout({
|
|
|
1457
1457
|
);
|
|
1458
1458
|
}
|
|
1459
1459
|
}, [appearance]);
|
|
1460
|
-
|
|
1460
|
+
React14.useEffect(() => {
|
|
1461
1461
|
let cancelled = false;
|
|
1462
1462
|
async function bootstrap() {
|
|
1463
1463
|
const needsBusinessResolve = !businessId;
|
|
@@ -1528,14 +1528,14 @@ function CimplifyCheckout({
|
|
|
1528
1528
|
cancelled = true;
|
|
1529
1529
|
};
|
|
1530
1530
|
}, [businessId, cartId, client]);
|
|
1531
|
-
|
|
1531
|
+
React14.useEffect(() => {
|
|
1532
1532
|
return () => {
|
|
1533
1533
|
isMountedRef.current = false;
|
|
1534
1534
|
activeCheckoutRef.current?.abort();
|
|
1535
1535
|
activeCheckoutRef.current = null;
|
|
1536
1536
|
};
|
|
1537
1537
|
}, []);
|
|
1538
|
-
const handleSubmit =
|
|
1538
|
+
const handleSubmit = React14__default.default.useEffectEvent(async () => {
|
|
1539
1539
|
if (isSubmitting || isInitializing || !resolvedCartId) {
|
|
1540
1540
|
if (!resolvedCartId && !isInitializing) {
|
|
1541
1541
|
const message = "Your cart is empty. Add items before checkout.";
|
|
@@ -1580,7 +1580,7 @@ function CimplifyCheckout({
|
|
|
1580
1580
|
}
|
|
1581
1581
|
}
|
|
1582
1582
|
});
|
|
1583
|
-
|
|
1583
|
+
React14.useEffect(() => {
|
|
1584
1584
|
if (!resolvedBusinessId) {
|
|
1585
1585
|
elementsRef.current = null;
|
|
1586
1586
|
return;
|
|
@@ -1626,7 +1626,7 @@ function CimplifyCheckout({
|
|
|
1626
1626
|
resolvedDefaultOrderType,
|
|
1627
1627
|
submitLabel
|
|
1628
1628
|
]);
|
|
1629
|
-
|
|
1629
|
+
React14.useEffect(() => {
|
|
1630
1630
|
if (!resolvedCart || !elementsRef.current) return;
|
|
1631
1631
|
const checkoutElement = elementsRef.current.getElement("checkout");
|
|
1632
1632
|
if (checkoutElement) {
|
|
@@ -1673,7 +1673,7 @@ var BUTTON_SIZES = {
|
|
|
1673
1673
|
sm: "px-[13px] py-[7px] text-[12.5px]",
|
|
1674
1674
|
md: "px-[18px] py-[10px] text-[13.5px]"
|
|
1675
1675
|
};
|
|
1676
|
-
var Button =
|
|
1676
|
+
var Button = React14__default.default.forwardRef(function Button2({ variant = "primary", size = "md", className, children, ...props }, ref) {
|
|
1677
1677
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1678
1678
|
"button",
|
|
1679
1679
|
{
|
|
@@ -2454,6 +2454,560 @@ function ContextCard({ rows, className }) {
|
|
|
2454
2454
|
}
|
|
2455
2455
|
);
|
|
2456
2456
|
}
|
|
2457
|
+
function RiderAvatar({ rider, size }) {
|
|
2458
|
+
if (rider.photoUrl) {
|
|
2459
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2460
|
+
"img",
|
|
2461
|
+
{
|
|
2462
|
+
src: rider.photoUrl,
|
|
2463
|
+
alt: "",
|
|
2464
|
+
className: "rounded-full object-cover",
|
|
2465
|
+
style: { width: size, height: size }
|
|
2466
|
+
}
|
|
2467
|
+
);
|
|
2468
|
+
}
|
|
2469
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2470
|
+
"span",
|
|
2471
|
+
{
|
|
2472
|
+
"aria-hidden": true,
|
|
2473
|
+
className: "grid place-items-center rounded-full font-serif font-semibold text-white",
|
|
2474
|
+
style: { width: size, height: size, fontSize: size * 0.38, background: avatarGradient(rider.name) },
|
|
2475
|
+
children: initials(rider.name)
|
|
2476
|
+
}
|
|
2477
|
+
);
|
|
2478
|
+
}
|
|
2479
|
+
function RiderMeta({ rider }) {
|
|
2480
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2481
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
|
|
2482
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-sm font-semibold text-foreground", children: rider.name }),
|
|
2483
|
+
rider.rating !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-xs font-semibold text-amber-500", children: [
|
|
2484
|
+
"\u2605 ",
|
|
2485
|
+
rider.rating.toFixed(1)
|
|
2486
|
+
] })
|
|
2487
|
+
] }),
|
|
2488
|
+
rider.vehicle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "truncate text-xs text-foreground/55", children: rider.vehicle })
|
|
2489
|
+
] });
|
|
2490
|
+
}
|
|
2491
|
+
function DotStep({ steps }) {
|
|
2492
|
+
const current = steps.find((s) => s.state === "current") ?? [...steps].reverse().find((s) => s.state === "done");
|
|
2493
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3.5", children: [
|
|
2494
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1.5", children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsxs(React14__default.default.Fragment, { children: [
|
|
2495
|
+
i > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2496
|
+
"span",
|
|
2497
|
+
{
|
|
2498
|
+
className: cn(
|
|
2499
|
+
"h-0.5 flex-1 rounded-full",
|
|
2500
|
+
steps[i - 1].state === "done" ? "bg-primary" : "bg-border"
|
|
2501
|
+
)
|
|
2502
|
+
}
|
|
2503
|
+
),
|
|
2504
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2505
|
+
"span",
|
|
2506
|
+
{
|
|
2507
|
+
className: cn(
|
|
2508
|
+
"block size-[7px] shrink-0 rounded-full",
|
|
2509
|
+
step.state === "done" && "bg-primary",
|
|
2510
|
+
step.state === "current" && "bg-primary ring-4 ring-primary/15",
|
|
2511
|
+
step.state === "pending" && "bg-border"
|
|
2512
|
+
)
|
|
2513
|
+
}
|
|
2514
|
+
)
|
|
2515
|
+
] }, step.label)) }),
|
|
2516
|
+
current && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 truncate text-center text-[11.5px] font-semibold text-primary", children: current.label })
|
|
2517
|
+
] });
|
|
2518
|
+
}
|
|
2519
|
+
function DeliveryTracker({
|
|
2520
|
+
steps,
|
|
2521
|
+
statusLabel,
|
|
2522
|
+
etaLabel,
|
|
2523
|
+
rider,
|
|
2524
|
+
live,
|
|
2525
|
+
onTrackLive,
|
|
2526
|
+
onContactRider,
|
|
2527
|
+
variant = "card",
|
|
2528
|
+
className
|
|
2529
|
+
}) {
|
|
2530
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2531
|
+
"div",
|
|
2532
|
+
{
|
|
2533
|
+
"data-cimplify-delivery-tracker": true,
|
|
2534
|
+
"data-mode": live ? "live" : "steps",
|
|
2535
|
+
className: cn(
|
|
2536
|
+
"overflow-hidden",
|
|
2537
|
+
variant === "card" && "rounded-[var(--radius,12px)] border border-border/60 bg-card",
|
|
2538
|
+
className
|
|
2539
|
+
),
|
|
2540
|
+
children: live ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2541
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-[216px] w-full overflow-hidden bg-muted", children: [
|
|
2542
|
+
live.map,
|
|
2543
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute left-3 top-3 inline-flex items-center gap-1.5 rounded-full border border-border/40 bg-background/90 px-2.5 py-1 text-xs font-semibold shadow-sm backdrop-blur", children: [
|
|
2544
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "relative size-[7px] rounded-full bg-emerald-500", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute inset-0 animate-ping rounded-full bg-emerald-500" }) }),
|
|
2545
|
+
"Live"
|
|
2546
|
+
] }),
|
|
2547
|
+
(live.etaLabel ?? etaLabel) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute right-3 top-3 rounded-full bg-foreground px-3 py-1.5 text-xs font-semibold text-background shadow-lg", children: live.etaLabel ?? etaLabel })
|
|
2548
|
+
] }),
|
|
2549
|
+
rider && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-[2] -mt-6 mx-3.5 mb-3.5 rounded-2xl border border-border/60 bg-card p-3.5 shadow-[0_10px_30px_-16px_rgba(16,24,40,0.32)]", children: [
|
|
2550
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
|
|
2551
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative shrink-0", children: [
|
|
2552
|
+
/* @__PURE__ */ jsxRuntime.jsx(RiderAvatar, { rider, size: 46 }),
|
|
2553
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute -bottom-px -right-px size-3 rounded-full border-[2.5px] border-card bg-emerald-500" })
|
|
2554
|
+
] }),
|
|
2555
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(RiderMeta, { rider }) }),
|
|
2556
|
+
(rider.etaLabel || rider.distanceLabel) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-right", children: [
|
|
2557
|
+
rider.etaLabel && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[15px] font-semibold tabular-nums text-foreground", children: rider.etaLabel }),
|
|
2558
|
+
rider.distanceLabel && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11.5px] text-foreground/55", children: rider.distanceLabel })
|
|
2559
|
+
] })
|
|
2560
|
+
] }),
|
|
2561
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-3 flex gap-2", children: [
|
|
2562
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2563
|
+
"button",
|
|
2564
|
+
{
|
|
2565
|
+
type: "button",
|
|
2566
|
+
onClick: onTrackLive,
|
|
2567
|
+
className: "h-10 flex-1 rounded-xl bg-primary text-sm font-semibold text-[var(--color-primary-foreground,#fff)] hover:brightness-105",
|
|
2568
|
+
children: "Track live"
|
|
2569
|
+
}
|
|
2570
|
+
),
|
|
2571
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2572
|
+
"button",
|
|
2573
|
+
{
|
|
2574
|
+
type: "button",
|
|
2575
|
+
onClick: onContactRider,
|
|
2576
|
+
"aria-label": `Contact ${rider.name}`,
|
|
2577
|
+
className: "grid size-10 place-items-center rounded-xl border border-border bg-card text-foreground hover:bg-muted/50",
|
|
2578
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3 19.5 19.5 0 0 1-6-6 19.8 19.8 0 0 1-3-8.6A2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1 1 .4 1.9.7 2.8a2 2 0 0 1-.5 2.1L8.1 9.9a16 16 0 0 0 6 6l1.3-1.2a2 2 0 0 1 2.1-.5c.9.3 1.8.6 2.8.7a2 2 0 0 1 1.7 2Z" }) })
|
|
2579
|
+
}
|
|
2580
|
+
)
|
|
2581
|
+
] }),
|
|
2582
|
+
/* @__PURE__ */ jsxRuntime.jsx(DotStep, { steps })
|
|
2583
|
+
] })
|
|
2584
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: variant === "card" ? "p-4 sm:p-5" : "", children: [
|
|
2585
|
+
(statusLabel || etaLabel) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4 flex items-center justify-between", children: [
|
|
2586
|
+
statusLabel && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 rounded-full bg-amber-500/10 px-2.5 py-1 text-xs font-semibold text-amber-600", children: [
|
|
2587
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-1.5 rounded-full bg-current" }),
|
|
2588
|
+
statusLabel
|
|
2589
|
+
] }),
|
|
2590
|
+
etaLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-semibold tabular-nums text-foreground", children: etaLabel })
|
|
2591
|
+
] }),
|
|
2592
|
+
/* @__PURE__ */ jsxRuntime.jsx("ol", { className: "relative ml-[9px] border-l-2 border-border", children: steps.map((step) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "relative pb-4 pl-6 last:pb-0", children: [
|
|
2593
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2594
|
+
"span",
|
|
2595
|
+
{
|
|
2596
|
+
className: cn(
|
|
2597
|
+
"absolute -left-[9px] top-px grid size-[18px] place-items-center rounded-full border-2 bg-card",
|
|
2598
|
+
step.state === "done" && "border-primary bg-primary",
|
|
2599
|
+
step.state === "current" && "border-primary ring-4 ring-primary/15",
|
|
2600
|
+
step.state === "pending" && "border-border"
|
|
2601
|
+
),
|
|
2602
|
+
children: [
|
|
2603
|
+
step.state === "done" && /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "10", height: "10", viewBox: "0 0 24 24", fill: "none", stroke: "#fff", strokeWidth: "3.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" }) }),
|
|
2604
|
+
step.state === "current" && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-[7px] rounded-full bg-primary" })
|
|
2605
|
+
]
|
|
2606
|
+
}
|
|
2607
|
+
),
|
|
2608
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2609
|
+
"div",
|
|
2610
|
+
{
|
|
2611
|
+
className: cn(
|
|
2612
|
+
"text-[13px] font-semibold",
|
|
2613
|
+
step.state === "pending" ? "text-foreground/45" : "text-foreground"
|
|
2614
|
+
),
|
|
2615
|
+
children: step.label
|
|
2616
|
+
}
|
|
2617
|
+
),
|
|
2618
|
+
step.time && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-foreground/55", children: step.time })
|
|
2619
|
+
] }, step.label)) }),
|
|
2620
|
+
rider && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex items-center gap-3 border-t border-border/60 pt-4", children: [
|
|
2621
|
+
/* @__PURE__ */ jsxRuntime.jsx(RiderAvatar, { rider, size: 42 }),
|
|
2622
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(RiderMeta, { rider }) }),
|
|
2623
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2624
|
+
"button",
|
|
2625
|
+
{
|
|
2626
|
+
type: "button",
|
|
2627
|
+
onClick: onContactRider,
|
|
2628
|
+
className: "h-9 rounded-[10px] border border-border bg-card px-4 text-[13px] font-semibold text-foreground hover:bg-muted/50",
|
|
2629
|
+
children: "Contact"
|
|
2630
|
+
}
|
|
2631
|
+
)
|
|
2632
|
+
] })
|
|
2633
|
+
] })
|
|
2634
|
+
}
|
|
2635
|
+
);
|
|
2636
|
+
}
|
|
2637
|
+
var STATE_TONE = {
|
|
2638
|
+
preparing: "text-amber-600",
|
|
2639
|
+
ready: "text-emerald-600",
|
|
2640
|
+
delivered: "text-emerald-600",
|
|
2641
|
+
booked: "text-primary",
|
|
2642
|
+
cancelled: "text-destructive",
|
|
2643
|
+
default: "text-foreground/55"
|
|
2644
|
+
};
|
|
2645
|
+
function StateDot({ label, tone = "default" }) {
|
|
2646
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: cn("inline-flex items-center gap-1.5 text-xs font-medium", STATE_TONE[tone]), children: [
|
|
2647
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-1.5 rounded-full bg-current" }),
|
|
2648
|
+
label
|
|
2649
|
+
] });
|
|
2650
|
+
}
|
|
2651
|
+
var TYPE_GLYPH = {
|
|
2652
|
+
product: null,
|
|
2653
|
+
bundle: null,
|
|
2654
|
+
composite: null,
|
|
2655
|
+
service: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "19", height: "19", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", children: [
|
|
2656
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "17", rx: "2" }),
|
|
2657
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 9h18M8 2v4M16 2v4" })
|
|
2658
|
+
] }),
|
|
2659
|
+
digital: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "19", height: "19", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.6", children: [
|
|
2660
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 4h11l5 5v11a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1Z" }),
|
|
2661
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14 4v5h5" })
|
|
2662
|
+
] })
|
|
2663
|
+
};
|
|
2664
|
+
function Thumb({ item }) {
|
|
2665
|
+
const glyph = item.lineType ? TYPE_GLYPH[item.lineType] : null;
|
|
2666
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-px size-[46px] shrink-0 overflow-hidden rounded-[10px] bg-muted/50", children: item.imageUrl ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: item.imageUrl, alt: "", className: "size-full object-cover" }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid size-full place-items-center text-foreground/35", children: glyph }) });
|
|
2667
|
+
}
|
|
2668
|
+
function AccountLineItem({ item, className }) {
|
|
2669
|
+
const [open, setOpen] = React14.useState(false);
|
|
2670
|
+
const subtitle = item.subtitle ?? ([item.variant, item.addOns?.length ? `+ ${item.addOns.map((a) => a.name).join(", ")}` : null].filter(Boolean).join(" \xB7 ") || void 0);
|
|
2671
|
+
const hasDetail = !!item.customerInputs?.length || !!item.includes?.length || !!item.customisations?.length;
|
|
2672
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-line-item": true, "data-type": item.lineType, className: cn("py-[15px]", className), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-[46px_minmax(0,1fr)_auto] items-start gap-x-[13px]", children: [
|
|
2673
|
+
/* @__PURE__ */ jsxRuntime.jsx(Thumb, { item }),
|
|
2674
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
|
|
2675
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold leading-tight tracking-[-0.01em] text-foreground", children: item.name }),
|
|
2676
|
+
subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[12.5px] text-foreground/55", children: subtitle }),
|
|
2677
|
+
item.scheduling && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-0.5 text-[12.5px] text-foreground/55", children: [
|
|
2678
|
+
item.scheduling.whenLabel,
|
|
2679
|
+
item.scheduling.staffName && ` \xB7 with ${item.scheduling.staffName}`
|
|
2680
|
+
] }),
|
|
2681
|
+
(item.stateLabel || item.scheduling?.confirmationCode || hasDetail || item.digital) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-x-3 gap-y-1.5", children: [
|
|
2682
|
+
item.stateLabel && /* @__PURE__ */ jsxRuntime.jsx(StateDot, { label: item.stateLabel, tone: item.stateTone }),
|
|
2683
|
+
item.scheduling?.confirmationCode && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-foreground/45", children: [
|
|
2684
|
+
"#",
|
|
2685
|
+
item.scheduling.confirmationCode
|
|
2686
|
+
] }),
|
|
2687
|
+
item.digital && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2688
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2689
|
+
StateDot,
|
|
2690
|
+
{
|
|
2691
|
+
label: item.digital.statusLabel,
|
|
2692
|
+
tone: item.digital.tone === "revoked" ? "cancelled" : "ready"
|
|
2693
|
+
}
|
|
2694
|
+
),
|
|
2695
|
+
item.digital.usageSummary && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[11.5px] text-foreground/55", children: item.digital.usageSummary }),
|
|
2696
|
+
item.digital.onDownload && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2697
|
+
"button",
|
|
2698
|
+
{
|
|
2699
|
+
type: "button",
|
|
2700
|
+
onClick: item.digital.onDownload,
|
|
2701
|
+
className: "inline-flex items-center gap-1.5 text-xs font-semibold text-primary hover:underline",
|
|
2702
|
+
children: [
|
|
2703
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 3v12m0 0 4-4m-4 4-4-4M5 21h14" }) }),
|
|
2704
|
+
"Download"
|
|
2705
|
+
]
|
|
2706
|
+
}
|
|
2707
|
+
)
|
|
2708
|
+
] }),
|
|
2709
|
+
hasDetail && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2710
|
+
"button",
|
|
2711
|
+
{
|
|
2712
|
+
type: "button",
|
|
2713
|
+
onClick: () => setOpen((v) => !v),
|
|
2714
|
+
"aria-expanded": open,
|
|
2715
|
+
className: "inline-flex items-center gap-1.5 text-[12.5px] font-semibold text-foreground/55 hover:text-foreground",
|
|
2716
|
+
children: [
|
|
2717
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2718
|
+
"svg",
|
|
2719
|
+
{
|
|
2720
|
+
width: "13",
|
|
2721
|
+
height: "13",
|
|
2722
|
+
viewBox: "0 0 24 24",
|
|
2723
|
+
fill: "none",
|
|
2724
|
+
stroke: "currentColor",
|
|
2725
|
+
strokeWidth: "2",
|
|
2726
|
+
className: cn("transition-transform", open && "rotate-90"),
|
|
2727
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m9 18 6-6-6-6" })
|
|
2728
|
+
}
|
|
2729
|
+
),
|
|
2730
|
+
item.customisations?.length || item.customerInputs?.length ? "Customisations & details" : "What's included"
|
|
2731
|
+
]
|
|
2732
|
+
}
|
|
2733
|
+
)
|
|
2734
|
+
] }),
|
|
2735
|
+
open && hasDetail && /* @__PURE__ */ jsxRuntime.jsx(LineItemDetails, { item, className: "ml-[1px] mt-2.5" })
|
|
2736
|
+
] }),
|
|
2737
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-semibold tabular-nums text-foreground", children: item.priceLabel })
|
|
2738
|
+
] }) });
|
|
2739
|
+
}
|
|
2740
|
+
function ChildRow({ sel }) {
|
|
2741
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-2 py-1.5 [&:not(:first-child)]:border-t [&:not(:first-child)]:border-border/50", children: [
|
|
2742
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-[11px] font-semibold tabular-nums text-foreground/55", children: [
|
|
2743
|
+
sel.quantity ?? 1,
|
|
2744
|
+
"\xD7"
|
|
2745
|
+
] }),
|
|
2746
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
|
|
2747
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[12.5px] font-medium text-foreground", children: sel.name }),
|
|
2748
|
+
sel.variantName && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[11px] text-foreground/55", children: sel.variantName })
|
|
2749
|
+
] }),
|
|
2750
|
+
sel.priceLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "shrink-0 text-[11.5px] tabular-nums text-foreground/55", children: sel.priceLabel })
|
|
2751
|
+
] });
|
|
2752
|
+
}
|
|
2753
|
+
function LineItemDetails({
|
|
2754
|
+
item,
|
|
2755
|
+
className
|
|
2756
|
+
}) {
|
|
2757
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-3", className), children: [
|
|
2758
|
+
item.includes && item.includes.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2759
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-foreground/45", children: "Bundle includes" }),
|
|
2760
|
+
item.includes.map((sel, i) => /* @__PURE__ */ jsxRuntime.jsx(ChildRow, { sel }, i))
|
|
2761
|
+
] }),
|
|
2762
|
+
item.customisations && item.customisations.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2763
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-foreground/45", children: "Customisations" }),
|
|
2764
|
+
item.customisations.map((sel, i) => /* @__PURE__ */ jsxRuntime.jsx(ChildRow, { sel }, i))
|
|
2765
|
+
] }),
|
|
2766
|
+
item.customerInputs && item.customerInputs.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-[84px_minmax(0,1fr)] items-start gap-x-2.5 gap-y-1 text-xs sm:grid-cols-[104px_minmax(0,1fr)]", children: item.customerInputs.map((input) => /* @__PURE__ */ jsxRuntime.jsxs(React14__default.default.Fragment, { children: [
|
|
2767
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "capitalize text-foreground/55", children: input.fieldName }),
|
|
2768
|
+
/* @__PURE__ */ jsxRuntime.jsx(CustomerInputValue, { input })
|
|
2769
|
+
] }, input.fieldId)) })
|
|
2770
|
+
] });
|
|
2771
|
+
}
|
|
2772
|
+
function asObject(v) {
|
|
2773
|
+
return v && typeof v === "object" && !Array.isArray(v) ? v : null;
|
|
2774
|
+
}
|
|
2775
|
+
function CustomerInputValue({ input }) {
|
|
2776
|
+
const v = input.value;
|
|
2777
|
+
const obj = asObject(v);
|
|
2778
|
+
if (input.semanticKind === "allergen" || input.semanticKind === "sensitivity") {
|
|
2779
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 font-medium text-amber-600", children: [
|
|
2780
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 9v4M12 17h.01M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0Z" }) }),
|
|
2781
|
+
String(v ?? "")
|
|
2782
|
+
] });
|
|
2783
|
+
}
|
|
2784
|
+
switch (input.fieldType) {
|
|
2785
|
+
case "textarea":
|
|
2786
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block whitespace-pre-wrap rounded-md bg-muted/40 px-2.5 py-1.5 leading-relaxed text-foreground/90", children: String(v ?? "") });
|
|
2787
|
+
case "number":
|
|
2788
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold tabular-nums text-foreground", children: String(v ?? "") });
|
|
2789
|
+
case "select":
|
|
2790
|
+
case "radio":
|
|
2791
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex w-fit items-center rounded-full border border-primary/20 bg-primary/[0.12] px-2 py-0.5 text-[11.5px] font-medium text-primary", children: String(v ?? "") });
|
|
2792
|
+
case "multi_select":
|
|
2793
|
+
case "checkbox": {
|
|
2794
|
+
if (typeof v === "boolean") return /* @__PURE__ */ jsxRuntime.jsx(BooleanBadge, { value: v });
|
|
2795
|
+
const list = Array.isArray(v) ? v.map(String) : [String(v ?? "")];
|
|
2796
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex flex-wrap gap-1", children: list.filter(Boolean).map((label, i) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center rounded-full border border-border bg-muted/40 px-2 py-0.5 text-[11px] font-medium", children: label }, i)) });
|
|
2797
|
+
}
|
|
2798
|
+
case "color": {
|
|
2799
|
+
const hex = String(v ?? "");
|
|
2800
|
+
const label = obj?.label ? String(obj.label) : hex;
|
|
2801
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 font-medium text-foreground", children: [
|
|
2802
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block size-3.5 rounded-full border border-black/10", style: { background: hex } }),
|
|
2803
|
+
label,
|
|
2804
|
+
hex && hex !== label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[11px] text-foreground/55", children: hex })
|
|
2805
|
+
] });
|
|
2806
|
+
}
|
|
2807
|
+
case "date":
|
|
2808
|
+
case "date_time":
|
|
2809
|
+
case "time":
|
|
2810
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium tabular-nums text-foreground", children: String(v ?? "") });
|
|
2811
|
+
case "date_range": {
|
|
2812
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 font-medium tabular-nums text-foreground", children: [
|
|
2813
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: String(obj?.start ?? "") }),
|
|
2814
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground/55", children: "\u2192" }),
|
|
2815
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: String(obj?.end ?? "") })
|
|
2816
|
+
] });
|
|
2817
|
+
}
|
|
2818
|
+
case "file": {
|
|
2819
|
+
const url = String(v ?? "");
|
|
2820
|
+
const filename = url.split("/").pop() || "Attachment";
|
|
2821
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2822
|
+
"a",
|
|
2823
|
+
{
|
|
2824
|
+
href: url,
|
|
2825
|
+
target: "_blank",
|
|
2826
|
+
rel: "noopener noreferrer",
|
|
2827
|
+
className: "inline-flex w-fit max-w-full items-center gap-1.5 rounded-md border border-border bg-muted/40 px-2 py-1 text-foreground hover:border-primary hover:text-primary",
|
|
2828
|
+
children: [
|
|
2829
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M14 3v5h5M15 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8Z" }) }),
|
|
2830
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-[11.5px] font-medium", children: filename })
|
|
2831
|
+
]
|
|
2832
|
+
}
|
|
2833
|
+
);
|
|
2834
|
+
}
|
|
2835
|
+
case "image": {
|
|
2836
|
+
const url = typeof v === "string" ? v : "";
|
|
2837
|
+
if (!url) return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "italic text-foreground/55", children: "No image" });
|
|
2838
|
+
return /* @__PURE__ */ jsxRuntime.jsx("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: "block size-14 overflow-hidden rounded-md border border-border", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: url, alt: input.fieldName, className: "size-full object-cover" }) });
|
|
2839
|
+
}
|
|
2840
|
+
case "url": {
|
|
2841
|
+
const url = String(v ?? "");
|
|
2842
|
+
return /* @__PURE__ */ jsxRuntime.jsx("a", { href: url, target: "_blank", rel: "noopener noreferrer", className: "inline-flex max-w-full items-center gap-1 truncate text-primary hover:underline", children: url.replace(/^https?:\/\//, "").replace(/\/$/, "") });
|
|
2843
|
+
}
|
|
2844
|
+
case "email":
|
|
2845
|
+
return /* @__PURE__ */ jsxRuntime.jsx("a", { href: `mailto:${String(v ?? "")}`, className: "text-primary hover:underline", children: String(v ?? "") });
|
|
2846
|
+
case "phone": {
|
|
2847
|
+
const display = obj?.formatted ? String(obj.formatted) : String(v ?? "");
|
|
2848
|
+
return /* @__PURE__ */ jsxRuntime.jsx("a", { href: `tel:${display}`, className: "tabular-nums text-primary hover:underline", children: display });
|
|
2849
|
+
}
|
|
2850
|
+
case "address": {
|
|
2851
|
+
const formatted = obj?.formatted_address ? String(obj.formatted_address) : String(v ?? "");
|
|
2852
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "block whitespace-pre-line rounded-md bg-muted/40 px-2.5 py-1.5 text-[11.5px] leading-relaxed", children: formatted });
|
|
2853
|
+
}
|
|
2854
|
+
case "location": {
|
|
2855
|
+
const label = obj?.label ? String(obj.label) : null;
|
|
2856
|
+
const lat = obj?.latitude;
|
|
2857
|
+
const lng = obj?.longitude;
|
|
2858
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-1.5 font-medium text-foreground", children: [
|
|
2859
|
+
/* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", className: "text-destructive", children: [
|
|
2860
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11Z" }),
|
|
2861
|
+
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "10", r: "2.5" })
|
|
2862
|
+
] }),
|
|
2863
|
+
label ?? `${lat ?? "?"}, ${lng ?? "?"}`
|
|
2864
|
+
] });
|
|
2865
|
+
}
|
|
2866
|
+
case "signature": {
|
|
2867
|
+
const signer = obj?.signer_name ? String(obj.signer_name) : null;
|
|
2868
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex w-fit items-center gap-1 rounded-full border border-emerald-500/20 bg-emerald-500/[0.12] px-2 py-0.5 text-[11px] font-semibold text-emerald-600", children: [
|
|
2869
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" }) }),
|
|
2870
|
+
signer ? `Signed by ${signer}` : "Signed"
|
|
2871
|
+
] });
|
|
2872
|
+
}
|
|
2873
|
+
case "text":
|
|
2874
|
+
default:
|
|
2875
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "italic text-foreground/90", children: [
|
|
2876
|
+
"\u201C",
|
|
2877
|
+
String(v ?? ""),
|
|
2878
|
+
"\u201D"
|
|
2879
|
+
] });
|
|
2880
|
+
}
|
|
2881
|
+
}
|
|
2882
|
+
function BooleanBadge({ value }) {
|
|
2883
|
+
return value ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex w-fit items-center gap-1 rounded-full border border-emerald-500/20 bg-emerald-500/[0.12] px-2 py-0.5 text-[11px] font-semibold text-emerald-600", children: [
|
|
2884
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M20 6 9 17l-5-5" }) }),
|
|
2885
|
+
"Yes"
|
|
2886
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex w-fit items-center rounded-full bg-muted/40 px-2 py-0.5 text-[11px] font-medium text-foreground/55", children: "No" });
|
|
2887
|
+
}
|
|
2888
|
+
function AccountLineItems({ items, className }) {
|
|
2889
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-line-items": true, className: cn("divide-y divide-border/60", className), children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(AccountLineItem, { item }, item.id)) });
|
|
2890
|
+
}
|
|
2891
|
+
var STATUS_TONE = {
|
|
2892
|
+
progress: "bg-amber-500/10 text-amber-600",
|
|
2893
|
+
positive: "bg-emerald-500/10 text-emerald-600",
|
|
2894
|
+
muted: "bg-muted/60 text-foreground/60"
|
|
2895
|
+
};
|
|
2896
|
+
function SectionLabel({ children }) {
|
|
2897
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[10px] font-bold uppercase tracking-wider text-foreground/45", children });
|
|
2898
|
+
}
|
|
2899
|
+
function AccountOrderView({
|
|
2900
|
+
orderNumber,
|
|
2901
|
+
placedLabel,
|
|
2902
|
+
statusLabel,
|
|
2903
|
+
statusTone = "progress",
|
|
2904
|
+
items,
|
|
2905
|
+
itemsLabel = "Items",
|
|
2906
|
+
delivery,
|
|
2907
|
+
payment,
|
|
2908
|
+
shipTo,
|
|
2909
|
+
actions,
|
|
2910
|
+
onBack,
|
|
2911
|
+
backLabel = "Back to orders",
|
|
2912
|
+
className
|
|
2913
|
+
}) {
|
|
2914
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-view": true, className: cn("min-w-0", className), children: [
|
|
2915
|
+
onBack && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2916
|
+
"button",
|
|
2917
|
+
{
|
|
2918
|
+
type: "button",
|
|
2919
|
+
onClick: onBack,
|
|
2920
|
+
className: "mb-5 inline-flex items-center gap-1.5 text-[13px] font-medium text-foreground/55 hover:text-foreground",
|
|
2921
|
+
children: [
|
|
2922
|
+
/* @__PURE__ */ jsxRuntime.jsx("svg", { width: "15", height: "15", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m15 18-6-6 6-6" }) }),
|
|
2923
|
+
backLabel
|
|
2924
|
+
]
|
|
2925
|
+
}
|
|
2926
|
+
),
|
|
2927
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-5 flex items-start justify-between gap-3", children: [
|
|
2928
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
|
|
2929
|
+
/* @__PURE__ */ jsxRuntime.jsxs("h1", { className: "font-serif text-2xl font-semibold tracking-[-0.02em] tabular-nums text-foreground", children: [
|
|
2930
|
+
"Order #",
|
|
2931
|
+
orderNumber
|
|
2932
|
+
] }),
|
|
2933
|
+
placedLabel && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0.5 text-[13px] text-foreground/55", children: placedLabel })
|
|
2934
|
+
] }),
|
|
2935
|
+
statusLabel && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2936
|
+
"span",
|
|
2937
|
+
{
|
|
2938
|
+
className: cn(
|
|
2939
|
+
"shrink-0 rounded-full px-2.5 py-1 text-xs font-semibold",
|
|
2940
|
+
STATUS_TONE[statusTone]
|
|
2941
|
+
),
|
|
2942
|
+
children: statusLabel
|
|
2943
|
+
}
|
|
2944
|
+
)
|
|
2945
|
+
] }),
|
|
2946
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 gap-8 lg:grid-cols-[minmax(0,1fr)_300px] lg:gap-14", children: [
|
|
2947
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
|
|
2948
|
+
/* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
|
|
2949
|
+
/* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: itemsLabel }),
|
|
2950
|
+
/* @__PURE__ */ jsxRuntime.jsx(AccountLineItems, { items, className: "mt-2.5" })
|
|
2951
|
+
] }),
|
|
2952
|
+
delivery && /* @__PURE__ */ jsxRuntime.jsxs("section", { className: "mt-6 border-t border-border/60 pt-6", children: [
|
|
2953
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 flex items-center justify-between", children: /* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: delivery.label ?? "Delivery" }) }),
|
|
2954
|
+
delivery.note && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-[11.5px] text-foreground/55", children: delivery.note }),
|
|
2955
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2956
|
+
DeliveryTracker,
|
|
2957
|
+
{
|
|
2958
|
+
variant: "plain",
|
|
2959
|
+
steps: delivery.steps,
|
|
2960
|
+
statusLabel: delivery.statusLabel,
|
|
2961
|
+
etaLabel: delivery.etaLabel,
|
|
2962
|
+
rider: delivery.rider,
|
|
2963
|
+
live: delivery.live,
|
|
2964
|
+
onTrackLive: delivery.onTrackLive,
|
|
2965
|
+
onContactRider: delivery.onContactRider
|
|
2966
|
+
}
|
|
2967
|
+
)
|
|
2968
|
+
] })
|
|
2969
|
+
] }),
|
|
2970
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2971
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-[var(--radius,12px)] bg-muted/40 p-4", children: [
|
|
2972
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-3 flex items-center justify-between", children: [
|
|
2973
|
+
/* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: "Payment" }),
|
|
2974
|
+
payment.stateLabel && /* @__PURE__ */ jsxRuntime.jsx(
|
|
2975
|
+
"span",
|
|
2976
|
+
{
|
|
2977
|
+
className: cn(
|
|
2978
|
+
"rounded-full px-2 py-0.5 text-[11.5px] font-semibold",
|
|
2979
|
+
payment.stateTone === "warning" ? "bg-amber-500/10 text-amber-600" : payment.stateTone === "muted" ? "bg-muted/70 text-foreground/60" : "bg-emerald-500/10 text-emerald-600"
|
|
2980
|
+
),
|
|
2981
|
+
children: payment.stateLabel
|
|
2982
|
+
}
|
|
2983
|
+
)
|
|
2984
|
+
] }),
|
|
2985
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2 text-[13px]", children: [
|
|
2986
|
+
payment.rows.map((row, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between", children: [
|
|
2987
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-foreground/55", children: row.label }),
|
|
2988
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: cn("tabular-nums", row.tone === "positive" && "text-emerald-600"), children: row.value })
|
|
2989
|
+
] }, i)),
|
|
2990
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-2 h-px bg-border" }),
|
|
2991
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex justify-between text-[15px] font-semibold", children: [
|
|
2992
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: payment.total.label }),
|
|
2993
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "tabular-nums", children: payment.total.value })
|
|
2994
|
+
] })
|
|
2995
|
+
] }),
|
|
2996
|
+
payment.method && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
2997
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-3 h-px bg-border" }),
|
|
2998
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[12.5px] text-foreground", children: payment.method })
|
|
2999
|
+
] })
|
|
3000
|
+
] }),
|
|
3001
|
+
shipTo && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-7", children: [
|
|
3002
|
+
/* @__PURE__ */ jsxRuntime.jsx(SectionLabel, { children: shipTo.heading ?? "Delivering to" }),
|
|
3003
|
+
shipTo.name && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 text-[13px] font-semibold text-foreground", children: shipTo.name }),
|
|
3004
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-[12.5px] leading-relaxed text-foreground/55", children: shipTo.lines })
|
|
3005
|
+
] }),
|
|
3006
|
+
actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-7 space-y-2.5", children: actions })
|
|
3007
|
+
] })
|
|
3008
|
+
] })
|
|
3009
|
+
] });
|
|
3010
|
+
}
|
|
2457
3011
|
function SubscriptionRow({
|
|
2458
3012
|
subscription,
|
|
2459
3013
|
onSelect,
|
|
@@ -2619,7 +3173,7 @@ function CimplifySignInButton({
|
|
|
2619
3173
|
onError,
|
|
2620
3174
|
...signInOpts
|
|
2621
3175
|
}) {
|
|
2622
|
-
const [busy, setBusy] =
|
|
3176
|
+
const [busy, setBusy] = React14.useState(false);
|
|
2623
3177
|
const onClick = async () => {
|
|
2624
3178
|
if (busy || disabled) return;
|
|
2625
3179
|
setBusy(true);
|
|
@@ -3235,9 +3789,9 @@ function AccountSubscriptionDetailPage({
|
|
|
3235
3789
|
}
|
|
3236
3790
|
function useCimplifySession(options) {
|
|
3237
3791
|
const sessionUri = options?.sessionUri ?? "/auth/session";
|
|
3238
|
-
const [session, setSession] =
|
|
3239
|
-
const [loading, setLoading] =
|
|
3240
|
-
const fetchSession =
|
|
3792
|
+
const [session, setSession] = React14.useState(null);
|
|
3793
|
+
const [loading, setLoading] = React14.useState(true);
|
|
3794
|
+
const fetchSession = React14.useCallback(async () => {
|
|
3241
3795
|
setLoading(true);
|
|
3242
3796
|
try {
|
|
3243
3797
|
const res = await fetch(sessionUri, { credentials: "include" });
|
|
@@ -3253,7 +3807,7 @@ function useCimplifySession(options) {
|
|
|
3253
3807
|
setLoading(false);
|
|
3254
3808
|
}
|
|
3255
3809
|
}, [sessionUri]);
|
|
3256
|
-
|
|
3810
|
+
React14.useEffect(() => {
|
|
3257
3811
|
void fetchSession();
|
|
3258
3812
|
}, [fetchSession]);
|
|
3259
3813
|
return { session, loading, refresh: fetchSession };
|
|
@@ -3269,27 +3823,11 @@ var DEFAULT_LINKS = [
|
|
|
3269
3823
|
] })
|
|
3270
3824
|
},
|
|
3271
3825
|
{
|
|
3272
|
-
label: "
|
|
3273
|
-
href: "/account/
|
|
3274
|
-
icon: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", "aria-hidden": true, children: [
|
|
3275
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11Z" }),
|
|
3276
|
-
/* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "10", r: "2.5" })
|
|
3277
|
-
] })
|
|
3278
|
-
},
|
|
3279
|
-
{
|
|
3280
|
-
label: "Payment methods",
|
|
3281
|
-
href: "/account/payment",
|
|
3282
|
-
icon: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", "aria-hidden": true, children: [
|
|
3283
|
-
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2", y: "5", width: "20", height: "14", rx: "2" }),
|
|
3284
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 10h20" })
|
|
3285
|
-
] })
|
|
3286
|
-
},
|
|
3287
|
-
{
|
|
3288
|
-
label: "Account",
|
|
3289
|
-
href: "/account",
|
|
3826
|
+
label: "Subscriptions",
|
|
3827
|
+
href: "/account/subscriptions",
|
|
3290
3828
|
icon: /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.8", "aria-hidden": true, children: [
|
|
3291
|
-
/* @__PURE__ */ jsxRuntime.jsx("
|
|
3292
|
-
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "
|
|
3829
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2" }),
|
|
3830
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 9h18M8 2v4M16 2v4" })
|
|
3293
3831
|
] })
|
|
3294
3832
|
}
|
|
3295
3833
|
];
|
|
@@ -3328,10 +3866,10 @@ function CimplifyUserButton({
|
|
|
3328
3866
|
const hook = useCimplifySession({ sessionUri });
|
|
3329
3867
|
const session = controlled ? controlledSession : hook.session;
|
|
3330
3868
|
const loading = controlled ? false : hook.loading;
|
|
3331
|
-
const [open, setOpen] =
|
|
3332
|
-
const rootRef =
|
|
3333
|
-
const menuId =
|
|
3334
|
-
|
|
3869
|
+
const [open, setOpen] = React14.useState(false);
|
|
3870
|
+
const rootRef = React14.useRef(null);
|
|
3871
|
+
const menuId = React14.useId();
|
|
3872
|
+
React14.useEffect(() => {
|
|
3335
3873
|
if (!open) return;
|
|
3336
3874
|
const onDocClick = (e) => {
|
|
3337
3875
|
if (!rootRef.current?.contains(e.target)) setOpen(false);
|
|
@@ -3406,7 +3944,7 @@ function CimplifyUserButton({
|
|
|
3406
3944
|
id: menuId,
|
|
3407
3945
|
role: "menu",
|
|
3408
3946
|
className: cn(
|
|
3409
|
-
"absolute top-[calc(100%+8px)] z-50 w-[280px] overflow-hidden",
|
|
3947
|
+
"absolute top-[calc(100%+8px)] z-50 w-[280px] max-w-[calc(100vw-1.5rem)] overflow-hidden",
|
|
3410
3948
|
"rounded-[14px] border border-border bg-card",
|
|
3411
3949
|
"shadow-[0_1px_2px_rgba(16,24,40,0.04),0_16px_40px_-16px_rgba(16,24,40,0.24)]",
|
|
3412
3950
|
align === "end" ? "right-0" : "left-0"
|
|
@@ -3515,9 +4053,9 @@ function createCachedQuery(config) {
|
|
|
3515
4053
|
}
|
|
3516
4054
|
const enabled = options.enabled ?? true;
|
|
3517
4055
|
const locationId = client.getLocationId();
|
|
3518
|
-
const previousLocationRef =
|
|
3519
|
-
const requestIdRef =
|
|
3520
|
-
const optionsRef =
|
|
4056
|
+
const previousLocationRef = React14.useRef(locationId);
|
|
4057
|
+
const requestIdRef = React14.useRef(0);
|
|
4058
|
+
const optionsRef = React14.useRef(options);
|
|
3521
4059
|
optionsRef.current = options;
|
|
3522
4060
|
if (config.locationSensitive && previousLocationRef.current !== locationId) {
|
|
3523
4061
|
cache.clear();
|
|
@@ -3527,10 +4065,10 @@ function createCachedQuery(config) {
|
|
|
3527
4065
|
sweep();
|
|
3528
4066
|
const cacheKey2 = config.key(client, options);
|
|
3529
4067
|
const cached = cache.get(cacheKey2);
|
|
3530
|
-
const [data, setData] =
|
|
3531
|
-
const [isLoading, setIsLoading] =
|
|
3532
|
-
const [error, setError] =
|
|
3533
|
-
const load =
|
|
4068
|
+
const [data, setData] = React14.useState(cached?.data ?? null);
|
|
4069
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && !cached);
|
|
4070
|
+
const [error, setError] = React14.useState(null);
|
|
4071
|
+
const load = React14.useCallback(
|
|
3534
4072
|
async (force = false) => {
|
|
3535
4073
|
if (!enabled) {
|
|
3536
4074
|
setIsLoading(false);
|
|
@@ -3573,10 +4111,10 @@ function createCachedQuery(config) {
|
|
|
3573
4111
|
},
|
|
3574
4112
|
[cacheKey2, client, enabled]
|
|
3575
4113
|
);
|
|
3576
|
-
|
|
4114
|
+
React14.useEffect(() => {
|
|
3577
4115
|
void load(false);
|
|
3578
4116
|
}, [load]);
|
|
3579
|
-
const refetch =
|
|
4117
|
+
const refetch = React14.useCallback(async () => {
|
|
3580
4118
|
cache.delete(cacheKey2);
|
|
3581
4119
|
await load(true);
|
|
3582
4120
|
}, [cacheKey2, load]);
|
|
@@ -3706,25 +4244,25 @@ function useOrder(orderId, options = {}) {
|
|
|
3706
4244
|
if (!client) {
|
|
3707
4245
|
throw new Error("useOrder must be used within CimplifyProvider or passed { client }.");
|
|
3708
4246
|
}
|
|
3709
|
-
const normalizedOrderId =
|
|
4247
|
+
const normalizedOrderId = React14.useMemo(() => (orderId || "").trim(), [orderId]);
|
|
3710
4248
|
const enabled = options.enabled ?? true;
|
|
3711
4249
|
const poll = options.poll ?? false;
|
|
3712
4250
|
const pollInterval = options.pollInterval ?? 5e3;
|
|
3713
|
-
const requestIdRef =
|
|
3714
|
-
const previousStatusRef =
|
|
3715
|
-
const onStatusChangeRef =
|
|
4251
|
+
const requestIdRef = React14.useRef(0);
|
|
4252
|
+
const previousStatusRef = React14.useRef(null);
|
|
4253
|
+
const onStatusChangeRef = React14.useRef(options.onStatusChange);
|
|
3716
4254
|
onStatusChangeRef.current = options.onStatusChange;
|
|
3717
|
-
const cacheKey2 =
|
|
4255
|
+
const cacheKey2 = React14.useMemo(
|
|
3718
4256
|
() => buildOrderCacheKey(client, normalizedOrderId),
|
|
3719
4257
|
[client, normalizedOrderId]
|
|
3720
4258
|
);
|
|
3721
4259
|
const cached = orderCache.get(cacheKey2);
|
|
3722
|
-
const [order, setOrder] =
|
|
3723
|
-
const [isLoading, setIsLoading] =
|
|
4260
|
+
const [order, setOrder] = React14.useState(cached?.order ?? null);
|
|
4261
|
+
const [isLoading, setIsLoading] = React14.useState(
|
|
3724
4262
|
enabled && normalizedOrderId.length > 0 && !cached
|
|
3725
4263
|
);
|
|
3726
|
-
const [error, setError] =
|
|
3727
|
-
const load =
|
|
4264
|
+
const [error, setError] = React14.useState(null);
|
|
4265
|
+
const load = React14.useCallback(
|
|
3728
4266
|
async (force = false) => {
|
|
3729
4267
|
if (!enabled || normalizedOrderId.length === 0) {
|
|
3730
4268
|
setOrder(null);
|
|
@@ -3783,11 +4321,11 @@ function useOrder(orderId, options = {}) {
|
|
|
3783
4321
|
},
|
|
3784
4322
|
[cacheKey2, client, enabled, normalizedOrderId]
|
|
3785
4323
|
);
|
|
3786
|
-
|
|
4324
|
+
React14.useEffect(() => {
|
|
3787
4325
|
void load(false);
|
|
3788
4326
|
}, [load]);
|
|
3789
4327
|
const isTerminal = order ? TERMINAL_STATUSES.has(order.status) : false;
|
|
3790
|
-
|
|
4328
|
+
React14.useEffect(() => {
|
|
3791
4329
|
if (!poll || !enabled || normalizedOrderId.length === 0 || isTerminal) {
|
|
3792
4330
|
return;
|
|
3793
4331
|
}
|
|
@@ -3798,7 +4336,7 @@ function useOrder(orderId, options = {}) {
|
|
|
3798
4336
|
window.clearInterval(timer);
|
|
3799
4337
|
};
|
|
3800
4338
|
}, [enabled, isTerminal, load, normalizedOrderId, poll, pollInterval]);
|
|
3801
|
-
const refetch =
|
|
4339
|
+
const refetch = React14.useCallback(async () => {
|
|
3802
4340
|
orderCache.delete(cacheKey2);
|
|
3803
4341
|
await load(true);
|
|
3804
4342
|
}, [cacheKey2, load]);
|
|
@@ -3849,10 +4387,10 @@ function useLocations(options = {}) {
|
|
|
3849
4387
|
};
|
|
3850
4388
|
}
|
|
3851
4389
|
const client = options.client;
|
|
3852
|
-
const [locations, setLocations] =
|
|
3853
|
-
const [currentLocation, setCurrentLocationState] =
|
|
3854
|
-
const [isLoading, setIsLoading] =
|
|
3855
|
-
const setCurrentLocation =
|
|
4390
|
+
const [locations, setLocations] = React14.useState([]);
|
|
4391
|
+
const [currentLocation, setCurrentLocationState] = React14.useState(null);
|
|
4392
|
+
const [isLoading, setIsLoading] = React14.useState(true);
|
|
4393
|
+
const setCurrentLocation = React14.useCallback(
|
|
3856
4394
|
(location) => {
|
|
3857
4395
|
setCurrentLocationState(location);
|
|
3858
4396
|
if (client) {
|
|
@@ -3862,7 +4400,7 @@ function useLocations(options = {}) {
|
|
|
3862
4400
|
},
|
|
3863
4401
|
[client]
|
|
3864
4402
|
);
|
|
3865
|
-
|
|
4403
|
+
React14.useEffect(() => {
|
|
3866
4404
|
if (!client) {
|
|
3867
4405
|
setLocations([]);
|
|
3868
4406
|
setCurrentLocationState(null);
|
|
@@ -3966,14 +4504,14 @@ function useSearch(options = {}) {
|
|
|
3966
4504
|
const minLength = Math.max(0, options.minLength ?? 2);
|
|
3967
4505
|
const debounceMs = Math.max(0, options.debounceMs ?? 300);
|
|
3968
4506
|
const limit = Math.max(1, options.limit ?? 20);
|
|
3969
|
-
const [query, setQueryState] =
|
|
3970
|
-
const [results, setResults] =
|
|
3971
|
-
const [isLoading, setIsLoading] =
|
|
3972
|
-
const [error, setError] =
|
|
3973
|
-
const requestIdRef =
|
|
3974
|
-
const timerRef =
|
|
4507
|
+
const [query, setQueryState] = React14.useState("");
|
|
4508
|
+
const [results, setResults] = React14.useState([]);
|
|
4509
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
4510
|
+
const [error, setError] = React14.useState(null);
|
|
4511
|
+
const requestIdRef = React14.useRef(0);
|
|
4512
|
+
const timerRef = React14.useRef(null);
|
|
3975
4513
|
const tagsSignature = options.tags?.join(",") ?? "";
|
|
3976
|
-
|
|
4514
|
+
React14.useEffect(() => {
|
|
3977
4515
|
if (timerRef.current) {
|
|
3978
4516
|
clearTimeout(timerRef.current);
|
|
3979
4517
|
timerRef.current = null;
|
|
@@ -4028,10 +4566,10 @@ function useSearch(options = {}) {
|
|
|
4028
4566
|
}
|
|
4029
4567
|
};
|
|
4030
4568
|
}, [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]);
|
|
4031
|
-
const setQuery =
|
|
4569
|
+
const setQuery = React14.useCallback((nextQuery) => {
|
|
4032
4570
|
setQueryState(nextQuery);
|
|
4033
4571
|
}, []);
|
|
4034
|
-
const clear =
|
|
4572
|
+
const clear = React14.useCallback(() => {
|
|
4035
4573
|
requestIdRef.current += 1;
|
|
4036
4574
|
if (timerRef.current) {
|
|
4037
4575
|
clearTimeout(timerRef.current);
|
|
@@ -4122,34 +4660,34 @@ function useQuote(input, options = {}) {
|
|
|
4122
4660
|
const autoRefresh = options.autoRefresh ?? true;
|
|
4123
4661
|
const refreshBeforeExpiryMs = Math.max(0, options.refreshBeforeExpiryMs ?? 3e4);
|
|
4124
4662
|
const locationId = client.getLocationId();
|
|
4125
|
-
const requestIdRef =
|
|
4126
|
-
const debounceTimerRef =
|
|
4663
|
+
const requestIdRef = React14.useRef(0);
|
|
4664
|
+
const debounceTimerRef = React14.useRef(null);
|
|
4127
4665
|
const inputSignature = buildQuoteInputSignature(input);
|
|
4128
|
-
const normalizedInput =
|
|
4666
|
+
const normalizedInput = React14.useMemo(() => {
|
|
4129
4667
|
if (!input) {
|
|
4130
4668
|
return null;
|
|
4131
4669
|
}
|
|
4132
4670
|
const normalized = normalizeInput(input, locationId);
|
|
4133
4671
|
return normalized.product_id.length > 0 ? normalized : null;
|
|
4134
4672
|
}, [inputSignature, locationId]);
|
|
4135
|
-
const cacheKey2 =
|
|
4673
|
+
const cacheKey2 = React14.useMemo(
|
|
4136
4674
|
() => buildQuoteCacheKey(client, locationId, inputSignature),
|
|
4137
4675
|
[client, inputSignature, locationId]
|
|
4138
4676
|
);
|
|
4139
4677
|
const cached = quoteCache.get(cacheKey2);
|
|
4140
|
-
const [quote, setQuote] =
|
|
4141
|
-
const [isLoading, setIsLoading] =
|
|
4142
|
-
const [error, setError] =
|
|
4143
|
-
const [isExpired, setIsExpired] =
|
|
4144
|
-
const [messages, setMessages] =
|
|
4145
|
-
const quoteExpiryTimestamp =
|
|
4678
|
+
const [quote, setQuote] = React14.useState(cached?.quote ?? null);
|
|
4679
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && normalizedInput !== null && !cached);
|
|
4680
|
+
const [error, setError] = React14.useState(null);
|
|
4681
|
+
const [isExpired, setIsExpired] = React14.useState(isQuoteExpired(cached?.quote ?? null));
|
|
4682
|
+
const [messages, setMessages] = React14.useState(cached?.quote?.ui_messages ?? []);
|
|
4683
|
+
const quoteExpiryTimestamp = React14.useMemo(() => {
|
|
4146
4684
|
if (!quote?.expires_at) {
|
|
4147
4685
|
return Number.NaN;
|
|
4148
4686
|
}
|
|
4149
4687
|
const expiresAt = Date.parse(quote.expires_at);
|
|
4150
4688
|
return Number.isFinite(expiresAt) ? expiresAt : Number.NaN;
|
|
4151
4689
|
}, [quote?.expires_at]);
|
|
4152
|
-
const load =
|
|
4690
|
+
const load = React14.useCallback(
|
|
4153
4691
|
async (force = false) => {
|
|
4154
4692
|
if (!enabled || !normalizedInput) {
|
|
4155
4693
|
setQuote(null);
|
|
@@ -4209,7 +4747,7 @@ function useQuote(input, options = {}) {
|
|
|
4209
4747
|
},
|
|
4210
4748
|
[cacheKey2, client, enabled, normalizedInput]
|
|
4211
4749
|
);
|
|
4212
|
-
|
|
4750
|
+
React14.useEffect(() => {
|
|
4213
4751
|
if (debounceTimerRef.current) {
|
|
4214
4752
|
clearTimeout(debounceTimerRef.current);
|
|
4215
4753
|
}
|
|
@@ -4228,7 +4766,7 @@ function useQuote(input, options = {}) {
|
|
|
4228
4766
|
}
|
|
4229
4767
|
};
|
|
4230
4768
|
}, [load, cacheKey2, enabled, normalizedInput]);
|
|
4231
|
-
const refresh =
|
|
4769
|
+
const refresh = React14.useCallback(async () => {
|
|
4232
4770
|
if (!enabled || !normalizedInput) {
|
|
4233
4771
|
return;
|
|
4234
4772
|
}
|
|
@@ -4265,7 +4803,7 @@ function useQuote(input, options = {}) {
|
|
|
4265
4803
|
}
|
|
4266
4804
|
}
|
|
4267
4805
|
}, [cacheKey2, client, enabled, load, normalizedInput, quote]);
|
|
4268
|
-
|
|
4806
|
+
React14.useEffect(() => {
|
|
4269
4807
|
if (!Number.isFinite(quoteExpiryTimestamp)) {
|
|
4270
4808
|
setIsExpired(false);
|
|
4271
4809
|
return;
|
|
@@ -4441,9 +4979,9 @@ function useValidateDiscount(options = {}) {
|
|
|
4441
4979
|
if (!client) {
|
|
4442
4980
|
throw new Error("useValidateDiscount must be used within CimplifyProvider or passed { client }.");
|
|
4443
4981
|
}
|
|
4444
|
-
const [isValidating, setIsValidating] =
|
|
4445
|
-
const [error, setError] =
|
|
4446
|
-
const validate =
|
|
4982
|
+
const [isValidating, setIsValidating] = React14.useState(false);
|
|
4983
|
+
const [error, setError] = React14.useState(null);
|
|
4984
|
+
const validate = React14.useCallback(
|
|
4447
4985
|
async (code, orderSubtotal, locationId) => {
|
|
4448
4986
|
setError(null);
|
|
4449
4987
|
setIsValidating(true);
|
|
@@ -4490,7 +5028,7 @@ function useProductPrice(input) {
|
|
|
4490
5028
|
compositePrice,
|
|
4491
5029
|
bundleTotalPrice
|
|
4492
5030
|
} = input;
|
|
4493
|
-
return
|
|
5031
|
+
return React14.useMemo(() => {
|
|
4494
5032
|
let unitPrice;
|
|
4495
5033
|
if (bundleTotalPrice != null) {
|
|
4496
5034
|
unitPrice = bundleTotalPrice;
|
|
@@ -4539,10 +5077,10 @@ function useOrders(options = {}) {
|
|
|
4539
5077
|
function useSubscriptions(options = {}) {
|
|
4540
5078
|
const { client } = useCimplifyClient();
|
|
4541
5079
|
const { status, enabled = true } = options;
|
|
4542
|
-
const [subscriptions, setSubscriptions] =
|
|
4543
|
-
const [isLoading, setIsLoading] =
|
|
4544
|
-
const [error, setError] =
|
|
4545
|
-
const fetch2 =
|
|
5080
|
+
const [subscriptions, setSubscriptions] = React14.useState([]);
|
|
5081
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5082
|
+
const [error, setError] = React14.useState(null);
|
|
5083
|
+
const fetch2 = React14.useCallback(async () => {
|
|
4546
5084
|
if (!enabled) return;
|
|
4547
5085
|
setIsLoading(true);
|
|
4548
5086
|
setError(null);
|
|
@@ -4560,7 +5098,7 @@ function useSubscriptions(options = {}) {
|
|
|
4560
5098
|
setIsLoading(false);
|
|
4561
5099
|
}
|
|
4562
5100
|
}, [client, enabled, status]);
|
|
4563
|
-
|
|
5101
|
+
React14.useEffect(() => {
|
|
4564
5102
|
void fetch2();
|
|
4565
5103
|
}, [fetch2]);
|
|
4566
5104
|
return { subscriptions, isLoading, error, refetch: fetch2 };
|
|
@@ -4569,10 +5107,10 @@ function useSubscription(id, options = {}) {
|
|
|
4569
5107
|
const { client } = useCimplifyClient();
|
|
4570
5108
|
const { enabled = true } = options;
|
|
4571
5109
|
const normalizedId = (id || "").trim();
|
|
4572
|
-
const [subscription, setSubscription] =
|
|
4573
|
-
const [isLoading, setIsLoading] =
|
|
4574
|
-
const [error, setError] =
|
|
4575
|
-
const fetch2 =
|
|
5110
|
+
const [subscription, setSubscription] = React14.useState(null);
|
|
5111
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5112
|
+
const [error, setError] = React14.useState(null);
|
|
5113
|
+
const fetch2 = React14.useCallback(async () => {
|
|
4576
5114
|
if (!enabled || !normalizedId) return;
|
|
4577
5115
|
setIsLoading(true);
|
|
4578
5116
|
setError(null);
|
|
@@ -4589,25 +5127,25 @@ function useSubscription(id, options = {}) {
|
|
|
4589
5127
|
setIsLoading(false);
|
|
4590
5128
|
}
|
|
4591
5129
|
}, [client, enabled, normalizedId]);
|
|
4592
|
-
|
|
5130
|
+
React14.useEffect(() => {
|
|
4593
5131
|
void fetch2();
|
|
4594
5132
|
}, [fetch2]);
|
|
4595
|
-
const cancel =
|
|
5133
|
+
const cancel = React14.useCallback(async (reason) => {
|
|
4596
5134
|
if (!normalizedId) return;
|
|
4597
5135
|
await client.subscriptions.cancel(normalizedId, reason);
|
|
4598
5136
|
void fetch2();
|
|
4599
5137
|
}, [client, normalizedId, fetch2]);
|
|
4600
|
-
const pause =
|
|
5138
|
+
const pause = React14.useCallback(async () => {
|
|
4601
5139
|
if (!normalizedId) return;
|
|
4602
5140
|
await client.subscriptions.pause(normalizedId);
|
|
4603
5141
|
void fetch2();
|
|
4604
5142
|
}, [client, normalizedId, fetch2]);
|
|
4605
|
-
const resume =
|
|
5143
|
+
const resume = React14.useCallback(async () => {
|
|
4606
5144
|
if (!normalizedId) return;
|
|
4607
5145
|
await client.subscriptions.resume(normalizedId);
|
|
4608
5146
|
void fetch2();
|
|
4609
5147
|
}, [client, normalizedId, fetch2]);
|
|
4610
|
-
const skipNext =
|
|
5148
|
+
const skipNext = React14.useCallback(async () => {
|
|
4611
5149
|
if (!normalizedId) return;
|
|
4612
5150
|
await client.subscriptions.skipNextRenewal(normalizedId);
|
|
4613
5151
|
void fetch2();
|
|
@@ -4711,7 +5249,7 @@ function useBookings(options = {}) {
|
|
|
4711
5249
|
const context = useOptionalCimplifyClient();
|
|
4712
5250
|
const client = options.client ?? context?.client;
|
|
4713
5251
|
const { data, isLoading, error, refetch } = bookingsQuery(options);
|
|
4714
|
-
const cancelBooking =
|
|
5252
|
+
const cancelBooking = React14.useCallback(
|
|
4715
5253
|
async (bookingId, reason) => {
|
|
4716
5254
|
if (!client) throw new Error("useBookings must be used within CimplifyProvider or passed { client }.");
|
|
4717
5255
|
const result = await client.scheduling.cancelBooking({
|
|
@@ -4767,14 +5305,14 @@ function useBillingPlans(productId, options = {}) {
|
|
|
4767
5305
|
throw new Error("useBillingPlans must be used within CimplifyProvider or passed { client }.");
|
|
4768
5306
|
}
|
|
4769
5307
|
const enabled = options.enabled ?? true;
|
|
4770
|
-
const requestIdRef =
|
|
4771
|
-
const [plans, setPlans] =
|
|
4772
|
-
const [isLoading, setIsLoading] =
|
|
4773
|
-
const [error, setError] =
|
|
5308
|
+
const requestIdRef = React14.useRef(0);
|
|
5309
|
+
const [plans, setPlans] = React14.useState([]);
|
|
5310
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && !!productId);
|
|
5311
|
+
const [error, setError] = React14.useState(null);
|
|
4774
5312
|
const customerId = options.customerId;
|
|
4775
5313
|
const quantity = options.quantity;
|
|
4776
5314
|
const orderValue = options.orderValue;
|
|
4777
|
-
const load =
|
|
5315
|
+
const load = React14.useCallback(
|
|
4778
5316
|
async (force = false) => {
|
|
4779
5317
|
if (!enabled || !productId) {
|
|
4780
5318
|
setPlans([]);
|
|
@@ -4809,17 +5347,17 @@ function useBillingPlans(productId, options = {}) {
|
|
|
4809
5347
|
},
|
|
4810
5348
|
[client, enabled, productId, customerId, quantity, orderValue]
|
|
4811
5349
|
);
|
|
4812
|
-
|
|
5350
|
+
React14.useEffect(() => {
|
|
4813
5351
|
void load(false);
|
|
4814
5352
|
}, [load]);
|
|
4815
|
-
const refetch =
|
|
5353
|
+
const refetch = React14.useCallback(async () => {
|
|
4816
5354
|
await load(true);
|
|
4817
5355
|
}, [load]);
|
|
4818
|
-
const subscriptionPlans =
|
|
5356
|
+
const subscriptionPlans = React14.useMemo(
|
|
4819
5357
|
() => plans.filter((p) => p.plan_type === "subscription"),
|
|
4820
5358
|
[plans]
|
|
4821
5359
|
);
|
|
4822
|
-
const installmentPlans =
|
|
5360
|
+
const installmentPlans = React14.useMemo(
|
|
4823
5361
|
() => plans.filter((p) => p.plan_type === "installment"),
|
|
4824
5362
|
[plans]
|
|
4825
5363
|
);
|
|
@@ -4854,8 +5392,8 @@ function computeAvailableValues(variants, axes, selections) {
|
|
|
4854
5392
|
}
|
|
4855
5393
|
function useVariantSelector(options) {
|
|
4856
5394
|
const { variants, axes } = options;
|
|
4857
|
-
const [selectedValues, setSelectedValues] =
|
|
4858
|
-
const selectValue =
|
|
5395
|
+
const [selectedValues, setSelectedValues] = React14.useState({});
|
|
5396
|
+
const selectValue = React14.useCallback(
|
|
4859
5397
|
(axisId, valueId) => {
|
|
4860
5398
|
setSelectedValues((prev) => {
|
|
4861
5399
|
if (prev[axisId] === valueId) {
|
|
@@ -4868,16 +5406,16 @@ function useVariantSelector(options) {
|
|
|
4868
5406
|
},
|
|
4869
5407
|
[]
|
|
4870
5408
|
);
|
|
4871
|
-
const reset =
|
|
4872
|
-
const selectedVariant =
|
|
5409
|
+
const reset = React14.useCallback(() => setSelectedValues({}), []);
|
|
5410
|
+
const selectedVariant = React14.useMemo(
|
|
4873
5411
|
() => findMatchingVariant(variants, selectedValues),
|
|
4874
5412
|
[variants, selectedValues]
|
|
4875
5413
|
);
|
|
4876
|
-
const variantImage =
|
|
5414
|
+
const variantImage = React14.useMemo(
|
|
4877
5415
|
() => selectedVariant?.images?.[0] ?? null,
|
|
4878
5416
|
[selectedVariant]
|
|
4879
5417
|
);
|
|
4880
|
-
const availableValues =
|
|
5418
|
+
const availableValues = React14.useMemo(
|
|
4881
5419
|
() => computeAvailableValues(variants, axes, selectedValues),
|
|
4882
5420
|
[variants, axes, selectedValues]
|
|
4883
5421
|
);
|
|
@@ -4903,7 +5441,7 @@ function useActivityState(options = {}) {
|
|
|
4903
5441
|
const context = useOptionalCimplifyClient();
|
|
4904
5442
|
const client = options.client ?? context?.client;
|
|
4905
5443
|
const { data, isLoading, error, refetch } = activityStateQuery(options);
|
|
4906
|
-
const dismissMessage =
|
|
5444
|
+
const dismissMessage = React14.useCallback(
|
|
4907
5445
|
async (code) => {
|
|
4908
5446
|
if (!client) return;
|
|
4909
5447
|
const result = await client.activity.dismissMessage(code);
|
|
@@ -5005,31 +5543,31 @@ var WS_PATH = "/api/v1/support/conversation/ws";
|
|
|
5005
5543
|
function useChat(options = {}) {
|
|
5006
5544
|
const context = useOptionalCimplifyClient();
|
|
5007
5545
|
const client = options.client ?? context?.client;
|
|
5008
|
-
const [messages, setMessages] =
|
|
5009
|
-
const [isLoading, setIsLoading] =
|
|
5010
|
-
const [isSending, setIsSending] =
|
|
5011
|
-
const [error, setError] =
|
|
5012
|
-
const [conversationOpened, setConversationOpened] =
|
|
5013
|
-
const pollRef =
|
|
5014
|
-
const lastActivityRef =
|
|
5015
|
-
const openedRef =
|
|
5016
|
-
const messagesRef =
|
|
5017
|
-
const clientRef =
|
|
5018
|
-
const wsRef =
|
|
5019
|
-
const wsReconnectAttemptRef =
|
|
5020
|
-
const wsReconnectTimerRef =
|
|
5546
|
+
const [messages, setMessages] = React14.useState([]);
|
|
5547
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5548
|
+
const [isSending, setIsSending] = React14.useState(false);
|
|
5549
|
+
const [error, setError] = React14.useState(null);
|
|
5550
|
+
const [conversationOpened, setConversationOpened] = React14.useState(false);
|
|
5551
|
+
const pollRef = React14.useRef(null);
|
|
5552
|
+
const lastActivityRef = React14.useRef(Date.now());
|
|
5553
|
+
const openedRef = React14.useRef(false);
|
|
5554
|
+
const messagesRef = React14.useRef([]);
|
|
5555
|
+
const clientRef = React14.useRef(client);
|
|
5556
|
+
const wsRef = React14.useRef(null);
|
|
5557
|
+
const wsReconnectAttemptRef = React14.useRef(0);
|
|
5558
|
+
const wsReconnectTimerRef = React14.useRef(null);
|
|
5021
5559
|
messagesRef.current = messages;
|
|
5022
5560
|
clientRef.current = client;
|
|
5023
5561
|
const pollInterval = options.pollInterval ?? POLL_INTERVAL_MS;
|
|
5024
5562
|
const pollIdleInterval = options.pollIdleInterval ?? POLL_IDLE_INTERVAL_MS;
|
|
5025
|
-
const appendMessages =
|
|
5563
|
+
const appendMessages = React14.useCallback((incoming) => {
|
|
5026
5564
|
setMessages((prev) => {
|
|
5027
5565
|
const ids = new Set(prev.map((m) => m.id));
|
|
5028
5566
|
const fresh = incoming.filter((m) => !ids.has(m.id));
|
|
5029
5567
|
return fresh.length > 0 ? [...prev, ...fresh] : prev;
|
|
5030
5568
|
});
|
|
5031
5569
|
}, []);
|
|
5032
|
-
const pollMessages =
|
|
5570
|
+
const pollMessages = React14.useCallback(async () => {
|
|
5033
5571
|
const c = clientRef.current;
|
|
5034
5572
|
if (!c) return;
|
|
5035
5573
|
if (Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS) return;
|
|
@@ -5042,18 +5580,18 @@ function useChat(options = {}) {
|
|
|
5042
5580
|
appendMessages(result.value);
|
|
5043
5581
|
}
|
|
5044
5582
|
}, [appendMessages]);
|
|
5045
|
-
const startPolling =
|
|
5583
|
+
const startPolling = React14.useCallback(() => {
|
|
5046
5584
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
5047
5585
|
const interval = Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS ? pollIdleInterval : pollInterval;
|
|
5048
5586
|
pollRef.current = setInterval(pollMessages, interval);
|
|
5049
5587
|
}, [pollMessages, pollInterval, pollIdleInterval]);
|
|
5050
|
-
const stopPolling =
|
|
5588
|
+
const stopPolling = React14.useCallback(() => {
|
|
5051
5589
|
if (pollRef.current) {
|
|
5052
5590
|
clearInterval(pollRef.current);
|
|
5053
5591
|
pollRef.current = null;
|
|
5054
5592
|
}
|
|
5055
5593
|
}, []);
|
|
5056
|
-
const connectWebSocket =
|
|
5594
|
+
const connectWebSocket = React14.useCallback(() => {
|
|
5057
5595
|
const c = clientRef.current;
|
|
5058
5596
|
if (!c || typeof WebSocket === "undefined") {
|
|
5059
5597
|
startPolling();
|
|
@@ -5094,7 +5632,7 @@ function useChat(options = {}) {
|
|
|
5094
5632
|
};
|
|
5095
5633
|
wsRef.current = ws;
|
|
5096
5634
|
}, [appendMessages, startPolling, stopPolling, pollMessages]);
|
|
5097
|
-
|
|
5635
|
+
React14.useEffect(() => {
|
|
5098
5636
|
return () => {
|
|
5099
5637
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
5100
5638
|
if (wsReconnectTimerRef.current) clearTimeout(wsReconnectTimerRef.current);
|
|
@@ -5104,7 +5642,7 @@ function useChat(options = {}) {
|
|
|
5104
5642
|
}
|
|
5105
5643
|
};
|
|
5106
5644
|
}, []);
|
|
5107
|
-
const openConversation =
|
|
5645
|
+
const openConversation = React14.useCallback(async () => {
|
|
5108
5646
|
if (openedRef.current || !client) return;
|
|
5109
5647
|
openedRef.current = true;
|
|
5110
5648
|
setIsLoading(true);
|
|
@@ -5120,7 +5658,7 @@ function useChat(options = {}) {
|
|
|
5120
5658
|
}
|
|
5121
5659
|
setIsLoading(false);
|
|
5122
5660
|
}, [client, connectWebSocket]);
|
|
5123
|
-
const send =
|
|
5661
|
+
const send = React14.useCallback(
|
|
5124
5662
|
async (content) => {
|
|
5125
5663
|
if (!client || !content.trim()) return;
|
|
5126
5664
|
setError(null);
|
|
@@ -5154,7 +5692,7 @@ function useChat(options = {}) {
|
|
|
5154
5692
|
},
|
|
5155
5693
|
[client, openConversation]
|
|
5156
5694
|
);
|
|
5157
|
-
const startConversation =
|
|
5695
|
+
const startConversation = React14.useCallback(
|
|
5158
5696
|
async (starterText) => {
|
|
5159
5697
|
await openConversation();
|
|
5160
5698
|
if (starterText) {
|
|
@@ -5173,15 +5711,15 @@ function useChat(options = {}) {
|
|
|
5173
5711
|
startConversation
|
|
5174
5712
|
};
|
|
5175
5713
|
}
|
|
5176
|
-
var ElementsContext =
|
|
5714
|
+
var ElementsContext = React14.createContext({
|
|
5177
5715
|
elements: null,
|
|
5178
5716
|
isReady: false
|
|
5179
5717
|
});
|
|
5180
5718
|
function useElements() {
|
|
5181
|
-
return
|
|
5719
|
+
return React14.useContext(ElementsContext).elements;
|
|
5182
5720
|
}
|
|
5183
5721
|
function useElementsReady() {
|
|
5184
|
-
return
|
|
5722
|
+
return React14.useContext(ElementsContext).isReady;
|
|
5185
5723
|
}
|
|
5186
5724
|
function ElementsProvider({
|
|
5187
5725
|
client,
|
|
@@ -5189,10 +5727,10 @@ function ElementsProvider({
|
|
|
5189
5727
|
options,
|
|
5190
5728
|
children
|
|
5191
5729
|
}) {
|
|
5192
|
-
const [elements, setElements] =
|
|
5193
|
-
const [isReady, setIsReady] =
|
|
5194
|
-
const initialOptionsRef =
|
|
5195
|
-
|
|
5730
|
+
const [elements, setElements] = React14.useState(null);
|
|
5731
|
+
const [isReady, setIsReady] = React14.useState(false);
|
|
5732
|
+
const initialOptionsRef = React14.useRef(options);
|
|
5733
|
+
React14.useEffect(() => {
|
|
5196
5734
|
let cancelled = false;
|
|
5197
5735
|
let instance = null;
|
|
5198
5736
|
setIsReady(false);
|
|
@@ -5232,18 +5770,18 @@ function AuthElement({
|
|
|
5232
5770
|
onAuthenticated,
|
|
5233
5771
|
onError
|
|
5234
5772
|
}) {
|
|
5235
|
-
const containerRef =
|
|
5236
|
-
const elementRef =
|
|
5773
|
+
const containerRef = React14.useRef(null);
|
|
5774
|
+
const elementRef = React14.useRef(null);
|
|
5237
5775
|
const elements = useElements();
|
|
5238
|
-
const onReadyRef =
|
|
5239
|
-
const onAuthenticatedRef =
|
|
5240
|
-
const onErrorRef =
|
|
5241
|
-
|
|
5776
|
+
const onReadyRef = React14.useRef(onReady);
|
|
5777
|
+
const onAuthenticatedRef = React14.useRef(onAuthenticated);
|
|
5778
|
+
const onErrorRef = React14.useRef(onError);
|
|
5779
|
+
React14.useEffect(() => {
|
|
5242
5780
|
onReadyRef.current = onReady;
|
|
5243
5781
|
onAuthenticatedRef.current = onAuthenticated;
|
|
5244
5782
|
onErrorRef.current = onError;
|
|
5245
5783
|
}, [onReady, onAuthenticated, onError]);
|
|
5246
|
-
|
|
5784
|
+
React14.useEffect(() => {
|
|
5247
5785
|
if (!elements || !containerRef.current) return;
|
|
5248
5786
|
const element = elements.create(chunkWCSAZRNC_js.ELEMENT_TYPES.AUTH, { prefillEmail });
|
|
5249
5787
|
elementRef.current = element;
|
|
@@ -5269,18 +5807,18 @@ function AddressElement({
|
|
|
5269
5807
|
onChange,
|
|
5270
5808
|
onError
|
|
5271
5809
|
}) {
|
|
5272
|
-
const containerRef =
|
|
5273
|
-
const elementRef =
|
|
5810
|
+
const containerRef = React14.useRef(null);
|
|
5811
|
+
const elementRef = React14.useRef(null);
|
|
5274
5812
|
const elements = useElements();
|
|
5275
|
-
const onReadyRef =
|
|
5276
|
-
const onChangeRef =
|
|
5277
|
-
const onErrorRef =
|
|
5278
|
-
|
|
5813
|
+
const onReadyRef = React14.useRef(onReady);
|
|
5814
|
+
const onChangeRef = React14.useRef(onChange);
|
|
5815
|
+
const onErrorRef = React14.useRef(onError);
|
|
5816
|
+
React14.useEffect(() => {
|
|
5279
5817
|
onReadyRef.current = onReady;
|
|
5280
5818
|
onChangeRef.current = onChange;
|
|
5281
5819
|
onErrorRef.current = onError;
|
|
5282
5820
|
}, [onReady, onChange, onError]);
|
|
5283
|
-
|
|
5821
|
+
React14.useEffect(() => {
|
|
5284
5822
|
if (!elements || !containerRef.current) return;
|
|
5285
5823
|
const element = elements.create(chunkWCSAZRNC_js.ELEMENT_TYPES.ADDRESS, { mode });
|
|
5286
5824
|
elementRef.current = element;
|
|
@@ -5307,18 +5845,18 @@ function PaymentElement({
|
|
|
5307
5845
|
onChange,
|
|
5308
5846
|
onError
|
|
5309
5847
|
}) {
|
|
5310
|
-
const containerRef =
|
|
5311
|
-
const elementRef =
|
|
5848
|
+
const containerRef = React14.useRef(null);
|
|
5849
|
+
const elementRef = React14.useRef(null);
|
|
5312
5850
|
const elements = useElements();
|
|
5313
|
-
const onReadyRef =
|
|
5314
|
-
const onChangeRef =
|
|
5315
|
-
const onErrorRef =
|
|
5316
|
-
|
|
5851
|
+
const onReadyRef = React14.useRef(onReady);
|
|
5852
|
+
const onChangeRef = React14.useRef(onChange);
|
|
5853
|
+
const onErrorRef = React14.useRef(onError);
|
|
5854
|
+
React14.useEffect(() => {
|
|
5317
5855
|
onReadyRef.current = onReady;
|
|
5318
5856
|
onChangeRef.current = onChange;
|
|
5319
5857
|
onErrorRef.current = onError;
|
|
5320
5858
|
}, [onReady, onChange, onError]);
|
|
5321
|
-
|
|
5859
|
+
React14.useEffect(() => {
|
|
5322
5860
|
if (!elements || !containerRef.current) return;
|
|
5323
5861
|
const element = elements.create(chunkWCSAZRNC_js.ELEMENT_TYPES.PAYMENT, { amount, currency });
|
|
5324
5862
|
elementRef.current = element;
|
|
@@ -5338,8 +5876,8 @@ function PaymentElement({
|
|
|
5338
5876
|
}
|
|
5339
5877
|
function useCheckout() {
|
|
5340
5878
|
const elements = useElements();
|
|
5341
|
-
const [isLoading, setIsLoading] =
|
|
5342
|
-
const submit =
|
|
5879
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5880
|
+
const submit = React14.useCallback(
|
|
5343
5881
|
async (data) => {
|
|
5344
5882
|
if (!elements) {
|
|
5345
5883
|
return { success: false, error: { code: "NO_ELEMENTS", message: "Elements not initialized" } };
|
|
@@ -5353,7 +5891,7 @@ function useCheckout() {
|
|
|
5353
5891
|
},
|
|
5354
5892
|
[elements]
|
|
5355
5893
|
);
|
|
5356
|
-
const process =
|
|
5894
|
+
const process = React14.useCallback(
|
|
5357
5895
|
async (options) => {
|
|
5358
5896
|
if (!elements) {
|
|
5359
5897
|
return {
|
|
@@ -5447,13 +5985,13 @@ function VariantSelector({
|
|
|
5447
5985
|
className,
|
|
5448
5986
|
classNames
|
|
5449
5987
|
}) {
|
|
5450
|
-
const [axisSelections, setAxisSelections] =
|
|
5451
|
-
const initialized =
|
|
5452
|
-
const idPrefix =
|
|
5453
|
-
|
|
5988
|
+
const [axisSelections, setAxisSelections] = React14.useState({});
|
|
5989
|
+
const initialized = React14.useRef(false);
|
|
5990
|
+
const idPrefix = React14.useId();
|
|
5991
|
+
React14.useEffect(() => {
|
|
5454
5992
|
initialized.current = false;
|
|
5455
5993
|
}, [variants]);
|
|
5456
|
-
|
|
5994
|
+
React14.useEffect(() => {
|
|
5457
5995
|
if (initialized.current) return;
|
|
5458
5996
|
if (!variants || variants.length === 0) return;
|
|
5459
5997
|
const defaultVariant = variants.find((v) => v.is_default) || variants[0];
|
|
@@ -5468,7 +6006,7 @@ function VariantSelector({
|
|
|
5468
6006
|
setAxisSelections(initial);
|
|
5469
6007
|
}
|
|
5470
6008
|
}, [variants, onVariantChange]);
|
|
5471
|
-
|
|
6009
|
+
React14.useEffect(() => {
|
|
5472
6010
|
if (!initialized.current) return;
|
|
5473
6011
|
if (!variantAxes || variantAxes.length === 0) return;
|
|
5474
6012
|
const match = variants.find((v) => {
|
|
@@ -5611,12 +6149,12 @@ function AddOnSelector({
|
|
|
5611
6149
|
className,
|
|
5612
6150
|
classNames
|
|
5613
6151
|
}) {
|
|
5614
|
-
const selectedSet =
|
|
5615
|
-
const isOptionSelected =
|
|
6152
|
+
const selectedSet = React14.useMemo(() => new Set(selectedOptions), [selectedOptions]);
|
|
6153
|
+
const isOptionSelected = React14.useCallback(
|
|
5616
6154
|
(optionId) => selectedSet.has(optionId),
|
|
5617
6155
|
[selectedSet]
|
|
5618
6156
|
);
|
|
5619
|
-
const handleCheckedChange =
|
|
6157
|
+
const handleCheckedChange = React14.useCallback(
|
|
5620
6158
|
(addOn, optionId, checked) => {
|
|
5621
6159
|
const isSelected = selectedSet.has(optionId);
|
|
5622
6160
|
if (addOn.is_mutually_exclusive || !addOn.is_multiple_allowed) {
|
|
@@ -5792,9 +6330,9 @@ function BundleSelector({
|
|
|
5792
6330
|
className,
|
|
5793
6331
|
classNames
|
|
5794
6332
|
}) {
|
|
5795
|
-
const [variantChoices, setVariantChoices] =
|
|
5796
|
-
const lastComponentIds =
|
|
5797
|
-
|
|
6333
|
+
const [variantChoices, setVariantChoices] = React14.useState({});
|
|
6334
|
+
const lastComponentIds = React14.useRef("");
|
|
6335
|
+
React14.useEffect(() => {
|
|
5798
6336
|
const ids = components.map((c) => c.id).sort().join();
|
|
5799
6337
|
if (ids === lastComponentIds.current) return;
|
|
5800
6338
|
lastComponentIds.current = ids;
|
|
@@ -5811,20 +6349,20 @@ function BundleSelector({
|
|
|
5811
6349
|
}
|
|
5812
6350
|
setVariantChoices(defaults);
|
|
5813
6351
|
}, [components]);
|
|
5814
|
-
const selections =
|
|
6352
|
+
const selections = React14.useMemo(() => {
|
|
5815
6353
|
return components.map((comp) => ({
|
|
5816
6354
|
component_id: comp.id,
|
|
5817
6355
|
variant_id: variantChoices[comp.id],
|
|
5818
6356
|
quantity: comp.quantity
|
|
5819
6357
|
}));
|
|
5820
6358
|
}, [components, variantChoices]);
|
|
5821
|
-
|
|
6359
|
+
React14.useEffect(() => {
|
|
5822
6360
|
onSelectionsChange(selections);
|
|
5823
6361
|
}, [selections, onSelectionsChange]);
|
|
5824
|
-
|
|
6362
|
+
React14.useEffect(() => {
|
|
5825
6363
|
onReady?.(components.length > 0 && selections.length > 0);
|
|
5826
6364
|
}, [components, selections, onReady]);
|
|
5827
|
-
const totalPrice =
|
|
6365
|
+
const totalPrice = React14.useMemo(() => {
|
|
5828
6366
|
if (pricingType === "fixed" && bundlePrice) {
|
|
5829
6367
|
return chunk7Y2O3E4D_js.parsePrice(bundlePrice);
|
|
5830
6368
|
}
|
|
@@ -5839,10 +6377,10 @@ function BundleSelector({
|
|
|
5839
6377
|
}
|
|
5840
6378
|
return componentsTotal;
|
|
5841
6379
|
}, [components, variantChoices, pricingType, bundlePrice, discountValue]);
|
|
5842
|
-
|
|
6380
|
+
React14.useEffect(() => {
|
|
5843
6381
|
onPriceChange?.(totalPrice);
|
|
5844
6382
|
}, [totalPrice, onPriceChange]);
|
|
5845
|
-
const handleVariantChange =
|
|
6383
|
+
const handleVariantChange = React14.useCallback(
|
|
5846
6384
|
(componentId, variantId) => {
|
|
5847
6385
|
setVariantChoices((prev) => ({ ...prev, [componentId]: variantId }));
|
|
5848
6386
|
},
|
|
@@ -5923,9 +6461,9 @@ function BundleComponentCard({
|
|
|
5923
6461
|
onVariantChange,
|
|
5924
6462
|
classNames
|
|
5925
6463
|
}) {
|
|
5926
|
-
const idPrefix =
|
|
6464
|
+
const idPrefix = React14.useId();
|
|
5927
6465
|
const showVariantPicker = component.allow_variant_choice && component.available_variants.length > 1;
|
|
5928
|
-
const displayPrice =
|
|
6466
|
+
const displayPrice = React14.useMemo(
|
|
5929
6467
|
() => getComponentPrice(component, selectedVariantId),
|
|
5930
6468
|
[component, selectedVariantId]
|
|
5931
6469
|
);
|
|
@@ -6073,11 +6611,11 @@ function CompositeSelector({
|
|
|
6073
6611
|
classNames
|
|
6074
6612
|
}) {
|
|
6075
6613
|
const { client } = useCimplifyClient();
|
|
6076
|
-
const [groupSelections, setGroupSelections] =
|
|
6077
|
-
const [priceResult, setPriceResult] =
|
|
6078
|
-
const [isPriceLoading, setIsPriceLoading] =
|
|
6079
|
-
const [priceError, setPriceError] =
|
|
6080
|
-
const selections =
|
|
6614
|
+
const [groupSelections, setGroupSelections] = React14.useState({});
|
|
6615
|
+
const [priceResult, setPriceResult] = React14.useState(null);
|
|
6616
|
+
const [isPriceLoading, setIsPriceLoading] = React14.useState(false);
|
|
6617
|
+
const [priceError, setPriceError] = React14.useState(false);
|
|
6618
|
+
const selections = React14.useMemo(() => {
|
|
6081
6619
|
const result = [];
|
|
6082
6620
|
for (const groupSels of Object.values(groupSelections)) {
|
|
6083
6621
|
for (const [componentId, qty] of Object.entries(groupSels)) {
|
|
@@ -6088,13 +6626,13 @@ function CompositeSelector({
|
|
|
6088
6626
|
}
|
|
6089
6627
|
return result;
|
|
6090
6628
|
}, [groupSelections]);
|
|
6091
|
-
|
|
6629
|
+
React14.useEffect(() => {
|
|
6092
6630
|
onSelectionsChange(selections);
|
|
6093
6631
|
}, [selections, onSelectionsChange]);
|
|
6094
|
-
|
|
6632
|
+
React14.useEffect(() => {
|
|
6095
6633
|
onPriceChange?.(priceResult);
|
|
6096
6634
|
}, [priceResult, onPriceChange]);
|
|
6097
|
-
const allGroupsSatisfied =
|
|
6635
|
+
const allGroupsSatisfied = React14.useMemo(() => {
|
|
6098
6636
|
for (const group of groups) {
|
|
6099
6637
|
const groupSels = groupSelections[group.id] || {};
|
|
6100
6638
|
const totalSelected = Object.values(groupSels).reduce((sum, q) => sum + q, 0);
|
|
@@ -6102,17 +6640,17 @@ function CompositeSelector({
|
|
|
6102
6640
|
}
|
|
6103
6641
|
return true;
|
|
6104
6642
|
}, [groups, groupSelections]);
|
|
6105
|
-
const sortedGroups =
|
|
6643
|
+
const sortedGroups = React14.useMemo(
|
|
6106
6644
|
() => [...groups].sort((a, b) => a.display_order - b.display_order).map((group) => ({
|
|
6107
6645
|
...group,
|
|
6108
6646
|
_sortedComponents: group.components.filter((component) => component.is_available && !component.is_archived).sort((a, b) => a.display_order - b.display_order)
|
|
6109
6647
|
})),
|
|
6110
6648
|
[groups]
|
|
6111
6649
|
);
|
|
6112
|
-
|
|
6650
|
+
React14.useEffect(() => {
|
|
6113
6651
|
onReady?.(allGroupsSatisfied);
|
|
6114
6652
|
}, [allGroupsSatisfied, onReady]);
|
|
6115
|
-
|
|
6653
|
+
React14.useEffect(() => {
|
|
6116
6654
|
if (skipPriceFetch || !allGroupsSatisfied || selections.length === 0) return;
|
|
6117
6655
|
let cancelled = false;
|
|
6118
6656
|
const timer = setTimeout(() => {
|
|
@@ -6139,7 +6677,7 @@ function CompositeSelector({
|
|
|
6139
6677
|
clearTimeout(timer);
|
|
6140
6678
|
};
|
|
6141
6679
|
}, [selections, allGroupsSatisfied, compositeId, client, skipPriceFetch]);
|
|
6142
|
-
const toggleComponent =
|
|
6680
|
+
const toggleComponent = React14.useCallback(
|
|
6143
6681
|
(group, component) => {
|
|
6144
6682
|
setGroupSelections((prev) => {
|
|
6145
6683
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -6167,7 +6705,7 @@ function CompositeSelector({
|
|
|
6167
6705
|
},
|
|
6168
6706
|
[]
|
|
6169
6707
|
);
|
|
6170
|
-
const updateQuantity =
|
|
6708
|
+
const updateQuantity = React14.useCallback(
|
|
6171
6709
|
(group, componentId, newValue) => {
|
|
6172
6710
|
setGroupSelections((prev) => {
|
|
6173
6711
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -6746,7 +7284,7 @@ function DatePicker({
|
|
|
6746
7284
|
classNames,
|
|
6747
7285
|
"aria-label": ariaLabel
|
|
6748
7286
|
}) {
|
|
6749
|
-
const [open, setOpen] =
|
|
7287
|
+
const [open, setOpen] = React14.useState(false);
|
|
6750
7288
|
const selected = parseValue(value);
|
|
6751
7289
|
const disabledMatchers = [];
|
|
6752
7290
|
if (minDate) disabledMatchers.push({ before: minDate });
|
|
@@ -6900,9 +7438,9 @@ function TimePicker({
|
|
|
6900
7438
|
classNames,
|
|
6901
7439
|
"aria-label": ariaLabel
|
|
6902
7440
|
}) {
|
|
6903
|
-
const [open, setOpen] =
|
|
7441
|
+
const [open, setOpen] = React14.useState(false);
|
|
6904
7442
|
const parsed = parseHHmm(value);
|
|
6905
|
-
const options =
|
|
7443
|
+
const options = React14.useMemo(
|
|
6906
7444
|
() => buildOptions(minTime, maxTime, stepMinutes),
|
|
6907
7445
|
[minTime, maxTime, stepMinutes]
|
|
6908
7446
|
);
|
|
@@ -6991,13 +7529,13 @@ function CustomerInputFields({
|
|
|
6991
7529
|
const clientContext = useOptionalCimplifyClient();
|
|
6992
7530
|
if (fields.length === 0) return null;
|
|
6993
7531
|
const sorted = [...fields].sort((a, b) => a.display_order - b.display_order);
|
|
6994
|
-
const setValue =
|
|
7532
|
+
const setValue = React14.useCallback(
|
|
6995
7533
|
(fieldId, value) => {
|
|
6996
7534
|
onChange({ ...values, [fieldId]: value });
|
|
6997
7535
|
},
|
|
6998
7536
|
[values, onChange]
|
|
6999
7537
|
);
|
|
7000
|
-
const defaultFileUpload =
|
|
7538
|
+
const defaultFileUpload = React14.useCallback(
|
|
7001
7539
|
async (file) => {
|
|
7002
7540
|
if (onFileUpload) return onFileUpload(file, {});
|
|
7003
7541
|
if (!clientContext?.client) throw new Error("No upload provider available");
|
|
@@ -7332,7 +7870,7 @@ function FileUploadInput({
|
|
|
7332
7870
|
onFileUpload,
|
|
7333
7871
|
classNames
|
|
7334
7872
|
}) {
|
|
7335
|
-
const [isUploading, setIsUploading] =
|
|
7873
|
+
const [isUploading, setIsUploading] = React14__default.default.useState(false);
|
|
7336
7874
|
const fileUrl = typeof value === "string" ? value : void 0;
|
|
7337
7875
|
const acceptedFormats = field.validation?.accepted_formats;
|
|
7338
7876
|
const accept = acceptedFormats ? acceptedFormats.map((f) => `.${f}`).join(",") : field.field_type === chunkIQLJJW2H_js.INPUT_FIELD_TYPE.Image ? "image/*" : void 0;
|
|
@@ -7482,22 +8020,22 @@ function AddressInput({
|
|
|
7482
8020
|
}) {
|
|
7483
8021
|
const clientContext = useOptionalCimplifyClient();
|
|
7484
8022
|
const addr = value && typeof value === "object" ? value : null;
|
|
7485
|
-
const [inputText, setInputText] =
|
|
7486
|
-
const [suggestions, setSuggestions] =
|
|
7487
|
-
const [isOpen, setIsOpen] =
|
|
7488
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
7489
|
-
const debounceRef =
|
|
7490
|
-
const seqRef =
|
|
7491
|
-
const sessionTokenRef =
|
|
7492
|
-
const blurTimeoutRef =
|
|
7493
|
-
|
|
8023
|
+
const [inputText, setInputText] = React14__default.default.useState(addr?.formatted_address ?? "");
|
|
8024
|
+
const [suggestions, setSuggestions] = React14__default.default.useState([]);
|
|
8025
|
+
const [isOpen, setIsOpen] = React14__default.default.useState(false);
|
|
8026
|
+
const [highlightedIndex, setHighlightedIndex] = React14__default.default.useState(-1);
|
|
8027
|
+
const debounceRef = React14__default.default.useRef(null);
|
|
8028
|
+
const seqRef = React14__default.default.useRef(0);
|
|
8029
|
+
const sessionTokenRef = React14__default.default.useRef(createSessionToken());
|
|
8030
|
+
const blurTimeoutRef = React14__default.default.useRef(null);
|
|
8031
|
+
React14__default.default.useEffect(() => {
|
|
7494
8032
|
return () => {
|
|
7495
8033
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7496
8034
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7497
8035
|
seqRef.current += 1;
|
|
7498
8036
|
};
|
|
7499
8037
|
}, []);
|
|
7500
|
-
const fetchSuggestions =
|
|
8038
|
+
const fetchSuggestions = React14__default.default.useCallback(async (query) => {
|
|
7501
8039
|
const client = clientContext?.client;
|
|
7502
8040
|
if (!client || query.length < 3) {
|
|
7503
8041
|
setSuggestions([]);
|
|
@@ -7521,7 +8059,7 @@ function AddressInput({
|
|
|
7521
8059
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7522
8060
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
7523
8061
|
};
|
|
7524
|
-
const selectSuggestion =
|
|
8062
|
+
const selectSuggestion = React14__default.default.useCallback(async (suggestion) => {
|
|
7525
8063
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7526
8064
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7527
8065
|
const fallback = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -7624,22 +8162,22 @@ function LocationInput({
|
|
|
7624
8162
|
}) {
|
|
7625
8163
|
const clientContext = useOptionalCimplifyClient();
|
|
7626
8164
|
const loc = value && typeof value === "object" ? value : null;
|
|
7627
|
-
const [inputText, setInputText] =
|
|
7628
|
-
const [suggestions, setSuggestions] =
|
|
7629
|
-
const [isOpen, setIsOpen] =
|
|
7630
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
7631
|
-
const debounceRef =
|
|
7632
|
-
const seqRef =
|
|
7633
|
-
const sessionTokenRef =
|
|
7634
|
-
const blurTimeoutRef =
|
|
7635
|
-
|
|
8165
|
+
const [inputText, setInputText] = React14__default.default.useState(loc?.label ?? "");
|
|
8166
|
+
const [suggestions, setSuggestions] = React14__default.default.useState([]);
|
|
8167
|
+
const [isOpen, setIsOpen] = React14__default.default.useState(false);
|
|
8168
|
+
const [highlightedIndex, setHighlightedIndex] = React14__default.default.useState(-1);
|
|
8169
|
+
const debounceRef = React14__default.default.useRef(null);
|
|
8170
|
+
const seqRef = React14__default.default.useRef(0);
|
|
8171
|
+
const sessionTokenRef = React14__default.default.useRef(createSessionToken());
|
|
8172
|
+
const blurTimeoutRef = React14__default.default.useRef(null);
|
|
8173
|
+
React14__default.default.useEffect(() => {
|
|
7636
8174
|
return () => {
|
|
7637
8175
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7638
8176
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7639
8177
|
seqRef.current += 1;
|
|
7640
8178
|
};
|
|
7641
8179
|
}, []);
|
|
7642
|
-
const fetchSuggestions =
|
|
8180
|
+
const fetchSuggestions = React14__default.default.useCallback(async (query) => {
|
|
7643
8181
|
const client = clientContext?.client;
|
|
7644
8182
|
if (!client || query.length < 3) {
|
|
7645
8183
|
setSuggestions([]);
|
|
@@ -7663,7 +8201,7 @@ function LocationInput({
|
|
|
7663
8201
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7664
8202
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
7665
8203
|
};
|
|
7666
|
-
const selectSuggestion =
|
|
8204
|
+
const selectSuggestion = React14__default.default.useCallback(async (suggestion) => {
|
|
7667
8205
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7668
8206
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7669
8207
|
const label = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -7752,8 +8290,8 @@ function PhoneInput({
|
|
|
7752
8290
|
inputClass
|
|
7753
8291
|
}) {
|
|
7754
8292
|
const phone = value && typeof value === "object" ? value : null;
|
|
7755
|
-
const [code, setCode] =
|
|
7756
|
-
const [number, setNumber] =
|
|
8293
|
+
const [code, setCode] = React14__default.default.useState(phone?.country_code ?? "+1");
|
|
8294
|
+
const [number, setNumber] = React14__default.default.useState(phone?.number ?? "");
|
|
7757
8295
|
const update = (nextCode, nextNumber) => {
|
|
7758
8296
|
setCode(nextCode);
|
|
7759
8297
|
setNumber(nextNumber);
|
|
@@ -7798,8 +8336,8 @@ function SignatureInput({
|
|
|
7798
8336
|
classNames
|
|
7799
8337
|
}) {
|
|
7800
8338
|
const sig = value && typeof value === "object" ? value : null;
|
|
7801
|
-
const canvasRef =
|
|
7802
|
-
const isDrawing =
|
|
8339
|
+
const canvasRef = React14__default.default.useRef(null);
|
|
8340
|
+
const isDrawing = React14__default.default.useRef(false);
|
|
7803
8341
|
const getCtx = () => canvasRef.current?.getContext("2d") ?? null;
|
|
7804
8342
|
const startDraw = (e) => {
|
|
7805
8343
|
const ctx = getCtx();
|
|
@@ -7975,7 +8513,7 @@ function SlotPicker({
|
|
|
7975
8513
|
}
|
|
7976
8514
|
);
|
|
7977
8515
|
const rawSlots = slotsProp ?? fetched;
|
|
7978
|
-
const slots =
|
|
8516
|
+
const slots = React14.useMemo(() => {
|
|
7979
8517
|
if (!hideElapsedSlots) return rawSlots;
|
|
7980
8518
|
const cutoff = Date.now() + minLeadMinutes * 6e4;
|
|
7981
8519
|
return rawSlots.filter((slot) => {
|
|
@@ -8113,9 +8651,9 @@ function DateSlotPicker({
|
|
|
8113
8651
|
className,
|
|
8114
8652
|
classNames
|
|
8115
8653
|
}) {
|
|
8116
|
-
const [offset, setOffset] =
|
|
8117
|
-
const [selectedDate, setSelectedDate] =
|
|
8118
|
-
const dateRange =
|
|
8654
|
+
const [offset, setOffset] = React14.useState(0);
|
|
8655
|
+
const [selectedDate, setSelectedDate] = React14.useState(toDateString(/* @__PURE__ */ new Date()));
|
|
8656
|
+
const dateRange = React14.useMemo(() => {
|
|
8119
8657
|
const today = /* @__PURE__ */ new Date();
|
|
8120
8658
|
const start = addDays(today, offset);
|
|
8121
8659
|
const dates = [];
|
|
@@ -8138,25 +8676,25 @@ function DateSlotPicker({
|
|
|
8138
8676
|
}
|
|
8139
8677
|
);
|
|
8140
8678
|
const days = availabilityProp ?? fetchedDays;
|
|
8141
|
-
const availabilityMap =
|
|
8679
|
+
const availabilityMap = React14.useMemo(() => {
|
|
8142
8680
|
const map = /* @__PURE__ */ new Map();
|
|
8143
8681
|
for (const day of days) {
|
|
8144
8682
|
map.set(day.date, day);
|
|
8145
8683
|
}
|
|
8146
8684
|
return map;
|
|
8147
8685
|
}, [days]);
|
|
8148
|
-
const handlePrev =
|
|
8686
|
+
const handlePrev = React14.useCallback(() => {
|
|
8149
8687
|
setOffset((prev) => Math.max(0, prev - daysToShow));
|
|
8150
8688
|
}, [daysToShow]);
|
|
8151
|
-
const handleNext =
|
|
8689
|
+
const handleNext = React14.useCallback(() => {
|
|
8152
8690
|
setOffset((prev) => prev + daysToShow);
|
|
8153
8691
|
}, [daysToShow]);
|
|
8154
|
-
const handleDateChange =
|
|
8692
|
+
const handleDateChange = React14.useCallback((value) => {
|
|
8155
8693
|
if (typeof value === "string") {
|
|
8156
8694
|
setSelectedDate(value);
|
|
8157
8695
|
}
|
|
8158
8696
|
}, []);
|
|
8159
|
-
const handleSlotSelect =
|
|
8697
|
+
const handleSlotSelect = React14.useCallback(
|
|
8160
8698
|
(slot) => {
|
|
8161
8699
|
onSlotSelect?.(slot, selectedDate);
|
|
8162
8700
|
},
|
|
@@ -8272,22 +8810,22 @@ function ProductCustomizer({
|
|
|
8272
8810
|
className,
|
|
8273
8811
|
classNames
|
|
8274
8812
|
}) {
|
|
8275
|
-
const [quantity, setQuantity] =
|
|
8276
|
-
const [isAdded, setIsAdded] =
|
|
8277
|
-
const [isSubmitting, setIsSubmitting] =
|
|
8278
|
-
const [selectedVariantId, setSelectedVariantId] =
|
|
8279
|
-
const [selectedVariant, setSelectedVariant] =
|
|
8280
|
-
const [selectedAddOnOptionIds, setSelectedAddOnOptionIds] =
|
|
8281
|
-
const [compositeSelections, setCompositeSelections] =
|
|
8282
|
-
const [compositePrice, setCompositePrice] =
|
|
8283
|
-
const [compositeReady, setCompositeReady] =
|
|
8284
|
-
const [bundleSelections, setBundleSelections] =
|
|
8285
|
-
const [bundleTotalPrice, setBundleTotalPrice] =
|
|
8286
|
-
const [bundleReady, setBundleReady] =
|
|
8287
|
-
const [selectedBillingPlan, setSelectedBillingPlan] =
|
|
8288
|
-
const [customerInputValues, setCustomerInputValues] =
|
|
8289
|
-
const [specialInstructions, setSpecialInstructions] =
|
|
8290
|
-
const [selectedSlot, setSelectedSlot] =
|
|
8813
|
+
const [quantity, setQuantity] = React14.useState(product.min_order_quantity ?? 1);
|
|
8814
|
+
const [isAdded, setIsAdded] = React14.useState(false);
|
|
8815
|
+
const [isSubmitting, setIsSubmitting] = React14.useState(false);
|
|
8816
|
+
const [selectedVariantId, setSelectedVariantId] = React14.useState();
|
|
8817
|
+
const [selectedVariant, setSelectedVariant] = React14.useState();
|
|
8818
|
+
const [selectedAddOnOptionIds, setSelectedAddOnOptionIds] = React14.useState([]);
|
|
8819
|
+
const [compositeSelections, setCompositeSelections] = React14.useState([]);
|
|
8820
|
+
const [compositePrice, setCompositePrice] = React14.useState(null);
|
|
8821
|
+
const [compositeReady, setCompositeReady] = React14.useState(false);
|
|
8822
|
+
const [bundleSelections, setBundleSelections] = React14.useState([]);
|
|
8823
|
+
const [bundleTotalPrice, setBundleTotalPrice] = React14.useState(null);
|
|
8824
|
+
const [bundleReady, setBundleReady] = React14.useState(false);
|
|
8825
|
+
const [selectedBillingPlan, setSelectedBillingPlan] = React14.useState(null);
|
|
8826
|
+
const [customerInputValues, setCustomerInputValues] = React14.useState({});
|
|
8827
|
+
const [specialInstructions, setSpecialInstructions] = React14.useState("");
|
|
8828
|
+
const [selectedSlot, setSelectedSlot] = React14.useState(null);
|
|
8291
8829
|
const cart = useCart();
|
|
8292
8830
|
const productType = product.type || "product";
|
|
8293
8831
|
const isComposite = productType === "composite";
|
|
@@ -8297,7 +8835,7 @@ function ProductCustomizer({
|
|
|
8297
8835
|
const isStandard = !isComposite && !isBundle;
|
|
8298
8836
|
const hasVariants = isStandard && product.variants && product.variants.length > 0;
|
|
8299
8837
|
const hasAddOns = isStandard && product.add_ons && product.add_ons.length > 0;
|
|
8300
|
-
|
|
8838
|
+
React14.useEffect(() => {
|
|
8301
8839
|
setQuantity(product.min_order_quantity ?? 1);
|
|
8302
8840
|
setIsAdded(false);
|
|
8303
8841
|
setIsSubmitting(false);
|
|
@@ -8315,7 +8853,7 @@ function ProductCustomizer({
|
|
|
8315
8853
|
setSpecialInstructions("");
|
|
8316
8854
|
setSelectedSlot(null);
|
|
8317
8855
|
}, [product.id, product.min_order_quantity]);
|
|
8318
|
-
const selectedAddOnOptions =
|
|
8856
|
+
const selectedAddOnOptions = React14.useMemo(() => {
|
|
8319
8857
|
if (!product.add_ons) return [];
|
|
8320
8858
|
const options = [];
|
|
8321
8859
|
for (const addOn of product.add_ons) {
|
|
@@ -8327,11 +8865,11 @@ function ProductCustomizer({
|
|
|
8327
8865
|
}
|
|
8328
8866
|
return options;
|
|
8329
8867
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
8330
|
-
const normalizedAddOnOptionIds =
|
|
8868
|
+
const normalizedAddOnOptionIds = React14.useMemo(() => {
|
|
8331
8869
|
if (selectedAddOnOptionIds.length === 0) return [];
|
|
8332
8870
|
return Array.from(new Set(selectedAddOnOptionIds.map((id) => id.trim()).filter(Boolean))).sort();
|
|
8333
8871
|
}, [selectedAddOnOptionIds]);
|
|
8334
|
-
const localTotalPrice =
|
|
8872
|
+
const localTotalPrice = React14.useMemo(() => {
|
|
8335
8873
|
if (isComposite && compositePrice) {
|
|
8336
8874
|
return chunk7Y2O3E4D_js.parsePrice(compositePrice.final_price) * quantity;
|
|
8337
8875
|
}
|
|
@@ -8349,7 +8887,7 @@ function ProductCustomizer({
|
|
|
8349
8887
|
}
|
|
8350
8888
|
return price * quantity;
|
|
8351
8889
|
}, [product.default_price, selectedVariant, selectedAddOnOptions, quantity, isComposite, compositePrice, isBundle, bundleTotalPrice]);
|
|
8352
|
-
const requiredAddOnsSatisfied =
|
|
8890
|
+
const requiredAddOnsSatisfied = React14.useMemo(() => {
|
|
8353
8891
|
if (!product.add_ons) return true;
|
|
8354
8892
|
for (const addOn of product.add_ons) {
|
|
8355
8893
|
if (addOn.is_required) {
|
|
@@ -8364,7 +8902,7 @@ function ProductCustomizer({
|
|
|
8364
8902
|
}
|
|
8365
8903
|
return true;
|
|
8366
8904
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
8367
|
-
const quoteInput =
|
|
8905
|
+
const quoteInput = React14.useMemo(
|
|
8368
8906
|
() => ({
|
|
8369
8907
|
productId: product.id,
|
|
8370
8908
|
quantity,
|
|
@@ -8375,7 +8913,7 @@ function ProductCustomizer({
|
|
|
8375
8913
|
}),
|
|
8376
8914
|
[product.id, quantity, selectedVariantId, normalizedAddOnOptionIds, isBundle, bundleSelections, isComposite, compositeSelections]
|
|
8377
8915
|
);
|
|
8378
|
-
const requiredInputsSatisfied =
|
|
8916
|
+
const requiredInputsSatisfied = React14.useMemo(() => {
|
|
8379
8917
|
if (!product.input_fields || product.input_fields.length === 0) return true;
|
|
8380
8918
|
return product.input_fields.every((field) => {
|
|
8381
8919
|
if (!field.is_required) return true;
|
|
@@ -8388,7 +8926,7 @@ function ProductCustomizer({
|
|
|
8388
8926
|
enabled: quoteEnabled
|
|
8389
8927
|
});
|
|
8390
8928
|
const quoteId = quote?.quote_id;
|
|
8391
|
-
const quotedTotalPrice =
|
|
8929
|
+
const quotedTotalPrice = React14.useMemo(() => {
|
|
8392
8930
|
if (!quote) return void 0;
|
|
8393
8931
|
const priceInfo = quote.quoted_total_price_info ?? quote.final_price_info;
|
|
8394
8932
|
const perUnit = priceInfo.pre_tax_price;
|
|
@@ -8396,7 +8934,7 @@ function ProductCustomizer({
|
|
|
8396
8934
|
return chunk7Y2O3E4D_js.parsePrice(perUnit) * quantity;
|
|
8397
8935
|
}, [quote, quantity]);
|
|
8398
8936
|
const displayTotalPrice = quotedTotalPrice ?? localTotalPrice;
|
|
8399
|
-
const handleVariantChange =
|
|
8937
|
+
const handleVariantChange = React14.useCallback(
|
|
8400
8938
|
(variantId, variant) => {
|
|
8401
8939
|
setSelectedVariantId(variantId);
|
|
8402
8940
|
setSelectedVariant(variant);
|
|
@@ -8404,9 +8942,9 @@ function ProductCustomizer({
|
|
|
8404
8942
|
},
|
|
8405
8943
|
[onVariantChange]
|
|
8406
8944
|
);
|
|
8407
|
-
const addedTimerRef =
|
|
8408
|
-
|
|
8409
|
-
const handleAddToCart =
|
|
8945
|
+
const addedTimerRef = React14.useRef(void 0);
|
|
8946
|
+
React14.useEffect(() => () => clearTimeout(addedTimerRef.current), []);
|
|
8947
|
+
const handleAddToCart = React14.useCallback(async () => {
|
|
8410
8948
|
if (isSubmitting) return;
|
|
8411
8949
|
setIsSubmitting(true);
|
|
8412
8950
|
const options = {
|
|
@@ -8631,14 +9169,14 @@ function ProductImageGallery({
|
|
|
8631
9169
|
aspectRatio = "4/3",
|
|
8632
9170
|
className
|
|
8633
9171
|
}) {
|
|
8634
|
-
const normalizedImages =
|
|
9172
|
+
const normalizedImages = React14.useMemo(
|
|
8635
9173
|
() => images.filter(
|
|
8636
9174
|
(image) => typeof image === "string" && image.trim().length > 0
|
|
8637
9175
|
),
|
|
8638
9176
|
[images]
|
|
8639
9177
|
);
|
|
8640
|
-
const [selectedImage, setSelectedImage] =
|
|
8641
|
-
|
|
9178
|
+
const [selectedImage, setSelectedImage] = React14.useState(0);
|
|
9179
|
+
React14.useEffect(() => {
|
|
8642
9180
|
setSelectedImage(0);
|
|
8643
9181
|
}, [normalizedImages.length, productName]);
|
|
8644
9182
|
if (normalizedImages.length === 0) {
|
|
@@ -8721,9 +9259,9 @@ function StoreVideo({
|
|
|
8721
9259
|
lazy = true,
|
|
8722
9260
|
className
|
|
8723
9261
|
}) {
|
|
8724
|
-
const ref =
|
|
8725
|
-
const [inView, setInView] =
|
|
8726
|
-
|
|
9262
|
+
const ref = React14.useRef(null);
|
|
9263
|
+
const [inView, setInView] = React14.useState(!lazy);
|
|
9264
|
+
React14.useEffect(() => {
|
|
8727
9265
|
if (!lazy || inView) return;
|
|
8728
9266
|
const node = ref.current;
|
|
8729
9267
|
if (!node || typeof IntersectionObserver === "undefined") {
|
|
@@ -8811,8 +9349,8 @@ function ProductModel3D({
|
|
|
8811
9349
|
cameraControls = true,
|
|
8812
9350
|
className
|
|
8813
9351
|
}) {
|
|
8814
|
-
const [ready, setReady] =
|
|
8815
|
-
|
|
9352
|
+
const [ready, setReady] = React14.useState(false);
|
|
9353
|
+
React14.useEffect(() => {
|
|
8816
9354
|
let cancelled = false;
|
|
8817
9355
|
ensureModelViewer().then(
|
|
8818
9356
|
() => {
|
|
@@ -8831,7 +9369,7 @@ function ProductModel3D({
|
|
|
8831
9369
|
"data-cimplify-product-model-3d": true,
|
|
8832
9370
|
className,
|
|
8833
9371
|
style: { position: "relative", overflow: "hidden", ...ASPECT_STYLES3[aspectRatio] },
|
|
8834
|
-
children: ready ?
|
|
9372
|
+
children: ready ? React14__default.default.createElement("model-viewer", {
|
|
8835
9373
|
src,
|
|
8836
9374
|
"ios-src": iosSrc,
|
|
8837
9375
|
alt,
|
|
@@ -8842,12 +9380,12 @@ function ProductModel3D({
|
|
|
8842
9380
|
"auto-rotate": autoRotate || void 0,
|
|
8843
9381
|
"shadow-intensity": "1",
|
|
8844
9382
|
style: { width: "100%", height: "100%", backgroundColor: "transparent" }
|
|
8845
|
-
}) : poster ?
|
|
9383
|
+
}) : poster ? React14__default.default.createElement("img", {
|
|
8846
9384
|
src: poster,
|
|
8847
9385
|
alt: alt ?? "",
|
|
8848
9386
|
"data-cimplify-product-model-3d-loading": true,
|
|
8849
9387
|
style: { width: "100%", height: "100%", objectFit: "cover" }
|
|
8850
|
-
}) :
|
|
9388
|
+
}) : React14__default.default.createElement("div", {
|
|
8851
9389
|
"data-cimplify-product-model-3d-loading": true,
|
|
8852
9390
|
style: { width: "100%", height: "100%", backgroundColor: "var(--muted, #f3f4f6)" }
|
|
8853
9391
|
})
|
|
@@ -8875,12 +9413,12 @@ function MediaGallery({
|
|
|
8875
9413
|
aspectRatio = "4/3",
|
|
8876
9414
|
className
|
|
8877
9415
|
}) {
|
|
8878
|
-
const validItems =
|
|
9416
|
+
const validItems = React14.useMemo(
|
|
8879
9417
|
() => items.filter((i) => typeof i.src === "string" && i.src.trim().length > 0),
|
|
8880
9418
|
[items]
|
|
8881
9419
|
);
|
|
8882
|
-
const [selected, setSelected] =
|
|
8883
|
-
|
|
9420
|
+
const [selected, setSelected] = React14.useState(0);
|
|
9421
|
+
React14.useEffect(() => {
|
|
8884
9422
|
setSelected(0);
|
|
8885
9423
|
}, [validItems.length, productName]);
|
|
8886
9424
|
if (validItems.length === 0) return null;
|
|
@@ -9508,7 +10046,7 @@ var RICH_TEXT_PROSE = cn(
|
|
|
9508
10046
|
"[&_iframe]:my-4 [&_iframe]:aspect-video [&_iframe]:w-full [&_iframe]:rounded-md"
|
|
9509
10047
|
);
|
|
9510
10048
|
function RichText({ html, className, ...rest }) {
|
|
9511
|
-
const clean =
|
|
10049
|
+
const clean = React14.useMemo(() => html ? sanitizeRichTextHtml(html) : "", [html]);
|
|
9512
10050
|
if (!clean) {
|
|
9513
10051
|
return null;
|
|
9514
10052
|
}
|
|
@@ -9604,7 +10142,7 @@ function ProductSheet({
|
|
|
9604
10142
|
}
|
|
9605
10143
|
);
|
|
9606
10144
|
}
|
|
9607
|
-
const [selectedVariant, setSelectedVariant] =
|
|
10145
|
+
const [selectedVariant, setSelectedVariant] = React14.useState(
|
|
9608
10146
|
void 0
|
|
9609
10147
|
);
|
|
9610
10148
|
const variantImages = selectedVariant?.images?.filter(Boolean) ?? [];
|
|
@@ -10629,22 +11167,22 @@ function ProductCard({
|
|
|
10629
11167
|
classNames
|
|
10630
11168
|
}) {
|
|
10631
11169
|
const mode = displayMode ?? product.display_mode ?? "card";
|
|
10632
|
-
const [isOpen, setIsOpen] =
|
|
10633
|
-
const [shouldFetch, setShouldFetch] =
|
|
11170
|
+
const [isOpen, setIsOpen] = React14.useState(false);
|
|
11171
|
+
const [shouldFetch, setShouldFetch] = React14.useState(false);
|
|
10634
11172
|
const { product: productDetails } = useProduct(
|
|
10635
11173
|
product.slug ?? product.id,
|
|
10636
11174
|
{ enabled: shouldFetch || isOpen }
|
|
10637
11175
|
);
|
|
10638
|
-
const handlePrefetch =
|
|
11176
|
+
const handlePrefetch = React14.useCallback(() => {
|
|
10639
11177
|
setShouldFetch(true);
|
|
10640
11178
|
}, []);
|
|
10641
|
-
const handleOpenChange =
|
|
11179
|
+
const handleOpenChange = React14.useCallback((open) => {
|
|
10642
11180
|
setIsOpen(open);
|
|
10643
11181
|
if (open) {
|
|
10644
11182
|
setShouldFetch(true);
|
|
10645
11183
|
}
|
|
10646
11184
|
}, []);
|
|
10647
|
-
const handleClose =
|
|
11185
|
+
const handleClose = React14.useCallback(() => {
|
|
10648
11186
|
setIsOpen(false);
|
|
10649
11187
|
}, []);
|
|
10650
11188
|
const imageUrl = product.image_url || product.images?.[0];
|
|
@@ -10774,13 +11312,13 @@ function ProductGrid({
|
|
|
10774
11312
|
className,
|
|
10775
11313
|
classNames
|
|
10776
11314
|
}) {
|
|
10777
|
-
const rawId =
|
|
11315
|
+
const rawId = React14__default.default.useId();
|
|
10778
11316
|
const gridId = `cimplify-grid-${rawId.replace(/:/g, "")}`;
|
|
10779
11317
|
const sm = columns?.sm ?? 1;
|
|
10780
11318
|
const md = columns?.md ?? 2;
|
|
10781
11319
|
const lg = columns?.lg ?? 3;
|
|
10782
11320
|
const xl = columns?.xl ?? 4;
|
|
10783
|
-
const css =
|
|
11321
|
+
const css = React14__default.default.useMemo(
|
|
10784
11322
|
() => [
|
|
10785
11323
|
`#${gridId}{display:grid;grid-template-columns:repeat(${sm},1fr);gap:1rem}`,
|
|
10786
11324
|
`@media(min-width:768px){#${gridId}{grid-template-columns:repeat(${md},1fr)}}`,
|
|
@@ -10858,12 +11396,12 @@ function SearchInput({
|
|
|
10858
11396
|
className,
|
|
10859
11397
|
classNames
|
|
10860
11398
|
}) {
|
|
10861
|
-
const mergedOptions =
|
|
11399
|
+
const mergedOptions = React14.useMemo(
|
|
10862
11400
|
() => categoryId ? { ...searchOptions, category: categoryId } : searchOptions ?? {},
|
|
10863
11401
|
[searchOptions, categoryId]
|
|
10864
11402
|
);
|
|
10865
11403
|
const { results, isLoading, query, setQuery, clear } = useSearch(mergedOptions);
|
|
10866
|
-
const handleValueChange =
|
|
11404
|
+
const handleValueChange = React14.useCallback(
|
|
10867
11405
|
(value) => {
|
|
10868
11406
|
setQuery(value);
|
|
10869
11407
|
},
|
|
@@ -10962,7 +11500,7 @@ function CategoryFilter({
|
|
|
10962
11500
|
classNames
|
|
10963
11501
|
}) {
|
|
10964
11502
|
const { categories, isLoading } = useCategories();
|
|
10965
|
-
const handleValueChange =
|
|
11503
|
+
const handleValueChange = React14.useCallback(
|
|
10966
11504
|
(value) => {
|
|
10967
11505
|
onSelect(value === ALL_VALUE ? null : String(value));
|
|
10968
11506
|
},
|
|
@@ -11029,10 +11567,10 @@ function DiscountInput({
|
|
|
11029
11567
|
className,
|
|
11030
11568
|
classNames
|
|
11031
11569
|
}) {
|
|
11032
|
-
const [code, setCode] =
|
|
11033
|
-
const [appliedValidation, setAppliedValidation] =
|
|
11570
|
+
const [code, setCode] = React14.useState("");
|
|
11571
|
+
const [appliedValidation, setAppliedValidation] = React14.useState(null);
|
|
11034
11572
|
const { validate, isValidating, error } = useValidateDiscount();
|
|
11035
|
-
const handleApply =
|
|
11573
|
+
const handleApply = React14.useCallback(async () => {
|
|
11036
11574
|
const trimmed = code.trim();
|
|
11037
11575
|
if (!trimmed) return;
|
|
11038
11576
|
const result = await validate(trimmed, orderSubtotal, locationId);
|
|
@@ -11045,12 +11583,12 @@ function DiscountInput({
|
|
|
11045
11583
|
}
|
|
11046
11584
|
}
|
|
11047
11585
|
}, [code, validate, orderSubtotal, locationId, onApply]);
|
|
11048
|
-
const handleClear =
|
|
11586
|
+
const handleClear = React14.useCallback(() => {
|
|
11049
11587
|
setCode("");
|
|
11050
11588
|
setAppliedValidation(null);
|
|
11051
11589
|
onClear?.();
|
|
11052
11590
|
}, [onClear]);
|
|
11053
|
-
const handleKeyDown =
|
|
11591
|
+
const handleKeyDown = React14.useCallback(
|
|
11054
11592
|
(e) => {
|
|
11055
11593
|
if (e.key === "Enter") {
|
|
11056
11594
|
void handleApply();
|
|
@@ -11141,7 +11679,7 @@ function CategoryGrid({
|
|
|
11141
11679
|
enabled: categoriesProp === void 0
|
|
11142
11680
|
});
|
|
11143
11681
|
const categories = categoriesProp ?? fetched;
|
|
11144
|
-
const rawId =
|
|
11682
|
+
const rawId = React14__default.default.useId();
|
|
11145
11683
|
const gridId = `cimplify-cat-grid-${rawId.replace(/:/g, "")}`;
|
|
11146
11684
|
const sm = columns?.sm ?? 2;
|
|
11147
11685
|
const md = columns?.md ?? 3;
|
|
@@ -11367,7 +11905,7 @@ function OrderSummary({
|
|
|
11367
11905
|
/* @__PURE__ */ jsxRuntime.jsx("p", { children: order.delivery_address })
|
|
11368
11906
|
] }),
|
|
11369
11907
|
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-order-items": true, className: classNames?.items, children: order.items.map(
|
|
11370
|
-
(item) => renderLineItem ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
11908
|
+
(item) => renderLineItem ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderLineItem(item) }, item.id) : /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-line-item": true, className: classNames?.lineItem, children: [
|
|
11371
11909
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-line-info": true, children: [
|
|
11372
11910
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-order-line-qty": true, children: [
|
|
11373
11911
|
item.quantity,
|
|
@@ -12025,13 +12563,13 @@ function BookingPage({
|
|
|
12025
12563
|
const { addItem } = useCart();
|
|
12026
12564
|
const { client } = useCimplifyClient();
|
|
12027
12565
|
const isReschedule = existingBooking !== void 0;
|
|
12028
|
-
const [step, setStep] =
|
|
12029
|
-
const [selectedSlot, setSelectedSlot] =
|
|
12030
|
-
const [selectedDate, setSelectedDate] =
|
|
12031
|
-
const [selectedStaffId, setSelectedStaffId] =
|
|
12032
|
-
const [selectedResourceId, setSelectedResourceId] =
|
|
12033
|
-
const [isSubmitting, setIsSubmitting] =
|
|
12034
|
-
const [error, setError] =
|
|
12566
|
+
const [step, setStep] = React14.useState(STEP.SELECT_SLOT);
|
|
12567
|
+
const [selectedSlot, setSelectedSlot] = React14.useState(null);
|
|
12568
|
+
const [selectedDate, setSelectedDate] = React14.useState(null);
|
|
12569
|
+
const [selectedStaffId, setSelectedStaffId] = React14.useState(null);
|
|
12570
|
+
const [selectedResourceId, setSelectedResourceId] = React14.useState(null);
|
|
12571
|
+
const [isSubmitting, setIsSubmitting] = React14.useState(false);
|
|
12572
|
+
const [error, setError] = React14.useState(null);
|
|
12035
12573
|
const hasResourceStep = resources && resources.length > 0;
|
|
12036
12574
|
const hasStaffStep = staff && staff.length > 0;
|
|
12037
12575
|
const depositType = product?.deposit_type;
|
|
@@ -12039,7 +12577,7 @@ function BookingPage({
|
|
|
12039
12577
|
const hasDeposit = depositType !== void 0 && depositType !== "none" && depositAmount !== void 0 && chunk7Y2O3E4D_js.parsePrice(depositAmount) !== 0;
|
|
12040
12578
|
const cancellationMinutes = product?.cancellation_window_minutes;
|
|
12041
12579
|
const noShowFee = product?.no_show_fee;
|
|
12042
|
-
const handleSlotSelect =
|
|
12580
|
+
const handleSlotSelect = React14.useCallback(
|
|
12043
12581
|
(slot, date) => {
|
|
12044
12582
|
setSelectedSlot(slot);
|
|
12045
12583
|
setSelectedDate(date);
|
|
@@ -12054,7 +12592,7 @@ function BookingPage({
|
|
|
12054
12592
|
},
|
|
12055
12593
|
[hasResourceStep, hasStaffStep]
|
|
12056
12594
|
);
|
|
12057
|
-
const handleResourceSelect =
|
|
12595
|
+
const handleResourceSelect = React14.useCallback(
|
|
12058
12596
|
(resourceId) => {
|
|
12059
12597
|
setSelectedResourceId(resourceId);
|
|
12060
12598
|
if (hasStaffStep) {
|
|
@@ -12065,11 +12603,11 @@ function BookingPage({
|
|
|
12065
12603
|
},
|
|
12066
12604
|
[hasStaffStep]
|
|
12067
12605
|
);
|
|
12068
|
-
const handleStaffSelect =
|
|
12606
|
+
const handleStaffSelect = React14.useCallback((staffId) => {
|
|
12069
12607
|
setSelectedStaffId(staffId);
|
|
12070
12608
|
setStep(STEP.CONFIRM);
|
|
12071
12609
|
}, []);
|
|
12072
|
-
const handleBack =
|
|
12610
|
+
const handleBack = React14.useCallback(() => {
|
|
12073
12611
|
setError(null);
|
|
12074
12612
|
if (step === STEP.CONFIRM && hasStaffStep) {
|
|
12075
12613
|
setStep(STEP.SELECT_STAFF);
|
|
@@ -12083,7 +12621,7 @@ function BookingPage({
|
|
|
12083
12621
|
onBack?.();
|
|
12084
12622
|
}
|
|
12085
12623
|
}, [step, hasStaffStep, hasResourceStep, onBack]);
|
|
12086
|
-
const handleConfirm =
|
|
12624
|
+
const handleConfirm = React14.useCallback(async () => {
|
|
12087
12625
|
if (!selectedSlot || !selectedDate) return;
|
|
12088
12626
|
setIsSubmitting(true);
|
|
12089
12627
|
setError(null);
|
|
@@ -12285,9 +12823,9 @@ function BookingsPage({
|
|
|
12285
12823
|
className,
|
|
12286
12824
|
classNames
|
|
12287
12825
|
}) {
|
|
12288
|
-
const [filter, setFilter] =
|
|
12289
|
-
const [selectedBooking, setSelectedBooking] =
|
|
12290
|
-
const handleBookingClick =
|
|
12826
|
+
const [filter, setFilter] = React14.useState("all");
|
|
12827
|
+
const [selectedBooking, setSelectedBooking] = React14.useState(null);
|
|
12828
|
+
const handleBookingClick = React14.useCallback(
|
|
12291
12829
|
(booking) => {
|
|
12292
12830
|
if (onBookingNavigate) {
|
|
12293
12831
|
onBookingNavigate(booking);
|
|
@@ -12297,7 +12835,7 @@ function BookingsPage({
|
|
|
12297
12835
|
},
|
|
12298
12836
|
[onBookingNavigate]
|
|
12299
12837
|
);
|
|
12300
|
-
const handleBack =
|
|
12838
|
+
const handleBack = React14.useCallback(() => {
|
|
12301
12839
|
setSelectedBooking(null);
|
|
12302
12840
|
}, []);
|
|
12303
12841
|
if (selectedBooking && !onBookingNavigate) {
|
|
@@ -12527,7 +13065,7 @@ function DefaultCatalogueLayout({
|
|
|
12527
13065
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No products found" }),
|
|
12528
13066
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try adjusting your filters" })
|
|
12529
13067
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4", children: products.map(
|
|
12530
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
13068
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12531
13069
|
ProductCard,
|
|
12532
13070
|
{
|
|
12533
13071
|
product,
|
|
@@ -12634,7 +13172,7 @@ function CompactCatalogueLayout({
|
|
|
12634
13172
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No items found" }),
|
|
12635
13173
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different category or search" })
|
|
12636
13174
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-5", children: products.map(
|
|
12637
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
13175
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12638
13176
|
ProductCard,
|
|
12639
13177
|
{
|
|
12640
13178
|
product,
|
|
@@ -12657,8 +13195,8 @@ var BUILT_IN_LAYOUTS = {
|
|
|
12657
13195
|
["compact" /* Compact */]: CompactCatalogueLayout
|
|
12658
13196
|
};
|
|
12659
13197
|
function useDebounce(value, delay) {
|
|
12660
|
-
const [debounced, setDebounced] =
|
|
12661
|
-
|
|
13198
|
+
const [debounced, setDebounced] = React14__default.default.useState(value);
|
|
13199
|
+
React14__default.default.useEffect(() => {
|
|
12662
13200
|
const timer = setTimeout(() => setDebounced(value), delay);
|
|
12663
13201
|
return () => clearTimeout(timer);
|
|
12664
13202
|
}, [value, delay]);
|
|
@@ -12682,15 +13220,15 @@ function CataloguePage({
|
|
|
12682
13220
|
className,
|
|
12683
13221
|
classNames
|
|
12684
13222
|
}) {
|
|
12685
|
-
const [selectedCategory, setSelectedCategory] =
|
|
12686
|
-
const [searchQuery, setSearchQuery] =
|
|
12687
|
-
const [sortBy, setSortBy] =
|
|
12688
|
-
const [sortOrder, setSortOrder] =
|
|
12689
|
-
const [inStockOnly, setInStockOnly] =
|
|
12690
|
-
const [selectedTags, setSelectedTags] =
|
|
12691
|
-
const [minPrice, setMinPrice] =
|
|
12692
|
-
const [maxPrice, setMaxPrice] =
|
|
12693
|
-
const [page, setPage] =
|
|
13223
|
+
const [selectedCategory, setSelectedCategory] = React14.useState(null);
|
|
13224
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
13225
|
+
const [sortBy, setSortBy] = React14.useState(defaultSort?.by ?? "created_at");
|
|
13226
|
+
const [sortOrder, setSortOrder] = React14.useState(defaultSort?.order ?? "desc");
|
|
13227
|
+
const [inStockOnly, setInStockOnly] = React14.useState(false);
|
|
13228
|
+
const [selectedTags, setSelectedTags] = React14.useState([]);
|
|
13229
|
+
const [minPrice, setMinPrice] = React14.useState("");
|
|
13230
|
+
const [maxPrice, setMaxPrice] = React14.useState("");
|
|
13231
|
+
const [page, setPage] = React14.useState(1);
|
|
12694
13232
|
const debouncedSearch = useDebounce(searchQuery, 300);
|
|
12695
13233
|
const { products: fetchedProducts, isLoading, pagination } = useProducts({
|
|
12696
13234
|
enabled: productsProp === void 0,
|
|
@@ -12711,22 +13249,22 @@ function CataloguePage({
|
|
|
12711
13249
|
const products = productsProp ?? fetchedProducts;
|
|
12712
13250
|
const categories = categoriesProp ?? fetchedCategories;
|
|
12713
13251
|
const totalPages = pagination?.total_pages ?? 1;
|
|
12714
|
-
const handleCategoryChange =
|
|
13252
|
+
const handleCategoryChange = React14.useCallback((id) => {
|
|
12715
13253
|
setSelectedCategory(id);
|
|
12716
13254
|
setPage(1);
|
|
12717
13255
|
}, []);
|
|
12718
|
-
const handleSortChange =
|
|
13256
|
+
const handleSortChange = React14.useCallback((by, order) => {
|
|
12719
13257
|
setSortBy(by);
|
|
12720
13258
|
setSortOrder(order);
|
|
12721
13259
|
setPage(1);
|
|
12722
13260
|
}, []);
|
|
12723
|
-
const handleTagToggle =
|
|
13261
|
+
const handleTagToggle = React14.useCallback((tag) => {
|
|
12724
13262
|
setSelectedTags(
|
|
12725
13263
|
(prev) => prev.includes(tag) ? prev.filter((t) => t !== tag) : [...prev, tag]
|
|
12726
13264
|
);
|
|
12727
13265
|
setPage(1);
|
|
12728
13266
|
}, []);
|
|
12729
|
-
const handlePriceRangeChange =
|
|
13267
|
+
const handlePriceRangeChange = React14.useCallback((min, max) => {
|
|
12730
13268
|
setMinPrice(min);
|
|
12731
13269
|
setMaxPrice(max);
|
|
12732
13270
|
setPage(1);
|
|
@@ -12914,7 +13452,7 @@ function DefaultProductLayout({
|
|
|
12914
13452
|
showRelated = true,
|
|
12915
13453
|
className
|
|
12916
13454
|
}) {
|
|
12917
|
-
const [selectedVariantId, setSelectedVariantId] =
|
|
13455
|
+
const [selectedVariantId, setSelectedVariantId] = React14__default.default.useState();
|
|
12918
13456
|
const images = chunkIQLJJW2H_js.resolveGallery(product, selectedVariantId);
|
|
12919
13457
|
const hasRange = product.quantity_pricing && product.quantity_pricing.length > 1 || product.variants && product.variants.length > 1;
|
|
12920
13458
|
const onSale = chunk7Y2O3E4D_js.isOnSale(product);
|
|
@@ -13832,36 +14370,36 @@ function CartPage({
|
|
|
13832
14370
|
}
|
|
13833
14371
|
) });
|
|
13834
14372
|
}
|
|
13835
|
-
var CartDrawerContext =
|
|
14373
|
+
var CartDrawerContext = React14.createContext(null);
|
|
13836
14374
|
function useCartDrawer() {
|
|
13837
|
-
const ctx =
|
|
14375
|
+
const ctx = React14.useContext(CartDrawerContext);
|
|
13838
14376
|
if (!ctx) {
|
|
13839
14377
|
throw new Error("useCartDrawer must be used within <CartDrawerProvider>");
|
|
13840
14378
|
}
|
|
13841
14379
|
return ctx;
|
|
13842
14380
|
}
|
|
13843
14381
|
function CartDrawerProvider({ children, openOnAdd = true }) {
|
|
13844
|
-
const [isOpen, setIsOpen] =
|
|
14382
|
+
const [isOpen, setIsOpen] = React14.useState(false);
|
|
13845
14383
|
const cart = useCart();
|
|
13846
|
-
const lastPendingRef =
|
|
13847
|
-
const open =
|
|
13848
|
-
const close =
|
|
13849
|
-
const toggle =
|
|
13850
|
-
|
|
14384
|
+
const lastPendingRef = React14.useRef(0);
|
|
14385
|
+
const open = React14.useCallback(() => setIsOpen(true), []);
|
|
14386
|
+
const close = React14.useCallback(() => setIsOpen(false), []);
|
|
14387
|
+
const toggle = React14.useCallback(() => setIsOpen((v) => !v), []);
|
|
14388
|
+
React14.useEffect(() => {
|
|
13851
14389
|
if (!openOnAdd) return;
|
|
13852
14390
|
if (cart.pendingOpCount > lastPendingRef.current && cart.pendingOpCount > 0) {
|
|
13853
14391
|
setIsOpen(true);
|
|
13854
14392
|
}
|
|
13855
14393
|
lastPendingRef.current = cart.pendingOpCount;
|
|
13856
14394
|
}, [cart.pendingOpCount, openOnAdd]);
|
|
13857
|
-
const value =
|
|
14395
|
+
const value = React14.useMemo(() => ({ isOpen, open, close, toggle }), [isOpen, open, close, toggle]);
|
|
13858
14396
|
return /* @__PURE__ */ jsxRuntime.jsx(CartDrawerContext.Provider, { value, children });
|
|
13859
14397
|
}
|
|
13860
14398
|
function useAnimatedNumber(target, durationMs = 250) {
|
|
13861
|
-
const [value, setValue] =
|
|
13862
|
-
const fromRef =
|
|
13863
|
-
const startRef =
|
|
13864
|
-
|
|
14399
|
+
const [value, setValue] = React14.useState(target);
|
|
14400
|
+
const fromRef = React14.useRef(target);
|
|
14401
|
+
const startRef = React14.useRef(null);
|
|
14402
|
+
React14.useEffect(() => {
|
|
13865
14403
|
fromRef.current = value;
|
|
13866
14404
|
startRef.current = null;
|
|
13867
14405
|
let raf = 0;
|
|
@@ -13889,7 +14427,7 @@ function CartDrawer({
|
|
|
13889
14427
|
const cart = useCart();
|
|
13890
14428
|
const subtotalNum = chunk7Y2O3E4D_js.parsePrice(cart.subtotal);
|
|
13891
14429
|
const animatedSubtotal = useAnimatedNumber(subtotalNum);
|
|
13892
|
-
|
|
14430
|
+
React14.useEffect(() => {
|
|
13893
14431
|
if (!isOpen) return;
|
|
13894
14432
|
const original = document.body.style.overflow;
|
|
13895
14433
|
document.body.style.overflow = "hidden";
|
|
@@ -14094,9 +14632,9 @@ function DefaultCollectionLayout({
|
|
|
14094
14632
|
onQuickAdd,
|
|
14095
14633
|
className
|
|
14096
14634
|
}) {
|
|
14097
|
-
const [searchQuery, setSearchQuery] =
|
|
14098
|
-
const [activeTag, setActiveTag] =
|
|
14099
|
-
const collectionTags =
|
|
14635
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
14636
|
+
const [activeTag, setActiveTag] = React14.useState(null);
|
|
14637
|
+
const collectionTags = React14.useMemo(() => {
|
|
14100
14638
|
const tagSet = /* @__PURE__ */ new Set();
|
|
14101
14639
|
for (const p of products) {
|
|
14102
14640
|
if (p.tags) {
|
|
@@ -14105,7 +14643,7 @@ function DefaultCollectionLayout({
|
|
|
14105
14643
|
}
|
|
14106
14644
|
return Array.from(tagSet).slice(0, 6);
|
|
14107
14645
|
}, [products]);
|
|
14108
|
-
const filtered =
|
|
14646
|
+
const filtered = React14.useMemo(() => {
|
|
14109
14647
|
let result = products;
|
|
14110
14648
|
if (searchQuery.trim().length >= 2) {
|
|
14111
14649
|
const q = searchQuery.toLowerCase();
|
|
@@ -14180,7 +14718,7 @@ function DefaultCollectionLayout({
|
|
|
14180
14718
|
] })
|
|
14181
14719
|
] }),
|
|
14182
14720
|
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(
|
|
14183
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
14721
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14184
14722
|
ProductCard,
|
|
14185
14723
|
{
|
|
14186
14724
|
product,
|
|
@@ -14233,7 +14771,7 @@ function FeaturedCollectionLayout({
|
|
|
14233
14771
|
] })
|
|
14234
14772
|
] }),
|
|
14235
14773
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: products.map(
|
|
14236
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
14774
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14237
14775
|
ProductCard,
|
|
14238
14776
|
{
|
|
14239
14777
|
product,
|
|
@@ -14255,10 +14793,10 @@ function CatalogueCollectionLayout({
|
|
|
14255
14793
|
onQuickAdd,
|
|
14256
14794
|
className
|
|
14257
14795
|
}) {
|
|
14258
|
-
const [searchQuery, setSearchQuery] =
|
|
14259
|
-
const [activeCategory, setActiveCategory] =
|
|
14260
|
-
const [sortBy, setSortBy] =
|
|
14261
|
-
const categories =
|
|
14796
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
14797
|
+
const [activeCategory, setActiveCategory] = React14.useState(null);
|
|
14798
|
+
const [sortBy, setSortBy] = React14.useState("default");
|
|
14799
|
+
const categories = React14.useMemo(() => {
|
|
14262
14800
|
const cats = /* @__PURE__ */ new Map();
|
|
14263
14801
|
for (const p of products) {
|
|
14264
14802
|
if (p.category_id && p.tags) {
|
|
@@ -14269,7 +14807,7 @@ function CatalogueCollectionLayout({
|
|
|
14269
14807
|
}
|
|
14270
14808
|
return Array.from(cats.values()).slice(0, 8);
|
|
14271
14809
|
}, [products]);
|
|
14272
|
-
const filtered =
|
|
14810
|
+
const filtered = React14.useMemo(() => {
|
|
14273
14811
|
let result = products;
|
|
14274
14812
|
if (searchQuery.trim().length >= 2) {
|
|
14275
14813
|
const q = searchQuery.toLowerCase();
|
|
@@ -14357,7 +14895,7 @@ function CatalogueCollectionLayout({
|
|
|
14357
14895
|
] })
|
|
14358
14896
|
] }),
|
|
14359
14897
|
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(
|
|
14360
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
14898
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14361
14899
|
ProductCard,
|
|
14362
14900
|
{
|
|
14363
14901
|
product,
|
|
@@ -14536,13 +15074,13 @@ function OrderHistoryPage({
|
|
|
14536
15074
|
className,
|
|
14537
15075
|
classNames
|
|
14538
15076
|
}) {
|
|
14539
|
-
const [statusFilter, setStatusFilter] =
|
|
14540
|
-
const [selectedOrder, setSelectedOrder] =
|
|
14541
|
-
const handleTabChange =
|
|
15077
|
+
const [statusFilter, setStatusFilter] = React14.useState(void 0);
|
|
15078
|
+
const [selectedOrder, setSelectedOrder] = React14.useState(null);
|
|
15079
|
+
const handleTabChange = React14.useCallback((value) => {
|
|
14542
15080
|
const filter = STATUS_FILTERS.find((f) => f.tabValue === value);
|
|
14543
15081
|
setStatusFilter(filter?.value);
|
|
14544
15082
|
}, []);
|
|
14545
|
-
const handleOrderClick =
|
|
15083
|
+
const handleOrderClick = React14.useCallback(
|
|
14546
15084
|
(order) => {
|
|
14547
15085
|
if (onOrderNavigate) {
|
|
14548
15086
|
onOrderNavigate(order);
|
|
@@ -14552,7 +15090,7 @@ function OrderHistoryPage({
|
|
|
14552
15090
|
},
|
|
14553
15091
|
[onOrderNavigate]
|
|
14554
15092
|
);
|
|
14555
|
-
const handleBack =
|
|
15093
|
+
const handleBack = React14.useCallback(() => {
|
|
14556
15094
|
setSelectedOrder(null);
|
|
14557
15095
|
}, []);
|
|
14558
15096
|
const activeTabValue = STATUS_FILTERS.find((f) => f.value === statusFilter)?.tabValue ?? "all";
|
|
@@ -14737,7 +15275,7 @@ function DefaultSearchLayout({
|
|
|
14737
15275
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
14738
15276
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
14739
15277
|
] }) : results.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4", children: results.map(
|
|
14740
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
15278
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14741
15279
|
ProductCard,
|
|
14742
15280
|
{
|
|
14743
15281
|
product,
|
|
@@ -14839,7 +15377,7 @@ function CompactSearchLayout({
|
|
|
14839
15377
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
14840
15378
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
14841
15379
|
] }) : results.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-5", children: results.map(
|
|
14842
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
15380
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14843
15381
|
ProductCard,
|
|
14844
15382
|
{
|
|
14845
15383
|
product,
|
|
@@ -15170,11 +15708,11 @@ function DeliveryEstimate({
|
|
|
15170
15708
|
}) {
|
|
15171
15709
|
const context = useOptionalCimplifyClient();
|
|
15172
15710
|
const client = context?.client ?? null;
|
|
15173
|
-
const [result, setResult] =
|
|
15174
|
-
const [isLoading, setIsLoading] =
|
|
15175
|
-
const [error, setError] =
|
|
15176
|
-
const requestIdRef =
|
|
15177
|
-
|
|
15711
|
+
const [result, setResult] = React14.useState(null);
|
|
15712
|
+
const [isLoading, setIsLoading] = React14.useState(true);
|
|
15713
|
+
const [error, setError] = React14.useState(null);
|
|
15714
|
+
const requestIdRef = React14.useRef(0);
|
|
15715
|
+
React14.useEffect(() => {
|
|
15178
15716
|
if (!client) return;
|
|
15179
15717
|
const nextRequestId = ++requestIdRef.current;
|
|
15180
15718
|
setIsLoading(true);
|
|
@@ -15255,10 +15793,10 @@ function CurrencySelector({
|
|
|
15255
15793
|
}) {
|
|
15256
15794
|
const context = useOptionalCimplifyClient();
|
|
15257
15795
|
const client = context?.client ?? null;
|
|
15258
|
-
const [rates, setRates] =
|
|
15259
|
-
const [isLoadingRates, setIsLoadingRates] =
|
|
15260
|
-
const requestIdRef =
|
|
15261
|
-
|
|
15796
|
+
const [rates, setRates] = React14.useState({});
|
|
15797
|
+
const [isLoadingRates, setIsLoadingRates] = React14.useState(false);
|
|
15798
|
+
const requestIdRef = React14.useRef(0);
|
|
15799
|
+
React14.useEffect(() => {
|
|
15262
15800
|
if (!showRate || !baseCurrency || !client) return;
|
|
15263
15801
|
const targets = currencies.filter((c) => c !== baseCurrency);
|
|
15264
15802
|
if (targets.length === 0) return;
|
|
@@ -15321,11 +15859,11 @@ function ChatWidget({
|
|
|
15321
15859
|
}) {
|
|
15322
15860
|
const context = useOptionalCimplifyClient();
|
|
15323
15861
|
const client = clientProp ?? context?.client;
|
|
15324
|
-
const [open, setOpen] =
|
|
15325
|
-
const [unread, setUnread] =
|
|
15862
|
+
const [open, setOpen] = React14.useState(defaultOpen);
|
|
15863
|
+
const [unread, setUnread] = React14.useState(0);
|
|
15326
15864
|
const { messages, isLoading, isSending, error, isActive, send, startConversation } = useChat({ client, pollInterval });
|
|
15327
|
-
const prevCountRef =
|
|
15328
|
-
|
|
15865
|
+
const prevCountRef = React14.useRef(messages.length);
|
|
15866
|
+
React14.useEffect(() => {
|
|
15329
15867
|
if (!open && messages.length > prevCountRef.current) {
|
|
15330
15868
|
const newMessages = messages.slice(prevCountRef.current);
|
|
15331
15869
|
const incomingCount = newMessages.filter(
|
|
@@ -15335,11 +15873,11 @@ function ChatWidget({
|
|
|
15335
15873
|
}
|
|
15336
15874
|
prevCountRef.current = messages.length;
|
|
15337
15875
|
}, [messages, open]);
|
|
15338
|
-
const handleOpen =
|
|
15876
|
+
const handleOpen = React14.useCallback(() => {
|
|
15339
15877
|
setOpen(true);
|
|
15340
15878
|
setUnread(0);
|
|
15341
15879
|
}, []);
|
|
15342
|
-
const handleClose =
|
|
15880
|
+
const handleClose = React14.useCallback(() => setOpen(false), []);
|
|
15343
15881
|
const isLeft = position === "bottom-left";
|
|
15344
15882
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15345
15883
|
"div",
|
|
@@ -15581,8 +16119,8 @@ function MessageList({
|
|
|
15581
16119
|
isSending,
|
|
15582
16120
|
className
|
|
15583
16121
|
}) {
|
|
15584
|
-
const bottomRef =
|
|
15585
|
-
|
|
16122
|
+
const bottomRef = React14.useRef(null);
|
|
16123
|
+
React14.useEffect(() => {
|
|
15586
16124
|
bottomRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
15587
16125
|
}, [messages.length, isSending]);
|
|
15588
16126
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -15642,9 +16180,9 @@ function ChatInput({
|
|
|
15642
16180
|
onSend,
|
|
15643
16181
|
className
|
|
15644
16182
|
}) {
|
|
15645
|
-
const [value, setValue] =
|
|
15646
|
-
const textareaRef =
|
|
15647
|
-
const handleSend =
|
|
16183
|
+
const [value, setValue] = React14.useState("");
|
|
16184
|
+
const textareaRef = React14.useRef(null);
|
|
16185
|
+
const handleSend = React14.useCallback(() => {
|
|
15648
16186
|
const trimmed = value.trim();
|
|
15649
16187
|
if (!trimmed || isSending) return;
|
|
15650
16188
|
setValue("");
|
|
@@ -15653,7 +16191,7 @@ function ChatInput({
|
|
|
15653
16191
|
}
|
|
15654
16192
|
onSend(trimmed);
|
|
15655
16193
|
}, [value, isSending, onSend]);
|
|
15656
|
-
const handleKeyDown =
|
|
16194
|
+
const handleKeyDown = React14.useCallback(
|
|
15657
16195
|
(e) => {
|
|
15658
16196
|
if (e.key === "Enter" && !e.shiftKey) {
|
|
15659
16197
|
e.preventDefault();
|
|
@@ -15662,7 +16200,7 @@ function ChatInput({
|
|
|
15662
16200
|
},
|
|
15663
16201
|
[handleSend]
|
|
15664
16202
|
);
|
|
15665
|
-
const handleInput =
|
|
16203
|
+
const handleInput = React14.useCallback(() => {
|
|
15666
16204
|
const el = textareaRef.current;
|
|
15667
16205
|
if (!el) return;
|
|
15668
16206
|
el.style.height = "auto";
|
|
@@ -15802,8 +16340,11 @@ exports.AccountContent = AccountContent;
|
|
|
15802
16340
|
exports.AccountDashboardPage = AccountDashboardPage;
|
|
15803
16341
|
exports.AccountHero = AccountHero;
|
|
15804
16342
|
exports.AccountIdentityStrip = AccountIdentityStrip;
|
|
16343
|
+
exports.AccountLineItem = AccountLineItem;
|
|
16344
|
+
exports.AccountLineItems = AccountLineItems;
|
|
15805
16345
|
exports.AccountNav = AccountNav;
|
|
15806
16346
|
exports.AccountOrderDetailPage = AccountOrderDetailPage;
|
|
16347
|
+
exports.AccountOrderView = AccountOrderView;
|
|
15807
16348
|
exports.AccountOrdersPage = AccountOrdersPage;
|
|
15808
16349
|
exports.AccountShell = AccountShell;
|
|
15809
16350
|
exports.AccountSidebar = AccountSidebar;
|
|
@@ -15873,6 +16414,7 @@ exports.DefaultCollectionLayout = DefaultCollectionLayout;
|
|
|
15873
16414
|
exports.DefaultProductLayout = DefaultProductLayout;
|
|
15874
16415
|
exports.DefaultSearchLayout = DefaultSearchLayout;
|
|
15875
16416
|
exports.DeliveryEstimate = DeliveryEstimate;
|
|
16417
|
+
exports.DeliveryTracker = DeliveryTracker;
|
|
15876
16418
|
exports.DeliveryTruckIcon = DeliveryTruckIcon;
|
|
15877
16419
|
exports.DigitalProductCard = DigitalProductCard;
|
|
15878
16420
|
exports.DigitalProductLayout = DigitalProductLayout;
|
|
@@ -15890,6 +16432,7 @@ exports.IdentityOfframp = IdentityOfframp;
|
|
|
15890
16432
|
exports.InventoryBadge = InventoryBadge;
|
|
15891
16433
|
exports.ItemsCard = ItemsCard;
|
|
15892
16434
|
exports.LeaseServiceCard = LeaseServiceCard;
|
|
16435
|
+
exports.LineItemDetails = LineItemDetails;
|
|
15893
16436
|
exports.LocationPicker = LocationPicker;
|
|
15894
16437
|
exports.MediaGallery = MediaGallery;
|
|
15895
16438
|
exports.MetadataStringList = MetadataStringList;
|