@cimplify/sdk 0.68.0 → 0.70.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/README.md +3 -2
- package/dist/advanced.d.mts +1 -1
- package/dist/advanced.d.ts +1 -1
- package/dist/advanced.js +20 -20
- package/dist/advanced.mjs +1 -1
- package/dist/{chunk-TAKORJP4.mjs → chunk-6XXVA3IV.mjs} +2 -2
- package/dist/{chunk-WCSAZRNC.js → chunk-BCWPRPK7.js} +10 -0
- package/dist/{chunk-KNPE4WCQ.mjs → chunk-EAVXSFAB.mjs} +1 -1
- package/dist/{chunk-SXGFJEME.js → chunk-I4MP2XZS.js} +73 -7
- package/dist/{chunk-SOV4H6PQ.mjs → chunk-M2CXZQHS.mjs} +10 -0
- package/dist/{chunk-FVGVJ4TC.mjs → chunk-O3ECKVOM.mjs} +73 -7
- package/dist/{chunk-5HAUJBOK.js → chunk-QZQEGRGB.js} +35 -35
- package/dist/{chunk-NGQCWFKF.js → chunk-SC5DUKGD.js} +4 -4
- package/dist/{client-CBE7ksYC.d.mts → client-BRGGjeny.d.mts} +1 -1
- package/dist/{client-Dyo3dvNy.d.mts → client-DRJvXz54.d.mts} +181 -21
- package/dist/{client-DlXfZy7N.d.ts → client-Des_GqmQ.d.ts} +1 -1
- package/dist/{client-CfeQRwhl.d.ts → client-DjQhg6yr.d.ts} +181 -21
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +68 -68
- package/dist/index.mjs +3 -3
- 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 +166 -2
- package/dist/react.d.ts +166 -2
- package/dist/react.js +1223 -493
- package/dist/react.mjs +801 -79
- package/dist/server.d.mts +2 -2
- package/dist/server.d.ts +2 -2
- package/dist/server.js +7 -7
- package/dist/server.mjs +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 +23 -23
- package/dist/testing/suite.mjs +4 -4
- package/dist/testing.d.mts +2 -2
- package/dist/testing.d.ts +2 -2
- package/dist/testing.js +79 -79
- package/dist/testing.mjs +5 -5
- package/package.json +1 -1
package/dist/react.js
CHANGED
|
@@ -2,15 +2,16 @@
|
|
|
2
2
|
'use strict';
|
|
3
3
|
|
|
4
4
|
var chunkIQLJJW2H_js = require('./chunk-IQLJJW2H.js');
|
|
5
|
-
var
|
|
6
|
-
var
|
|
5
|
+
var chunkQZQEGRGB_js = require('./chunk-QZQEGRGB.js');
|
|
6
|
+
var chunkBCWPRPK7_js = require('./chunk-BCWPRPK7.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');
|
|
14
|
+
var dateFns = require('date-fns');
|
|
14
15
|
var numberField = require('@base-ui/react/number-field');
|
|
15
16
|
var radioGroup = require('@base-ui/react/radio-group');
|
|
16
17
|
var radio = require('@base-ui/react/radio');
|
|
@@ -18,7 +19,6 @@ var checkbox = require('@base-ui/react/checkbox');
|
|
|
18
19
|
var button = require('@base-ui/react/button');
|
|
19
20
|
var popover = require('@base-ui/react/popover');
|
|
20
21
|
var reactDayPicker = require('react-day-picker');
|
|
21
|
-
var dateFns = require('date-fns');
|
|
22
22
|
var tabs = require('@base-ui/react/tabs');
|
|
23
23
|
var xss = require('xss');
|
|
24
24
|
var dialog = require('@base-ui/react/dialog');
|
|
@@ -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,
|
|
@@ -1086,7 +1086,7 @@ var DEFAULT_COUNTRY = "US";
|
|
|
1086
1086
|
function createDefaultClient() {
|
|
1087
1087
|
const processRef = globalThis.process;
|
|
1088
1088
|
const envPublicKey = processRef?.env?.NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY || "";
|
|
1089
|
-
return
|
|
1089
|
+
return chunkQZQEGRGB_js.createCimplifyClient({ publicKey: envPublicKey });
|
|
1090
1090
|
}
|
|
1091
1091
|
function getStoredLocationId() {
|
|
1092
1092
|
if (typeof window === "undefined" || !window.localStorage) {
|
|
@@ -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,744 @@ 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
|
+
}
|
|
3011
|
+
function fmtDateTime(iso) {
|
|
3012
|
+
if (!iso) return null;
|
|
3013
|
+
const d = dateFns.parseISO(iso);
|
|
3014
|
+
return dateFns.isValid(d) ? dateFns.format(d, "EEE, MMM d \xB7 h:mm a") : null;
|
|
3015
|
+
}
|
|
3016
|
+
function fmtScheduleWindow(start, end) {
|
|
3017
|
+
const s = start ? dateFns.parseISO(start) : null;
|
|
3018
|
+
if (!s || !dateFns.isValid(s)) return "";
|
|
3019
|
+
const startStr = dateFns.format(s, "EEE, MMM d \xB7 h:mm a");
|
|
3020
|
+
const e = end ? dateFns.parseISO(end) : null;
|
|
3021
|
+
if (e && dateFns.isValid(e)) {
|
|
3022
|
+
const sameDay = s.toDateString() === e.toDateString();
|
|
3023
|
+
return `${startStr} \u2013 ${dateFns.format(e, sameDay ? "h:mm a" : "EEE, MMM d \xB7 h:mm a")}`;
|
|
3024
|
+
}
|
|
3025
|
+
return startStr;
|
|
3026
|
+
}
|
|
3027
|
+
var LINE_STATE_TONE = {
|
|
3028
|
+
in_preparation: "preparing",
|
|
3029
|
+
ready: "ready",
|
|
3030
|
+
served: "delivered",
|
|
3031
|
+
delivered: "delivered",
|
|
3032
|
+
completed: "delivered",
|
|
3033
|
+
cancelled: "cancelled"
|
|
3034
|
+
};
|
|
3035
|
+
var LINE_STATE_LABEL = {
|
|
3036
|
+
pending: "Pending",
|
|
3037
|
+
in_preparation: "Preparing",
|
|
3038
|
+
ready: "Ready",
|
|
3039
|
+
partially_served: "Partially served",
|
|
3040
|
+
served: "Served",
|
|
3041
|
+
delivered: "Delivered",
|
|
3042
|
+
completed: "Completed",
|
|
3043
|
+
cancelled: "Cancelled"
|
|
3044
|
+
};
|
|
3045
|
+
function digitalTone(status) {
|
|
3046
|
+
switch (status) {
|
|
3047
|
+
case "accessed":
|
|
3048
|
+
case "completed":
|
|
3049
|
+
return "accessed";
|
|
3050
|
+
case "ready":
|
|
3051
|
+
return "ready";
|
|
3052
|
+
case "revoked":
|
|
3053
|
+
case "expired":
|
|
3054
|
+
return "revoked";
|
|
3055
|
+
default:
|
|
3056
|
+
return "pending";
|
|
3057
|
+
}
|
|
3058
|
+
}
|
|
3059
|
+
function cap(s) {
|
|
3060
|
+
return s ? s.charAt(0).toUpperCase() + s.slice(1).replace(/_/g, " ") : "";
|
|
3061
|
+
}
|
|
3062
|
+
function lineStateKey(state) {
|
|
3063
|
+
return typeof state === "string" ? state : Object.keys(state)[0];
|
|
3064
|
+
}
|
|
3065
|
+
function variantLabel(item) {
|
|
3066
|
+
if (item.variant_info?.name) return item.variant_info.name;
|
|
3067
|
+
const props = item.variant_details?.properties;
|
|
3068
|
+
if (props) {
|
|
3069
|
+
const vals = Object.values(props).filter(Boolean);
|
|
3070
|
+
if (vals.length) return vals.join(" \xB7 ");
|
|
3071
|
+
}
|
|
3072
|
+
return void 0;
|
|
3073
|
+
}
|
|
3074
|
+
function lineSubtitle(item) {
|
|
3075
|
+
const parts = [];
|
|
3076
|
+
const v = variantLabel(item);
|
|
3077
|
+
if (v) parts.push(v);
|
|
3078
|
+
if (item.line_type === "bundle") parts.push(`Bundle \xB7 ${item.bundle_selections?.selections.length ?? 0} items`);
|
|
3079
|
+
if (item.line_type === "digital" && item.fulfillment?.digital_type) parts.push(item.fulfillment.digital_type);
|
|
3080
|
+
parts.push(`Qty ${item.quantity}`);
|
|
3081
|
+
const addOns = item.add_ons.flatMap((g) => g.options.map((o) => o.name));
|
|
3082
|
+
if (addOns.length) parts.push(`+ ${addOns.join(", ")}`);
|
|
3083
|
+
return parts.join(" \xB7 ");
|
|
3084
|
+
}
|
|
3085
|
+
function toCustomerInputs(item) {
|
|
3086
|
+
if (!item.customer_inputs.length) return void 0;
|
|
3087
|
+
return item.customer_inputs.map((ci) => ({
|
|
3088
|
+
fieldId: ci.field_id,
|
|
3089
|
+
fieldName: ci.field_name,
|
|
3090
|
+
fieldType: ci.field_type,
|
|
3091
|
+
value: ci.value,
|
|
3092
|
+
semanticKind: ci.semantic_kind
|
|
3093
|
+
}));
|
|
3094
|
+
}
|
|
3095
|
+
function toAccountLineItem(item, currency) {
|
|
3096
|
+
const includes = item.bundle_selections?.selections.map((s) => ({
|
|
3097
|
+
quantity: s.quantity,
|
|
3098
|
+
name: s.product_name,
|
|
3099
|
+
variantName: s.variant_name,
|
|
3100
|
+
priceLabel: chunk7Y2O3E4D_js.parsePrice(s.unit_price) > 0 ? chunk7Y2O3E4D_js.formatMoney(s.unit_price, currency) : void 0
|
|
3101
|
+
}));
|
|
3102
|
+
const customisations = item.composite_selections?.selections.map((s) => ({
|
|
3103
|
+
quantity: s.quantity,
|
|
3104
|
+
name: s.component_name,
|
|
3105
|
+
priceLabel: chunk7Y2O3E4D_js.parsePrice(s.unit_price) > 0 ? `+${chunk7Y2O3E4D_js.formatMoney(s.unit_price, currency)}` : void 0
|
|
3106
|
+
}));
|
|
3107
|
+
const data = {
|
|
3108
|
+
id: item.id,
|
|
3109
|
+
name: item.product_name ?? "Item",
|
|
3110
|
+
imageUrl: item.image_url,
|
|
3111
|
+
subtitle: lineSubtitle(item),
|
|
3112
|
+
priceLabel: chunk7Y2O3E4D_js.formatMoney(item.total_price, currency),
|
|
3113
|
+
lineType: item.line_type,
|
|
3114
|
+
includes,
|
|
3115
|
+
customisations,
|
|
3116
|
+
customerInputs: toCustomerInputs(item)
|
|
3117
|
+
};
|
|
3118
|
+
const stateKey = item.line_state ? lineStateKey(item.line_state.state) : void 0;
|
|
3119
|
+
if (stateKey && stateKey !== "pending") {
|
|
3120
|
+
data.stateLabel = LINE_STATE_LABEL[stateKey] ?? cap(stateKey);
|
|
3121
|
+
data.stateTone = LINE_STATE_TONE[stateKey] ?? "default";
|
|
3122
|
+
}
|
|
3123
|
+
if (item.scheduled_start) {
|
|
3124
|
+
data.scheduling = {
|
|
3125
|
+
whenLabel: fmtScheduleWindow(item.scheduled_start, item.scheduled_end),
|
|
3126
|
+
confirmationCode: item.confirmation_code
|
|
3127
|
+
};
|
|
3128
|
+
if (!data.stateLabel) {
|
|
3129
|
+
data.stateLabel = "Booked";
|
|
3130
|
+
data.stateTone = "booked";
|
|
3131
|
+
}
|
|
3132
|
+
}
|
|
3133
|
+
if (item.line_type === "digital" && item.fulfillment) {
|
|
3134
|
+
data.digital = {
|
|
3135
|
+
statusLabel: cap(item.fulfillment.status) || "Pending",
|
|
3136
|
+
tone: digitalTone(item.fulfillment.status),
|
|
3137
|
+
usageSummary: item.fulfillment.usage_summary
|
|
3138
|
+
};
|
|
3139
|
+
}
|
|
3140
|
+
return data;
|
|
3141
|
+
}
|
|
3142
|
+
function toAccountLineItems(items, currency) {
|
|
3143
|
+
return items.map((item) => toAccountLineItem(item, currency));
|
|
3144
|
+
}
|
|
3145
|
+
var STATUS_TONE2 = {
|
|
3146
|
+
delivered: "positive",
|
|
3147
|
+
picked_up: "positive",
|
|
3148
|
+
served: "positive",
|
|
3149
|
+
completed: "positive",
|
|
3150
|
+
cancelled: "muted",
|
|
3151
|
+
refunded: "muted"
|
|
3152
|
+
};
|
|
3153
|
+
var PAYMENT_TONE = {
|
|
3154
|
+
paid: "positive",
|
|
3155
|
+
not_paid: "warning",
|
|
3156
|
+
partially_refunded: "warning",
|
|
3157
|
+
refunded: "muted"
|
|
3158
|
+
};
|
|
3159
|
+
function toAccountOrderView(order, opts = {}) {
|
|
3160
|
+
const currency = order.payment.currency;
|
|
3161
|
+
const rows = [
|
|
3162
|
+
{ label: "Subtotal", value: chunk7Y2O3E4D_js.formatMoney(order.pricing.subtotal, currency) }
|
|
3163
|
+
];
|
|
3164
|
+
if (chunk7Y2O3E4D_js.parsePrice(order.pricing.total_discount) > 0) {
|
|
3165
|
+
rows.push({
|
|
3166
|
+
label: "Discount",
|
|
3167
|
+
value: `\u2212${chunk7Y2O3E4D_js.formatMoney(order.pricing.total_discount, currency)}`,
|
|
3168
|
+
tone: "positive"
|
|
3169
|
+
});
|
|
3170
|
+
}
|
|
3171
|
+
if (order.pricing.tax && chunk7Y2O3E4D_js.parsePrice(order.pricing.tax) > 0) {
|
|
3172
|
+
rows.push({ label: "Tax", value: chunk7Y2O3E4D_js.formatMoney(order.pricing.tax, currency) });
|
|
3173
|
+
}
|
|
3174
|
+
if (order.pricing.service_charge && chunk7Y2O3E4D_js.parsePrice(order.pricing.service_charge) > 0) {
|
|
3175
|
+
rows.push({ label: "Service", value: chunk7Y2O3E4D_js.formatMoney(order.pricing.service_charge, currency) });
|
|
3176
|
+
}
|
|
3177
|
+
const placed = fmtDateTime(order.timestamps.created_at);
|
|
3178
|
+
const placedLabel = opts.placedLabel ?? [placed && `Placed ${placed}`, `${order.items.length} item${order.items.length === 1 ? "" : "s"}`].filter(Boolean).join(" \xB7 ");
|
|
3179
|
+
return {
|
|
3180
|
+
orderNumber: order.user_friendly_id,
|
|
3181
|
+
placedLabel,
|
|
3182
|
+
statusLabel: cap(order.status),
|
|
3183
|
+
statusTone: STATUS_TONE2[order.status] ?? "progress",
|
|
3184
|
+
items: toAccountLineItems(order.items, currency),
|
|
3185
|
+
payment: {
|
|
3186
|
+
stateLabel: cap(order.payment.computed_status ?? order.payment.state),
|
|
3187
|
+
stateTone: PAYMENT_TONE[order.payment.state] ?? "muted",
|
|
3188
|
+
rows,
|
|
3189
|
+
total: { label: "Total", value: chunk7Y2O3E4D_js.formatMoney(order.pricing.total_price, currency) }
|
|
3190
|
+
},
|
|
3191
|
+
shipTo: order.customer.delivery_address ? { lines: order.customer.delivery_address } : void 0,
|
|
3192
|
+
onBack: opts.onBack
|
|
3193
|
+
};
|
|
3194
|
+
}
|
|
2457
3195
|
function SubscriptionRow({
|
|
2458
3196
|
subscription,
|
|
2459
3197
|
onSelect,
|
|
@@ -2619,11 +3357,11 @@ function CimplifySignInButton({
|
|
|
2619
3357
|
onError,
|
|
2620
3358
|
...signInOpts
|
|
2621
3359
|
}) {
|
|
2622
|
-
const [busy, setBusy] =
|
|
3360
|
+
const [busy, setBusy] = React14.useState(false);
|
|
2623
3361
|
const onClick = async () => {
|
|
2624
3362
|
if (busy || disabled) return;
|
|
2625
3363
|
setBusy(true);
|
|
2626
|
-
await
|
|
3364
|
+
await chunkBCWPRPK7_js.startSignIn({
|
|
2627
3365
|
...signInOpts,
|
|
2628
3366
|
onSuccess: () => {
|
|
2629
3367
|
setBusy(false);
|
|
@@ -3235,9 +3973,9 @@ function AccountSubscriptionDetailPage({
|
|
|
3235
3973
|
}
|
|
3236
3974
|
function useCimplifySession(options) {
|
|
3237
3975
|
const sessionUri = options?.sessionUri ?? "/auth/session";
|
|
3238
|
-
const [session, setSession] =
|
|
3239
|
-
const [loading, setLoading] =
|
|
3240
|
-
const fetchSession =
|
|
3976
|
+
const [session, setSession] = React14.useState(null);
|
|
3977
|
+
const [loading, setLoading] = React14.useState(true);
|
|
3978
|
+
const fetchSession = React14.useCallback(async () => {
|
|
3241
3979
|
setLoading(true);
|
|
3242
3980
|
try {
|
|
3243
3981
|
const res = await fetch(sessionUri, { credentials: "include" });
|
|
@@ -3253,7 +3991,7 @@ function useCimplifySession(options) {
|
|
|
3253
3991
|
setLoading(false);
|
|
3254
3992
|
}
|
|
3255
3993
|
}, [sessionUri]);
|
|
3256
|
-
|
|
3994
|
+
React14.useEffect(() => {
|
|
3257
3995
|
void fetchSession();
|
|
3258
3996
|
}, [fetchSession]);
|
|
3259
3997
|
return { session, loading, refresh: fetchSession };
|
|
@@ -3269,27 +4007,11 @@ var DEFAULT_LINKS = [
|
|
|
3269
4007
|
] })
|
|
3270
4008
|
},
|
|
3271
4009
|
{
|
|
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",
|
|
4010
|
+
label: "Subscriptions",
|
|
4011
|
+
href: "/account/subscriptions",
|
|
3290
4012
|
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: "
|
|
4013
|
+
/* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "4", width: "18", height: "16", rx: "2" }),
|
|
4014
|
+
/* @__PURE__ */ jsxRuntime.jsx("path", { d: "M3 9h18M8 2v4M16 2v4" })
|
|
3293
4015
|
] })
|
|
3294
4016
|
}
|
|
3295
4017
|
];
|
|
@@ -3328,10 +4050,10 @@ function CimplifyUserButton({
|
|
|
3328
4050
|
const hook = useCimplifySession({ sessionUri });
|
|
3329
4051
|
const session = controlled ? controlledSession : hook.session;
|
|
3330
4052
|
const loading = controlled ? false : hook.loading;
|
|
3331
|
-
const [open, setOpen] =
|
|
3332
|
-
const rootRef =
|
|
3333
|
-
const menuId =
|
|
3334
|
-
|
|
4053
|
+
const [open, setOpen] = React14.useState(false);
|
|
4054
|
+
const rootRef = React14.useRef(null);
|
|
4055
|
+
const menuId = React14.useId();
|
|
4056
|
+
React14.useEffect(() => {
|
|
3335
4057
|
if (!open) return;
|
|
3336
4058
|
const onDocClick = (e) => {
|
|
3337
4059
|
if (!rootRef.current?.contains(e.target)) setOpen(false);
|
|
@@ -3406,7 +4128,7 @@ function CimplifyUserButton({
|
|
|
3406
4128
|
id: menuId,
|
|
3407
4129
|
role: "menu",
|
|
3408
4130
|
className: cn(
|
|
3409
|
-
"absolute top-[calc(100%+8px)] z-50 w-[280px] overflow-hidden",
|
|
4131
|
+
"absolute top-[calc(100%+8px)] z-50 w-[280px] max-w-[calc(100vw-1.5rem)] overflow-hidden",
|
|
3410
4132
|
"rounded-[14px] border border-border bg-card",
|
|
3411
4133
|
"shadow-[0_1px_2px_rgba(16,24,40,0.04),0_16px_40px_-16px_rgba(16,24,40,0.24)]",
|
|
3412
4134
|
align === "end" ? "right-0" : "left-0"
|
|
@@ -3515,9 +4237,9 @@ function createCachedQuery(config) {
|
|
|
3515
4237
|
}
|
|
3516
4238
|
const enabled = options.enabled ?? true;
|
|
3517
4239
|
const locationId = client.getLocationId();
|
|
3518
|
-
const previousLocationRef =
|
|
3519
|
-
const requestIdRef =
|
|
3520
|
-
const optionsRef =
|
|
4240
|
+
const previousLocationRef = React14.useRef(locationId);
|
|
4241
|
+
const requestIdRef = React14.useRef(0);
|
|
4242
|
+
const optionsRef = React14.useRef(options);
|
|
3521
4243
|
optionsRef.current = options;
|
|
3522
4244
|
if (config.locationSensitive && previousLocationRef.current !== locationId) {
|
|
3523
4245
|
cache.clear();
|
|
@@ -3527,10 +4249,10 @@ function createCachedQuery(config) {
|
|
|
3527
4249
|
sweep();
|
|
3528
4250
|
const cacheKey2 = config.key(client, options);
|
|
3529
4251
|
const cached = cache.get(cacheKey2);
|
|
3530
|
-
const [data, setData] =
|
|
3531
|
-
const [isLoading, setIsLoading] =
|
|
3532
|
-
const [error, setError] =
|
|
3533
|
-
const load =
|
|
4252
|
+
const [data, setData] = React14.useState(cached?.data ?? null);
|
|
4253
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && !cached);
|
|
4254
|
+
const [error, setError] = React14.useState(null);
|
|
4255
|
+
const load = React14.useCallback(
|
|
3534
4256
|
async (force = false) => {
|
|
3535
4257
|
if (!enabled) {
|
|
3536
4258
|
setIsLoading(false);
|
|
@@ -3573,10 +4295,10 @@ function createCachedQuery(config) {
|
|
|
3573
4295
|
},
|
|
3574
4296
|
[cacheKey2, client, enabled]
|
|
3575
4297
|
);
|
|
3576
|
-
|
|
4298
|
+
React14.useEffect(() => {
|
|
3577
4299
|
void load(false);
|
|
3578
4300
|
}, [load]);
|
|
3579
|
-
const refetch =
|
|
4301
|
+
const refetch = React14.useCallback(async () => {
|
|
3580
4302
|
cache.delete(cacheKey2);
|
|
3581
4303
|
await load(true);
|
|
3582
4304
|
}, [cacheKey2, load]);
|
|
@@ -3706,25 +4428,25 @@ function useOrder(orderId, options = {}) {
|
|
|
3706
4428
|
if (!client) {
|
|
3707
4429
|
throw new Error("useOrder must be used within CimplifyProvider or passed { client }.");
|
|
3708
4430
|
}
|
|
3709
|
-
const normalizedOrderId =
|
|
4431
|
+
const normalizedOrderId = React14.useMemo(() => (orderId || "").trim(), [orderId]);
|
|
3710
4432
|
const enabled = options.enabled ?? true;
|
|
3711
4433
|
const poll = options.poll ?? false;
|
|
3712
4434
|
const pollInterval = options.pollInterval ?? 5e3;
|
|
3713
|
-
const requestIdRef =
|
|
3714
|
-
const previousStatusRef =
|
|
3715
|
-
const onStatusChangeRef =
|
|
4435
|
+
const requestIdRef = React14.useRef(0);
|
|
4436
|
+
const previousStatusRef = React14.useRef(null);
|
|
4437
|
+
const onStatusChangeRef = React14.useRef(options.onStatusChange);
|
|
3716
4438
|
onStatusChangeRef.current = options.onStatusChange;
|
|
3717
|
-
const cacheKey2 =
|
|
4439
|
+
const cacheKey2 = React14.useMemo(
|
|
3718
4440
|
() => buildOrderCacheKey(client, normalizedOrderId),
|
|
3719
4441
|
[client, normalizedOrderId]
|
|
3720
4442
|
);
|
|
3721
4443
|
const cached = orderCache.get(cacheKey2);
|
|
3722
|
-
const [order, setOrder] =
|
|
3723
|
-
const [isLoading, setIsLoading] =
|
|
4444
|
+
const [order, setOrder] = React14.useState(cached?.order ?? null);
|
|
4445
|
+
const [isLoading, setIsLoading] = React14.useState(
|
|
3724
4446
|
enabled && normalizedOrderId.length > 0 && !cached
|
|
3725
4447
|
);
|
|
3726
|
-
const [error, setError] =
|
|
3727
|
-
const load =
|
|
4448
|
+
const [error, setError] = React14.useState(null);
|
|
4449
|
+
const load = React14.useCallback(
|
|
3728
4450
|
async (force = false) => {
|
|
3729
4451
|
if (!enabled || normalizedOrderId.length === 0) {
|
|
3730
4452
|
setOrder(null);
|
|
@@ -3783,11 +4505,11 @@ function useOrder(orderId, options = {}) {
|
|
|
3783
4505
|
},
|
|
3784
4506
|
[cacheKey2, client, enabled, normalizedOrderId]
|
|
3785
4507
|
);
|
|
3786
|
-
|
|
4508
|
+
React14.useEffect(() => {
|
|
3787
4509
|
void load(false);
|
|
3788
4510
|
}, [load]);
|
|
3789
4511
|
const isTerminal = order ? TERMINAL_STATUSES.has(order.status) : false;
|
|
3790
|
-
|
|
4512
|
+
React14.useEffect(() => {
|
|
3791
4513
|
if (!poll || !enabled || normalizedOrderId.length === 0 || isTerminal) {
|
|
3792
4514
|
return;
|
|
3793
4515
|
}
|
|
@@ -3798,7 +4520,7 @@ function useOrder(orderId, options = {}) {
|
|
|
3798
4520
|
window.clearInterval(timer);
|
|
3799
4521
|
};
|
|
3800
4522
|
}, [enabled, isTerminal, load, normalizedOrderId, poll, pollInterval]);
|
|
3801
|
-
const refetch =
|
|
4523
|
+
const refetch = React14.useCallback(async () => {
|
|
3802
4524
|
orderCache.delete(cacheKey2);
|
|
3803
4525
|
await load(true);
|
|
3804
4526
|
}, [cacheKey2, load]);
|
|
@@ -3849,10 +4571,10 @@ function useLocations(options = {}) {
|
|
|
3849
4571
|
};
|
|
3850
4572
|
}
|
|
3851
4573
|
const client = options.client;
|
|
3852
|
-
const [locations, setLocations] =
|
|
3853
|
-
const [currentLocation, setCurrentLocationState] =
|
|
3854
|
-
const [isLoading, setIsLoading] =
|
|
3855
|
-
const setCurrentLocation =
|
|
4574
|
+
const [locations, setLocations] = React14.useState([]);
|
|
4575
|
+
const [currentLocation, setCurrentLocationState] = React14.useState(null);
|
|
4576
|
+
const [isLoading, setIsLoading] = React14.useState(true);
|
|
4577
|
+
const setCurrentLocation = React14.useCallback(
|
|
3856
4578
|
(location) => {
|
|
3857
4579
|
setCurrentLocationState(location);
|
|
3858
4580
|
if (client) {
|
|
@@ -3862,7 +4584,7 @@ function useLocations(options = {}) {
|
|
|
3862
4584
|
},
|
|
3863
4585
|
[client]
|
|
3864
4586
|
);
|
|
3865
|
-
|
|
4587
|
+
React14.useEffect(() => {
|
|
3866
4588
|
if (!client) {
|
|
3867
4589
|
setLocations([]);
|
|
3868
4590
|
setCurrentLocationState(null);
|
|
@@ -3966,14 +4688,14 @@ function useSearch(options = {}) {
|
|
|
3966
4688
|
const minLength = Math.max(0, options.minLength ?? 2);
|
|
3967
4689
|
const debounceMs = Math.max(0, options.debounceMs ?? 300);
|
|
3968
4690
|
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 =
|
|
4691
|
+
const [query, setQueryState] = React14.useState("");
|
|
4692
|
+
const [results, setResults] = React14.useState([]);
|
|
4693
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
4694
|
+
const [error, setError] = React14.useState(null);
|
|
4695
|
+
const requestIdRef = React14.useRef(0);
|
|
4696
|
+
const timerRef = React14.useRef(null);
|
|
3975
4697
|
const tagsSignature = options.tags?.join(",") ?? "";
|
|
3976
|
-
|
|
4698
|
+
React14.useEffect(() => {
|
|
3977
4699
|
if (timerRef.current) {
|
|
3978
4700
|
clearTimeout(timerRef.current);
|
|
3979
4701
|
timerRef.current = null;
|
|
@@ -4028,10 +4750,10 @@ function useSearch(options = {}) {
|
|
|
4028
4750
|
}
|
|
4029
4751
|
};
|
|
4030
4752
|
}, [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 =
|
|
4753
|
+
const setQuery = React14.useCallback((nextQuery) => {
|
|
4032
4754
|
setQueryState(nextQuery);
|
|
4033
4755
|
}, []);
|
|
4034
|
-
const clear =
|
|
4756
|
+
const clear = React14.useCallback(() => {
|
|
4035
4757
|
requestIdRef.current += 1;
|
|
4036
4758
|
if (timerRef.current) {
|
|
4037
4759
|
clearTimeout(timerRef.current);
|
|
@@ -4122,34 +4844,34 @@ function useQuote(input, options = {}) {
|
|
|
4122
4844
|
const autoRefresh = options.autoRefresh ?? true;
|
|
4123
4845
|
const refreshBeforeExpiryMs = Math.max(0, options.refreshBeforeExpiryMs ?? 3e4);
|
|
4124
4846
|
const locationId = client.getLocationId();
|
|
4125
|
-
const requestIdRef =
|
|
4126
|
-
const debounceTimerRef =
|
|
4847
|
+
const requestIdRef = React14.useRef(0);
|
|
4848
|
+
const debounceTimerRef = React14.useRef(null);
|
|
4127
4849
|
const inputSignature = buildQuoteInputSignature(input);
|
|
4128
|
-
const normalizedInput =
|
|
4850
|
+
const normalizedInput = React14.useMemo(() => {
|
|
4129
4851
|
if (!input) {
|
|
4130
4852
|
return null;
|
|
4131
4853
|
}
|
|
4132
4854
|
const normalized = normalizeInput(input, locationId);
|
|
4133
4855
|
return normalized.product_id.length > 0 ? normalized : null;
|
|
4134
4856
|
}, [inputSignature, locationId]);
|
|
4135
|
-
const cacheKey2 =
|
|
4857
|
+
const cacheKey2 = React14.useMemo(
|
|
4136
4858
|
() => buildQuoteCacheKey(client, locationId, inputSignature),
|
|
4137
4859
|
[client, inputSignature, locationId]
|
|
4138
4860
|
);
|
|
4139
4861
|
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 =
|
|
4862
|
+
const [quote, setQuote] = React14.useState(cached?.quote ?? null);
|
|
4863
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && normalizedInput !== null && !cached);
|
|
4864
|
+
const [error, setError] = React14.useState(null);
|
|
4865
|
+
const [isExpired, setIsExpired] = React14.useState(isQuoteExpired(cached?.quote ?? null));
|
|
4866
|
+
const [messages, setMessages] = React14.useState(cached?.quote?.ui_messages ?? []);
|
|
4867
|
+
const quoteExpiryTimestamp = React14.useMemo(() => {
|
|
4146
4868
|
if (!quote?.expires_at) {
|
|
4147
4869
|
return Number.NaN;
|
|
4148
4870
|
}
|
|
4149
4871
|
const expiresAt = Date.parse(quote.expires_at);
|
|
4150
4872
|
return Number.isFinite(expiresAt) ? expiresAt : Number.NaN;
|
|
4151
4873
|
}, [quote?.expires_at]);
|
|
4152
|
-
const load =
|
|
4874
|
+
const load = React14.useCallback(
|
|
4153
4875
|
async (force = false) => {
|
|
4154
4876
|
if (!enabled || !normalizedInput) {
|
|
4155
4877
|
setQuote(null);
|
|
@@ -4209,7 +4931,7 @@ function useQuote(input, options = {}) {
|
|
|
4209
4931
|
},
|
|
4210
4932
|
[cacheKey2, client, enabled, normalizedInput]
|
|
4211
4933
|
);
|
|
4212
|
-
|
|
4934
|
+
React14.useEffect(() => {
|
|
4213
4935
|
if (debounceTimerRef.current) {
|
|
4214
4936
|
clearTimeout(debounceTimerRef.current);
|
|
4215
4937
|
}
|
|
@@ -4228,7 +4950,7 @@ function useQuote(input, options = {}) {
|
|
|
4228
4950
|
}
|
|
4229
4951
|
};
|
|
4230
4952
|
}, [load, cacheKey2, enabled, normalizedInput]);
|
|
4231
|
-
const refresh =
|
|
4953
|
+
const refresh = React14.useCallback(async () => {
|
|
4232
4954
|
if (!enabled || !normalizedInput) {
|
|
4233
4955
|
return;
|
|
4234
4956
|
}
|
|
@@ -4265,7 +4987,7 @@ function useQuote(input, options = {}) {
|
|
|
4265
4987
|
}
|
|
4266
4988
|
}
|
|
4267
4989
|
}, [cacheKey2, client, enabled, load, normalizedInput, quote]);
|
|
4268
|
-
|
|
4990
|
+
React14.useEffect(() => {
|
|
4269
4991
|
if (!Number.isFinite(quoteExpiryTimestamp)) {
|
|
4270
4992
|
setIsExpired(false);
|
|
4271
4993
|
return;
|
|
@@ -4441,9 +5163,9 @@ function useValidateDiscount(options = {}) {
|
|
|
4441
5163
|
if (!client) {
|
|
4442
5164
|
throw new Error("useValidateDiscount must be used within CimplifyProvider or passed { client }.");
|
|
4443
5165
|
}
|
|
4444
|
-
const [isValidating, setIsValidating] =
|
|
4445
|
-
const [error, setError] =
|
|
4446
|
-
const validate =
|
|
5166
|
+
const [isValidating, setIsValidating] = React14.useState(false);
|
|
5167
|
+
const [error, setError] = React14.useState(null);
|
|
5168
|
+
const validate = React14.useCallback(
|
|
4447
5169
|
async (code, orderSubtotal, locationId) => {
|
|
4448
5170
|
setError(null);
|
|
4449
5171
|
setIsValidating(true);
|
|
@@ -4490,7 +5212,7 @@ function useProductPrice(input) {
|
|
|
4490
5212
|
compositePrice,
|
|
4491
5213
|
bundleTotalPrice
|
|
4492
5214
|
} = input;
|
|
4493
|
-
return
|
|
5215
|
+
return React14.useMemo(() => {
|
|
4494
5216
|
let unitPrice;
|
|
4495
5217
|
if (bundleTotalPrice != null) {
|
|
4496
5218
|
unitPrice = bundleTotalPrice;
|
|
@@ -4539,10 +5261,10 @@ function useOrders(options = {}) {
|
|
|
4539
5261
|
function useSubscriptions(options = {}) {
|
|
4540
5262
|
const { client } = useCimplifyClient();
|
|
4541
5263
|
const { status, enabled = true } = options;
|
|
4542
|
-
const [subscriptions, setSubscriptions] =
|
|
4543
|
-
const [isLoading, setIsLoading] =
|
|
4544
|
-
const [error, setError] =
|
|
4545
|
-
const fetch2 =
|
|
5264
|
+
const [subscriptions, setSubscriptions] = React14.useState([]);
|
|
5265
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5266
|
+
const [error, setError] = React14.useState(null);
|
|
5267
|
+
const fetch2 = React14.useCallback(async () => {
|
|
4546
5268
|
if (!enabled) return;
|
|
4547
5269
|
setIsLoading(true);
|
|
4548
5270
|
setError(null);
|
|
@@ -4560,7 +5282,7 @@ function useSubscriptions(options = {}) {
|
|
|
4560
5282
|
setIsLoading(false);
|
|
4561
5283
|
}
|
|
4562
5284
|
}, [client, enabled, status]);
|
|
4563
|
-
|
|
5285
|
+
React14.useEffect(() => {
|
|
4564
5286
|
void fetch2();
|
|
4565
5287
|
}, [fetch2]);
|
|
4566
5288
|
return { subscriptions, isLoading, error, refetch: fetch2 };
|
|
@@ -4569,10 +5291,10 @@ function useSubscription(id, options = {}) {
|
|
|
4569
5291
|
const { client } = useCimplifyClient();
|
|
4570
5292
|
const { enabled = true } = options;
|
|
4571
5293
|
const normalizedId = (id || "").trim();
|
|
4572
|
-
const [subscription, setSubscription] =
|
|
4573
|
-
const [isLoading, setIsLoading] =
|
|
4574
|
-
const [error, setError] =
|
|
4575
|
-
const fetch2 =
|
|
5294
|
+
const [subscription, setSubscription] = React14.useState(null);
|
|
5295
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5296
|
+
const [error, setError] = React14.useState(null);
|
|
5297
|
+
const fetch2 = React14.useCallback(async () => {
|
|
4576
5298
|
if (!enabled || !normalizedId) return;
|
|
4577
5299
|
setIsLoading(true);
|
|
4578
5300
|
setError(null);
|
|
@@ -4589,25 +5311,25 @@ function useSubscription(id, options = {}) {
|
|
|
4589
5311
|
setIsLoading(false);
|
|
4590
5312
|
}
|
|
4591
5313
|
}, [client, enabled, normalizedId]);
|
|
4592
|
-
|
|
5314
|
+
React14.useEffect(() => {
|
|
4593
5315
|
void fetch2();
|
|
4594
5316
|
}, [fetch2]);
|
|
4595
|
-
const cancel =
|
|
5317
|
+
const cancel = React14.useCallback(async (reason) => {
|
|
4596
5318
|
if (!normalizedId) return;
|
|
4597
5319
|
await client.subscriptions.cancel(normalizedId, reason);
|
|
4598
5320
|
void fetch2();
|
|
4599
5321
|
}, [client, normalizedId, fetch2]);
|
|
4600
|
-
const pause =
|
|
5322
|
+
const pause = React14.useCallback(async () => {
|
|
4601
5323
|
if (!normalizedId) return;
|
|
4602
5324
|
await client.subscriptions.pause(normalizedId);
|
|
4603
5325
|
void fetch2();
|
|
4604
5326
|
}, [client, normalizedId, fetch2]);
|
|
4605
|
-
const resume =
|
|
5327
|
+
const resume = React14.useCallback(async () => {
|
|
4606
5328
|
if (!normalizedId) return;
|
|
4607
5329
|
await client.subscriptions.resume(normalizedId);
|
|
4608
5330
|
void fetch2();
|
|
4609
5331
|
}, [client, normalizedId, fetch2]);
|
|
4610
|
-
const skipNext =
|
|
5332
|
+
const skipNext = React14.useCallback(async () => {
|
|
4611
5333
|
if (!normalizedId) return;
|
|
4612
5334
|
await client.subscriptions.skipNextRenewal(normalizedId);
|
|
4613
5335
|
void fetch2();
|
|
@@ -4711,7 +5433,7 @@ function useBookings(options = {}) {
|
|
|
4711
5433
|
const context = useOptionalCimplifyClient();
|
|
4712
5434
|
const client = options.client ?? context?.client;
|
|
4713
5435
|
const { data, isLoading, error, refetch } = bookingsQuery(options);
|
|
4714
|
-
const cancelBooking =
|
|
5436
|
+
const cancelBooking = React14.useCallback(
|
|
4715
5437
|
async (bookingId, reason) => {
|
|
4716
5438
|
if (!client) throw new Error("useBookings must be used within CimplifyProvider or passed { client }.");
|
|
4717
5439
|
const result = await client.scheduling.cancelBooking({
|
|
@@ -4767,14 +5489,14 @@ function useBillingPlans(productId, options = {}) {
|
|
|
4767
5489
|
throw new Error("useBillingPlans must be used within CimplifyProvider or passed { client }.");
|
|
4768
5490
|
}
|
|
4769
5491
|
const enabled = options.enabled ?? true;
|
|
4770
|
-
const requestIdRef =
|
|
4771
|
-
const [plans, setPlans] =
|
|
4772
|
-
const [isLoading, setIsLoading] =
|
|
4773
|
-
const [error, setError] =
|
|
5492
|
+
const requestIdRef = React14.useRef(0);
|
|
5493
|
+
const [plans, setPlans] = React14.useState([]);
|
|
5494
|
+
const [isLoading, setIsLoading] = React14.useState(enabled && !!productId);
|
|
5495
|
+
const [error, setError] = React14.useState(null);
|
|
4774
5496
|
const customerId = options.customerId;
|
|
4775
5497
|
const quantity = options.quantity;
|
|
4776
5498
|
const orderValue = options.orderValue;
|
|
4777
|
-
const load =
|
|
5499
|
+
const load = React14.useCallback(
|
|
4778
5500
|
async (force = false) => {
|
|
4779
5501
|
if (!enabled || !productId) {
|
|
4780
5502
|
setPlans([]);
|
|
@@ -4809,17 +5531,17 @@ function useBillingPlans(productId, options = {}) {
|
|
|
4809
5531
|
},
|
|
4810
5532
|
[client, enabled, productId, customerId, quantity, orderValue]
|
|
4811
5533
|
);
|
|
4812
|
-
|
|
5534
|
+
React14.useEffect(() => {
|
|
4813
5535
|
void load(false);
|
|
4814
5536
|
}, [load]);
|
|
4815
|
-
const refetch =
|
|
5537
|
+
const refetch = React14.useCallback(async () => {
|
|
4816
5538
|
await load(true);
|
|
4817
5539
|
}, [load]);
|
|
4818
|
-
const subscriptionPlans =
|
|
5540
|
+
const subscriptionPlans = React14.useMemo(
|
|
4819
5541
|
() => plans.filter((p) => p.plan_type === "subscription"),
|
|
4820
5542
|
[plans]
|
|
4821
5543
|
);
|
|
4822
|
-
const installmentPlans =
|
|
5544
|
+
const installmentPlans = React14.useMemo(
|
|
4823
5545
|
() => plans.filter((p) => p.plan_type === "installment"),
|
|
4824
5546
|
[plans]
|
|
4825
5547
|
);
|
|
@@ -4854,8 +5576,8 @@ function computeAvailableValues(variants, axes, selections) {
|
|
|
4854
5576
|
}
|
|
4855
5577
|
function useVariantSelector(options) {
|
|
4856
5578
|
const { variants, axes } = options;
|
|
4857
|
-
const [selectedValues, setSelectedValues] =
|
|
4858
|
-
const selectValue =
|
|
5579
|
+
const [selectedValues, setSelectedValues] = React14.useState({});
|
|
5580
|
+
const selectValue = React14.useCallback(
|
|
4859
5581
|
(axisId, valueId) => {
|
|
4860
5582
|
setSelectedValues((prev) => {
|
|
4861
5583
|
if (prev[axisId] === valueId) {
|
|
@@ -4868,16 +5590,16 @@ function useVariantSelector(options) {
|
|
|
4868
5590
|
},
|
|
4869
5591
|
[]
|
|
4870
5592
|
);
|
|
4871
|
-
const reset =
|
|
4872
|
-
const selectedVariant =
|
|
5593
|
+
const reset = React14.useCallback(() => setSelectedValues({}), []);
|
|
5594
|
+
const selectedVariant = React14.useMemo(
|
|
4873
5595
|
() => findMatchingVariant(variants, selectedValues),
|
|
4874
5596
|
[variants, selectedValues]
|
|
4875
5597
|
);
|
|
4876
|
-
const variantImage =
|
|
5598
|
+
const variantImage = React14.useMemo(
|
|
4877
5599
|
() => selectedVariant?.images?.[0] ?? null,
|
|
4878
5600
|
[selectedVariant]
|
|
4879
5601
|
);
|
|
4880
|
-
const availableValues =
|
|
5602
|
+
const availableValues = React14.useMemo(
|
|
4881
5603
|
() => computeAvailableValues(variants, axes, selectedValues),
|
|
4882
5604
|
[variants, axes, selectedValues]
|
|
4883
5605
|
);
|
|
@@ -4903,7 +5625,7 @@ function useActivityState(options = {}) {
|
|
|
4903
5625
|
const context = useOptionalCimplifyClient();
|
|
4904
5626
|
const client = options.client ?? context?.client;
|
|
4905
5627
|
const { data, isLoading, error, refetch } = activityStateQuery(options);
|
|
4906
|
-
const dismissMessage =
|
|
5628
|
+
const dismissMessage = React14.useCallback(
|
|
4907
5629
|
async (code) => {
|
|
4908
5630
|
if (!client) return;
|
|
4909
5631
|
const result = await client.activity.dismissMessage(code);
|
|
@@ -5005,31 +5727,31 @@ var WS_PATH = "/api/v1/support/conversation/ws";
|
|
|
5005
5727
|
function useChat(options = {}) {
|
|
5006
5728
|
const context = useOptionalCimplifyClient();
|
|
5007
5729
|
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 =
|
|
5730
|
+
const [messages, setMessages] = React14.useState([]);
|
|
5731
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
5732
|
+
const [isSending, setIsSending] = React14.useState(false);
|
|
5733
|
+
const [error, setError] = React14.useState(null);
|
|
5734
|
+
const [conversationOpened, setConversationOpened] = React14.useState(false);
|
|
5735
|
+
const pollRef = React14.useRef(null);
|
|
5736
|
+
const lastActivityRef = React14.useRef(Date.now());
|
|
5737
|
+
const openedRef = React14.useRef(false);
|
|
5738
|
+
const messagesRef = React14.useRef([]);
|
|
5739
|
+
const clientRef = React14.useRef(client);
|
|
5740
|
+
const wsRef = React14.useRef(null);
|
|
5741
|
+
const wsReconnectAttemptRef = React14.useRef(0);
|
|
5742
|
+
const wsReconnectTimerRef = React14.useRef(null);
|
|
5021
5743
|
messagesRef.current = messages;
|
|
5022
5744
|
clientRef.current = client;
|
|
5023
5745
|
const pollInterval = options.pollInterval ?? POLL_INTERVAL_MS;
|
|
5024
5746
|
const pollIdleInterval = options.pollIdleInterval ?? POLL_IDLE_INTERVAL_MS;
|
|
5025
|
-
const appendMessages =
|
|
5747
|
+
const appendMessages = React14.useCallback((incoming) => {
|
|
5026
5748
|
setMessages((prev) => {
|
|
5027
5749
|
const ids = new Set(prev.map((m) => m.id));
|
|
5028
5750
|
const fresh = incoming.filter((m) => !ids.has(m.id));
|
|
5029
5751
|
return fresh.length > 0 ? [...prev, ...fresh] : prev;
|
|
5030
5752
|
});
|
|
5031
5753
|
}, []);
|
|
5032
|
-
const pollMessages =
|
|
5754
|
+
const pollMessages = React14.useCallback(async () => {
|
|
5033
5755
|
const c = clientRef.current;
|
|
5034
5756
|
if (!c) return;
|
|
5035
5757
|
if (Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS) return;
|
|
@@ -5042,18 +5764,18 @@ function useChat(options = {}) {
|
|
|
5042
5764
|
appendMessages(result.value);
|
|
5043
5765
|
}
|
|
5044
5766
|
}, [appendMessages]);
|
|
5045
|
-
const startPolling =
|
|
5767
|
+
const startPolling = React14.useCallback(() => {
|
|
5046
5768
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
5047
5769
|
const interval = Date.now() - lastActivityRef.current > IDLE_TIMEOUT_MS ? pollIdleInterval : pollInterval;
|
|
5048
5770
|
pollRef.current = setInterval(pollMessages, interval);
|
|
5049
5771
|
}, [pollMessages, pollInterval, pollIdleInterval]);
|
|
5050
|
-
const stopPolling =
|
|
5772
|
+
const stopPolling = React14.useCallback(() => {
|
|
5051
5773
|
if (pollRef.current) {
|
|
5052
5774
|
clearInterval(pollRef.current);
|
|
5053
5775
|
pollRef.current = null;
|
|
5054
5776
|
}
|
|
5055
5777
|
}, []);
|
|
5056
|
-
const connectWebSocket =
|
|
5778
|
+
const connectWebSocket = React14.useCallback(() => {
|
|
5057
5779
|
const c = clientRef.current;
|
|
5058
5780
|
if (!c || typeof WebSocket === "undefined") {
|
|
5059
5781
|
startPolling();
|
|
@@ -5094,7 +5816,7 @@ function useChat(options = {}) {
|
|
|
5094
5816
|
};
|
|
5095
5817
|
wsRef.current = ws;
|
|
5096
5818
|
}, [appendMessages, startPolling, stopPolling, pollMessages]);
|
|
5097
|
-
|
|
5819
|
+
React14.useEffect(() => {
|
|
5098
5820
|
return () => {
|
|
5099
5821
|
if (pollRef.current) clearInterval(pollRef.current);
|
|
5100
5822
|
if (wsReconnectTimerRef.current) clearTimeout(wsReconnectTimerRef.current);
|
|
@@ -5104,7 +5826,7 @@ function useChat(options = {}) {
|
|
|
5104
5826
|
}
|
|
5105
5827
|
};
|
|
5106
5828
|
}, []);
|
|
5107
|
-
const openConversation =
|
|
5829
|
+
const openConversation = React14.useCallback(async () => {
|
|
5108
5830
|
if (openedRef.current || !client) return;
|
|
5109
5831
|
openedRef.current = true;
|
|
5110
5832
|
setIsLoading(true);
|
|
@@ -5120,7 +5842,7 @@ function useChat(options = {}) {
|
|
|
5120
5842
|
}
|
|
5121
5843
|
setIsLoading(false);
|
|
5122
5844
|
}, [client, connectWebSocket]);
|
|
5123
|
-
const send =
|
|
5845
|
+
const send = React14.useCallback(
|
|
5124
5846
|
async (content) => {
|
|
5125
5847
|
if (!client || !content.trim()) return;
|
|
5126
5848
|
setError(null);
|
|
@@ -5154,7 +5876,7 @@ function useChat(options = {}) {
|
|
|
5154
5876
|
},
|
|
5155
5877
|
[client, openConversation]
|
|
5156
5878
|
);
|
|
5157
|
-
const startConversation =
|
|
5879
|
+
const startConversation = React14.useCallback(
|
|
5158
5880
|
async (starterText) => {
|
|
5159
5881
|
await openConversation();
|
|
5160
5882
|
if (starterText) {
|
|
@@ -5173,15 +5895,15 @@ function useChat(options = {}) {
|
|
|
5173
5895
|
startConversation
|
|
5174
5896
|
};
|
|
5175
5897
|
}
|
|
5176
|
-
var ElementsContext =
|
|
5898
|
+
var ElementsContext = React14.createContext({
|
|
5177
5899
|
elements: null,
|
|
5178
5900
|
isReady: false
|
|
5179
5901
|
});
|
|
5180
5902
|
function useElements() {
|
|
5181
|
-
return
|
|
5903
|
+
return React14.useContext(ElementsContext).elements;
|
|
5182
5904
|
}
|
|
5183
5905
|
function useElementsReady() {
|
|
5184
|
-
return
|
|
5906
|
+
return React14.useContext(ElementsContext).isReady;
|
|
5185
5907
|
}
|
|
5186
5908
|
function ElementsProvider({
|
|
5187
5909
|
client,
|
|
@@ -5189,10 +5911,10 @@ function ElementsProvider({
|
|
|
5189
5911
|
options,
|
|
5190
5912
|
children
|
|
5191
5913
|
}) {
|
|
5192
|
-
const [elements, setElements] =
|
|
5193
|
-
const [isReady, setIsReady] =
|
|
5194
|
-
const initialOptionsRef =
|
|
5195
|
-
|
|
5914
|
+
const [elements, setElements] = React14.useState(null);
|
|
5915
|
+
const [isReady, setIsReady] = React14.useState(false);
|
|
5916
|
+
const initialOptionsRef = React14.useRef(options);
|
|
5917
|
+
React14.useEffect(() => {
|
|
5196
5918
|
let cancelled = false;
|
|
5197
5919
|
let instance = null;
|
|
5198
5920
|
setIsReady(false);
|
|
@@ -5232,28 +5954,28 @@ function AuthElement({
|
|
|
5232
5954
|
onAuthenticated,
|
|
5233
5955
|
onError
|
|
5234
5956
|
}) {
|
|
5235
|
-
const containerRef =
|
|
5236
|
-
const elementRef =
|
|
5957
|
+
const containerRef = React14.useRef(null);
|
|
5958
|
+
const elementRef = React14.useRef(null);
|
|
5237
5959
|
const elements = useElements();
|
|
5238
|
-
const onReadyRef =
|
|
5239
|
-
const onAuthenticatedRef =
|
|
5240
|
-
const onErrorRef =
|
|
5241
|
-
|
|
5960
|
+
const onReadyRef = React14.useRef(onReady);
|
|
5961
|
+
const onAuthenticatedRef = React14.useRef(onAuthenticated);
|
|
5962
|
+
const onErrorRef = React14.useRef(onError);
|
|
5963
|
+
React14.useEffect(() => {
|
|
5242
5964
|
onReadyRef.current = onReady;
|
|
5243
5965
|
onAuthenticatedRef.current = onAuthenticated;
|
|
5244
5966
|
onErrorRef.current = onError;
|
|
5245
5967
|
}, [onReady, onAuthenticated, onError]);
|
|
5246
|
-
|
|
5968
|
+
React14.useEffect(() => {
|
|
5247
5969
|
if (!elements || !containerRef.current) return;
|
|
5248
|
-
const element = elements.create(
|
|
5970
|
+
const element = elements.create(chunkBCWPRPK7_js.ELEMENT_TYPES.AUTH, { prefillEmail });
|
|
5249
5971
|
elementRef.current = element;
|
|
5250
|
-
element.on(
|
|
5972
|
+
element.on(chunkBCWPRPK7_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
5251
5973
|
element.on(
|
|
5252
|
-
|
|
5974
|
+
chunkBCWPRPK7_js.EVENT_TYPES.AUTHENTICATED,
|
|
5253
5975
|
(data) => onAuthenticatedRef.current?.(data)
|
|
5254
5976
|
);
|
|
5255
5977
|
element.on(
|
|
5256
|
-
|
|
5978
|
+
chunkBCWPRPK7_js.EVENT_TYPES.ERROR,
|
|
5257
5979
|
(data) => onErrorRef.current?.(data)
|
|
5258
5980
|
);
|
|
5259
5981
|
element.mount(containerRef.current);
|
|
@@ -5269,28 +5991,28 @@ function AddressElement({
|
|
|
5269
5991
|
onChange,
|
|
5270
5992
|
onError
|
|
5271
5993
|
}) {
|
|
5272
|
-
const containerRef =
|
|
5273
|
-
const elementRef =
|
|
5994
|
+
const containerRef = React14.useRef(null);
|
|
5995
|
+
const elementRef = React14.useRef(null);
|
|
5274
5996
|
const elements = useElements();
|
|
5275
|
-
const onReadyRef =
|
|
5276
|
-
const onChangeRef =
|
|
5277
|
-
const onErrorRef =
|
|
5278
|
-
|
|
5997
|
+
const onReadyRef = React14.useRef(onReady);
|
|
5998
|
+
const onChangeRef = React14.useRef(onChange);
|
|
5999
|
+
const onErrorRef = React14.useRef(onError);
|
|
6000
|
+
React14.useEffect(() => {
|
|
5279
6001
|
onReadyRef.current = onReady;
|
|
5280
6002
|
onChangeRef.current = onChange;
|
|
5281
6003
|
onErrorRef.current = onError;
|
|
5282
6004
|
}, [onReady, onChange, onError]);
|
|
5283
|
-
|
|
6005
|
+
React14.useEffect(() => {
|
|
5284
6006
|
if (!elements || !containerRef.current) return;
|
|
5285
|
-
const element = elements.create(
|
|
6007
|
+
const element = elements.create(chunkBCWPRPK7_js.ELEMENT_TYPES.ADDRESS, { mode });
|
|
5286
6008
|
elementRef.current = element;
|
|
5287
|
-
element.on(
|
|
6009
|
+
element.on(chunkBCWPRPK7_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
5288
6010
|
element.on(
|
|
5289
|
-
|
|
6011
|
+
chunkBCWPRPK7_js.EVENT_TYPES.CHANGE,
|
|
5290
6012
|
(data) => onChangeRef.current?.(data)
|
|
5291
6013
|
);
|
|
5292
6014
|
element.on(
|
|
5293
|
-
|
|
6015
|
+
chunkBCWPRPK7_js.EVENT_TYPES.ERROR,
|
|
5294
6016
|
(data) => onErrorRef.current?.(data)
|
|
5295
6017
|
);
|
|
5296
6018
|
element.mount(containerRef.current);
|
|
@@ -5307,28 +6029,28 @@ function PaymentElement({
|
|
|
5307
6029
|
onChange,
|
|
5308
6030
|
onError
|
|
5309
6031
|
}) {
|
|
5310
|
-
const containerRef =
|
|
5311
|
-
const elementRef =
|
|
6032
|
+
const containerRef = React14.useRef(null);
|
|
6033
|
+
const elementRef = React14.useRef(null);
|
|
5312
6034
|
const elements = useElements();
|
|
5313
|
-
const onReadyRef =
|
|
5314
|
-
const onChangeRef =
|
|
5315
|
-
const onErrorRef =
|
|
5316
|
-
|
|
6035
|
+
const onReadyRef = React14.useRef(onReady);
|
|
6036
|
+
const onChangeRef = React14.useRef(onChange);
|
|
6037
|
+
const onErrorRef = React14.useRef(onError);
|
|
6038
|
+
React14.useEffect(() => {
|
|
5317
6039
|
onReadyRef.current = onReady;
|
|
5318
6040
|
onChangeRef.current = onChange;
|
|
5319
6041
|
onErrorRef.current = onError;
|
|
5320
6042
|
}, [onReady, onChange, onError]);
|
|
5321
|
-
|
|
6043
|
+
React14.useEffect(() => {
|
|
5322
6044
|
if (!elements || !containerRef.current) return;
|
|
5323
|
-
const element = elements.create(
|
|
6045
|
+
const element = elements.create(chunkBCWPRPK7_js.ELEMENT_TYPES.PAYMENT, { amount, currency });
|
|
5324
6046
|
elementRef.current = element;
|
|
5325
|
-
element.on(
|
|
6047
|
+
element.on(chunkBCWPRPK7_js.EVENT_TYPES.READY, () => onReadyRef.current?.());
|
|
5326
6048
|
element.on(
|
|
5327
|
-
|
|
6049
|
+
chunkBCWPRPK7_js.EVENT_TYPES.CHANGE,
|
|
5328
6050
|
(data) => onChangeRef.current?.(data)
|
|
5329
6051
|
);
|
|
5330
6052
|
element.on(
|
|
5331
|
-
|
|
6053
|
+
chunkBCWPRPK7_js.EVENT_TYPES.ERROR,
|
|
5332
6054
|
(data) => onErrorRef.current?.(data)
|
|
5333
6055
|
);
|
|
5334
6056
|
element.mount(containerRef.current);
|
|
@@ -5338,8 +6060,8 @@ function PaymentElement({
|
|
|
5338
6060
|
}
|
|
5339
6061
|
function useCheckout() {
|
|
5340
6062
|
const elements = useElements();
|
|
5341
|
-
const [isLoading, setIsLoading] =
|
|
5342
|
-
const submit =
|
|
6063
|
+
const [isLoading, setIsLoading] = React14.useState(false);
|
|
6064
|
+
const submit = React14.useCallback(
|
|
5343
6065
|
async (data) => {
|
|
5344
6066
|
if (!elements) {
|
|
5345
6067
|
return { success: false, error: { code: "NO_ELEMENTS", message: "Elements not initialized" } };
|
|
@@ -5353,7 +6075,7 @@ function useCheckout() {
|
|
|
5353
6075
|
},
|
|
5354
6076
|
[elements]
|
|
5355
6077
|
);
|
|
5356
|
-
const process =
|
|
6078
|
+
const process = React14.useCallback(
|
|
5357
6079
|
async (options) => {
|
|
5358
6080
|
if (!elements) {
|
|
5359
6081
|
return {
|
|
@@ -5447,13 +6169,13 @@ function VariantSelector({
|
|
|
5447
6169
|
className,
|
|
5448
6170
|
classNames
|
|
5449
6171
|
}) {
|
|
5450
|
-
const [axisSelections, setAxisSelections] =
|
|
5451
|
-
const initialized =
|
|
5452
|
-
const idPrefix =
|
|
5453
|
-
|
|
6172
|
+
const [axisSelections, setAxisSelections] = React14.useState({});
|
|
6173
|
+
const initialized = React14.useRef(false);
|
|
6174
|
+
const idPrefix = React14.useId();
|
|
6175
|
+
React14.useEffect(() => {
|
|
5454
6176
|
initialized.current = false;
|
|
5455
6177
|
}, [variants]);
|
|
5456
|
-
|
|
6178
|
+
React14.useEffect(() => {
|
|
5457
6179
|
if (initialized.current) return;
|
|
5458
6180
|
if (!variants || variants.length === 0) return;
|
|
5459
6181
|
const defaultVariant = variants.find((v) => v.is_default) || variants[0];
|
|
@@ -5468,7 +6190,7 @@ function VariantSelector({
|
|
|
5468
6190
|
setAxisSelections(initial);
|
|
5469
6191
|
}
|
|
5470
6192
|
}, [variants, onVariantChange]);
|
|
5471
|
-
|
|
6193
|
+
React14.useEffect(() => {
|
|
5472
6194
|
if (!initialized.current) return;
|
|
5473
6195
|
if (!variantAxes || variantAxes.length === 0) return;
|
|
5474
6196
|
const match = variants.find((v) => {
|
|
@@ -5611,12 +6333,12 @@ function AddOnSelector({
|
|
|
5611
6333
|
className,
|
|
5612
6334
|
classNames
|
|
5613
6335
|
}) {
|
|
5614
|
-
const selectedSet =
|
|
5615
|
-
const isOptionSelected =
|
|
6336
|
+
const selectedSet = React14.useMemo(() => new Set(selectedOptions), [selectedOptions]);
|
|
6337
|
+
const isOptionSelected = React14.useCallback(
|
|
5616
6338
|
(optionId) => selectedSet.has(optionId),
|
|
5617
6339
|
[selectedSet]
|
|
5618
6340
|
);
|
|
5619
|
-
const handleCheckedChange =
|
|
6341
|
+
const handleCheckedChange = React14.useCallback(
|
|
5620
6342
|
(addOn, optionId, checked) => {
|
|
5621
6343
|
const isSelected = selectedSet.has(optionId);
|
|
5622
6344
|
if (addOn.is_mutually_exclusive || !addOn.is_multiple_allowed) {
|
|
@@ -5792,9 +6514,9 @@ function BundleSelector({
|
|
|
5792
6514
|
className,
|
|
5793
6515
|
classNames
|
|
5794
6516
|
}) {
|
|
5795
|
-
const [variantChoices, setVariantChoices] =
|
|
5796
|
-
const lastComponentIds =
|
|
5797
|
-
|
|
6517
|
+
const [variantChoices, setVariantChoices] = React14.useState({});
|
|
6518
|
+
const lastComponentIds = React14.useRef("");
|
|
6519
|
+
React14.useEffect(() => {
|
|
5798
6520
|
const ids = components.map((c) => c.id).sort().join();
|
|
5799
6521
|
if (ids === lastComponentIds.current) return;
|
|
5800
6522
|
lastComponentIds.current = ids;
|
|
@@ -5811,20 +6533,20 @@ function BundleSelector({
|
|
|
5811
6533
|
}
|
|
5812
6534
|
setVariantChoices(defaults);
|
|
5813
6535
|
}, [components]);
|
|
5814
|
-
const selections =
|
|
6536
|
+
const selections = React14.useMemo(() => {
|
|
5815
6537
|
return components.map((comp) => ({
|
|
5816
6538
|
component_id: comp.id,
|
|
5817
6539
|
variant_id: variantChoices[comp.id],
|
|
5818
6540
|
quantity: comp.quantity
|
|
5819
6541
|
}));
|
|
5820
6542
|
}, [components, variantChoices]);
|
|
5821
|
-
|
|
6543
|
+
React14.useEffect(() => {
|
|
5822
6544
|
onSelectionsChange(selections);
|
|
5823
6545
|
}, [selections, onSelectionsChange]);
|
|
5824
|
-
|
|
6546
|
+
React14.useEffect(() => {
|
|
5825
6547
|
onReady?.(components.length > 0 && selections.length > 0);
|
|
5826
6548
|
}, [components, selections, onReady]);
|
|
5827
|
-
const totalPrice =
|
|
6549
|
+
const totalPrice = React14.useMemo(() => {
|
|
5828
6550
|
if (pricingType === "fixed" && bundlePrice) {
|
|
5829
6551
|
return chunk7Y2O3E4D_js.parsePrice(bundlePrice);
|
|
5830
6552
|
}
|
|
@@ -5839,10 +6561,10 @@ function BundleSelector({
|
|
|
5839
6561
|
}
|
|
5840
6562
|
return componentsTotal;
|
|
5841
6563
|
}, [components, variantChoices, pricingType, bundlePrice, discountValue]);
|
|
5842
|
-
|
|
6564
|
+
React14.useEffect(() => {
|
|
5843
6565
|
onPriceChange?.(totalPrice);
|
|
5844
6566
|
}, [totalPrice, onPriceChange]);
|
|
5845
|
-
const handleVariantChange =
|
|
6567
|
+
const handleVariantChange = React14.useCallback(
|
|
5846
6568
|
(componentId, variantId) => {
|
|
5847
6569
|
setVariantChoices((prev) => ({ ...prev, [componentId]: variantId }));
|
|
5848
6570
|
},
|
|
@@ -5923,9 +6645,9 @@ function BundleComponentCard({
|
|
|
5923
6645
|
onVariantChange,
|
|
5924
6646
|
classNames
|
|
5925
6647
|
}) {
|
|
5926
|
-
const idPrefix =
|
|
6648
|
+
const idPrefix = React14.useId();
|
|
5927
6649
|
const showVariantPicker = component.allow_variant_choice && component.available_variants.length > 1;
|
|
5928
|
-
const displayPrice =
|
|
6650
|
+
const displayPrice = React14.useMemo(
|
|
5929
6651
|
() => getComponentPrice(component, selectedVariantId),
|
|
5930
6652
|
[component, selectedVariantId]
|
|
5931
6653
|
);
|
|
@@ -6073,11 +6795,11 @@ function CompositeSelector({
|
|
|
6073
6795
|
classNames
|
|
6074
6796
|
}) {
|
|
6075
6797
|
const { client } = useCimplifyClient();
|
|
6076
|
-
const [groupSelections, setGroupSelections] =
|
|
6077
|
-
const [priceResult, setPriceResult] =
|
|
6078
|
-
const [isPriceLoading, setIsPriceLoading] =
|
|
6079
|
-
const [priceError, setPriceError] =
|
|
6080
|
-
const selections =
|
|
6798
|
+
const [groupSelections, setGroupSelections] = React14.useState({});
|
|
6799
|
+
const [priceResult, setPriceResult] = React14.useState(null);
|
|
6800
|
+
const [isPriceLoading, setIsPriceLoading] = React14.useState(false);
|
|
6801
|
+
const [priceError, setPriceError] = React14.useState(false);
|
|
6802
|
+
const selections = React14.useMemo(() => {
|
|
6081
6803
|
const result = [];
|
|
6082
6804
|
for (const groupSels of Object.values(groupSelections)) {
|
|
6083
6805
|
for (const [componentId, qty] of Object.entries(groupSels)) {
|
|
@@ -6088,13 +6810,13 @@ function CompositeSelector({
|
|
|
6088
6810
|
}
|
|
6089
6811
|
return result;
|
|
6090
6812
|
}, [groupSelections]);
|
|
6091
|
-
|
|
6813
|
+
React14.useEffect(() => {
|
|
6092
6814
|
onSelectionsChange(selections);
|
|
6093
6815
|
}, [selections, onSelectionsChange]);
|
|
6094
|
-
|
|
6816
|
+
React14.useEffect(() => {
|
|
6095
6817
|
onPriceChange?.(priceResult);
|
|
6096
6818
|
}, [priceResult, onPriceChange]);
|
|
6097
|
-
const allGroupsSatisfied =
|
|
6819
|
+
const allGroupsSatisfied = React14.useMemo(() => {
|
|
6098
6820
|
for (const group of groups) {
|
|
6099
6821
|
const groupSels = groupSelections[group.id] || {};
|
|
6100
6822
|
const totalSelected = Object.values(groupSels).reduce((sum, q) => sum + q, 0);
|
|
@@ -6102,17 +6824,17 @@ function CompositeSelector({
|
|
|
6102
6824
|
}
|
|
6103
6825
|
return true;
|
|
6104
6826
|
}, [groups, groupSelections]);
|
|
6105
|
-
const sortedGroups =
|
|
6827
|
+
const sortedGroups = React14.useMemo(
|
|
6106
6828
|
() => [...groups].sort((a, b) => a.display_order - b.display_order).map((group) => ({
|
|
6107
6829
|
...group,
|
|
6108
6830
|
_sortedComponents: group.components.filter((component) => component.is_available && !component.is_archived).sort((a, b) => a.display_order - b.display_order)
|
|
6109
6831
|
})),
|
|
6110
6832
|
[groups]
|
|
6111
6833
|
);
|
|
6112
|
-
|
|
6834
|
+
React14.useEffect(() => {
|
|
6113
6835
|
onReady?.(allGroupsSatisfied);
|
|
6114
6836
|
}, [allGroupsSatisfied, onReady]);
|
|
6115
|
-
|
|
6837
|
+
React14.useEffect(() => {
|
|
6116
6838
|
if (skipPriceFetch || !allGroupsSatisfied || selections.length === 0) return;
|
|
6117
6839
|
let cancelled = false;
|
|
6118
6840
|
const timer = setTimeout(() => {
|
|
@@ -6139,7 +6861,7 @@ function CompositeSelector({
|
|
|
6139
6861
|
clearTimeout(timer);
|
|
6140
6862
|
};
|
|
6141
6863
|
}, [selections, allGroupsSatisfied, compositeId, client, skipPriceFetch]);
|
|
6142
|
-
const toggleComponent =
|
|
6864
|
+
const toggleComponent = React14.useCallback(
|
|
6143
6865
|
(group, component) => {
|
|
6144
6866
|
setGroupSelections((prev) => {
|
|
6145
6867
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -6167,7 +6889,7 @@ function CompositeSelector({
|
|
|
6167
6889
|
},
|
|
6168
6890
|
[]
|
|
6169
6891
|
);
|
|
6170
|
-
const updateQuantity =
|
|
6892
|
+
const updateQuantity = React14.useCallback(
|
|
6171
6893
|
(group, componentId, newValue) => {
|
|
6172
6894
|
setGroupSelections((prev) => {
|
|
6173
6895
|
const groupSels = { ...prev[group.id] || {} };
|
|
@@ -6746,7 +7468,7 @@ function DatePicker({
|
|
|
6746
7468
|
classNames,
|
|
6747
7469
|
"aria-label": ariaLabel
|
|
6748
7470
|
}) {
|
|
6749
|
-
const [open, setOpen] =
|
|
7471
|
+
const [open, setOpen] = React14.useState(false);
|
|
6750
7472
|
const selected = parseValue(value);
|
|
6751
7473
|
const disabledMatchers = [];
|
|
6752
7474
|
if (minDate) disabledMatchers.push({ before: minDate });
|
|
@@ -6900,9 +7622,9 @@ function TimePicker({
|
|
|
6900
7622
|
classNames,
|
|
6901
7623
|
"aria-label": ariaLabel
|
|
6902
7624
|
}) {
|
|
6903
|
-
const [open, setOpen] =
|
|
7625
|
+
const [open, setOpen] = React14.useState(false);
|
|
6904
7626
|
const parsed = parseHHmm(value);
|
|
6905
|
-
const options =
|
|
7627
|
+
const options = React14.useMemo(
|
|
6906
7628
|
() => buildOptions(minTime, maxTime, stepMinutes),
|
|
6907
7629
|
[minTime, maxTime, stepMinutes]
|
|
6908
7630
|
);
|
|
@@ -6991,13 +7713,13 @@ function CustomerInputFields({
|
|
|
6991
7713
|
const clientContext = useOptionalCimplifyClient();
|
|
6992
7714
|
if (fields.length === 0) return null;
|
|
6993
7715
|
const sorted = [...fields].sort((a, b) => a.display_order - b.display_order);
|
|
6994
|
-
const setValue =
|
|
7716
|
+
const setValue = React14.useCallback(
|
|
6995
7717
|
(fieldId, value) => {
|
|
6996
7718
|
onChange({ ...values, [fieldId]: value });
|
|
6997
7719
|
},
|
|
6998
7720
|
[values, onChange]
|
|
6999
7721
|
);
|
|
7000
|
-
const defaultFileUpload =
|
|
7722
|
+
const defaultFileUpload = React14.useCallback(
|
|
7001
7723
|
async (file) => {
|
|
7002
7724
|
if (onFileUpload) return onFileUpload(file, {});
|
|
7003
7725
|
if (!clientContext?.client) throw new Error("No upload provider available");
|
|
@@ -7332,7 +8054,7 @@ function FileUploadInput({
|
|
|
7332
8054
|
onFileUpload,
|
|
7333
8055
|
classNames
|
|
7334
8056
|
}) {
|
|
7335
|
-
const [isUploading, setIsUploading] =
|
|
8057
|
+
const [isUploading, setIsUploading] = React14__default.default.useState(false);
|
|
7336
8058
|
const fileUrl = typeof value === "string" ? value : void 0;
|
|
7337
8059
|
const acceptedFormats = field.validation?.accepted_formats;
|
|
7338
8060
|
const accept = acceptedFormats ? acceptedFormats.map((f) => `.${f}`).join(",") : field.field_type === chunkIQLJJW2H_js.INPUT_FIELD_TYPE.Image ? "image/*" : void 0;
|
|
@@ -7482,22 +8204,22 @@ function AddressInput({
|
|
|
7482
8204
|
}) {
|
|
7483
8205
|
const clientContext = useOptionalCimplifyClient();
|
|
7484
8206
|
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
|
-
|
|
8207
|
+
const [inputText, setInputText] = React14__default.default.useState(addr?.formatted_address ?? "");
|
|
8208
|
+
const [suggestions, setSuggestions] = React14__default.default.useState([]);
|
|
8209
|
+
const [isOpen, setIsOpen] = React14__default.default.useState(false);
|
|
8210
|
+
const [highlightedIndex, setHighlightedIndex] = React14__default.default.useState(-1);
|
|
8211
|
+
const debounceRef = React14__default.default.useRef(null);
|
|
8212
|
+
const seqRef = React14__default.default.useRef(0);
|
|
8213
|
+
const sessionTokenRef = React14__default.default.useRef(createSessionToken());
|
|
8214
|
+
const blurTimeoutRef = React14__default.default.useRef(null);
|
|
8215
|
+
React14__default.default.useEffect(() => {
|
|
7494
8216
|
return () => {
|
|
7495
8217
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7496
8218
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7497
8219
|
seqRef.current += 1;
|
|
7498
8220
|
};
|
|
7499
8221
|
}, []);
|
|
7500
|
-
const fetchSuggestions =
|
|
8222
|
+
const fetchSuggestions = React14__default.default.useCallback(async (query) => {
|
|
7501
8223
|
const client = clientContext?.client;
|
|
7502
8224
|
if (!client || query.length < 3) {
|
|
7503
8225
|
setSuggestions([]);
|
|
@@ -7521,7 +8243,7 @@ function AddressInput({
|
|
|
7521
8243
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7522
8244
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
7523
8245
|
};
|
|
7524
|
-
const selectSuggestion =
|
|
8246
|
+
const selectSuggestion = React14__default.default.useCallback(async (suggestion) => {
|
|
7525
8247
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7526
8248
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7527
8249
|
const fallback = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -7624,22 +8346,22 @@ function LocationInput({
|
|
|
7624
8346
|
}) {
|
|
7625
8347
|
const clientContext = useOptionalCimplifyClient();
|
|
7626
8348
|
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
|
-
|
|
8349
|
+
const [inputText, setInputText] = React14__default.default.useState(loc?.label ?? "");
|
|
8350
|
+
const [suggestions, setSuggestions] = React14__default.default.useState([]);
|
|
8351
|
+
const [isOpen, setIsOpen] = React14__default.default.useState(false);
|
|
8352
|
+
const [highlightedIndex, setHighlightedIndex] = React14__default.default.useState(-1);
|
|
8353
|
+
const debounceRef = React14__default.default.useRef(null);
|
|
8354
|
+
const seqRef = React14__default.default.useRef(0);
|
|
8355
|
+
const sessionTokenRef = React14__default.default.useRef(createSessionToken());
|
|
8356
|
+
const blurTimeoutRef = React14__default.default.useRef(null);
|
|
8357
|
+
React14__default.default.useEffect(() => {
|
|
7636
8358
|
return () => {
|
|
7637
8359
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7638
8360
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7639
8361
|
seqRef.current += 1;
|
|
7640
8362
|
};
|
|
7641
8363
|
}, []);
|
|
7642
|
-
const fetchSuggestions =
|
|
8364
|
+
const fetchSuggestions = React14__default.default.useCallback(async (query) => {
|
|
7643
8365
|
const client = clientContext?.client;
|
|
7644
8366
|
if (!client || query.length < 3) {
|
|
7645
8367
|
setSuggestions([]);
|
|
@@ -7663,7 +8385,7 @@ function LocationInput({
|
|
|
7663
8385
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7664
8386
|
debounceRef.current = setTimeout(() => void fetchSuggestions(nextValue.trim()), 300);
|
|
7665
8387
|
};
|
|
7666
|
-
const selectSuggestion =
|
|
8388
|
+
const selectSuggestion = React14__default.default.useCallback(async (suggestion) => {
|
|
7667
8389
|
if (debounceRef.current) clearTimeout(debounceRef.current);
|
|
7668
8390
|
if (blurTimeoutRef.current) clearTimeout(blurTimeoutRef.current);
|
|
7669
8391
|
const label = suggestion.description.split(",")[0]?.trim() || suggestion.description;
|
|
@@ -7752,8 +8474,8 @@ function PhoneInput({
|
|
|
7752
8474
|
inputClass
|
|
7753
8475
|
}) {
|
|
7754
8476
|
const phone = value && typeof value === "object" ? value : null;
|
|
7755
|
-
const [code, setCode] =
|
|
7756
|
-
const [number, setNumber] =
|
|
8477
|
+
const [code, setCode] = React14__default.default.useState(phone?.country_code ?? "+1");
|
|
8478
|
+
const [number, setNumber] = React14__default.default.useState(phone?.number ?? "");
|
|
7757
8479
|
const update = (nextCode, nextNumber) => {
|
|
7758
8480
|
setCode(nextCode);
|
|
7759
8481
|
setNumber(nextNumber);
|
|
@@ -7798,8 +8520,8 @@ function SignatureInput({
|
|
|
7798
8520
|
classNames
|
|
7799
8521
|
}) {
|
|
7800
8522
|
const sig = value && typeof value === "object" ? value : null;
|
|
7801
|
-
const canvasRef =
|
|
7802
|
-
const isDrawing =
|
|
8523
|
+
const canvasRef = React14__default.default.useRef(null);
|
|
8524
|
+
const isDrawing = React14__default.default.useRef(false);
|
|
7803
8525
|
const getCtx = () => canvasRef.current?.getContext("2d") ?? null;
|
|
7804
8526
|
const startDraw = (e) => {
|
|
7805
8527
|
const ctx = getCtx();
|
|
@@ -7975,7 +8697,7 @@ function SlotPicker({
|
|
|
7975
8697
|
}
|
|
7976
8698
|
);
|
|
7977
8699
|
const rawSlots = slotsProp ?? fetched;
|
|
7978
|
-
const slots =
|
|
8700
|
+
const slots = React14.useMemo(() => {
|
|
7979
8701
|
if (!hideElapsedSlots) return rawSlots;
|
|
7980
8702
|
const cutoff = Date.now() + minLeadMinutes * 6e4;
|
|
7981
8703
|
return rawSlots.filter((slot) => {
|
|
@@ -8113,9 +8835,9 @@ function DateSlotPicker({
|
|
|
8113
8835
|
className,
|
|
8114
8836
|
classNames
|
|
8115
8837
|
}) {
|
|
8116
|
-
const [offset, setOffset] =
|
|
8117
|
-
const [selectedDate, setSelectedDate] =
|
|
8118
|
-
const dateRange =
|
|
8838
|
+
const [offset, setOffset] = React14.useState(0);
|
|
8839
|
+
const [selectedDate, setSelectedDate] = React14.useState(toDateString(/* @__PURE__ */ new Date()));
|
|
8840
|
+
const dateRange = React14.useMemo(() => {
|
|
8119
8841
|
const today = /* @__PURE__ */ new Date();
|
|
8120
8842
|
const start = addDays(today, offset);
|
|
8121
8843
|
const dates = [];
|
|
@@ -8138,25 +8860,25 @@ function DateSlotPicker({
|
|
|
8138
8860
|
}
|
|
8139
8861
|
);
|
|
8140
8862
|
const days = availabilityProp ?? fetchedDays;
|
|
8141
|
-
const availabilityMap =
|
|
8863
|
+
const availabilityMap = React14.useMemo(() => {
|
|
8142
8864
|
const map = /* @__PURE__ */ new Map();
|
|
8143
8865
|
for (const day of days) {
|
|
8144
8866
|
map.set(day.date, day);
|
|
8145
8867
|
}
|
|
8146
8868
|
return map;
|
|
8147
8869
|
}, [days]);
|
|
8148
|
-
const handlePrev =
|
|
8870
|
+
const handlePrev = React14.useCallback(() => {
|
|
8149
8871
|
setOffset((prev) => Math.max(0, prev - daysToShow));
|
|
8150
8872
|
}, [daysToShow]);
|
|
8151
|
-
const handleNext =
|
|
8873
|
+
const handleNext = React14.useCallback(() => {
|
|
8152
8874
|
setOffset((prev) => prev + daysToShow);
|
|
8153
8875
|
}, [daysToShow]);
|
|
8154
|
-
const handleDateChange =
|
|
8876
|
+
const handleDateChange = React14.useCallback((value) => {
|
|
8155
8877
|
if (typeof value === "string") {
|
|
8156
8878
|
setSelectedDate(value);
|
|
8157
8879
|
}
|
|
8158
8880
|
}, []);
|
|
8159
|
-
const handleSlotSelect =
|
|
8881
|
+
const handleSlotSelect = React14.useCallback(
|
|
8160
8882
|
(slot) => {
|
|
8161
8883
|
onSlotSelect?.(slot, selectedDate);
|
|
8162
8884
|
},
|
|
@@ -8272,22 +8994,22 @@ function ProductCustomizer({
|
|
|
8272
8994
|
className,
|
|
8273
8995
|
classNames
|
|
8274
8996
|
}) {
|
|
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] =
|
|
8997
|
+
const [quantity, setQuantity] = React14.useState(product.min_order_quantity ?? 1);
|
|
8998
|
+
const [isAdded, setIsAdded] = React14.useState(false);
|
|
8999
|
+
const [isSubmitting, setIsSubmitting] = React14.useState(false);
|
|
9000
|
+
const [selectedVariantId, setSelectedVariantId] = React14.useState();
|
|
9001
|
+
const [selectedVariant, setSelectedVariant] = React14.useState();
|
|
9002
|
+
const [selectedAddOnOptionIds, setSelectedAddOnOptionIds] = React14.useState([]);
|
|
9003
|
+
const [compositeSelections, setCompositeSelections] = React14.useState([]);
|
|
9004
|
+
const [compositePrice, setCompositePrice] = React14.useState(null);
|
|
9005
|
+
const [compositeReady, setCompositeReady] = React14.useState(false);
|
|
9006
|
+
const [bundleSelections, setBundleSelections] = React14.useState([]);
|
|
9007
|
+
const [bundleTotalPrice, setBundleTotalPrice] = React14.useState(null);
|
|
9008
|
+
const [bundleReady, setBundleReady] = React14.useState(false);
|
|
9009
|
+
const [selectedBillingPlan, setSelectedBillingPlan] = React14.useState(null);
|
|
9010
|
+
const [customerInputValues, setCustomerInputValues] = React14.useState({});
|
|
9011
|
+
const [specialInstructions, setSpecialInstructions] = React14.useState("");
|
|
9012
|
+
const [selectedSlot, setSelectedSlot] = React14.useState(null);
|
|
8291
9013
|
const cart = useCart();
|
|
8292
9014
|
const productType = product.type || "product";
|
|
8293
9015
|
const isComposite = productType === "composite";
|
|
@@ -8297,7 +9019,7 @@ function ProductCustomizer({
|
|
|
8297
9019
|
const isStandard = !isComposite && !isBundle;
|
|
8298
9020
|
const hasVariants = isStandard && product.variants && product.variants.length > 0;
|
|
8299
9021
|
const hasAddOns = isStandard && product.add_ons && product.add_ons.length > 0;
|
|
8300
|
-
|
|
9022
|
+
React14.useEffect(() => {
|
|
8301
9023
|
setQuantity(product.min_order_quantity ?? 1);
|
|
8302
9024
|
setIsAdded(false);
|
|
8303
9025
|
setIsSubmitting(false);
|
|
@@ -8315,7 +9037,7 @@ function ProductCustomizer({
|
|
|
8315
9037
|
setSpecialInstructions("");
|
|
8316
9038
|
setSelectedSlot(null);
|
|
8317
9039
|
}, [product.id, product.min_order_quantity]);
|
|
8318
|
-
const selectedAddOnOptions =
|
|
9040
|
+
const selectedAddOnOptions = React14.useMemo(() => {
|
|
8319
9041
|
if (!product.add_ons) return [];
|
|
8320
9042
|
const options = [];
|
|
8321
9043
|
for (const addOn of product.add_ons) {
|
|
@@ -8327,11 +9049,11 @@ function ProductCustomizer({
|
|
|
8327
9049
|
}
|
|
8328
9050
|
return options;
|
|
8329
9051
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
8330
|
-
const normalizedAddOnOptionIds =
|
|
9052
|
+
const normalizedAddOnOptionIds = React14.useMemo(() => {
|
|
8331
9053
|
if (selectedAddOnOptionIds.length === 0) return [];
|
|
8332
9054
|
return Array.from(new Set(selectedAddOnOptionIds.map((id) => id.trim()).filter(Boolean))).sort();
|
|
8333
9055
|
}, [selectedAddOnOptionIds]);
|
|
8334
|
-
const localTotalPrice =
|
|
9056
|
+
const localTotalPrice = React14.useMemo(() => {
|
|
8335
9057
|
if (isComposite && compositePrice) {
|
|
8336
9058
|
return chunk7Y2O3E4D_js.parsePrice(compositePrice.final_price) * quantity;
|
|
8337
9059
|
}
|
|
@@ -8349,7 +9071,7 @@ function ProductCustomizer({
|
|
|
8349
9071
|
}
|
|
8350
9072
|
return price * quantity;
|
|
8351
9073
|
}, [product.default_price, selectedVariant, selectedAddOnOptions, quantity, isComposite, compositePrice, isBundle, bundleTotalPrice]);
|
|
8352
|
-
const requiredAddOnsSatisfied =
|
|
9074
|
+
const requiredAddOnsSatisfied = React14.useMemo(() => {
|
|
8353
9075
|
if (!product.add_ons) return true;
|
|
8354
9076
|
for (const addOn of product.add_ons) {
|
|
8355
9077
|
if (addOn.is_required) {
|
|
@@ -8364,7 +9086,7 @@ function ProductCustomizer({
|
|
|
8364
9086
|
}
|
|
8365
9087
|
return true;
|
|
8366
9088
|
}, [product.add_ons, selectedAddOnOptionIds]);
|
|
8367
|
-
const quoteInput =
|
|
9089
|
+
const quoteInput = React14.useMemo(
|
|
8368
9090
|
() => ({
|
|
8369
9091
|
productId: product.id,
|
|
8370
9092
|
quantity,
|
|
@@ -8375,7 +9097,7 @@ function ProductCustomizer({
|
|
|
8375
9097
|
}),
|
|
8376
9098
|
[product.id, quantity, selectedVariantId, normalizedAddOnOptionIds, isBundle, bundleSelections, isComposite, compositeSelections]
|
|
8377
9099
|
);
|
|
8378
|
-
const requiredInputsSatisfied =
|
|
9100
|
+
const requiredInputsSatisfied = React14.useMemo(() => {
|
|
8379
9101
|
if (!product.input_fields || product.input_fields.length === 0) return true;
|
|
8380
9102
|
return product.input_fields.every((field) => {
|
|
8381
9103
|
if (!field.is_required) return true;
|
|
@@ -8388,7 +9110,7 @@ function ProductCustomizer({
|
|
|
8388
9110
|
enabled: quoteEnabled
|
|
8389
9111
|
});
|
|
8390
9112
|
const quoteId = quote?.quote_id;
|
|
8391
|
-
const quotedTotalPrice =
|
|
9113
|
+
const quotedTotalPrice = React14.useMemo(() => {
|
|
8392
9114
|
if (!quote) return void 0;
|
|
8393
9115
|
const priceInfo = quote.quoted_total_price_info ?? quote.final_price_info;
|
|
8394
9116
|
const perUnit = priceInfo.pre_tax_price;
|
|
@@ -8396,7 +9118,7 @@ function ProductCustomizer({
|
|
|
8396
9118
|
return chunk7Y2O3E4D_js.parsePrice(perUnit) * quantity;
|
|
8397
9119
|
}, [quote, quantity]);
|
|
8398
9120
|
const displayTotalPrice = quotedTotalPrice ?? localTotalPrice;
|
|
8399
|
-
const handleVariantChange =
|
|
9121
|
+
const handleVariantChange = React14.useCallback(
|
|
8400
9122
|
(variantId, variant) => {
|
|
8401
9123
|
setSelectedVariantId(variantId);
|
|
8402
9124
|
setSelectedVariant(variant);
|
|
@@ -8404,9 +9126,9 @@ function ProductCustomizer({
|
|
|
8404
9126
|
},
|
|
8405
9127
|
[onVariantChange]
|
|
8406
9128
|
);
|
|
8407
|
-
const addedTimerRef =
|
|
8408
|
-
|
|
8409
|
-
const handleAddToCart =
|
|
9129
|
+
const addedTimerRef = React14.useRef(void 0);
|
|
9130
|
+
React14.useEffect(() => () => clearTimeout(addedTimerRef.current), []);
|
|
9131
|
+
const handleAddToCart = React14.useCallback(async () => {
|
|
8410
9132
|
if (isSubmitting) return;
|
|
8411
9133
|
setIsSubmitting(true);
|
|
8412
9134
|
const options = {
|
|
@@ -8631,14 +9353,14 @@ function ProductImageGallery({
|
|
|
8631
9353
|
aspectRatio = "4/3",
|
|
8632
9354
|
className
|
|
8633
9355
|
}) {
|
|
8634
|
-
const normalizedImages =
|
|
9356
|
+
const normalizedImages = React14.useMemo(
|
|
8635
9357
|
() => images.filter(
|
|
8636
9358
|
(image) => typeof image === "string" && image.trim().length > 0
|
|
8637
9359
|
),
|
|
8638
9360
|
[images]
|
|
8639
9361
|
);
|
|
8640
|
-
const [selectedImage, setSelectedImage] =
|
|
8641
|
-
|
|
9362
|
+
const [selectedImage, setSelectedImage] = React14.useState(0);
|
|
9363
|
+
React14.useEffect(() => {
|
|
8642
9364
|
setSelectedImage(0);
|
|
8643
9365
|
}, [normalizedImages.length, productName]);
|
|
8644
9366
|
if (normalizedImages.length === 0) {
|
|
@@ -8721,9 +9443,9 @@ function StoreVideo({
|
|
|
8721
9443
|
lazy = true,
|
|
8722
9444
|
className
|
|
8723
9445
|
}) {
|
|
8724
|
-
const ref =
|
|
8725
|
-
const [inView, setInView] =
|
|
8726
|
-
|
|
9446
|
+
const ref = React14.useRef(null);
|
|
9447
|
+
const [inView, setInView] = React14.useState(!lazy);
|
|
9448
|
+
React14.useEffect(() => {
|
|
8727
9449
|
if (!lazy || inView) return;
|
|
8728
9450
|
const node = ref.current;
|
|
8729
9451
|
if (!node || typeof IntersectionObserver === "undefined") {
|
|
@@ -8811,8 +9533,8 @@ function ProductModel3D({
|
|
|
8811
9533
|
cameraControls = true,
|
|
8812
9534
|
className
|
|
8813
9535
|
}) {
|
|
8814
|
-
const [ready, setReady] =
|
|
8815
|
-
|
|
9536
|
+
const [ready, setReady] = React14.useState(false);
|
|
9537
|
+
React14.useEffect(() => {
|
|
8816
9538
|
let cancelled = false;
|
|
8817
9539
|
ensureModelViewer().then(
|
|
8818
9540
|
() => {
|
|
@@ -8831,7 +9553,7 @@ function ProductModel3D({
|
|
|
8831
9553
|
"data-cimplify-product-model-3d": true,
|
|
8832
9554
|
className,
|
|
8833
9555
|
style: { position: "relative", overflow: "hidden", ...ASPECT_STYLES3[aspectRatio] },
|
|
8834
|
-
children: ready ?
|
|
9556
|
+
children: ready ? React14__default.default.createElement("model-viewer", {
|
|
8835
9557
|
src,
|
|
8836
9558
|
"ios-src": iosSrc,
|
|
8837
9559
|
alt,
|
|
@@ -8842,12 +9564,12 @@ function ProductModel3D({
|
|
|
8842
9564
|
"auto-rotate": autoRotate || void 0,
|
|
8843
9565
|
"shadow-intensity": "1",
|
|
8844
9566
|
style: { width: "100%", height: "100%", backgroundColor: "transparent" }
|
|
8845
|
-
}) : poster ?
|
|
9567
|
+
}) : poster ? React14__default.default.createElement("img", {
|
|
8846
9568
|
src: poster,
|
|
8847
9569
|
alt: alt ?? "",
|
|
8848
9570
|
"data-cimplify-product-model-3d-loading": true,
|
|
8849
9571
|
style: { width: "100%", height: "100%", objectFit: "cover" }
|
|
8850
|
-
}) :
|
|
9572
|
+
}) : React14__default.default.createElement("div", {
|
|
8851
9573
|
"data-cimplify-product-model-3d-loading": true,
|
|
8852
9574
|
style: { width: "100%", height: "100%", backgroundColor: "var(--muted, #f3f4f6)" }
|
|
8853
9575
|
})
|
|
@@ -8875,12 +9597,12 @@ function MediaGallery({
|
|
|
8875
9597
|
aspectRatio = "4/3",
|
|
8876
9598
|
className
|
|
8877
9599
|
}) {
|
|
8878
|
-
const validItems =
|
|
9600
|
+
const validItems = React14.useMemo(
|
|
8879
9601
|
() => items.filter((i) => typeof i.src === "string" && i.src.trim().length > 0),
|
|
8880
9602
|
[items]
|
|
8881
9603
|
);
|
|
8882
|
-
const [selected, setSelected] =
|
|
8883
|
-
|
|
9604
|
+
const [selected, setSelected] = React14.useState(0);
|
|
9605
|
+
React14.useEffect(() => {
|
|
8884
9606
|
setSelected(0);
|
|
8885
9607
|
}, [validItems.length, productName]);
|
|
8886
9608
|
if (validItems.length === 0) return null;
|
|
@@ -9001,7 +9723,7 @@ function CartLineItemRow({
|
|
|
9001
9723
|
const isOptimistic = item.isOptimistic === true;
|
|
9002
9724
|
const lineTotal = chunk7Y2O3E4D_js.parsePrice(unitPrice) * item.quantity;
|
|
9003
9725
|
const imageUrl = item.product.image_url;
|
|
9004
|
-
const
|
|
9726
|
+
const variantLabel2 = item.variant ? chunkIQLJJW2H_js.getVariantDisplayName(item.variant, item.product.name) : null;
|
|
9005
9727
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
9006
9728
|
"div",
|
|
9007
9729
|
{
|
|
@@ -9054,13 +9776,13 @@ function CartLineItemRow({
|
|
|
9054
9776
|
}
|
|
9055
9777
|
)
|
|
9056
9778
|
] }),
|
|
9057
|
-
(
|
|
9058
|
-
|
|
9779
|
+
(variantLabel2 || item.addOnOptions && item.addOnOptions.length > 0 || hasComposite || hasBundle) && /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-cart-item-pills": true, className: "flex flex-wrap gap-1.5 mt-1.5", children: [
|
|
9780
|
+
variantLabel2 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
9059
9781
|
"span",
|
|
9060
9782
|
{
|
|
9061
9783
|
"data-cimplify-cart-item-variant": true,
|
|
9062
9784
|
className: "inline-flex items-center px-2 py-0.5 rounded-full bg-muted text-[11px] font-medium text-foreground",
|
|
9063
|
-
children:
|
|
9785
|
+
children: variantLabel2
|
|
9064
9786
|
}
|
|
9065
9787
|
),
|
|
9066
9788
|
item.addOnOptions?.map((opt) => /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -9508,7 +10230,7 @@ var RICH_TEXT_PROSE = cn(
|
|
|
9508
10230
|
"[&_iframe]:my-4 [&_iframe]:aspect-video [&_iframe]:w-full [&_iframe]:rounded-md"
|
|
9509
10231
|
);
|
|
9510
10232
|
function RichText({ html, className, ...rest }) {
|
|
9511
|
-
const clean =
|
|
10233
|
+
const clean = React14.useMemo(() => html ? sanitizeRichTextHtml(html) : "", [html]);
|
|
9512
10234
|
if (!clean) {
|
|
9513
10235
|
return null;
|
|
9514
10236
|
}
|
|
@@ -9604,7 +10326,7 @@ function ProductSheet({
|
|
|
9604
10326
|
}
|
|
9605
10327
|
);
|
|
9606
10328
|
}
|
|
9607
|
-
const [selectedVariant, setSelectedVariant] =
|
|
10329
|
+
const [selectedVariant, setSelectedVariant] = React14.useState(
|
|
9608
10330
|
void 0
|
|
9609
10331
|
);
|
|
9610
10332
|
const variantImages = selectedVariant?.images?.filter(Boolean) ?? [];
|
|
@@ -10629,22 +11351,22 @@ function ProductCard({
|
|
|
10629
11351
|
classNames
|
|
10630
11352
|
}) {
|
|
10631
11353
|
const mode = displayMode ?? product.display_mode ?? "card";
|
|
10632
|
-
const [isOpen, setIsOpen] =
|
|
10633
|
-
const [shouldFetch, setShouldFetch] =
|
|
11354
|
+
const [isOpen, setIsOpen] = React14.useState(false);
|
|
11355
|
+
const [shouldFetch, setShouldFetch] = React14.useState(false);
|
|
10634
11356
|
const { product: productDetails } = useProduct(
|
|
10635
11357
|
product.slug ?? product.id,
|
|
10636
11358
|
{ enabled: shouldFetch || isOpen }
|
|
10637
11359
|
);
|
|
10638
|
-
const handlePrefetch =
|
|
11360
|
+
const handlePrefetch = React14.useCallback(() => {
|
|
10639
11361
|
setShouldFetch(true);
|
|
10640
11362
|
}, []);
|
|
10641
|
-
const handleOpenChange =
|
|
11363
|
+
const handleOpenChange = React14.useCallback((open) => {
|
|
10642
11364
|
setIsOpen(open);
|
|
10643
11365
|
if (open) {
|
|
10644
11366
|
setShouldFetch(true);
|
|
10645
11367
|
}
|
|
10646
11368
|
}, []);
|
|
10647
|
-
const handleClose =
|
|
11369
|
+
const handleClose = React14.useCallback(() => {
|
|
10648
11370
|
setIsOpen(false);
|
|
10649
11371
|
}, []);
|
|
10650
11372
|
const imageUrl = product.image_url || product.images?.[0];
|
|
@@ -10774,13 +11496,13 @@ function ProductGrid({
|
|
|
10774
11496
|
className,
|
|
10775
11497
|
classNames
|
|
10776
11498
|
}) {
|
|
10777
|
-
const rawId =
|
|
11499
|
+
const rawId = React14__default.default.useId();
|
|
10778
11500
|
const gridId = `cimplify-grid-${rawId.replace(/:/g, "")}`;
|
|
10779
11501
|
const sm = columns?.sm ?? 1;
|
|
10780
11502
|
const md = columns?.md ?? 2;
|
|
10781
11503
|
const lg = columns?.lg ?? 3;
|
|
10782
11504
|
const xl = columns?.xl ?? 4;
|
|
10783
|
-
const css =
|
|
11505
|
+
const css = React14__default.default.useMemo(
|
|
10784
11506
|
() => [
|
|
10785
11507
|
`#${gridId}{display:grid;grid-template-columns:repeat(${sm},1fr);gap:1rem}`,
|
|
10786
11508
|
`@media(min-width:768px){#${gridId}{grid-template-columns:repeat(${md},1fr)}}`,
|
|
@@ -10858,12 +11580,12 @@ function SearchInput({
|
|
|
10858
11580
|
className,
|
|
10859
11581
|
classNames
|
|
10860
11582
|
}) {
|
|
10861
|
-
const mergedOptions =
|
|
11583
|
+
const mergedOptions = React14.useMemo(
|
|
10862
11584
|
() => categoryId ? { ...searchOptions, category: categoryId } : searchOptions ?? {},
|
|
10863
11585
|
[searchOptions, categoryId]
|
|
10864
11586
|
);
|
|
10865
11587
|
const { results, isLoading, query, setQuery, clear } = useSearch(mergedOptions);
|
|
10866
|
-
const handleValueChange =
|
|
11588
|
+
const handleValueChange = React14.useCallback(
|
|
10867
11589
|
(value) => {
|
|
10868
11590
|
setQuery(value);
|
|
10869
11591
|
},
|
|
@@ -10962,7 +11684,7 @@ function CategoryFilter({
|
|
|
10962
11684
|
classNames
|
|
10963
11685
|
}) {
|
|
10964
11686
|
const { categories, isLoading } = useCategories();
|
|
10965
|
-
const handleValueChange =
|
|
11687
|
+
const handleValueChange = React14.useCallback(
|
|
10966
11688
|
(value) => {
|
|
10967
11689
|
onSelect(value === ALL_VALUE ? null : String(value));
|
|
10968
11690
|
},
|
|
@@ -11029,10 +11751,10 @@ function DiscountInput({
|
|
|
11029
11751
|
className,
|
|
11030
11752
|
classNames
|
|
11031
11753
|
}) {
|
|
11032
|
-
const [code, setCode] =
|
|
11033
|
-
const [appliedValidation, setAppliedValidation] =
|
|
11754
|
+
const [code, setCode] = React14.useState("");
|
|
11755
|
+
const [appliedValidation, setAppliedValidation] = React14.useState(null);
|
|
11034
11756
|
const { validate, isValidating, error } = useValidateDiscount();
|
|
11035
|
-
const handleApply =
|
|
11757
|
+
const handleApply = React14.useCallback(async () => {
|
|
11036
11758
|
const trimmed = code.trim();
|
|
11037
11759
|
if (!trimmed) return;
|
|
11038
11760
|
const result = await validate(trimmed, orderSubtotal, locationId);
|
|
@@ -11045,12 +11767,12 @@ function DiscountInput({
|
|
|
11045
11767
|
}
|
|
11046
11768
|
}
|
|
11047
11769
|
}, [code, validate, orderSubtotal, locationId, onApply]);
|
|
11048
|
-
const handleClear =
|
|
11770
|
+
const handleClear = React14.useCallback(() => {
|
|
11049
11771
|
setCode("");
|
|
11050
11772
|
setAppliedValidation(null);
|
|
11051
11773
|
onClear?.();
|
|
11052
11774
|
}, [onClear]);
|
|
11053
|
-
const handleKeyDown =
|
|
11775
|
+
const handleKeyDown = React14.useCallback(
|
|
11054
11776
|
(e) => {
|
|
11055
11777
|
if (e.key === "Enter") {
|
|
11056
11778
|
void handleApply();
|
|
@@ -11141,7 +11863,7 @@ function CategoryGrid({
|
|
|
11141
11863
|
enabled: categoriesProp === void 0
|
|
11142
11864
|
});
|
|
11143
11865
|
const categories = categoriesProp ?? fetched;
|
|
11144
|
-
const rawId =
|
|
11866
|
+
const rawId = React14__default.default.useId();
|
|
11145
11867
|
const gridId = `cimplify-cat-grid-${rawId.replace(/:/g, "")}`;
|
|
11146
11868
|
const sm = columns?.sm ?? 2;
|
|
11147
11869
|
const md = columns?.md ?? 3;
|
|
@@ -11367,7 +12089,7 @@ function OrderSummary({
|
|
|
11367
12089
|
/* @__PURE__ */ jsxRuntime.jsx("p", { children: order.delivery_address })
|
|
11368
12090
|
] }),
|
|
11369
12091
|
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-cimplify-order-items": true, className: classNames?.items, children: order.items.map(
|
|
11370
|
-
(item) => renderLineItem ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
12092
|
+
(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
12093
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { "data-cimplify-order-line-info": true, children: [
|
|
11372
12094
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { "data-cimplify-order-line-qty": true, children: [
|
|
11373
12095
|
item.quantity,
|
|
@@ -12025,13 +12747,13 @@ function BookingPage({
|
|
|
12025
12747
|
const { addItem } = useCart();
|
|
12026
12748
|
const { client } = useCimplifyClient();
|
|
12027
12749
|
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] =
|
|
12750
|
+
const [step, setStep] = React14.useState(STEP.SELECT_SLOT);
|
|
12751
|
+
const [selectedSlot, setSelectedSlot] = React14.useState(null);
|
|
12752
|
+
const [selectedDate, setSelectedDate] = React14.useState(null);
|
|
12753
|
+
const [selectedStaffId, setSelectedStaffId] = React14.useState(null);
|
|
12754
|
+
const [selectedResourceId, setSelectedResourceId] = React14.useState(null);
|
|
12755
|
+
const [isSubmitting, setIsSubmitting] = React14.useState(false);
|
|
12756
|
+
const [error, setError] = React14.useState(null);
|
|
12035
12757
|
const hasResourceStep = resources && resources.length > 0;
|
|
12036
12758
|
const hasStaffStep = staff && staff.length > 0;
|
|
12037
12759
|
const depositType = product?.deposit_type;
|
|
@@ -12039,7 +12761,7 @@ function BookingPage({
|
|
|
12039
12761
|
const hasDeposit = depositType !== void 0 && depositType !== "none" && depositAmount !== void 0 && chunk7Y2O3E4D_js.parsePrice(depositAmount) !== 0;
|
|
12040
12762
|
const cancellationMinutes = product?.cancellation_window_minutes;
|
|
12041
12763
|
const noShowFee = product?.no_show_fee;
|
|
12042
|
-
const handleSlotSelect =
|
|
12764
|
+
const handleSlotSelect = React14.useCallback(
|
|
12043
12765
|
(slot, date) => {
|
|
12044
12766
|
setSelectedSlot(slot);
|
|
12045
12767
|
setSelectedDate(date);
|
|
@@ -12054,7 +12776,7 @@ function BookingPage({
|
|
|
12054
12776
|
},
|
|
12055
12777
|
[hasResourceStep, hasStaffStep]
|
|
12056
12778
|
);
|
|
12057
|
-
const handleResourceSelect =
|
|
12779
|
+
const handleResourceSelect = React14.useCallback(
|
|
12058
12780
|
(resourceId) => {
|
|
12059
12781
|
setSelectedResourceId(resourceId);
|
|
12060
12782
|
if (hasStaffStep) {
|
|
@@ -12065,11 +12787,11 @@ function BookingPage({
|
|
|
12065
12787
|
},
|
|
12066
12788
|
[hasStaffStep]
|
|
12067
12789
|
);
|
|
12068
|
-
const handleStaffSelect =
|
|
12790
|
+
const handleStaffSelect = React14.useCallback((staffId) => {
|
|
12069
12791
|
setSelectedStaffId(staffId);
|
|
12070
12792
|
setStep(STEP.CONFIRM);
|
|
12071
12793
|
}, []);
|
|
12072
|
-
const handleBack =
|
|
12794
|
+
const handleBack = React14.useCallback(() => {
|
|
12073
12795
|
setError(null);
|
|
12074
12796
|
if (step === STEP.CONFIRM && hasStaffStep) {
|
|
12075
12797
|
setStep(STEP.SELECT_STAFF);
|
|
@@ -12083,7 +12805,7 @@ function BookingPage({
|
|
|
12083
12805
|
onBack?.();
|
|
12084
12806
|
}
|
|
12085
12807
|
}, [step, hasStaffStep, hasResourceStep, onBack]);
|
|
12086
|
-
const handleConfirm =
|
|
12808
|
+
const handleConfirm = React14.useCallback(async () => {
|
|
12087
12809
|
if (!selectedSlot || !selectedDate) return;
|
|
12088
12810
|
setIsSubmitting(true);
|
|
12089
12811
|
setError(null);
|
|
@@ -12285,9 +13007,9 @@ function BookingsPage({
|
|
|
12285
13007
|
className,
|
|
12286
13008
|
classNames
|
|
12287
13009
|
}) {
|
|
12288
|
-
const [filter, setFilter] =
|
|
12289
|
-
const [selectedBooking, setSelectedBooking] =
|
|
12290
|
-
const handleBookingClick =
|
|
13010
|
+
const [filter, setFilter] = React14.useState("all");
|
|
13011
|
+
const [selectedBooking, setSelectedBooking] = React14.useState(null);
|
|
13012
|
+
const handleBookingClick = React14.useCallback(
|
|
12291
13013
|
(booking) => {
|
|
12292
13014
|
if (onBookingNavigate) {
|
|
12293
13015
|
onBookingNavigate(booking);
|
|
@@ -12297,7 +13019,7 @@ function BookingsPage({
|
|
|
12297
13019
|
},
|
|
12298
13020
|
[onBookingNavigate]
|
|
12299
13021
|
);
|
|
12300
|
-
const handleBack =
|
|
13022
|
+
const handleBack = React14.useCallback(() => {
|
|
12301
13023
|
setSelectedBooking(null);
|
|
12302
13024
|
}, []);
|
|
12303
13025
|
if (selectedBooking && !onBookingNavigate) {
|
|
@@ -12527,7 +13249,7 @@ function DefaultCatalogueLayout({
|
|
|
12527
13249
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No products found" }),
|
|
12528
13250
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try adjusting your filters" })
|
|
12529
13251
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 md:grid-cols-3 gap-4", children: products.map(
|
|
12530
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
13252
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12531
13253
|
ProductCard,
|
|
12532
13254
|
{
|
|
12533
13255
|
product,
|
|
@@ -12634,7 +13356,7 @@ function CompactCatalogueLayout({
|
|
|
12634
13356
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg font-medium", children: "No items found" }),
|
|
12635
13357
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different category or search" })
|
|
12636
13358
|
] }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 lg:grid-cols-3 gap-5", children: products.map(
|
|
12637
|
-
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
13359
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
12638
13360
|
ProductCard,
|
|
12639
13361
|
{
|
|
12640
13362
|
product,
|
|
@@ -12657,8 +13379,8 @@ var BUILT_IN_LAYOUTS = {
|
|
|
12657
13379
|
["compact" /* Compact */]: CompactCatalogueLayout
|
|
12658
13380
|
};
|
|
12659
13381
|
function useDebounce(value, delay) {
|
|
12660
|
-
const [debounced, setDebounced] =
|
|
12661
|
-
|
|
13382
|
+
const [debounced, setDebounced] = React14__default.default.useState(value);
|
|
13383
|
+
React14__default.default.useEffect(() => {
|
|
12662
13384
|
const timer = setTimeout(() => setDebounced(value), delay);
|
|
12663
13385
|
return () => clearTimeout(timer);
|
|
12664
13386
|
}, [value, delay]);
|
|
@@ -12682,15 +13404,15 @@ function CataloguePage({
|
|
|
12682
13404
|
className,
|
|
12683
13405
|
classNames
|
|
12684
13406
|
}) {
|
|
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] =
|
|
13407
|
+
const [selectedCategory, setSelectedCategory] = React14.useState(null);
|
|
13408
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
13409
|
+
const [sortBy, setSortBy] = React14.useState(defaultSort?.by ?? "created_at");
|
|
13410
|
+
const [sortOrder, setSortOrder] = React14.useState(defaultSort?.order ?? "desc");
|
|
13411
|
+
const [inStockOnly, setInStockOnly] = React14.useState(false);
|
|
13412
|
+
const [selectedTags, setSelectedTags] = React14.useState([]);
|
|
13413
|
+
const [minPrice, setMinPrice] = React14.useState("");
|
|
13414
|
+
const [maxPrice, setMaxPrice] = React14.useState("");
|
|
13415
|
+
const [page, setPage] = React14.useState(1);
|
|
12694
13416
|
const debouncedSearch = useDebounce(searchQuery, 300);
|
|
12695
13417
|
const { products: fetchedProducts, isLoading, pagination } = useProducts({
|
|
12696
13418
|
enabled: productsProp === void 0,
|
|
@@ -12711,22 +13433,22 @@ function CataloguePage({
|
|
|
12711
13433
|
const products = productsProp ?? fetchedProducts;
|
|
12712
13434
|
const categories = categoriesProp ?? fetchedCategories;
|
|
12713
13435
|
const totalPages = pagination?.total_pages ?? 1;
|
|
12714
|
-
const handleCategoryChange =
|
|
13436
|
+
const handleCategoryChange = React14.useCallback((id) => {
|
|
12715
13437
|
setSelectedCategory(id);
|
|
12716
13438
|
setPage(1);
|
|
12717
13439
|
}, []);
|
|
12718
|
-
const handleSortChange =
|
|
13440
|
+
const handleSortChange = React14.useCallback((by, order) => {
|
|
12719
13441
|
setSortBy(by);
|
|
12720
13442
|
setSortOrder(order);
|
|
12721
13443
|
setPage(1);
|
|
12722
13444
|
}, []);
|
|
12723
|
-
const handleTagToggle =
|
|
13445
|
+
const handleTagToggle = React14.useCallback((tag) => {
|
|
12724
13446
|
setSelectedTags(
|
|
12725
13447
|
(prev) => prev.includes(tag) ? prev.filter((t) => t !== tag) : [...prev, tag]
|
|
12726
13448
|
);
|
|
12727
13449
|
setPage(1);
|
|
12728
13450
|
}, []);
|
|
12729
|
-
const handlePriceRangeChange =
|
|
13451
|
+
const handlePriceRangeChange = React14.useCallback((min, max) => {
|
|
12730
13452
|
setMinPrice(min);
|
|
12731
13453
|
setMaxPrice(max);
|
|
12732
13454
|
setPage(1);
|
|
@@ -12914,7 +13636,7 @@ function DefaultProductLayout({
|
|
|
12914
13636
|
showRelated = true,
|
|
12915
13637
|
className
|
|
12916
13638
|
}) {
|
|
12917
|
-
const [selectedVariantId, setSelectedVariantId] =
|
|
13639
|
+
const [selectedVariantId, setSelectedVariantId] = React14__default.default.useState();
|
|
12918
13640
|
const images = chunkIQLJJW2H_js.resolveGallery(product, selectedVariantId);
|
|
12919
13641
|
const hasRange = product.quantity_pricing && product.quantity_pricing.length > 1 || product.variants && product.variants.length > 1;
|
|
12920
13642
|
const onSale = chunk7Y2O3E4D_js.isOnSale(product);
|
|
@@ -13832,36 +14554,36 @@ function CartPage({
|
|
|
13832
14554
|
}
|
|
13833
14555
|
) });
|
|
13834
14556
|
}
|
|
13835
|
-
var CartDrawerContext =
|
|
14557
|
+
var CartDrawerContext = React14.createContext(null);
|
|
13836
14558
|
function useCartDrawer() {
|
|
13837
|
-
const ctx =
|
|
14559
|
+
const ctx = React14.useContext(CartDrawerContext);
|
|
13838
14560
|
if (!ctx) {
|
|
13839
14561
|
throw new Error("useCartDrawer must be used within <CartDrawerProvider>");
|
|
13840
14562
|
}
|
|
13841
14563
|
return ctx;
|
|
13842
14564
|
}
|
|
13843
14565
|
function CartDrawerProvider({ children, openOnAdd = true }) {
|
|
13844
|
-
const [isOpen, setIsOpen] =
|
|
14566
|
+
const [isOpen, setIsOpen] = React14.useState(false);
|
|
13845
14567
|
const cart = useCart();
|
|
13846
|
-
const lastPendingRef =
|
|
13847
|
-
const open =
|
|
13848
|
-
const close =
|
|
13849
|
-
const toggle =
|
|
13850
|
-
|
|
14568
|
+
const lastPendingRef = React14.useRef(0);
|
|
14569
|
+
const open = React14.useCallback(() => setIsOpen(true), []);
|
|
14570
|
+
const close = React14.useCallback(() => setIsOpen(false), []);
|
|
14571
|
+
const toggle = React14.useCallback(() => setIsOpen((v) => !v), []);
|
|
14572
|
+
React14.useEffect(() => {
|
|
13851
14573
|
if (!openOnAdd) return;
|
|
13852
14574
|
if (cart.pendingOpCount > lastPendingRef.current && cart.pendingOpCount > 0) {
|
|
13853
14575
|
setIsOpen(true);
|
|
13854
14576
|
}
|
|
13855
14577
|
lastPendingRef.current = cart.pendingOpCount;
|
|
13856
14578
|
}, [cart.pendingOpCount, openOnAdd]);
|
|
13857
|
-
const value =
|
|
14579
|
+
const value = React14.useMemo(() => ({ isOpen, open, close, toggle }), [isOpen, open, close, toggle]);
|
|
13858
14580
|
return /* @__PURE__ */ jsxRuntime.jsx(CartDrawerContext.Provider, { value, children });
|
|
13859
14581
|
}
|
|
13860
14582
|
function useAnimatedNumber(target, durationMs = 250) {
|
|
13861
|
-
const [value, setValue] =
|
|
13862
|
-
const fromRef =
|
|
13863
|
-
const startRef =
|
|
13864
|
-
|
|
14583
|
+
const [value, setValue] = React14.useState(target);
|
|
14584
|
+
const fromRef = React14.useRef(target);
|
|
14585
|
+
const startRef = React14.useRef(null);
|
|
14586
|
+
React14.useEffect(() => {
|
|
13865
14587
|
fromRef.current = value;
|
|
13866
14588
|
startRef.current = null;
|
|
13867
14589
|
let raf = 0;
|
|
@@ -13889,7 +14611,7 @@ function CartDrawer({
|
|
|
13889
14611
|
const cart = useCart();
|
|
13890
14612
|
const subtotalNum = chunk7Y2O3E4D_js.parsePrice(cart.subtotal);
|
|
13891
14613
|
const animatedSubtotal = useAnimatedNumber(subtotalNum);
|
|
13892
|
-
|
|
14614
|
+
React14.useEffect(() => {
|
|
13893
14615
|
if (!isOpen) return;
|
|
13894
14616
|
const original = document.body.style.overflow;
|
|
13895
14617
|
document.body.style.overflow = "hidden";
|
|
@@ -14094,9 +14816,9 @@ function DefaultCollectionLayout({
|
|
|
14094
14816
|
onQuickAdd,
|
|
14095
14817
|
className
|
|
14096
14818
|
}) {
|
|
14097
|
-
const [searchQuery, setSearchQuery] =
|
|
14098
|
-
const [activeTag, setActiveTag] =
|
|
14099
|
-
const collectionTags =
|
|
14819
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
14820
|
+
const [activeTag, setActiveTag] = React14.useState(null);
|
|
14821
|
+
const collectionTags = React14.useMemo(() => {
|
|
14100
14822
|
const tagSet = /* @__PURE__ */ new Set();
|
|
14101
14823
|
for (const p of products) {
|
|
14102
14824
|
if (p.tags) {
|
|
@@ -14105,7 +14827,7 @@ function DefaultCollectionLayout({
|
|
|
14105
14827
|
}
|
|
14106
14828
|
return Array.from(tagSet).slice(0, 6);
|
|
14107
14829
|
}, [products]);
|
|
14108
|
-
const filtered =
|
|
14830
|
+
const filtered = React14.useMemo(() => {
|
|
14109
14831
|
let result = products;
|
|
14110
14832
|
if (searchQuery.trim().length >= 2) {
|
|
14111
14833
|
const q = searchQuery.toLowerCase();
|
|
@@ -14180,7 +14902,7 @@ function DefaultCollectionLayout({
|
|
|
14180
14902
|
] })
|
|
14181
14903
|
] }),
|
|
14182
14904
|
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(
|
|
14905
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14184
14906
|
ProductCard,
|
|
14185
14907
|
{
|
|
14186
14908
|
product,
|
|
@@ -14233,7 +14955,7 @@ function FeaturedCollectionLayout({
|
|
|
14233
14955
|
] })
|
|
14234
14956
|
] }),
|
|
14235
14957
|
/* @__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(
|
|
14958
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14237
14959
|
ProductCard,
|
|
14238
14960
|
{
|
|
14239
14961
|
product,
|
|
@@ -14255,10 +14977,10 @@ function CatalogueCollectionLayout({
|
|
|
14255
14977
|
onQuickAdd,
|
|
14256
14978
|
className
|
|
14257
14979
|
}) {
|
|
14258
|
-
const [searchQuery, setSearchQuery] =
|
|
14259
|
-
const [activeCategory, setActiveCategory] =
|
|
14260
|
-
const [sortBy, setSortBy] =
|
|
14261
|
-
const categories =
|
|
14980
|
+
const [searchQuery, setSearchQuery] = React14.useState("");
|
|
14981
|
+
const [activeCategory, setActiveCategory] = React14.useState(null);
|
|
14982
|
+
const [sortBy, setSortBy] = React14.useState("default");
|
|
14983
|
+
const categories = React14.useMemo(() => {
|
|
14262
14984
|
const cats = /* @__PURE__ */ new Map();
|
|
14263
14985
|
for (const p of products) {
|
|
14264
14986
|
if (p.category_id && p.tags) {
|
|
@@ -14269,7 +14991,7 @@ function CatalogueCollectionLayout({
|
|
|
14269
14991
|
}
|
|
14270
14992
|
return Array.from(cats.values()).slice(0, 8);
|
|
14271
14993
|
}, [products]);
|
|
14272
|
-
const filtered =
|
|
14994
|
+
const filtered = React14.useMemo(() => {
|
|
14273
14995
|
let result = products;
|
|
14274
14996
|
if (searchQuery.trim().length >= 2) {
|
|
14275
14997
|
const q = searchQuery.toLowerCase();
|
|
@@ -14357,7 +15079,7 @@ function CatalogueCollectionLayout({
|
|
|
14357
15079
|
] })
|
|
14358
15080
|
] }),
|
|
14359
15081
|
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(
|
|
15082
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14361
15083
|
ProductCard,
|
|
14362
15084
|
{
|
|
14363
15085
|
product,
|
|
@@ -14536,13 +15258,13 @@ function OrderHistoryPage({
|
|
|
14536
15258
|
className,
|
|
14537
15259
|
classNames
|
|
14538
15260
|
}) {
|
|
14539
|
-
const [statusFilter, setStatusFilter] =
|
|
14540
|
-
const [selectedOrder, setSelectedOrder] =
|
|
14541
|
-
const handleTabChange =
|
|
15261
|
+
const [statusFilter, setStatusFilter] = React14.useState(void 0);
|
|
15262
|
+
const [selectedOrder, setSelectedOrder] = React14.useState(null);
|
|
15263
|
+
const handleTabChange = React14.useCallback((value) => {
|
|
14542
15264
|
const filter = STATUS_FILTERS.find((f) => f.tabValue === value);
|
|
14543
15265
|
setStatusFilter(filter?.value);
|
|
14544
15266
|
}, []);
|
|
14545
|
-
const handleOrderClick =
|
|
15267
|
+
const handleOrderClick = React14.useCallback(
|
|
14546
15268
|
(order) => {
|
|
14547
15269
|
if (onOrderNavigate) {
|
|
14548
15270
|
onOrderNavigate(order);
|
|
@@ -14552,7 +15274,7 @@ function OrderHistoryPage({
|
|
|
14552
15274
|
},
|
|
14553
15275
|
[onOrderNavigate]
|
|
14554
15276
|
);
|
|
14555
|
-
const handleBack =
|
|
15277
|
+
const handleBack = React14.useCallback(() => {
|
|
14556
15278
|
setSelectedOrder(null);
|
|
14557
15279
|
}, []);
|
|
14558
15280
|
const activeTabValue = STATUS_FILTERS.find((f) => f.value === statusFilter)?.tabValue ?? "all";
|
|
@@ -14737,7 +15459,7 @@ function DefaultSearchLayout({
|
|
|
14737
15459
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
14738
15460
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
14739
15461
|
] }) : 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(
|
|
15462
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14741
15463
|
ProductCard,
|
|
14742
15464
|
{
|
|
14743
15465
|
product,
|
|
@@ -14839,7 +15561,7 @@ function CompactSearchLayout({
|
|
|
14839
15561
|
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Try a different search term" }),
|
|
14840
15562
|
/* @__PURE__ */ jsxRuntime.jsx("button", { onClick: clear, className: "text-sm font-medium text-primary mt-4 hover:underline", children: "Clear search" })
|
|
14841
15563
|
] }) : 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(
|
|
15564
|
+
(product) => renderCard ? /* @__PURE__ */ jsxRuntime.jsx(React14__default.default.Fragment, { children: renderCard(product) }, product.id) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
14843
15565
|
ProductCard,
|
|
14844
15566
|
{
|
|
14845
15567
|
product,
|
|
@@ -15170,11 +15892,11 @@ function DeliveryEstimate({
|
|
|
15170
15892
|
}) {
|
|
15171
15893
|
const context = useOptionalCimplifyClient();
|
|
15172
15894
|
const client = context?.client ?? null;
|
|
15173
|
-
const [result, setResult] =
|
|
15174
|
-
const [isLoading, setIsLoading] =
|
|
15175
|
-
const [error, setError] =
|
|
15176
|
-
const requestIdRef =
|
|
15177
|
-
|
|
15895
|
+
const [result, setResult] = React14.useState(null);
|
|
15896
|
+
const [isLoading, setIsLoading] = React14.useState(true);
|
|
15897
|
+
const [error, setError] = React14.useState(null);
|
|
15898
|
+
const requestIdRef = React14.useRef(0);
|
|
15899
|
+
React14.useEffect(() => {
|
|
15178
15900
|
if (!client) return;
|
|
15179
15901
|
const nextRequestId = ++requestIdRef.current;
|
|
15180
15902
|
setIsLoading(true);
|
|
@@ -15255,10 +15977,10 @@ function CurrencySelector({
|
|
|
15255
15977
|
}) {
|
|
15256
15978
|
const context = useOptionalCimplifyClient();
|
|
15257
15979
|
const client = context?.client ?? null;
|
|
15258
|
-
const [rates, setRates] =
|
|
15259
|
-
const [isLoadingRates, setIsLoadingRates] =
|
|
15260
|
-
const requestIdRef =
|
|
15261
|
-
|
|
15980
|
+
const [rates, setRates] = React14.useState({});
|
|
15981
|
+
const [isLoadingRates, setIsLoadingRates] = React14.useState(false);
|
|
15982
|
+
const requestIdRef = React14.useRef(0);
|
|
15983
|
+
React14.useEffect(() => {
|
|
15262
15984
|
if (!showRate || !baseCurrency || !client) return;
|
|
15263
15985
|
const targets = currencies.filter((c) => c !== baseCurrency);
|
|
15264
15986
|
if (targets.length === 0) return;
|
|
@@ -15321,11 +16043,11 @@ function ChatWidget({
|
|
|
15321
16043
|
}) {
|
|
15322
16044
|
const context = useOptionalCimplifyClient();
|
|
15323
16045
|
const client = clientProp ?? context?.client;
|
|
15324
|
-
const [open, setOpen] =
|
|
15325
|
-
const [unread, setUnread] =
|
|
16046
|
+
const [open, setOpen] = React14.useState(defaultOpen);
|
|
16047
|
+
const [unread, setUnread] = React14.useState(0);
|
|
15326
16048
|
const { messages, isLoading, isSending, error, isActive, send, startConversation } = useChat({ client, pollInterval });
|
|
15327
|
-
const prevCountRef =
|
|
15328
|
-
|
|
16049
|
+
const prevCountRef = React14.useRef(messages.length);
|
|
16050
|
+
React14.useEffect(() => {
|
|
15329
16051
|
if (!open && messages.length > prevCountRef.current) {
|
|
15330
16052
|
const newMessages = messages.slice(prevCountRef.current);
|
|
15331
16053
|
const incomingCount = newMessages.filter(
|
|
@@ -15335,11 +16057,11 @@ function ChatWidget({
|
|
|
15335
16057
|
}
|
|
15336
16058
|
prevCountRef.current = messages.length;
|
|
15337
16059
|
}, [messages, open]);
|
|
15338
|
-
const handleOpen =
|
|
16060
|
+
const handleOpen = React14.useCallback(() => {
|
|
15339
16061
|
setOpen(true);
|
|
15340
16062
|
setUnread(0);
|
|
15341
16063
|
}, []);
|
|
15342
|
-
const handleClose =
|
|
16064
|
+
const handleClose = React14.useCallback(() => setOpen(false), []);
|
|
15343
16065
|
const isLeft = position === "bottom-left";
|
|
15344
16066
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
15345
16067
|
"div",
|
|
@@ -15581,8 +16303,8 @@ function MessageList({
|
|
|
15581
16303
|
isSending,
|
|
15582
16304
|
className
|
|
15583
16305
|
}) {
|
|
15584
|
-
const bottomRef =
|
|
15585
|
-
|
|
16306
|
+
const bottomRef = React14.useRef(null);
|
|
16307
|
+
React14.useEffect(() => {
|
|
15586
16308
|
bottomRef.current?.scrollIntoView({ behavior: "smooth" });
|
|
15587
16309
|
}, [messages.length, isSending]);
|
|
15588
16310
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
@@ -15642,9 +16364,9 @@ function ChatInput({
|
|
|
15642
16364
|
onSend,
|
|
15643
16365
|
className
|
|
15644
16366
|
}) {
|
|
15645
|
-
const [value, setValue] =
|
|
15646
|
-
const textareaRef =
|
|
15647
|
-
const handleSend =
|
|
16367
|
+
const [value, setValue] = React14.useState("");
|
|
16368
|
+
const textareaRef = React14.useRef(null);
|
|
16369
|
+
const handleSend = React14.useCallback(() => {
|
|
15648
16370
|
const trimmed = value.trim();
|
|
15649
16371
|
if (!trimmed || isSending) return;
|
|
15650
16372
|
setValue("");
|
|
@@ -15653,7 +16375,7 @@ function ChatInput({
|
|
|
15653
16375
|
}
|
|
15654
16376
|
onSend(trimmed);
|
|
15655
16377
|
}, [value, isSending, onSend]);
|
|
15656
|
-
const handleKeyDown =
|
|
16378
|
+
const handleKeyDown = React14.useCallback(
|
|
15657
16379
|
(e) => {
|
|
15658
16380
|
if (e.key === "Enter" && !e.shiftKey) {
|
|
15659
16381
|
e.preventDefault();
|
|
@@ -15662,7 +16384,7 @@ function ChatInput({
|
|
|
15662
16384
|
},
|
|
15663
16385
|
[handleSend]
|
|
15664
16386
|
);
|
|
15665
|
-
const handleInput =
|
|
16387
|
+
const handleInput = React14.useCallback(() => {
|
|
15666
16388
|
const el = textareaRef.current;
|
|
15667
16389
|
if (!el) return;
|
|
15668
16390
|
el.style.height = "auto";
|
|
@@ -15802,8 +16524,11 @@ exports.AccountContent = AccountContent;
|
|
|
15802
16524
|
exports.AccountDashboardPage = AccountDashboardPage;
|
|
15803
16525
|
exports.AccountHero = AccountHero;
|
|
15804
16526
|
exports.AccountIdentityStrip = AccountIdentityStrip;
|
|
16527
|
+
exports.AccountLineItem = AccountLineItem;
|
|
16528
|
+
exports.AccountLineItems = AccountLineItems;
|
|
15805
16529
|
exports.AccountNav = AccountNav;
|
|
15806
16530
|
exports.AccountOrderDetailPage = AccountOrderDetailPage;
|
|
16531
|
+
exports.AccountOrderView = AccountOrderView;
|
|
15807
16532
|
exports.AccountOrdersPage = AccountOrdersPage;
|
|
15808
16533
|
exports.AccountShell = AccountShell;
|
|
15809
16534
|
exports.AccountSidebar = AccountSidebar;
|
|
@@ -15873,6 +16598,7 @@ exports.DefaultCollectionLayout = DefaultCollectionLayout;
|
|
|
15873
16598
|
exports.DefaultProductLayout = DefaultProductLayout;
|
|
15874
16599
|
exports.DefaultSearchLayout = DefaultSearchLayout;
|
|
15875
16600
|
exports.DeliveryEstimate = DeliveryEstimate;
|
|
16601
|
+
exports.DeliveryTracker = DeliveryTracker;
|
|
15876
16602
|
exports.DeliveryTruckIcon = DeliveryTruckIcon;
|
|
15877
16603
|
exports.DigitalProductCard = DigitalProductCard;
|
|
15878
16604
|
exports.DigitalProductLayout = DigitalProductLayout;
|
|
@@ -15890,6 +16616,7 @@ exports.IdentityOfframp = IdentityOfframp;
|
|
|
15890
16616
|
exports.InventoryBadge = InventoryBadge;
|
|
15891
16617
|
exports.ItemsCard = ItemsCard;
|
|
15892
16618
|
exports.LeaseServiceCard = LeaseServiceCard;
|
|
16619
|
+
exports.LineItemDetails = LineItemDetails;
|
|
15893
16620
|
exports.LocationPicker = LocationPicker;
|
|
15894
16621
|
exports.MediaGallery = MediaGallery;
|
|
15895
16622
|
exports.MetadataStringList = MetadataStringList;
|
|
@@ -15970,6 +16697,9 @@ exports.cn = cn;
|
|
|
15970
16697
|
exports.roomToResource = roomToResource;
|
|
15971
16698
|
exports.sanitizeRichTextHtml = sanitizeRichTextHtml;
|
|
15972
16699
|
exports.stripHtmlToText = stripHtmlToText;
|
|
16700
|
+
exports.toAccountLineItem = toAccountLineItem;
|
|
16701
|
+
exports.toAccountLineItems = toAccountLineItems;
|
|
16702
|
+
exports.toAccountOrderView = toAccountOrderView;
|
|
15973
16703
|
exports.useActivityState = useActivityState;
|
|
15974
16704
|
exports.useAds = useAds;
|
|
15975
16705
|
exports.useAttributeDefinitions = useAttributeDefinitions;
|