@rebuy/rebuy-hydrogen 2.3.1 → 3.0.0-beta.10

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.
Files changed (118) hide show
  1. package/README.md +0 -2
  2. package/dist/components/AddToCartBtn/AddToCartBtn.d.ts +3 -0
  3. package/dist/components/AddToCartBtn/AddToCartBtn.d.ts.map +1 -0
  4. package/dist/components/AddToCartBtn/HydrogenAddToCartBtn.d.ts +3 -0
  5. package/dist/components/AddToCartBtn/HydrogenAddToCartBtn.d.ts.map +1 -0
  6. package/dist/components/AddToCartBtn/HydrogenReactAddToCartBtn.d.ts +3 -0
  7. package/dist/components/AddToCartBtn/HydrogenReactAddToCartBtn.d.ts.map +1 -0
  8. package/dist/components/AddToCartBtn/index.d.ts +2 -0
  9. package/dist/components/AddToCartBtn/index.d.ts.map +1 -0
  10. package/dist/components/AddToCartBtn/types.d.ts +26 -0
  11. package/dist/components/AddToCartBtn/types.d.ts.map +1 -0
  12. package/dist/components/ProductCard/ProductCard.d.ts +3 -0
  13. package/dist/components/ProductCard/ProductCard.d.ts.map +1 -0
  14. package/dist/components/ProductCard/index.d.ts +2 -0
  15. package/dist/components/ProductCard/index.d.ts.map +1 -0
  16. package/dist/components/ProductCard/types.d.ts +10 -0
  17. package/dist/components/ProductCard/types.d.ts.map +1 -0
  18. package/dist/components/ProductPrice/ProductPrice.d.ts +5 -0
  19. package/dist/components/ProductPrice/ProductPrice.d.ts.map +1 -0
  20. package/dist/components/ProductPrice/index.d.ts +2 -0
  21. package/dist/components/ProductPrice/index.d.ts.map +1 -0
  22. package/dist/components/Title/Title.d.ts +3 -0
  23. package/dist/components/Title/Title.d.ts.map +1 -0
  24. package/dist/components/Title/index.d.ts +2 -0
  25. package/dist/components/Title/index.d.ts.map +1 -0
  26. package/dist/components/Title/types.d.ts +7 -0
  27. package/dist/components/Title/types.d.ts.map +1 -0
  28. package/dist/components/VariantSelect/VariantSelect.d.ts +3 -0
  29. package/dist/components/VariantSelect/VariantSelect.d.ts.map +1 -0
  30. package/dist/components/VariantSelect/index.d.ts +2 -0
  31. package/dist/components/VariantSelect/index.d.ts.map +1 -0
  32. package/dist/components/VariantSelect/types.d.ts +6 -0
  33. package/dist/components/VariantSelect/types.d.ts.map +1 -0
  34. package/dist/context/RebuyContext.d.ts +6 -0
  35. package/dist/context/RebuyContext.d.ts.map +1 -0
  36. package/dist/hooks/titleLevel.d.ts +3 -0
  37. package/dist/hooks/titleLevel.d.ts.map +1 -0
  38. package/dist/index.css +296 -0
  39. package/dist/index.css.map +7 -0
  40. package/dist/index.d.ts +8 -0
  41. package/dist/index.d.ts.map +1 -0
  42. package/dist/index.js +1967 -0
  43. package/dist/index.js.map +7 -0
  44. package/dist/index.mjs +1935 -0
  45. package/dist/index.mjs.map +7 -0
  46. package/dist/providers/RebuyHydrogenContextProvider.d.ts +3 -0
  47. package/dist/providers/RebuyHydrogenContextProvider.d.ts.map +1 -0
  48. package/dist/providers/RebuyHydrogenReactContextProvider.d.ts +3 -0
  49. package/dist/providers/RebuyHydrogenReactContextProvider.d.ts.map +1 -0
  50. package/dist/providers/types.d.ts +54 -0
  51. package/dist/providers/types.d.ts.map +1 -0
  52. package/dist/queries/cart.queries.d.ts +5 -0
  53. package/dist/queries/cart.queries.d.ts.map +1 -0
  54. package/dist/types/common.d.ts +9 -0
  55. package/dist/types/common.d.ts.map +1 -0
  56. package/dist/types/rebuyCustom.d.ts +240 -0
  57. package/dist/types/rebuyCustom.d.ts.map +1 -0
  58. package/dist/types/rebuySmartCart.d.ts +184 -0
  59. package/dist/types/rebuySmartCart.d.ts.map +1 -0
  60. package/dist/types/shopify.d.ts +85 -0
  61. package/dist/types/shopify.d.ts.map +1 -0
  62. package/dist/types/widgets.d.ts +22 -0
  63. package/dist/types/widgets.d.ts.map +1 -0
  64. package/dist/utils/convertToRebuyProduct.d.ts +156 -0
  65. package/dist/utils/convertToRebuyProduct.d.ts.map +1 -0
  66. package/dist/utils/createContextParameters.d.ts +3 -0
  67. package/dist/utils/createContextParameters.d.ts.map +1 -0
  68. package/dist/utils/getEncodedAttributes.d.ts +3 -0
  69. package/dist/utils/getEncodedAttributes.d.ts.map +1 -0
  70. package/dist/utils/getRebuyConfig.d.ts +3 -0
  71. package/dist/utils/getRebuyConfig.d.ts.map +1 -0
  72. package/dist/widgetContainer/RebuyWidgetContainer.d.ts +8 -0
  73. package/dist/widgetContainer/RebuyWidgetContainer.d.ts.map +1 -0
  74. package/dist/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.d.ts +3 -0
  75. package/dist/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.d.ts.map +1 -0
  76. package/dist/widgets/RebuyCompleteTheLook/index.d.ts +2 -0
  77. package/dist/widgets/RebuyCompleteTheLook/index.d.ts.map +1 -0
  78. package/dist/widgets/RebuyCompleteTheLook/types.d.ts +5 -0
  79. package/dist/widgets/RebuyCompleteTheLook/types.d.ts.map +1 -0
  80. package/dist/widgets/RebuyDynamicBundleProducts/BundleImages.d.ts +5 -0
  81. package/dist/widgets/RebuyDynamicBundleProducts/BundleImages.d.ts.map +1 -0
  82. package/dist/widgets/RebuyDynamicBundleProducts/BundlePrice.d.ts +5 -0
  83. package/dist/widgets/RebuyDynamicBundleProducts/BundlePrice.d.ts.map +1 -0
  84. package/dist/widgets/RebuyDynamicBundleProducts/BundleSelection.d.ts +3 -0
  85. package/dist/widgets/RebuyDynamicBundleProducts/BundleSelection.d.ts.map +1 -0
  86. package/dist/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.d.ts +3 -0
  87. package/dist/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.d.ts.map +1 -0
  88. package/dist/widgets/RebuyDynamicBundleProducts/Select.d.ts +3 -0
  89. package/dist/widgets/RebuyDynamicBundleProducts/Select.d.ts.map +1 -0
  90. package/dist/widgets/RebuyDynamicBundleProducts/index.d.ts +2 -0
  91. package/dist/widgets/RebuyDynamicBundleProducts/index.d.ts.map +1 -0
  92. package/dist/widgets/RebuyDynamicBundleProducts/types.d.ts +19 -0
  93. package/dist/widgets/RebuyDynamicBundleProducts/types.d.ts.map +1 -0
  94. package/dist/widgets/RebuyProductAddOns/RebuyProductAddOnCard.d.ts +3 -0
  95. package/dist/widgets/RebuyProductAddOns/RebuyProductAddOnCard.d.ts.map +1 -0
  96. package/dist/widgets/RebuyProductAddOns/RebuyProductAddOns.d.ts +3 -0
  97. package/dist/widgets/RebuyProductAddOns/RebuyProductAddOns.d.ts.map +1 -0
  98. package/dist/widgets/RebuyProductAddOns/index.d.ts +2 -0
  99. package/dist/widgets/RebuyProductAddOns/index.d.ts.map +1 -0
  100. package/dist/widgets/RebuyProductAddOns/types.d.ts +19 -0
  101. package/dist/widgets/RebuyProductAddOns/types.d.ts.map +1 -0
  102. package/dist/widgets/RebuyProductRecommendations/RebuyProductRecommendations.d.ts +3 -0
  103. package/dist/widgets/RebuyProductRecommendations/RebuyProductRecommendations.d.ts.map +1 -0
  104. package/dist/widgets/RebuyProductRecommendations/index.d.ts +2 -0
  105. package/dist/widgets/RebuyProductRecommendations/index.d.ts.map +1 -0
  106. package/dist/widgets/RebuyProductRecommendations/types.d.ts +5 -0
  107. package/dist/widgets/RebuyProductRecommendations/types.d.ts.map +1 -0
  108. package/package.json +84 -46
  109. package/RebuyCompleteTheLook.client.jsx +0 -188
  110. package/RebuyContextProvider.client.jsx +0 -222
  111. package/RebuyContexts.client.jsx +0 -3
  112. package/RebuyDynamicBundleProducts.client.jsx +0 -415
  113. package/RebuyProductAddOnCard.client.jsx +0 -89
  114. package/RebuyProductAddOns.client.jsx +0 -227
  115. package/RebuyProductRecommendations.client.jsx +0 -68
  116. package/RebuyProductViewed.client.jsx +0 -62
  117. package/RebuyRecentlyViewedProducts.client.jsx +0 -68
  118. package/RebuyWidgetContainer.client.jsx +0 -136
package/dist/index.js ADDED
@@ -0,0 +1,1967 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+
30
+ // src/index.ts
31
+ var index_exports = {};
32
+ __export(index_exports, {
33
+ RebuyCompleteTheLook: () => RebuyCompleteTheLook,
34
+ RebuyDynamicBundleProducts: () => RebuyDynamicBundleProducts,
35
+ RebuyHydrogenContextProvider: () => RebuyHydrogenContextProvider,
36
+ RebuyHydrogenReactContextProvider: () => RebuyHydrogenReactContextProvider,
37
+ RebuyProductAddOns: () => RebuyProductAddOns,
38
+ RebuyProductRecommendations: () => RebuyProductRecommendations,
39
+ RebuyWidgetContainer: () => RebuyWidgetContainer
40
+ });
41
+ module.exports = __toCommonJS(index_exports);
42
+
43
+ // src/providers/RebuyHydrogenContextProvider.tsx
44
+ var Utilities2 = __toESM(require("@rebuy/rebuy/utilities"), 1);
45
+ var import_react2 = require("@remix-run/react");
46
+ var import_react3 = require("react");
47
+
48
+ // src/context/RebuyContext.tsx
49
+ var import_react = require("react");
50
+ var RebuyContext = (0, import_react.createContext)(null);
51
+
52
+ // src/utils/createContextParameters.ts
53
+ var Utilities = __toESM(require("@rebuy/rebuy/utilities"), 1);
54
+
55
+ // src/utils/getEncodedAttributes.ts
56
+ var getEncodedAttributes = (attributes) => encodeURIComponent(
57
+ JSON.stringify(attributes.reduce((merged, { key, value }) => ({ ...merged, [key]: value }), {}))
58
+ );
59
+
60
+ // src/utils/createContextParameters.ts
61
+ var createContextParameters = ({
62
+ cacheKey,
63
+ cartAttributes,
64
+ cartId,
65
+ cartLines,
66
+ cartLinesLength,
67
+ cartNote,
68
+ cartSubtotal,
69
+ cartTotalQuantity,
70
+ isHydrogenReact,
71
+ queryObject,
72
+ windowUrl
73
+ }) => {
74
+ const contextParameters = {
75
+ cache_key: cacheKey,
76
+ cart_count: 0,
77
+ cart_item_count: 0,
78
+ cart_line_count: 0,
79
+ cart_subtotal: 0,
80
+ isHydrogenReact,
81
+ time: "",
82
+ url: windowUrl
83
+ };
84
+ const cartContext = {
85
+ attributes: "",
86
+ item_count: 0,
87
+ items: [],
88
+ line_count: 0,
89
+ note: "",
90
+ subtotal: 0,
91
+ token: ""
92
+ };
93
+ if (Object.prototype.hasOwnProperty.call(queryObject, "time")) {
94
+ contextParameters.time = queryObject.time;
95
+ }
96
+ if (cartId) {
97
+ cartContext.token = Utilities.getIdFromGraphUrl(cartId, "Cart");
98
+ contextParameters.cart_token = Utilities.getIdFromGraphUrl(cartId, "Cart");
99
+ }
100
+ if (cartSubtotal) {
101
+ cartContext.subtotal = Utilities.amountToCents(parseFloat(cartSubtotal));
102
+ contextParameters.cart_subtotal = Utilities.amountToCents(parseFloat(cartSubtotal));
103
+ }
104
+ if (cartLinesLength) {
105
+ const totalLines = cartLinesLength;
106
+ cartContext.line_count = totalLines;
107
+ contextParameters.cart_count = totalLines;
108
+ contextParameters.cart_line_count = totalLines;
109
+ }
110
+ if (cartTotalQuantity) {
111
+ cartContext.item_count = cartTotalQuantity;
112
+ contextParameters.cart_item_count = cartTotalQuantity;
113
+ }
114
+ if (cartLines) {
115
+ cartContext.items = [];
116
+ for (const cartItem of cartLines) {
117
+ const item = {
118
+ attributes: [],
119
+ product_id: "",
120
+ properties: "",
121
+ quantity: cartItem?.quantity,
122
+ variant_id: ""
123
+ };
124
+ if (cartItem?.merchandise?.product?.id) {
125
+ item.product_id = Utilities.getIdFromGraphUrl(cartItem.merchandise.product.id, "Product");
126
+ }
127
+ if (cartItem?.merchandise?.id) {
128
+ item.variant_id = Utilities.getIdFromGraphUrl(cartItem.merchandise.id, "ProductVariant");
129
+ }
130
+ if (cartItem?.attributes?.length) {
131
+ const validAttributes = cartItem.attributes.filter(
132
+ (attr) => attr !== void 0 && typeof attr.key === "string" && typeof attr.value === "string"
133
+ );
134
+ item.properties = getEncodedAttributes(validAttributes);
135
+ }
136
+ cartContext.items.push(item);
137
+ }
138
+ }
139
+ if (cartAttributes) {
140
+ const validAttributes = cartAttributes.filter(
141
+ (attr) => attr !== void 0 && typeof attr.key === "string" && typeof attr.value === "string"
142
+ );
143
+ cartContext.attributes = getEncodedAttributes(validAttributes);
144
+ }
145
+ if (cartNote) {
146
+ cartContext.note = cartNote;
147
+ }
148
+ contextParameters.cart = cartContext;
149
+ return contextParameters;
150
+ };
151
+
152
+ // src/utils/getRebuyConfig.ts
153
+ var import_rebuy = require("@rebuy/rebuy");
154
+ var getRebuyConfig = async (storeDomain) => {
155
+ try {
156
+ const request = {
157
+ parameters: { shop: storeDomain },
158
+ url: `/api/v1/user/config`
159
+ };
160
+ const { data: rebuy, ...response } = await new import_rebuy.RebuyClient(void 0, void 0, storeDomain).getShieldedAsset(
161
+ request.url,
162
+ request.parameters
163
+ );
164
+ if (!rebuy?.shop) {
165
+ throw new Error("Rebuy configuration is not properly set up - missing shop", { cause: response });
166
+ }
167
+ return rebuy;
168
+ } catch (error) {
169
+ const err = error;
170
+ console.warn("Error fetching Rebuy shop config");
171
+ console.error(err, err.cause);
172
+ throw err;
173
+ }
174
+ };
175
+
176
+ // src/providers/RebuyHydrogenContextProvider.tsx
177
+ var import_jsx_runtime = require("react/jsx-runtime");
178
+ var RebuyHydrogenContext = ({
179
+ apiKey,
180
+ cartAttributes,
181
+ cartCost,
182
+ cartId,
183
+ cartLines,
184
+ cartNote,
185
+ cartQuantity,
186
+ children,
187
+ publicStoreDomain,
188
+ shop
189
+ }) => {
190
+ const [rebuyConfig, setRebuyConfig] = (0, import_react3.useState)(null);
191
+ const location = (0, import_react2.useLocation)();
192
+ const queryObject = Utilities2.queryStringToObject(location.search);
193
+ const windowUrl = `${shop}${location.pathname}${location.search}`;
194
+ (0, import_react3.useEffect)(() => {
195
+ const initConfig = async () => {
196
+ const config = await getRebuyConfig(publicStoreDomain);
197
+ setRebuyConfig(config);
198
+ };
199
+ if (!rebuyConfig?.shop) {
200
+ initConfig();
201
+ }
202
+ }, [rebuyConfig]);
203
+ const contextParameters = (0, import_react3.useMemo)(
204
+ () => createContextParameters({
205
+ cacheKey: rebuyConfig?.shop?.cache_key,
206
+ cartAttributes,
207
+ cartId,
208
+ cartLines,
209
+ cartLinesLength: cartLines?.length,
210
+ cartNote,
211
+ cartSubtotal: cartCost,
212
+ cartTotalQuantity: cartQuantity,
213
+ isHydrogenReact: false,
214
+ queryObject,
215
+ windowUrl
216
+ }),
217
+ [rebuyConfig, windowUrl, queryObject, cartAttributes, cartCost, cartId, cartLines, cartQuantity, cartNote]
218
+ );
219
+ const contextParametersJSON = JSON.stringify(contextParameters);
220
+ const contextValue = (0, import_react3.useMemo)(
221
+ () => ({ contextParameters: JSON.parse(contextParametersJSON) }),
222
+ [contextParametersJSON]
223
+ );
224
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RebuyContext.Provider, { value: contextValue, children });
225
+ };
226
+ var RebuyHydrogenContextProvider = ({
227
+ apiKey,
228
+ cart,
229
+ children,
230
+ publicStoreDomain,
231
+ shop
232
+ }) => {
233
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react2.Await, { resolve: cart, children: (resolvedCart) => {
234
+ const cart2 = resolvedCart;
235
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
236
+ RebuyHydrogenContext,
237
+ {
238
+ apiKey,
239
+ cartAttributes: cart2?.attributes,
240
+ cartCost: cart2?.cost?.subtotalAmount?.amount,
241
+ cartId: cart2?.id,
242
+ cartLines: cart2?.lines?.nodes,
243
+ cartNote: cart2?.note,
244
+ cartQuantity: cart2?.totalQuantity,
245
+ publicStoreDomain,
246
+ shop,
247
+ children
248
+ }
249
+ );
250
+ } });
251
+ };
252
+
253
+ // src/providers/RebuyHydrogenReactContextProvider.tsx
254
+ var Utilities3 = __toESM(require("@rebuy/rebuy/utilities"), 1);
255
+ var import_react4 = require("@remix-run/react");
256
+ var import_hydrogen_react = require("@shopify/hydrogen-react");
257
+ var import_react5 = require("react");
258
+
259
+ // src/queries/cart.queries.ts
260
+ var OPTION_FRAGMENT = `#graphql
261
+ fragment OptionFragment on ProductOption {
262
+ id
263
+ name
264
+ optionValues {
265
+ id
266
+ name
267
+ swatch {
268
+ color
269
+ image {
270
+ mediaContentType
271
+ previewImage {
272
+ height
273
+ id
274
+ url
275
+ width
276
+ altText
277
+ }
278
+ id
279
+ alt
280
+ }
281
+ }
282
+ }
283
+ }
284
+ `;
285
+ var CART_LINE_FRAGMENT = `#graphql
286
+ fragment CartLineFragment on CartLine {
287
+ id
288
+ quantity
289
+ cost {
290
+ amountPerQuantity {
291
+ amount
292
+ currencyCode
293
+ }
294
+ compareAtAmountPerQuantity {
295
+ amount
296
+ currencyCode
297
+ }
298
+ totalAmount {
299
+ amount
300
+ currencyCode
301
+ }
302
+ subtotalAmount {
303
+ amount
304
+ currencyCode
305
+ }
306
+ }
307
+ attributes {
308
+ key
309
+ value
310
+ }
311
+ discountAllocations {
312
+ discountedAmount {
313
+ amount
314
+ currencyCode
315
+ }
316
+ ... on CartAutomaticDiscountAllocation {
317
+ __typename
318
+ discountedAmount {
319
+ amount
320
+ currencyCode
321
+ }
322
+ title
323
+ }
324
+ ... on CartCodeDiscountAllocation {
325
+ __typename
326
+ code
327
+ discountedAmount {
328
+ amount
329
+ currencyCode
330
+ }
331
+ }
332
+ ... on CartCustomDiscountAllocation {
333
+ __typename
334
+ discountedAmount {
335
+ amount
336
+ currencyCode
337
+ }
338
+ title
339
+ }
340
+ }
341
+ merchandise {
342
+ ... on ProductVariant {
343
+ availableForSale
344
+ id
345
+ sku
346
+ title
347
+ compareAtPrice {
348
+ amount
349
+ currencyCode
350
+ }
351
+ image {
352
+ altText
353
+ height
354
+ id
355
+ url
356
+ width
357
+ }
358
+ price {
359
+ amount
360
+ currencyCode
361
+ }
362
+ product {
363
+ handle
364
+ id
365
+ productType
366
+ tags
367
+ title
368
+ vendor
369
+ collections(first: 10) {
370
+ nodes {
371
+ handle
372
+ }
373
+ }
374
+ options {
375
+ ...OptionFragment
376
+ }
377
+ images(first: 20) {
378
+ nodes {
379
+ altText
380
+ height
381
+ id
382
+ url
383
+ width
384
+ }
385
+ }
386
+ }
387
+ selectedOptions {
388
+ name
389
+ value
390
+ }
391
+ }
392
+ }
393
+ }
394
+ `;
395
+ var CART_LINE_COMPONENT_FRAGMENT = `#graphql
396
+ fragment CartLineComponentFragment on ComponentizableCartLine {
397
+ id
398
+ quantity
399
+ cost {
400
+ amountPerQuantity {
401
+ amount
402
+ currencyCode
403
+ }
404
+ compareAtAmountPerQuantity {
405
+ amount
406
+ currencyCode
407
+ }
408
+ totalAmount {
409
+ amount
410
+ currencyCode
411
+ }
412
+ subtotalAmount {
413
+ amount
414
+ currencyCode
415
+ }
416
+ }
417
+ attributes {
418
+ key
419
+ value
420
+ }
421
+ discountAllocations {
422
+ discountedAmount {
423
+ amount
424
+ currencyCode
425
+ }
426
+ ... on CartAutomaticDiscountAllocation {
427
+ __typename
428
+ discountedAmount {
429
+ amount
430
+ currencyCode
431
+ }
432
+ title
433
+ }
434
+ ... on CartCodeDiscountAllocation {
435
+ __typename
436
+ code
437
+ discountedAmount {
438
+ amount
439
+ currencyCode
440
+ }
441
+ }
442
+ ... on CartCustomDiscountAllocation {
443
+ __typename
444
+ discountedAmount {
445
+ amount
446
+ currencyCode
447
+ }
448
+ title
449
+ }
450
+ }
451
+ merchandise {
452
+ ... on ProductVariant {
453
+ availableForSale
454
+ id
455
+ sku
456
+ title
457
+ compareAtPrice {
458
+ amount
459
+ currencyCode
460
+ }
461
+ image {
462
+ altText
463
+ height
464
+ id
465
+ url
466
+ width
467
+ }
468
+ price {
469
+ amount
470
+ currencyCode
471
+ }
472
+ product {
473
+ handle
474
+ id
475
+ productType
476
+ tags
477
+ title
478
+ vendor
479
+ collections(first: 10) {
480
+ nodes {
481
+ handle
482
+ }
483
+ }
484
+ options {
485
+ id
486
+ name
487
+ optionValues {
488
+ id
489
+ name
490
+ swatch {
491
+ color
492
+ image {
493
+ mediaContentType
494
+ previewImage {
495
+ height
496
+ id
497
+ url
498
+ width
499
+ altText
500
+ }
501
+ id
502
+ alt
503
+ }
504
+ }
505
+ }
506
+ }
507
+ images(first: 20) {
508
+ nodes {
509
+ altText
510
+ height
511
+ id
512
+ url
513
+ width
514
+ }
515
+ }
516
+ }
517
+ selectedOptions {
518
+ name
519
+ value
520
+ }
521
+ }
522
+ }
523
+ lineComponents {
524
+ id
525
+ quantity
526
+ cost {
527
+ amountPerQuantity {
528
+ amount
529
+ currencyCode
530
+ }
531
+ compareAtAmountPerQuantity {
532
+ amount
533
+ currencyCode
534
+ }
535
+ totalAmount {
536
+ amount
537
+ currencyCode
538
+ }
539
+ subtotalAmount {
540
+ amount
541
+ currencyCode
542
+ }
543
+ }
544
+ attributes {
545
+ key
546
+ value
547
+ }
548
+ discountAllocations {
549
+ discountedAmount {
550
+ amount
551
+ currencyCode
552
+ }
553
+ ... on CartAutomaticDiscountAllocation {
554
+ __typename
555
+ discountedAmount {
556
+ amount
557
+ currencyCode
558
+ }
559
+ title
560
+ }
561
+ ... on CartCodeDiscountAllocation {
562
+ __typename
563
+ code
564
+ discountedAmount {
565
+ amount
566
+ currencyCode
567
+ }
568
+ }
569
+ ... on CartCustomDiscountAllocation {
570
+ __typename
571
+ discountedAmount {
572
+ amount
573
+ currencyCode
574
+ }
575
+ title
576
+ }
577
+ }
578
+ merchandise {
579
+ ... on ProductVariant {
580
+ availableForSale
581
+ id
582
+ sku
583
+ title
584
+ compareAtPrice {
585
+ amount
586
+ currencyCode
587
+ }
588
+ image {
589
+ altText
590
+ height
591
+ id
592
+ url
593
+ width
594
+ }
595
+ price {
596
+ amount
597
+ currencyCode
598
+ }
599
+ product {
600
+ handle
601
+ id
602
+ productType
603
+ tags
604
+ title
605
+ vendor
606
+ collections(first: 10) {
607
+ nodes {
608
+ handle
609
+ }
610
+ }
611
+ options {
612
+ ...OptionFragment
613
+ }
614
+ images(first: 20) {
615
+ nodes {
616
+ altText
617
+ height
618
+ id
619
+ url
620
+ width
621
+ }
622
+ }
623
+ }
624
+ selectedOptions {
625
+ name
626
+ value
627
+ }
628
+ }
629
+ }
630
+ }
631
+ }
632
+ `;
633
+ var CART_FRAGMENT = `#graphql
634
+ fragment CartFragment on Cart {
635
+ id
636
+ checkoutUrl
637
+ createdAt
638
+ totalQuantity
639
+ note
640
+ updatedAt
641
+ __typename
642
+ buyerIdentity {
643
+ countryCode
644
+ customer {
645
+ id
646
+ email
647
+ firstName
648
+ lastName
649
+ displayName
650
+ }
651
+ email
652
+ phone
653
+ }
654
+ attributes {
655
+ key
656
+ value
657
+ }
658
+ cost {
659
+ subtotalAmount {
660
+ amount
661
+ currencyCode
662
+ }
663
+ totalAmount {
664
+ amount
665
+ currencyCode
666
+ }
667
+ }
668
+ discountAllocations {
669
+ discountedAmount {
670
+ amount
671
+ currencyCode
672
+ }
673
+ ... on CartAutomaticDiscountAllocation {
674
+ __typename
675
+ discountedAmount {
676
+ amount
677
+ currencyCode
678
+ }
679
+ title
680
+ }
681
+ ... on CartCodeDiscountAllocation {
682
+ __typename
683
+ code
684
+ discountedAmount {
685
+ amount
686
+ currencyCode
687
+ }
688
+ }
689
+ ... on CartCustomDiscountAllocation {
690
+ __typename
691
+ discountedAmount {
692
+ amount
693
+ currencyCode
694
+ }
695
+ title
696
+ }
697
+ }
698
+ discountCodes {
699
+ applicable
700
+ code
701
+ }
702
+ lines(first: $numCartLines) {
703
+ edges {
704
+ node {
705
+ ...CartLineComponentFragment
706
+ }
707
+ }
708
+ edges {
709
+ node {
710
+ ...CartLineFragment
711
+ }
712
+ }
713
+ }
714
+ }
715
+ ${CART_LINE_FRAGMENT}
716
+ ${CART_LINE_COMPONENT_FRAGMENT}
717
+ ${OPTION_FRAGMENT}
718
+ `;
719
+
720
+ // src/providers/RebuyHydrogenReactContextProvider.tsx
721
+ var import_jsx_runtime2 = require("react/jsx-runtime");
722
+ var PUBLIC_PRIMARY_DOMAIN = process.env.PUBLIC_PRIMARY_DOMAIN;
723
+ var PUBLIC_STORE_DOMAIN = process.env.PUBLIC_STORE_DOMAIN;
724
+ var PUBLIC_STOREFRONT_ID = process.env.PUBLIC_STOREFRONT_ID;
725
+ var PUBLIC_STOREFRONT_API_TOKEN = process.env.PUBLIC_STOREFRONT_API_TOKEN || "";
726
+ var RebuyHydrogenReactContext = ({ children }) => {
727
+ const [rebuyConfig, setRebuyConfig] = (0, import_react5.useState)(null);
728
+ const location = (0, import_react4.useLocation)();
729
+ const queryObject = Utilities3.queryStringToObject(location.search);
730
+ const windowUrl = `${PUBLIC_PRIMARY_DOMAIN}${location.pathname}${location.search}`;
731
+ const cart = (0, import_hydrogen_react.useCart)();
732
+ (0, import_react5.useEffect)(() => {
733
+ const initConfig = async () => {
734
+ const config = await getRebuyConfig(PUBLIC_STORE_DOMAIN);
735
+ setRebuyConfig(config);
736
+ };
737
+ if (!rebuyConfig?.shop) {
738
+ initConfig();
739
+ }
740
+ }, [rebuyConfig, PUBLIC_STORE_DOMAIN]);
741
+ const contextParameters = (0, import_react5.useMemo)(
742
+ () => createContextParameters({
743
+ cacheKey: rebuyConfig?.shop?.cache_key,
744
+ cartAttributes: cart?.attributes,
745
+ cartId: cart?.id,
746
+ cartLines: cart?.lines,
747
+ cartLinesLength: cart?.lines?.length,
748
+ cartSubtotal: cart?.cost?.subtotalAmount?.amount,
749
+ cartTotalQuantity: cart?.totalQuantity,
750
+ isHydrogenReact: true,
751
+ queryObject,
752
+ windowUrl
753
+ }),
754
+ [rebuyConfig, windowUrl, queryObject, cart]
755
+ );
756
+ const contextParametersJSON = JSON.stringify(contextParameters);
757
+ const contextValue = (0, import_react5.useMemo)(
758
+ () => ({ contextParameters: JSON.parse(contextParametersJSON) }),
759
+ [contextParametersJSON]
760
+ );
761
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RebuyContext.Provider, { value: contextValue, children });
762
+ };
763
+ var RebuyHydrogenReactContextProvider = ({
764
+ cartFragment = CART_FRAGMENT,
765
+ children,
766
+ countryIsoCode = "US",
767
+ customerAccessToken = "",
768
+ data,
769
+ languageIsoCode = "EN",
770
+ numCartLines,
771
+ onAttributesUpdate,
772
+ onAttributesUpdateComplete,
773
+ onBuyerIdentityUpdate,
774
+ onBuyerIdentityUpdateComplete,
775
+ onCreate,
776
+ onCreateComplete,
777
+ onDiscountCodesUpdate,
778
+ onDiscountCodesUpdateComplete,
779
+ onLineAdd,
780
+ onLineAddComplete,
781
+ onLineRemove,
782
+ onLineRemoveComplete,
783
+ onLineUpdate,
784
+ onLineUpdateComplete,
785
+ onNoteUpdate,
786
+ onNoteUpdateComplete,
787
+ storefrontApiVersion = "2025-01"
788
+ }) => {
789
+ const adapted = {
790
+ onAttributesUpdate: onAttributesUpdate ? () => onAttributesUpdate() : void 0,
791
+ onAttributesUpdateComplete: onAttributesUpdateComplete ? () => onAttributesUpdateComplete() : void 0,
792
+ onBuyerIdentityUpdate: onBuyerIdentityUpdate ? () => onBuyerIdentityUpdate() : void 0,
793
+ onBuyerIdentityUpdateComplete: onBuyerIdentityUpdateComplete ? () => onBuyerIdentityUpdateComplete() : void 0,
794
+ onCreate: onCreate ? () => onCreate() : void 0,
795
+ onCreateComplete: onCreateComplete ? () => onCreateComplete() : void 0,
796
+ onDiscountCodesUpdate: onDiscountCodesUpdate ? () => onDiscountCodesUpdate() : void 0,
797
+ onDiscountCodesUpdateComplete: onDiscountCodesUpdateComplete ? () => onDiscountCodesUpdateComplete() : void 0,
798
+ onLineAdd: onLineAdd ? () => onLineAdd() : void 0,
799
+ onLineAddComplete: onLineAddComplete ? () => onLineAddComplete() : void 0,
800
+ onLineRemove: onLineRemove ? () => onLineRemove() : void 0,
801
+ onLineRemoveComplete: onLineRemoveComplete ? () => onLineRemoveComplete() : void 0,
802
+ onLineUpdate: onLineUpdate ? () => onLineUpdate() : void 0,
803
+ onLineUpdateComplete: onLineUpdateComplete ? () => onLineUpdateComplete() : void 0,
804
+ onNoteUpdate: onNoteUpdate ? () => onNoteUpdate() : void 0,
805
+ onNoteUpdateComplete: onNoteUpdateComplete ? () => onNoteUpdateComplete() : void 0
806
+ };
807
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
808
+ import_hydrogen_react.ShopifyProvider,
809
+ {
810
+ countryIsoCode,
811
+ languageIsoCode,
812
+ storeDomain: PUBLIC_STORE_DOMAIN,
813
+ storefrontApiVersion,
814
+ storefrontId: PUBLIC_STOREFRONT_ID,
815
+ storefrontToken: PUBLIC_STOREFRONT_API_TOKEN,
816
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
817
+ import_hydrogen_react.CartProvider,
818
+ {
819
+ cartFragment,
820
+ countryCode: countryIsoCode,
821
+ customerAccessToken,
822
+ data,
823
+ languageCode: languageIsoCode,
824
+ numCartLines,
825
+ onAttributesUpdate: adapted.onAttributesUpdate,
826
+ onAttributesUpdateComplete: adapted.onAttributesUpdateComplete,
827
+ onBuyerIdentityUpdate: adapted.onBuyerIdentityUpdate,
828
+ onBuyerIdentityUpdateComplete: adapted.onBuyerIdentityUpdateComplete,
829
+ onCreate: adapted.onCreate,
830
+ onCreateComplete: adapted.onCreateComplete,
831
+ onDiscountCodesUpdate: adapted.onDiscountCodesUpdate,
832
+ onDiscountCodesUpdateComplete: adapted.onDiscountCodesUpdateComplete,
833
+ onLineAdd: adapted.onLineAdd,
834
+ onLineAddComplete: adapted.onLineAddComplete,
835
+ onLineRemove: adapted.onLineRemove,
836
+ onLineRemoveComplete: adapted.onLineRemoveComplete,
837
+ onLineUpdate: adapted.onLineUpdate,
838
+ onLineUpdateComplete: adapted.onLineUpdateComplete,
839
+ onNoteUpdate: adapted.onNoteUpdate,
840
+ onNoteUpdateComplete: adapted.onNoteUpdateComplete,
841
+ children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RebuyHydrogenReactContext, { children })
842
+ }
843
+ )
844
+ }
845
+ );
846
+ };
847
+
848
+ // src/widgetContainer/RebuyWidgetContainer.tsx
849
+ var import_rebuy2 = require("@rebuy/rebuy");
850
+ var Utilities4 = __toESM(require("@rebuy/rebuy/utilities"), 1);
851
+ var import_hydrogen = require("@shopify/hydrogen");
852
+ var import_react6 = __toESM(require("react"), 1);
853
+ var RebuyWidgetContainerBase = ({ children, ...props }) => {
854
+ const { apiKey, collection, collectionId, dataSource, limit, options, product, productId, variant, variantId } = props;
855
+ const contextParameters = (0, import_react6.useContext)(RebuyContext);
856
+ const [Rebuy, setRebuy] = (0, import_react6.useState)(null);
857
+ const [initialized, setInitialized] = (0, import_react6.useState)(false);
858
+ const shopifyProductId = product?.id ?? productId ?? null;
859
+ const shopifyVariantId = variant?.id ?? variantId ?? null;
860
+ const shopifyCollectionId = collection?.id ?? collectionId ?? null;
861
+ const [products, setProducts] = (0, import_react6.useState)([]);
862
+ const [metadata, setMetadata] = (0, import_react6.useState)();
863
+ (0, import_react6.useEffect)(() => {
864
+ if (!Rebuy) {
865
+ const client = new import_rebuy2.RebuyClient(apiKey);
866
+ client.setContextParameters(
867
+ contextParameters
868
+ // TODO: fix this type when @rebuy/rebuy is moved to typescript
869
+ );
870
+ if (options) {
871
+ client.setDefaultParameters(options);
872
+ }
873
+ setRebuy(client);
874
+ setInitialized(true);
875
+ }
876
+ }, [apiKey, Rebuy, contextParameters, options]);
877
+ (0, import_react6.useEffect)(() => {
878
+ if (!Rebuy) return;
879
+ Rebuy.setContextParameters(
880
+ contextParameters
881
+ // TODO: fix this type when @rebuy/rebuy is moved to typescript
882
+ );
883
+ }, [Rebuy, contextParameters]);
884
+ const request = (0, import_react6.useMemo)(() => {
885
+ const request2 = {
886
+ endpoint: dataSource || "/api/v1/products/recommended",
887
+ params: {}
888
+ // Keeping this object generic to allow for custom endpoints
889
+ };
890
+ if (shopifyProductId) {
891
+ request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(shopifyProductId, "Product");
892
+ }
893
+ if (shopifyProductId) {
894
+ request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(shopifyProductId, "Product");
895
+ }
896
+ if (shopifyVariantId) {
897
+ request2.params.shopify_variant_ids = Utilities4.getIdFromGraphUrl(shopifyVariantId, "ProductVariant");
898
+ }
899
+ if (shopifyCollectionId) {
900
+ request2.params.shopify_collection_ids = Utilities4.getIdFromGraphUrl(shopifyCollectionId, "Collection");
901
+ }
902
+ if (limit) {
903
+ request2.params.limit = limit;
904
+ }
905
+ return request2;
906
+ }, [dataSource, shopifyProductId, shopifyVariantId, shopifyCollectionId, limit]);
907
+ (0, import_react6.useEffect)(() => {
908
+ let isMounted = true;
909
+ if (!Rebuy || !initialized) return;
910
+ const fetchData = async () => {
911
+ const { data, metadata: metadata2 } = await Rebuy.getStorefrontData(request.endpoint, request.params);
912
+ if (isMounted) {
913
+ setProducts(
914
+ Array.isArray(data) ? data.map((product2) => ({
915
+ ...product2,
916
+ variants: {
917
+ nodes: product2.variants ? (0, import_hydrogen.flattenConnection)(product2.variants) : []
918
+ }
919
+ })) : []
920
+ );
921
+ setMetadata(metadata2);
922
+ }
923
+ };
924
+ fetchData();
925
+ return () => {
926
+ isMounted = false;
927
+ };
928
+ }, [Rebuy, initialized, request]);
929
+ const childrenWithProps = (props2) => import_react6.default.Children.map(
930
+ children,
931
+ (child) => import_react6.default.isValidElement(child) ? import_react6.default.cloneElement(child, props2) : child
932
+ );
933
+ const childProps = {
934
+ ...props,
935
+ isHydrogenReact: contextParameters?.contextParameters?.isHydrogenReact,
936
+ key: product?.id,
937
+ metadata,
938
+ products
939
+ };
940
+ return childrenWithProps(childProps);
941
+ };
942
+ var RebuyWidgetContainer = RebuyWidgetContainerBase;
943
+
944
+ // src/components/ProductCard/ProductCard.tsx
945
+ var import_react7 = require("@remix-run/react");
946
+ var import_hydrogen4 = require("@shopify/hydrogen");
947
+ var import_react8 = require("react");
948
+
949
+ // src/components/AddToCartBtn/HydrogenAddToCartBtn.tsx
950
+ var import_hydrogen2 = require("@shopify/hydrogen");
951
+
952
+ // src/components/AddToCartBtn/AddToCartBtn.module.css
953
+ var AddToCartBtn_default = {
954
+ button: "AddToCartBtn_button"
955
+ };
956
+
957
+ // src/components/AddToCartBtn/HydrogenAddToCartBtn.tsx
958
+ var import_jsx_runtime3 = require("react/jsx-runtime");
959
+ var HydrogenAddToCartBtn = ({
960
+ addToCartBtnText,
961
+ addToCartCallback,
962
+ disabled,
963
+ linesToAdd,
964
+ moneyData
965
+ }) => {
966
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
967
+ import_hydrogen2.CartForm,
968
+ {
969
+ action: import_hydrogen2.CartForm.ACTIONS.LinesAdd,
970
+ inputs: {
971
+ lines: linesToAdd
972
+ },
973
+ route: "/cart",
974
+ children: (fetcher) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
975
+ "button",
976
+ {
977
+ className: AddToCartBtn_default.button,
978
+ disabled: disabled || fetcher.state !== "idle",
979
+ onClick: addToCartCallback,
980
+ type: "submit",
981
+ children: [
982
+ addToCartBtnText,
983
+ moneyData && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
984
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: " | " }),
985
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_hydrogen2.Money, { data: moneyData, withoutTrailingZeros: true })
986
+ ] })
987
+ ]
988
+ }
989
+ ) })
990
+ }
991
+ );
992
+ };
993
+
994
+ // src/components/AddToCartBtn/HydrogenReactAddToCartBtn.tsx
995
+ var import_hydrogen_react2 = require("@shopify/hydrogen-react");
996
+ var import_jsx_runtime4 = require("react/jsx-runtime");
997
+ var HydrogenReactAddToCartBtn = ({
998
+ addToCartBtnText,
999
+ addToCartCallback,
1000
+ disabled,
1001
+ linesToAdd,
1002
+ moneyData
1003
+ }) => {
1004
+ const { linesAdd } = (0, import_hydrogen_react2.useCart)();
1005
+ const handleAddToCart = () => {
1006
+ linesAdd(linesToAdd);
1007
+ addToCartCallback?.();
1008
+ };
1009
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("button", { className: AddToCartBtn_default.button, disabled, onClick: handleAddToCart, type: "button", children: [
1010
+ addToCartBtnText,
1011
+ moneyData && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
1012
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: " | " }),
1013
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_hydrogen_react2.Money, { data: moneyData, withoutTrailingZeros: true })
1014
+ ] })
1015
+ ] });
1016
+ };
1017
+
1018
+ // src/components/AddToCartBtn/AddToCartBtn.tsx
1019
+ var import_jsx_runtime5 = require("react/jsx-runtime");
1020
+ var AddToCartBtn = ({
1021
+ addToCartBtnText,
1022
+ addToCartCallback,
1023
+ disabled,
1024
+ isHydrogenReact,
1025
+ moneyData,
1026
+ selectedVariants
1027
+ }) => {
1028
+ const linesToAdd = selectedVariants.map((variant) => ({
1029
+ attributes: [
1030
+ { key: "_source", value: "Rebuy" },
1031
+ { key: "_attribution", value: "Rebuy Product Recommendations" }
1032
+ ],
1033
+ merchandiseId: variant.id,
1034
+ quantity: 1,
1035
+ selectedVariant: variant
1036
+ }));
1037
+ if (isHydrogenReact) {
1038
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
1039
+ HydrogenReactAddToCartBtn,
1040
+ {
1041
+ addToCartBtnText,
1042
+ addToCartCallback,
1043
+ disabled,
1044
+ linesToAdd,
1045
+ moneyData
1046
+ }
1047
+ );
1048
+ }
1049
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
1050
+ HydrogenAddToCartBtn,
1051
+ {
1052
+ addToCartBtnText,
1053
+ addToCartCallback,
1054
+ disabled,
1055
+ linesToAdd,
1056
+ moneyData
1057
+ }
1058
+ );
1059
+ };
1060
+
1061
+ // src/components/ProductPrice/ProductPrice.tsx
1062
+ var import_hydrogen3 = require("@shopify/hydrogen");
1063
+
1064
+ // src/components/ProductPrice/ProductPrice.module.css
1065
+ var ProductPrice_default = {
1066
+ priceContainer: "ProductPrice_priceContainer",
1067
+ compareAtPrice: "ProductPrice_compareAtPrice"
1068
+ };
1069
+
1070
+ // src/components/ProductPrice/ProductPrice.tsx
1071
+ var import_jsx_runtime6 = require("react/jsx-runtime");
1072
+ var RebuyProductPrice = ({ selectedVariant }) => {
1073
+ if (!selectedVariant) return null;
1074
+ const { compareAtPriceV2: compareAtPrice, priceV2: price } = selectedVariant;
1075
+ const isDiscounted = (price2, compareAtPrice2) => Number(compareAtPrice2?.amount) > Number(price2?.amount);
1076
+ const CompareAtPrice = ({ data: compareAtPrice2 }) => {
1077
+ return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_hydrogen3.Money, { as: "span", className: ProductPrice_default.compareAtPrice, data: compareAtPrice2, withoutTrailingZeros: true });
1078
+ };
1079
+ return price && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: ProductPrice_default.priceContainer, children: [
1080
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_hydrogen3.Money, { data: price, withoutTrailingZeros: true }),
1081
+ compareAtPrice && isDiscounted(price, compareAtPrice) && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(CompareAtPrice, { data: compareAtPrice })
1082
+ ] });
1083
+ };
1084
+
1085
+ // src/components/Title/Title.tsx
1086
+ var import_jsx_runtime7 = require("react/jsx-runtime");
1087
+ var Title = ({ level, style, text }) => {
1088
+ switch (level) {
1089
+ case "h1":
1090
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { style, children: text });
1091
+ default:
1092
+ case "h2":
1093
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h2", { style, children: text });
1094
+ case "h3":
1095
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { style, children: text });
1096
+ case "h4":
1097
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h4", { style, children: text });
1098
+ case "h5":
1099
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h5", { style, children: text });
1100
+ case "h6":
1101
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h6", { style, children: text });
1102
+ }
1103
+ };
1104
+
1105
+ // src/components/VariantSelect/VariantSelect.module.css
1106
+ var VariantSelect_default = {
1107
+ select: "VariantSelect_select"
1108
+ };
1109
+
1110
+ // src/components/VariantSelect/VariantSelect.tsx
1111
+ var import_jsx_runtime8 = require("react/jsx-runtime");
1112
+ var VariantSelect = ({ handleSelectedVariant, product }) => {
1113
+ const getOptionsLabel = (product2) => {
1114
+ const options = product2.variants.nodes[0].selectedOptions;
1115
+ const optionsFromKeys = options ? Object.keys(options[0]) : [];
1116
+ const optionsFromValues = options ? options.map((option) => option.name) : [];
1117
+ const useValues = optionsFromKeys.every((key) => ["name", "value"].includes(key));
1118
+ return (useValues ? optionsFromValues : optionsFromKeys).join(" / ");
1119
+ };
1120
+ return product?.variants.nodes.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1121
+ "select",
1122
+ {
1123
+ "aria-label": "select variant",
1124
+ className: VariantSelect_default.select,
1125
+ onChange: (e) => handleSelectedVariant(product, e.target.value),
1126
+ children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("optgroup", { label: getOptionsLabel(product), children: product.variants.nodes.map(({ id, title }) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("option", { value: id, children: title }, id + "-variant")) })
1127
+ }
1128
+ ) });
1129
+ };
1130
+
1131
+ // src/components/ProductCard/ProductCard.module.css
1132
+ var ProductCard_default = {
1133
+ container: "ProductCard_container",
1134
+ productInfo: "ProductCard_productInfo"
1135
+ };
1136
+
1137
+ // src/components/ProductCard/ProductCard.tsx
1138
+ var import_jsx_runtime9 = require("react/jsx-runtime");
1139
+ var ProductCard = ({
1140
+ addToCartBtnText,
1141
+ addToCartCallback,
1142
+ isHydrogenReact,
1143
+ product,
1144
+ productCardTitleLevel
1145
+ }) => {
1146
+ const [selectedVariant, setSelectedVariant] = (0, import_react8.useState)(product.variants.nodes[0]);
1147
+ const { image } = selectedVariant;
1148
+ const handleSelectedVariant = (product2, variant_id) => {
1149
+ const updatedVariant = product2.variants.nodes.find((variant) => variant.id === variant_id);
1150
+ if (updatedVariant) {
1151
+ setSelectedVariant(updatedVariant);
1152
+ }
1153
+ };
1154
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: ProductCard_default.container, children: [
1155
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { children: [
1156
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react7.Link, { to: `/products/${product.handle}`, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1157
+ import_hydrogen4.Image,
1158
+ {
1159
+ alt: image?.altText ?? `Picture of ${product.title}`,
1160
+ data: image,
1161
+ sizes: "(max-width: 320px) 280px, (max-width: 768px) 720px, 1440px"
1162
+ }
1163
+ ) }),
1164
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: ProductCard_default.productInfo, children: [
1165
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react7.Link, { to: `/products/${product.handle}`, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Title, { level: productCardTitleLevel, text: product.title }) }),
1166
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RebuyProductPrice, { selectedVariant }),
1167
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(VariantSelect, { handleSelectedVariant, product })
1168
+ ] })
1169
+ ] }),
1170
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1171
+ AddToCartBtn,
1172
+ {
1173
+ addToCartBtnText,
1174
+ addToCartCallback,
1175
+ isHydrogenReact,
1176
+ selectedVariants: [selectedVariant]
1177
+ }
1178
+ )
1179
+ ] });
1180
+ };
1181
+
1182
+ // src/hooks/titleLevel.tsx
1183
+ var getTitleLevel = (level, decreaseLevel = false) => {
1184
+ switch (level) {
1185
+ case "h1":
1186
+ if (decreaseLevel) {
1187
+ return "h2" /* H2 */;
1188
+ }
1189
+ return "h1" /* H1 */;
1190
+ case "h2":
1191
+ if (decreaseLevel) {
1192
+ return "h3" /* H3 */;
1193
+ }
1194
+ return "h2" /* H2 */;
1195
+ case "h3":
1196
+ if (decreaseLevel) {
1197
+ return "h4" /* H4 */;
1198
+ }
1199
+ return "h3" /* H3 */;
1200
+ case "h4":
1201
+ if (decreaseLevel) {
1202
+ return "h5" /* H5 */;
1203
+ }
1204
+ return "h4" /* H4 */;
1205
+ case "h5":
1206
+ if (decreaseLevel) {
1207
+ return "h6" /* H6 */;
1208
+ }
1209
+ return "h5" /* H5 */;
1210
+ case "h6":
1211
+ if (decreaseLevel) {
1212
+ return "h6" /* H6 */;
1213
+ }
1214
+ return "h6" /* H6 */;
1215
+ default:
1216
+ return "h2" /* H2 */;
1217
+ }
1218
+ };
1219
+
1220
+ // src/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.module.css
1221
+ var RebuyCompleteTheLook_default = {
1222
+ container: "RebuyCompleteTheLook_container",
1223
+ productGrid: "RebuyCompleteTheLook_productGrid",
1224
+ productItem: "RebuyCompleteTheLook_productItem"
1225
+ };
1226
+
1227
+ // src/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.tsx
1228
+ var import_jsx_runtime10 = require("react/jsx-runtime");
1229
+ var RebuyCompleteTheLook = (props) => {
1230
+ const {
1231
+ addToCartBtnText = "Add to cart",
1232
+ addToCartCallback,
1233
+ customTitle = `These pair with ${props.product?.title}`,
1234
+ customTitleLevel = "h2",
1235
+ customTitleStyle,
1236
+ products = []
1237
+ } = props;
1238
+ if (products.length === 0) {
1239
+ console.log("RebuyCompleteTheLook: No products found");
1240
+ return null;
1241
+ }
1242
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("section", { className: RebuyCompleteTheLook_default.container, children: [
1243
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
1244
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("ul", { className: RebuyCompleteTheLook_default.productGrid, children: products.map((product) => /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("li", { className: RebuyCompleteTheLook_default.productItem, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1245
+ ProductCard,
1246
+ {
1247
+ addToCartBtnText,
1248
+ addToCartCallback,
1249
+ isHydrogenReact: props.isHydrogenReact,
1250
+ product,
1251
+ productCardTitleLevel: getTitleLevel(customTitleLevel, true)
1252
+ }
1253
+ ) }, product.id)) })
1254
+ ] });
1255
+ };
1256
+
1257
+ // src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.tsx
1258
+ var import_react11 = require("react");
1259
+
1260
+ // src/utils/convertToRebuyProduct.tsx
1261
+ var convertToRebuyProduct = (isHydrogenReact, product) => {
1262
+ const mainProductVariants = isHydrogenReact ? product?.variants?.nodes?.map((variant) => {
1263
+ return {
1264
+ ...variant
1265
+ };
1266
+ }) || [] : product?.adjacentVariants.map((variant) => {
1267
+ return {
1268
+ availableForSale: variant.availableForSale,
1269
+ compareAtPriceV2: {
1270
+ amount: variant.compareAtPrice?.amount || "",
1271
+ currencyCode: variant.compareAtPrice?.currencyCode || "USD"
1272
+ },
1273
+ id: variant.id,
1274
+ image: {
1275
+ altText: variant.image?.altText || "",
1276
+ height: variant.image?.height || 100,
1277
+ id: variant.image?.id || "",
1278
+ url: variant.image?.url || "",
1279
+ width: variant.image?.width || 100
1280
+ },
1281
+ priceV2: {
1282
+ amount: variant.price.amount || "",
1283
+ currencyCode: variant.price.currencyCode || "USD"
1284
+ },
1285
+ product: {
1286
+ handle: product.handle,
1287
+ id: product.id,
1288
+ title: product.title,
1289
+ vendor: product.vendor
1290
+ },
1291
+ selectedOptions: variant.selectedOptions,
1292
+ sku: variant.sku || "",
1293
+ title: variant.title || ""
1294
+ };
1295
+ }) || [];
1296
+ return isHydrogenReact ? {
1297
+ collections: {
1298
+ nodes: product?.collections.nodes.map((collection) => {
1299
+ return {
1300
+ handle: collection.handle
1301
+ };
1302
+ }) || []
1303
+ },
1304
+ compareAtPriceRange: {
1305
+ maxVariantCompareAtPrice: null,
1306
+ minVariantCompareAtPrice: null
1307
+ },
1308
+ description: product?.description || "",
1309
+ descriptionHtml: product?.descriptionHtml || "",
1310
+ featuredImage: {
1311
+ altText: product?.featuredImage?.altText || "",
1312
+ height: product?.featuredImage?.height || 100,
1313
+ id: product?.featuredImage?.id || "",
1314
+ url: product?.featuredImage?.url || "",
1315
+ width: product?.featuredImage?.width || 100
1316
+ },
1317
+ handle: product?.handle || "",
1318
+ id: product?.id || "",
1319
+ images: [{ altText: "", height: 100, id: "", url: "", width: 100 }],
1320
+ media: [],
1321
+ metafields: [],
1322
+ options: [],
1323
+ priceRange: product?.priceRange || {
1324
+ maxVariantPrice: { amount: "0", currencyCode: "USD" },
1325
+ minVariantPrice: { amount: "0", currencyCode: "USD" }
1326
+ },
1327
+ selected: true,
1328
+ selectedOptions: product?.selectedVariant?.selectedOptions?.reduce((acc, option) => {
1329
+ return { ...acc, [option.name]: option.value };
1330
+ }, {}) || {},
1331
+ selectedSellingPlan: {},
1332
+ selectedSellingPlanAllocation: {},
1333
+ selectedVariant: {
1334
+ availableForSale: product?.selectedVariant?.availableForSale || false,
1335
+ compareAtPriceV2: {
1336
+ amount: product?.selectedVariant?.compareAtPrice?.amount || "",
1337
+ currencyCode: product?.selectedVariant?.compareAtPrice?.currencyCode || "USD"
1338
+ },
1339
+ id: product?.selectedVariant?.id || "",
1340
+ image: {
1341
+ altText: product?.selectedVariant?.image?.altText || "",
1342
+ height: product?.selectedVariant?.image?.height || 100,
1343
+ id: product?.selectedVariant?.image?.id || "",
1344
+ url: product?.selectedVariant?.image?.url || "",
1345
+ width: product?.selectedVariant?.image?.width || 100
1346
+ },
1347
+ priceV2: {
1348
+ amount: product?.selectedVariant?.price.amount || "",
1349
+ currencyCode: product?.selectedVariant?.price.currencyCode || "USD"
1350
+ },
1351
+ product: {
1352
+ handle: product?.handle || "",
1353
+ id: product?.id || "",
1354
+ title: product?.title || "",
1355
+ vendor: product?.vendor || ""
1356
+ },
1357
+ selectedOptions: product?.selectedVariant?.selectedOptions || [],
1358
+ sku: product?.selectedVariant?.sku || "",
1359
+ title: product?.selectedVariant?.title || ""
1360
+ },
1361
+ sellingPlanGroups: [],
1362
+ seo: {
1363
+ description: product?.seo?.description || "",
1364
+ title: product?.seo?.title || ""
1365
+ },
1366
+ title: product?.title || "",
1367
+ variants: {
1368
+ nodes: mainProductVariants
1369
+ },
1370
+ vendor: product?.vendor || ""
1371
+ } : {
1372
+ collections: {
1373
+ nodes: []
1374
+ },
1375
+ compareAtPriceRange: {
1376
+ maxVariantCompareAtPrice: null,
1377
+ minVariantCompareAtPrice: null
1378
+ },
1379
+ description: product?.description || "",
1380
+ descriptionHtml: product?.descriptionHtml || "",
1381
+ featuredImage: {
1382
+ altText: product?.selectedOrFirstAvailableVariant?.image?.altText || "",
1383
+ height: product?.selectedOrFirstAvailableVariant?.image?.height || 100,
1384
+ id: product?.selectedOrFirstAvailableVariant?.image?.id || "",
1385
+ url: product?.selectedOrFirstAvailableVariant?.image?.url || "",
1386
+ width: product?.selectedOrFirstAvailableVariant?.image?.width || 100
1387
+ },
1388
+ handle: product?.handle || "",
1389
+ id: product?.id || "",
1390
+ images: [
1391
+ {
1392
+ altText: product?.selectedOrFirstAvailableVariant?.image?.altText || "",
1393
+ height: product?.selectedOrFirstAvailableVariant?.image?.height || 100,
1394
+ id: product?.selectedOrFirstAvailableVariant?.image?.id || "",
1395
+ url: product?.selectedOrFirstAvailableVariant?.image?.url || "",
1396
+ width: product?.selectedOrFirstAvailableVariant?.image?.width || 100
1397
+ }
1398
+ ],
1399
+ media: [],
1400
+ metafields: [],
1401
+ options: [],
1402
+ priceRange: product?.priceRange || {
1403
+ maxVariantPrice: { amount: "0", currencyCode: "USD" },
1404
+ minVariantPrice: { amount: "0", currencyCode: "USD" }
1405
+ },
1406
+ selected: true,
1407
+ selectedOptions: product?.selectedOrFirstAvailableVariant?.selectedOptions?.reduce((acc, option) => {
1408
+ return { ...acc, [option.name]: option.value };
1409
+ }, {}) || {},
1410
+ selectedSellingPlan: {},
1411
+ selectedSellingPlanAllocation: {},
1412
+ selectedVariant: {
1413
+ availableForSale: product?.selectedOrFirstAvailableVariant?.availableForSale || false,
1414
+ compareAtPriceV2: {
1415
+ amount: product?.selectedOrFirstAvailableVariant?.compareAtPrice?.amount || "",
1416
+ currencyCode: product?.selectedOrFirstAvailableVariant?.compareAtPrice?.currencyCode || "USD"
1417
+ },
1418
+ id: product?.selectedOrFirstAvailableVariant?.id || "",
1419
+ image: {
1420
+ altText: product?.selectedOrFirstAvailableVariant?.image?.altText || "",
1421
+ height: product?.selectedOrFirstAvailableVariant?.image?.height || 100,
1422
+ id: product?.selectedOrFirstAvailableVariant?.image?.id || "",
1423
+ url: product?.selectedOrFirstAvailableVariant?.image?.url || "",
1424
+ width: product?.selectedOrFirstAvailableVariant?.image?.width || 100
1425
+ },
1426
+ priceV2: {
1427
+ amount: product?.selectedOrFirstAvailableVariant?.price.amount || "",
1428
+ currencyCode: product?.selectedOrFirstAvailableVariant?.price.currencyCode || "USD"
1429
+ },
1430
+ product: {
1431
+ handle: product?.handle || "",
1432
+ id: product?.id || "",
1433
+ title: product?.title || "",
1434
+ vendor: product?.vendor || ""
1435
+ },
1436
+ selectedOptions: product?.selectedOrFirstAvailableVariant?.selectedOptions || [],
1437
+ sku: product?.selectedOrFirstAvailableVariant?.sku || "",
1438
+ title: product?.selectedOrFirstAvailableVariant?.title || ""
1439
+ },
1440
+ sellingPlanGroups: [],
1441
+ seo: {
1442
+ description: null,
1443
+ title: null
1444
+ },
1445
+ title: product?.title || "",
1446
+ variants: {
1447
+ nodes: [
1448
+ {
1449
+ availableForSale: product?.selectedOrFirstAvailableVariant?.availableForSale || false,
1450
+ compareAtPriceV2: {
1451
+ amount: product?.selectedOrFirstAvailableVariant?.compareAtPrice?.amount || "",
1452
+ currencyCode: product?.selectedOrFirstAvailableVariant?.compareAtPrice?.currencyCode || "USD"
1453
+ },
1454
+ id: product?.selectedOrFirstAvailableVariant?.id || "",
1455
+ image: {
1456
+ altText: product?.selectedOrFirstAvailableVariant?.image?.altText || "",
1457
+ height: product?.selectedOrFirstAvailableVariant?.image?.height || 100,
1458
+ id: product?.selectedOrFirstAvailableVariant?.image?.id || "",
1459
+ url: product?.selectedOrFirstAvailableVariant?.image?.url || "",
1460
+ width: product?.selectedOrFirstAvailableVariant?.image?.width || 100
1461
+ },
1462
+ priceV2: {
1463
+ amount: product?.selectedOrFirstAvailableVariant?.price.amount || "",
1464
+ currencyCode: product?.selectedOrFirstAvailableVariant?.price.currencyCode || "USD"
1465
+ },
1466
+ product: {
1467
+ handle: product?.handle || "",
1468
+ id: product?.id || "",
1469
+ title: product?.title || "",
1470
+ vendor: product?.vendor || ""
1471
+ },
1472
+ selectedOptions: product?.selectedOrFirstAvailableVariant?.selectedOptions || [],
1473
+ sku: product?.selectedOrFirstAvailableVariant?.sku || "",
1474
+ title: product?.selectedOrFirstAvailableVariant?.title || ""
1475
+ },
1476
+ ...mainProductVariants
1477
+ ]
1478
+ },
1479
+ vendor: product?.vendor || ""
1480
+ };
1481
+ };
1482
+
1483
+ // src/widgets/RebuyDynamicBundleProducts/BundleImages.tsx
1484
+ var import_react9 = require("@remix-run/react");
1485
+ var import_hydrogen5 = require("@shopify/hydrogen");
1486
+ var import_react10 = require("react");
1487
+
1488
+ // src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.module.css
1489
+ var RebuyDynamicBundleProducts_default = {
1490
+ container: "RebuyDynamicBundleProducts_container",
1491
+ addCartBtnContainer: "RebuyDynamicBundleProducts_addCartBtnContainer",
1492
+ bundleContainer: "RebuyDynamicBundleProducts_bundleContainer",
1493
+ select: "RebuyDynamicBundleProducts_select",
1494
+ bundleItemRowContainer: "RebuyDynamicBundleProducts_bundleItemRowContainer",
1495
+ unselected: "RebuyDynamicBundleProducts_unselected",
1496
+ bundleItemRow: "RebuyDynamicBundleProducts_bundleItemRow",
1497
+ bundleItemInput: "RebuyDynamicBundleProducts_bundleItemInput",
1498
+ bundleItemLabel: "RebuyDynamicBundleProducts_bundleItemLabel",
1499
+ bundleImages: "RebuyDynamicBundleProducts_bundleImages",
1500
+ bundleImage: "RebuyDynamicBundleProducts_bundleImage",
1501
+ "fade-in": "RebuyDynamicBundleProducts_fade-in",
1502
+ bundleImageDelimiter: "RebuyDynamicBundleProducts_bundleImageDelimiter",
1503
+ compareAtPrice: "RebuyDynamicBundleProducts_compareAtPrice"
1504
+ };
1505
+
1506
+ // src/widgets/RebuyDynamicBundleProducts/BundleImages.tsx
1507
+ var import_jsx_runtime11 = require("react/jsx-runtime");
1508
+ var BundleImages = ({ products }) => {
1509
+ const selected = products.filter((product) => product.selected);
1510
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("ul", { className: RebuyDynamicBundleProducts_default.bundleImages, children: products.map((product, index) => {
1511
+ const image = product.selectedVariant?.image;
1512
+ const productImage = image ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1513
+ import_hydrogen5.Image,
1514
+ {
1515
+ alt: image.altText || `Picture of ${product.title}`,
1516
+ className: RebuyDynamicBundleProducts_default.bundleImage,
1517
+ data: image,
1518
+ height: 80,
1519
+ title: product.title,
1520
+ width: 80
1521
+ }
1522
+ ) : (
1523
+ // No image defined
1524
+ product.title
1525
+ );
1526
+ const showDelimiter = selected[0]?.id !== product.id;
1527
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react10.Fragment, { children: product.selected && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
1528
+ showDelimiter && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { className: RebuyDynamicBundleProducts_default.bundleImageDelimiter, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: "+" }) }),
1529
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { className: "flex items-center", children: product.default ? (
1530
+ // Already on product page
1531
+ productImage
1532
+ ) : (
1533
+ // Link to product
1534
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.Link, { title: product.title, to: `/products/${product.handle}`, children: productImage })
1535
+ ) })
1536
+ ] }) }, product.id + "-BundleImages-" + index);
1537
+ }) });
1538
+ };
1539
+
1540
+ // src/widgets/RebuyDynamicBundleProducts/Select.tsx
1541
+ var import_jsx_runtime12 = require("react/jsx-runtime");
1542
+ var Select = ({ onSelectVariant, product }) => {
1543
+ const getOptionsLabel = (product2) => {
1544
+ const options = product2.variants.nodes[0].selectedOptions;
1545
+ const optionsFromKeys = options ? Object.keys(options[0]) : [];
1546
+ const optionsFromValues = options ? options.map((option) => option.name) : [];
1547
+ const useValues = optionsFromKeys.every((key) => ["name", "value"].includes(key));
1548
+ return (useValues ? optionsFromValues : optionsFromKeys).join(" / ");
1549
+ };
1550
+ return product && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1551
+ "select",
1552
+ {
1553
+ "aria-label": "select variant",
1554
+ className: RebuyDynamicBundleProducts_default.select,
1555
+ onChange: (e) => onSelectVariant(product, e.target.value),
1556
+ value: product.selectedVariant.id,
1557
+ children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("optgroup", { label: getOptionsLabel(product), children: product.variants.nodes.map(({ id, title }) => /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: id, children: title }, id + "-BundleVariant")) })
1558
+ }
1559
+ );
1560
+ };
1561
+
1562
+ // src/widgets/RebuyDynamicBundleProducts/BundleSelection.tsx
1563
+ var import_jsx_runtime13 = require("react/jsx-runtime");
1564
+ var BundleSelection = ({ onSelectVariant, onToggleBundleItem, products }) => {
1565
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { children: products.map((product, index) => {
1566
+ const { availableForSale } = product.selectedVariant;
1567
+ const isOutOfStock = !availableForSale;
1568
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1569
+ "li",
1570
+ {
1571
+ className: `${RebuyDynamicBundleProducts_default.bundleItemRowContainer} ${!product.selected && RebuyDynamicBundleProducts_default.unselected}`,
1572
+ children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleItemRow, children: [
1573
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1574
+ "input",
1575
+ {
1576
+ checked: product.selected && availableForSale,
1577
+ className: "mt-1 rounded-sm accent-black cursor-pointer",
1578
+ disabled: isOutOfStock,
1579
+ id: `${product.id}-toggle`,
1580
+ onChange: () => onToggleBundleItem(product),
1581
+ type: "checkbox",
1582
+ value: product.id
1583
+ }
1584
+ ),
1585
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleItemInput, children: [
1586
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { className: RebuyDynamicBundleProducts_default.bundleItemLabel, htmlFor: `${product.id}-toggle`, children: [
1587
+ isOutOfStock && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("b", { children: "SOLD OUT" }),
1588
+ product.default && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("b", { children: "This item:" }),
1589
+ product.title,
1590
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RebuyProductPrice, { selectedVariant: product.selectedVariant })
1591
+ ] }),
1592
+ product.variants.nodes.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Select, { onSelectVariant, product })
1593
+ ] })
1594
+ ] })
1595
+ },
1596
+ product.id + "-BundleSelection" + index
1597
+ );
1598
+ }) });
1599
+ };
1600
+
1601
+ // src/widgets/RebuyDynamicBundleProducts/BundlePrice.tsx
1602
+ var import_hydrogen6 = require("@shopify/hydrogen");
1603
+ var import_jsx_runtime14 = require("react/jsx-runtime");
1604
+ var BundlePrice = ({ products }) => {
1605
+ const isDisabled = products.filter((product) => product.selected).length < 1;
1606
+ const totalBundlePrice = () => {
1607
+ let total = 0;
1608
+ let currencyCode = "USD";
1609
+ for (const product of products) {
1610
+ if (product.selected && product.selectedVariant) {
1611
+ const { priceV2: price2 } = product.selectedVariant;
1612
+ total += Number(price2?.amount);
1613
+ currencyCode = price2?.currencyCode || "USD";
1614
+ }
1615
+ }
1616
+ return {
1617
+ amount: String(total),
1618
+ currencyCode
1619
+ };
1620
+ };
1621
+ const totalBundleCompareAtPrice = () => {
1622
+ let compareAtTotal = 0;
1623
+ let currencyCode = "USD";
1624
+ for (const product of products) {
1625
+ if (product.selected && product.selectedVariant) {
1626
+ const { compareAtPriceV2: compareAtPrice2, priceV2: price2 } = product.selectedVariant;
1627
+ currencyCode = price2?.currencyCode || "USD";
1628
+ compareAtTotal += Number((compareAtPrice2 || price2)?.amount);
1629
+ }
1630
+ }
1631
+ return {
1632
+ amount: String(compareAtTotal),
1633
+ currencyCode
1634
+ };
1635
+ };
1636
+ const isDiscounted = (price2, compareAtPrice2) => Number(compareAtPrice2?.amount) > Number(price2?.amount);
1637
+ const price = totalBundlePrice();
1638
+ const compareAtPrice = totalBundleCompareAtPrice();
1639
+ const CompareAtPrice = ({ data: compareAtPrice2 }) => {
1640
+ return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_hydrogen6.Money, { as: "span", className: RebuyDynamicBundleProducts_default.compareAtPrice, data: compareAtPrice2, withoutTrailingZeros: true });
1641
+ };
1642
+ return products.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex items-center flex-col", children: !isDisabled && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("p", { className: "flex items-center gap-2 mb-2", children: [
1643
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: "Total Price:" }),
1644
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_hydrogen6.Money, { as: "span", data: price, withoutTrailingZeros: true }),
1645
+ isDiscounted(price, compareAtPrice) && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CompareAtPrice, { data: compareAtPrice })
1646
+ ] }) });
1647
+ };
1648
+
1649
+ // src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.tsx
1650
+ var import_jsx_runtime15 = require("react/jsx-runtime");
1651
+ var RebuyDynamicBundleProducts = (props) => {
1652
+ const {
1653
+ addToCartBtnText = "Add to cart",
1654
+ addToCartCallback,
1655
+ customTitle = `These pair with ${props.product?.title}`,
1656
+ customTitleLevel = "h2",
1657
+ customTitleStyle,
1658
+ isHydrogenReact,
1659
+ product,
1660
+ products = []
1661
+ } = props;
1662
+ const [bundleProducts, setBundleProducts] = (0, import_react11.useState)([]);
1663
+ (0, import_react11.useEffect)(() => {
1664
+ const mainProduct = convertToRebuyProduct(isHydrogenReact || false, product);
1665
+ const formattedProducts = products.map((product2) => {
1666
+ return {
1667
+ ...product2,
1668
+ selected: true,
1669
+ selectedVariant: product2.variants.nodes[0]
1670
+ };
1671
+ });
1672
+ setBundleProducts([mainProduct, ...formattedProducts]);
1673
+ }, [product, products, isHydrogenReact]);
1674
+ const onToggleBundleItem = (0, import_react11.useCallback)(
1675
+ (product2) => {
1676
+ product2.selected = !product2.selected;
1677
+ setBundleProducts([...bundleProducts]);
1678
+ },
1679
+ [bundleProducts]
1680
+ );
1681
+ const onSelectVariant = (0, import_react11.useCallback)(
1682
+ (product2, variant_id) => {
1683
+ const variant = product2.variants.nodes.find(({ id }) => id === variant_id);
1684
+ if (variant) {
1685
+ product2.selectedVariant = variant;
1686
+ product2.selected = variant.availableForSale || false;
1687
+ setBundleProducts([...bundleProducts]);
1688
+ }
1689
+ },
1690
+ [bundleProducts]
1691
+ );
1692
+ if (products.length === 0) {
1693
+ console.log("RebuyDynamicBundleProducts: No products found");
1694
+ return null;
1695
+ }
1696
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("section", { className: RebuyDynamicBundleProducts_default.container, children: [
1697
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
1698
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleContainer, children: [
1699
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(BundleImages, { products: bundleProducts }),
1700
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(BundlePrice, { products: bundleProducts }),
1701
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: RebuyDynamicBundleProducts_default.addCartBtnContainer, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1702
+ AddToCartBtn,
1703
+ {
1704
+ addToCartBtnText,
1705
+ addToCartCallback,
1706
+ disabled: bundleProducts.filter((product2) => product2.selected).length === 0,
1707
+ isHydrogenReact,
1708
+ selectedVariants: bundleProducts.filter((product2) => product2.selected).map((product2) => {
1709
+ return product2.selectedVariant;
1710
+ })
1711
+ }
1712
+ ) }),
1713
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1714
+ BundleSelection,
1715
+ {
1716
+ onSelectVariant,
1717
+ onToggleBundleItem,
1718
+ products: bundleProducts
1719
+ }
1720
+ )
1721
+ ] })
1722
+ ] });
1723
+ };
1724
+
1725
+ // src/widgets/RebuyProductAddOns/RebuyProductAddOns.tsx
1726
+ var import_hydrogen_react3 = require("@shopify/hydrogen-react");
1727
+ var import_react13 = require("react");
1728
+
1729
+ // src/widgets/RebuyProductAddOns/RebuyProductAddOnCard.tsx
1730
+ var import_react12 = require("@remix-run/react");
1731
+ var import_hydrogen7 = require("@shopify/hydrogen");
1732
+
1733
+ // src/widgets/RebuyProductAddOns/RebuyProductAddOns.module.css
1734
+ var RebuyProductAddOns_default = {
1735
+ container: "RebuyProductAddOns_container",
1736
+ productAddOnsList: "RebuyProductAddOns_productAddOnsList",
1737
+ addOnCard: "RebuyProductAddOns_addOnCard",
1738
+ addOnCardContent: "RebuyProductAddOns_addOnCardContent",
1739
+ addOnCardInput: "RebuyProductAddOns_addOnCardInput",
1740
+ addOnCardContentImage: "RebuyProductAddOns_addOnCardContentImage",
1741
+ addOnCardOutOfStock: "RebuyProductAddOns_addOnCardOutOfStock",
1742
+ addOnCardTextContent: "RebuyProductAddOns_addOnCardTextContent",
1743
+ addOnCardLearnMore: "RebuyProductAddOns_addOnCardLearnMore",
1744
+ addCartBtnContainer: "RebuyProductAddOns_addCartBtnContainer",
1745
+ moneyContainer: "RebuyProductAddOns_moneyContainer"
1746
+ };
1747
+
1748
+ // src/widgets/RebuyProductAddOns/RebuyProductAddOnCard.tsx
1749
+ var import_jsx_runtime16 = require("react/jsx-runtime");
1750
+ var RebuyProductAddOnCard = ({
1751
+ handleChange,
1752
+ learnMoreText,
1753
+ outOfStockText,
1754
+ product,
1755
+ titleLevel
1756
+ }) => {
1757
+ const { availableForSale, image } = product.selectedVariant || {};
1758
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("label", { className: RebuyProductAddOns_default.addOnCard, htmlFor: product.id, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: RebuyProductAddOns_default.addOnCardContent, children: [
1759
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1760
+ "input",
1761
+ {
1762
+ checked: Boolean(product.selected),
1763
+ className: RebuyProductAddOns_default.addOnCardInput,
1764
+ disabled: !product.variants.nodes[0].availableForSale,
1765
+ id: product.id,
1766
+ name: product.title,
1767
+ onChange: (event) => handleChange(event, product),
1768
+ type: "checkbox",
1769
+ value: ""
1770
+ }
1771
+ ),
1772
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: RebuyProductAddOns_default.addOnCardContentImage, children: image && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1773
+ import_hydrogen7.Image,
1774
+ {
1775
+ alt: image.altText || `Picture of ${product.title}`,
1776
+ data: image,
1777
+ height: 150,
1778
+ width: 300
1779
+ }
1780
+ ) }),
1781
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: RebuyProductAddOns_default.addOnCardTextContent, children: [
1782
+ !availableForSale && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: RebuyProductAddOns_default.addOnCardOutOfStock, children: outOfStockText }),
1783
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Title, { level: titleLevel, text: product.title }),
1784
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RebuyProductPrice, { selectedVariant: product.selectedVariant }),
1785
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react12.Link, { className: RebuyProductAddOns_default.addOnCardLearnMore, to: `/products/${product.handle}`, children: learnMoreText })
1786
+ ] })
1787
+ ] }) });
1788
+ };
1789
+
1790
+ // src/widgets/RebuyProductAddOns/RebuyProductAddOns.tsx
1791
+ var import_jsx_runtime17 = require("react/jsx-runtime");
1792
+ var RebuyProductAddOns = (props) => {
1793
+ const {
1794
+ addToCartCallback,
1795
+ customTitle = `These pair with ${props.product?.title}`,
1796
+ customTitleLevel = "h2",
1797
+ customTitleStyle,
1798
+ includeMainProduct = false,
1799
+ isHydrogenReact,
1800
+ learnMoreText = "Learn more",
1801
+ outOfStockText = "Out of stock",
1802
+ product,
1803
+ products = [],
1804
+ addToCartBtnText = "Add to cart",
1805
+ subtotalText = "Add-ons Subtotal: ",
1806
+ withProductText = `With ${product?.title}: `
1807
+ } = props;
1808
+ const [addedItems, setAddedItems] = (0, import_react13.useState)(products);
1809
+ const [subtotalWithProduct, setSubtotalWithProduct] = (0, import_react13.useState)();
1810
+ const [subtotalWithOutProduct, setSubtotalWithOutProduct] = (0, import_react13.useState)();
1811
+ (0, import_react13.useEffect)(() => {
1812
+ let initialTotal = 0;
1813
+ let currencyCode = "USD";
1814
+ products.map((product2) => {
1815
+ product2.selectedVariant = product2.variants.nodes[0];
1816
+ product2.selected = true;
1817
+ if (product2.selectedVariant?.priceV2) {
1818
+ initialTotal += Number(product2.selectedVariant.priceV2.amount);
1819
+ currencyCode = product2.selectedVariant.priceV2.currencyCode || "USD";
1820
+ }
1821
+ });
1822
+ setSubtotalWithProduct({
1823
+ amount: String(initialTotal),
1824
+ currencyCode
1825
+ });
1826
+ setSubtotalWithOutProduct({
1827
+ amount: String(
1828
+ initialTotal - Number(
1829
+ isHydrogenReact ? product?.selectedVariant?.price.amount : product?.selectedOrFirstAvailableVariant?.price.amount
1830
+ )
1831
+ ),
1832
+ currencyCode
1833
+ });
1834
+ setAddedItems(products);
1835
+ if (includeMainProduct) {
1836
+ setAddedItems([convertToRebuyProduct(isHydrogenReact || false, product), ...products]);
1837
+ } else {
1838
+ setAddedItems(products);
1839
+ }
1840
+ }, [products, product, isHydrogenReact, includeMainProduct]);
1841
+ const handleChange = (0, import_react13.useCallback)(
1842
+ (event, product2) => {
1843
+ const newProducts = [...products];
1844
+ const productIndex = newProducts.findIndex((p) => p.id === product2.id);
1845
+ if (productIndex !== -1) {
1846
+ newProducts[productIndex] = {
1847
+ ...newProducts[productIndex],
1848
+ selected: event.target.checked
1849
+ };
1850
+ product2.selected = event.target.checked;
1851
+ if (event.target.checked) {
1852
+ setAddedItems((prev) => [...prev, product2]);
1853
+ } else {
1854
+ setAddedItems((prev) => prev.filter((item) => item.id !== product2.id));
1855
+ }
1856
+ }
1857
+ },
1858
+ [products]
1859
+ );
1860
+ (0, import_react13.useEffect)(() => {
1861
+ let total = 0;
1862
+ let currencyCode = "USD";
1863
+ addedItems.forEach((item) => {
1864
+ if (item.selected && item.selectedVariant?.priceV2) {
1865
+ total += Number(item.selectedVariant.priceV2.amount);
1866
+ currencyCode = item.selectedVariant.priceV2.currencyCode || "USD";
1867
+ }
1868
+ });
1869
+ setSubtotalWithProduct({
1870
+ amount: String(total),
1871
+ currencyCode
1872
+ });
1873
+ setSubtotalWithOutProduct({
1874
+ amount: String(
1875
+ total - Number(
1876
+ isHydrogenReact ? product?.selectedVariant?.price.amount : product?.selectedOrFirstAvailableVariant?.price.amount
1877
+ )
1878
+ ),
1879
+ currencyCode
1880
+ });
1881
+ }, [addedItems, product, isHydrogenReact]);
1882
+ if (products.length === 0) {
1883
+ console.log("RebuyProductAddOns: No products found");
1884
+ return null;
1885
+ }
1886
+ return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.container, children: [
1887
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
1888
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("ul", { className: RebuyProductAddOns_default.productAddOnsList, children: products.map((product2) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1889
+ RebuyProductAddOnCard,
1890
+ {
1891
+ handleChange,
1892
+ learnMoreText,
1893
+ outOfStockText,
1894
+ product: product2,
1895
+ titleLevel: getTitleLevel(customTitleLevel, true)
1896
+ }
1897
+ ) }, product2.id)) }),
1898
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.productAddOnsFooter, children: [
1899
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.moneyContainer, children: [
1900
+ subtotalText,
1901
+ subtotalWithOutProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_hydrogen_react3.Money, { data: subtotalWithOutProduct, withoutTrailingZeros: true })
1902
+ ] }),
1903
+ includeMainProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.moneyContainer, children: [
1904
+ withProductText,
1905
+ subtotalWithProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_hydrogen_react3.Money, { data: subtotalWithProduct, withoutTrailingZeros: true })
1906
+ ] }),
1907
+ /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: RebuyProductAddOns_default.addCartBtnContainer, children: includeMainProduct ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1908
+ AddToCartBtn,
1909
+ {
1910
+ addToCartBtnText,
1911
+ addToCartCallback,
1912
+ disabled: addedItems.length === 0,
1913
+ isHydrogenReact,
1914
+ moneyData: subtotalWithProduct,
1915
+ selectedVariants: addedItems.map((item) => item.selectedVariant)
1916
+ }
1917
+ ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1918
+ AddToCartBtn,
1919
+ {
1920
+ addToCartBtnText,
1921
+ addToCartCallback,
1922
+ disabled: addedItems.length === 0,
1923
+ isHydrogenReact,
1924
+ moneyData: subtotalWithOutProduct,
1925
+ selectedVariants: addedItems.map((item) => item.selectedVariant)
1926
+ }
1927
+ ) })
1928
+ ] })
1929
+ ] });
1930
+ };
1931
+
1932
+ // src/widgets/RebuyProductRecommendations/RebuyProductRecommendations.module.css
1933
+ var RebuyProductRecommendations_default = {
1934
+ container: "RebuyProductRecommendations_container",
1935
+ productGrid: "RebuyProductRecommendations_productGrid"
1936
+ };
1937
+
1938
+ // src/widgets/RebuyProductRecommendations/RebuyProductRecommendations.tsx
1939
+ var import_jsx_runtime18 = require("react/jsx-runtime");
1940
+ var RebuyProductRecommendations = (props) => {
1941
+ const {
1942
+ addToCartBtnText = "Add to cart",
1943
+ addToCartCallback,
1944
+ customTitle = `These pair with ${props.product?.title}`,
1945
+ customTitleLevel = "h2",
1946
+ customTitleStyle,
1947
+ products = []
1948
+ } = props;
1949
+ if (products.length === 0) {
1950
+ console.log("RebuyProductRecommendations: No products found");
1951
+ return null;
1952
+ }
1953
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("section", { className: RebuyProductRecommendations_default.container, children: [
1954
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
1955
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("ul", { className: RebuyProductRecommendations_default.productGrid, children: products.map((product) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("li", { className: RebuyProductRecommendations_default.productItem, children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
1956
+ ProductCard,
1957
+ {
1958
+ addToCartBtnText,
1959
+ addToCartCallback,
1960
+ isHydrogenReact: props.isHydrogenReact,
1961
+ product,
1962
+ productCardTitleLevel: getTitleLevel(customTitleLevel, true)
1963
+ }
1964
+ ) }, product.id)) })
1965
+ ] });
1966
+ };
1967
+ //# sourceMappingURL=index.js.map