@rebuy/rebuy-hydrogen 3.0.0-beta.3 → 3.0.0-beta.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AddToCartBtn/AddToCartBtn.d.ts.map +1 -1
- package/dist/components/AddToCartBtn/HydrogenAddToCartBtn.d.ts.map +1 -1
- package/dist/components/AddToCartBtn/HydrogenReactAddToCartBtn.d.ts.map +1 -1
- package/dist/components/ProductCard/ProductCard.d.ts.map +1 -1
- package/dist/components/ProductPrice/ProductPrice.d.ts +1 -1
- package/dist/components/ProductPrice/ProductPrice.d.ts.map +1 -1
- package/dist/components/VariantSelect/VariantSelect.d.ts +1 -1
- package/dist/components/VariantSelect/VariantSelect.d.ts.map +1 -1
- package/dist/hooks/titleLevel.d.ts.map +1 -1
- package/dist/index.css +88 -88
- package/dist/index.css.map +4 -4
- package/dist/index.js +204 -419
- package/dist/index.js.map +4 -4
- package/dist/index.mjs +204 -428
- package/dist/index.mjs.map +4 -4
- package/dist/providers/RebuyHydrogenContextProvider.d.ts +1 -1
- package/dist/providers/RebuyHydrogenContextProvider.d.ts.map +1 -1
- package/dist/providers/RebuyHydrogenReactContextProvider.d.ts.map +1 -1
- package/dist/providers/types.d.ts +1 -1
- package/dist/providers/types.d.ts.map +1 -1
- package/dist/types/rebuyCustom.d.ts.map +1 -1
- package/dist/types/shopify.d.ts.map +1 -1
- package/dist/types/widgets.d.ts +1 -1
- package/dist/types/widgets.d.ts.map +1 -1
- package/dist/utils/convertToRebuyProduct.d.ts.map +1 -1
- package/dist/utils/createContextParameters.d.ts.map +1 -1
- package/dist/utils/getEncodedAttributes.d.ts.map +1 -1
- package/dist/utils/getRebuyConfig.d.ts.map +1 -1
- package/dist/widgetContainer/RebuyWidgetContainer.d.ts +1 -1
- package/dist/widgetContainer/RebuyWidgetContainer.d.ts.map +1 -1
- package/dist/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.d.ts.map +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/BundleImages.d.ts.map +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/BundlePrice.d.ts.map +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/BundleSelection.d.ts +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/BundleSelection.d.ts.map +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.d.ts.map +1 -1
- package/dist/widgets/RebuyDynamicBundleProducts/Select.d.ts.map +1 -1
- package/dist/widgets/RebuyProductAddOns/RebuyProductAddOnCard.d.ts.map +1 -1
- package/dist/widgets/RebuyProductAddOns/RebuyProductAddOns.d.ts.map +1 -1
- package/dist/widgets/RebuyProductAddOns/types.d.ts.map +1 -1
- package/dist/widgets/RebuyProductRecommendations/RebuyProductRecommendations.d.ts.map +1 -1
- package/package.json +3 -1
package/dist/index.js
CHANGED
@@ -54,12 +54,7 @@ var Utilities = __toESM(require("@rebuy/rebuy/utilities"), 1);
|
|
54
54
|
|
55
55
|
// src/utils/getEncodedAttributes.ts
|
56
56
|
var getEncodedAttributes = (attributes) => encodeURIComponent(
|
57
|
-
JSON.stringify(
|
58
|
-
attributes.reduce(
|
59
|
-
(merged, { key, value }) => ({ ...merged, [key]: value }),
|
60
|
-
{}
|
61
|
-
)
|
62
|
-
)
|
57
|
+
JSON.stringify(attributes.reduce((merged, { key, value }) => ({ ...merged, [key]: value }), {}))
|
63
58
|
);
|
64
59
|
|
65
60
|
// src/utils/createContextParameters.ts
|
@@ -100,18 +95,11 @@ var createContextParameters = ({
|
|
100
95
|
}
|
101
96
|
if (cartId) {
|
102
97
|
cartContext.token = Utilities.getIdFromGraphUrl(cartId, "Cart");
|
103
|
-
contextParameters.cart_token = Utilities.getIdFromGraphUrl(
|
104
|
-
cartId,
|
105
|
-
"Cart"
|
106
|
-
);
|
98
|
+
contextParameters.cart_token = Utilities.getIdFromGraphUrl(cartId, "Cart");
|
107
99
|
}
|
108
100
|
if (cartSubtotal) {
|
109
|
-
cartContext.subtotal = Utilities.amountToCents(
|
110
|
-
|
111
|
-
);
|
112
|
-
contextParameters.cart_subtotal = Utilities.amountToCents(
|
113
|
-
parseFloat(cartSubtotal)
|
114
|
-
);
|
101
|
+
cartContext.subtotal = Utilities.amountToCents(parseFloat(cartSubtotal));
|
102
|
+
contextParameters.cart_subtotal = Utilities.amountToCents(parseFloat(cartSubtotal));
|
115
103
|
}
|
116
104
|
if (cartLinesLength) {
|
117
105
|
const totalLines = cartLinesLength;
|
@@ -134,16 +122,10 @@ var createContextParameters = ({
|
|
134
122
|
variant_id: ""
|
135
123
|
};
|
136
124
|
if (cartItem?.merchandise?.product?.id) {
|
137
|
-
item.product_id = Utilities.getIdFromGraphUrl(
|
138
|
-
cartItem.merchandise.product.id,
|
139
|
-
"Product"
|
140
|
-
);
|
125
|
+
item.product_id = Utilities.getIdFromGraphUrl(cartItem.merchandise.product.id, "Product");
|
141
126
|
}
|
142
127
|
if (cartItem?.merchandise?.id) {
|
143
|
-
item.variant_id = Utilities.getIdFromGraphUrl(
|
144
|
-
cartItem.merchandise.id,
|
145
|
-
"ProductVariant"
|
146
|
-
);
|
128
|
+
item.variant_id = Utilities.getIdFromGraphUrl(cartItem.merchandise.id, "ProductVariant");
|
147
129
|
}
|
148
130
|
if (cartItem?.attributes?.length) {
|
149
131
|
const validAttributes = cartItem.attributes.filter(
|
@@ -175,14 +157,12 @@ var getRebuyConfig = async (rebuyKey, storeDomain) => {
|
|
175
157
|
parameters: { shop: storeDomain },
|
176
158
|
url: `/api/v1/user/config`
|
177
159
|
};
|
178
|
-
const { data: rebuy, ...response } = await new import_rebuy.RebuyClient(
|
179
|
-
|
180
|
-
|
160
|
+
const { data: rebuy, ...response } = await new import_rebuy.RebuyClient(rebuyKey, null, storeDomain).getShieldedAsset(
|
161
|
+
request.url,
|
162
|
+
request.parameters
|
163
|
+
);
|
181
164
|
if (!rebuy?.shop) {
|
182
|
-
throw new Error(
|
183
|
-
"Rebuy configuration is not properly set up - missing shop",
|
184
|
-
{ cause: response }
|
185
|
-
);
|
165
|
+
throw new Error("Rebuy configuration is not properly set up - missing shop", { cause: response });
|
186
166
|
}
|
187
167
|
return rebuy;
|
188
168
|
} catch (error) {
|
@@ -195,6 +175,9 @@ var getRebuyConfig = async (rebuyKey, storeDomain) => {
|
|
195
175
|
|
196
176
|
// src/providers/RebuyHydrogenContextProvider.tsx
|
197
177
|
var import_jsx_runtime = require("react/jsx-runtime");
|
178
|
+
var PUBLIC_PRIMARY_DOMAIN = process.env.PUBLIC_PRIMARY_DOMAIN;
|
179
|
+
var PUBLIC_REBUY_API_KEY = process.env.PUBLIC_REBUY_API_KEY;
|
180
|
+
var PUBLIC_STORE_DOMAIN = process.env.PUBLIC_STORE_DOMAIN;
|
198
181
|
var RebuyHydrogenContext = ({
|
199
182
|
cartAttributes,
|
200
183
|
cartCost,
|
@@ -204,22 +187,28 @@ var RebuyHydrogenContext = ({
|
|
204
187
|
cartQuantity,
|
205
188
|
children
|
206
189
|
}) => {
|
207
|
-
|
208
|
-
|
209
|
-
|
190
|
+
if (!PUBLIC_PRIMARY_DOMAIN) {
|
191
|
+
throw new Error("Missing required environment variable: PUBLIC_PRIMARY_DOMAIN");
|
192
|
+
}
|
193
|
+
if (!PUBLIC_REBUY_API_KEY) {
|
194
|
+
throw new Error("Missing required environment variable: PUBLIC_REBUY_API_KEY");
|
195
|
+
}
|
196
|
+
if (!PUBLIC_STORE_DOMAIN) {
|
197
|
+
throw new Error("Missing required environment variable: PUBLIC_STORE_DOMAIN");
|
198
|
+
}
|
210
199
|
const [rebuyConfig, setRebuyConfig] = (0, import_react3.useState)(null);
|
211
200
|
const location = (0, import_react2.useLocation)();
|
212
201
|
const queryObject = Utilities2.queryStringToObject(location.search);
|
213
|
-
const windowUrl = `${
|
202
|
+
const windowUrl = `${PUBLIC_PRIMARY_DOMAIN}${location.pathname}${location.search}`;
|
214
203
|
(0, import_react3.useEffect)(() => {
|
215
204
|
const initConfig = async () => {
|
216
|
-
const config = await getRebuyConfig(
|
205
|
+
const config = await getRebuyConfig(PUBLIC_REBUY_API_KEY, PUBLIC_STORE_DOMAIN);
|
217
206
|
setRebuyConfig(config);
|
218
207
|
};
|
219
208
|
if (!rebuyConfig?.shop) {
|
220
209
|
initConfig();
|
221
210
|
}
|
222
|
-
}, [rebuyConfig,
|
211
|
+
}, [rebuyConfig, PUBLIC_REBUY_API_KEY, PUBLIC_STORE_DOMAIN]);
|
223
212
|
const contextParameters = (0, import_react3.useMemo)(
|
224
213
|
() => createContextParameters({
|
225
214
|
cacheKey: rebuyConfig?.shop?.cache_key,
|
@@ -234,17 +223,7 @@ var RebuyHydrogenContext = ({
|
|
234
223
|
queryObject,
|
235
224
|
windowUrl
|
236
225
|
}),
|
237
|
-
[
|
238
|
-
rebuyConfig,
|
239
|
-
windowUrl,
|
240
|
-
queryObject,
|
241
|
-
cartAttributes,
|
242
|
-
cartCost,
|
243
|
-
cartId,
|
244
|
-
cartLines,
|
245
|
-
cartQuantity,
|
246
|
-
cartNote
|
247
|
-
]
|
226
|
+
[rebuyConfig, windowUrl, queryObject, cartAttributes, cartCost, cartId, cartLines, cartQuantity, cartNote]
|
248
227
|
);
|
249
228
|
const contextParametersJSON = JSON.stringify(contextParameters);
|
250
229
|
const contextValue = (0, import_react3.useMemo)(
|
@@ -253,10 +232,7 @@ var RebuyHydrogenContext = ({
|
|
253
232
|
);
|
254
233
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RebuyContext.Provider, { value: contextValue, children });
|
255
234
|
};
|
256
|
-
var RebuyHydrogenContextProvider = ({
|
257
|
-
cart,
|
258
|
-
children
|
259
|
-
}) => {
|
235
|
+
var RebuyHydrogenContextProvider = ({ cart, children }) => {
|
260
236
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react2.Await, { resolve: cart, children: (resolvedCart) => {
|
261
237
|
const cart2 = resolvedCart;
|
262
238
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
@@ -743,24 +719,35 @@ var CART_FRAGMENT = `#graphql
|
|
743
719
|
|
744
720
|
// src/providers/RebuyHydrogenReactContextProvider.tsx
|
745
721
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
722
|
+
var PUBLIC_PRIMARY_DOMAIN2 = process.env.PUBLIC_PRIMARY_DOMAIN;
|
723
|
+
var PUBLIC_REBUY_API_KEY2 = process.env.PUBLIC_REBUY_API_KEY;
|
724
|
+
var PUBLIC_STORE_DOMAIN2 = process.env.PUBLIC_STORE_DOMAIN;
|
725
|
+
var PUBLIC_STOREFRONT_ID = process.env.PUBLIC_STOREFRONT_ID;
|
726
|
+
var PUBLIC_STOREFRONT_API_TOKEN = process.env.PUBLIC_STOREFRONT_API_TOKEN || "";
|
746
727
|
var RebuyHydrogenReactContext = ({ children }) => {
|
747
|
-
|
748
|
-
|
749
|
-
|
728
|
+
if (!PUBLIC_PRIMARY_DOMAIN2) {
|
729
|
+
throw new Error("Missing required environment variable: PUBLIC_PRIMARY_DOMAIN");
|
730
|
+
}
|
731
|
+
if (!PUBLIC_REBUY_API_KEY2) {
|
732
|
+
throw new Error("Missing required environment variable: PUBLIC_REBUY_API_KEY");
|
733
|
+
}
|
734
|
+
if (!PUBLIC_STORE_DOMAIN2) {
|
735
|
+
throw new Error("Missing required environment variable: PUBLIC_STORE_DOMAIN");
|
736
|
+
}
|
750
737
|
const [rebuyConfig, setRebuyConfig] = (0, import_react5.useState)(null);
|
751
738
|
const location = (0, import_react4.useLocation)();
|
752
739
|
const queryObject = Utilities3.queryStringToObject(location.search);
|
753
|
-
const windowUrl = `${
|
740
|
+
const windowUrl = `${PUBLIC_PRIMARY_DOMAIN2}${location.pathname}${location.search}`;
|
754
741
|
const cart = (0, import_hydrogen_react.useCart)();
|
755
742
|
(0, import_react5.useEffect)(() => {
|
756
743
|
const initConfig = async () => {
|
757
|
-
const config = await getRebuyConfig(
|
744
|
+
const config = await getRebuyConfig(PUBLIC_REBUY_API_KEY2, PUBLIC_STORE_DOMAIN2);
|
758
745
|
setRebuyConfig(config);
|
759
746
|
};
|
760
747
|
if (!rebuyConfig?.shop) {
|
761
748
|
initConfig();
|
762
749
|
}
|
763
|
-
}, [rebuyConfig,
|
750
|
+
}, [rebuyConfig, PUBLIC_REBUY_API_KEY2, PUBLIC_STORE_DOMAIN2]);
|
764
751
|
const contextParameters = (0, import_react5.useMemo)(
|
765
752
|
() => createContextParameters({
|
766
753
|
cacheKey: rebuyConfig?.shop?.cache_key,
|
@@ -809,9 +796,6 @@ var RebuyHydrogenReactContextProvider = ({
|
|
809
796
|
onNoteUpdateComplete,
|
810
797
|
storefrontApiVersion = "2025-01"
|
811
798
|
}) => {
|
812
|
-
const publicStoreDomain = process.env.PUBLIC_STORE_DOMAIN;
|
813
|
-
const storefrontId = process.env.PUBLIC_STOREFRONT_ID;
|
814
|
-
const storefrontToken = process.env.PUBLIC_STOREFRONT_API_TOKEN || "";
|
815
799
|
const adapted = {
|
816
800
|
onAttributesUpdate: onAttributesUpdate ? () => onAttributesUpdate() : void 0,
|
817
801
|
onAttributesUpdateComplete: onAttributesUpdateComplete ? () => onAttributesUpdateComplete() : void 0,
|
@@ -835,10 +819,10 @@ var RebuyHydrogenReactContextProvider = ({
|
|
835
819
|
{
|
836
820
|
countryIsoCode,
|
837
821
|
languageIsoCode,
|
838
|
-
storeDomain:
|
822
|
+
storeDomain: PUBLIC_STORE_DOMAIN2,
|
839
823
|
storefrontApiVersion,
|
840
|
-
storefrontId,
|
841
|
-
storefrontToken,
|
824
|
+
storefrontId: PUBLIC_STOREFRONT_ID,
|
825
|
+
storefrontToken: PUBLIC_STOREFRONT_API_TOKEN,
|
842
826
|
children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
843
827
|
import_hydrogen_react.CartProvider,
|
844
828
|
{
|
@@ -876,21 +860,8 @@ var import_rebuy2 = require("@rebuy/rebuy");
|
|
876
860
|
var Utilities4 = __toESM(require("@rebuy/rebuy/utilities"), 1);
|
877
861
|
var import_hydrogen = require("@shopify/hydrogen");
|
878
862
|
var import_react6 = __toESM(require("react"), 1);
|
879
|
-
var RebuyWidgetContainerBase = ({
|
880
|
-
|
881
|
-
...props
|
882
|
-
}) => {
|
883
|
-
const {
|
884
|
-
collection,
|
885
|
-
collectionId,
|
886
|
-
dataSource,
|
887
|
-
limit,
|
888
|
-
options,
|
889
|
-
product,
|
890
|
-
productId,
|
891
|
-
variant,
|
892
|
-
variantId
|
893
|
-
} = props;
|
863
|
+
var RebuyWidgetContainerBase = ({ children, ...props }) => {
|
864
|
+
const { collection, collectionId, dataSource, limit, options, product, productId, variant, variantId } = props;
|
894
865
|
const contextParameters = (0, import_react6.useContext)(RebuyContext);
|
895
866
|
const [Rebuy, setRebuy] = (0, import_react6.useState)(null);
|
896
867
|
const [initialized, setInitialized] = (0, import_react6.useState)(false);
|
@@ -928,48 +899,27 @@ var RebuyWidgetContainerBase = ({
|
|
928
899
|
// Keeping this object generic to allow for custom endpoints
|
929
900
|
};
|
930
901
|
if (shopifyProductId) {
|
931
|
-
request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(
|
932
|
-
shopifyProductId,
|
933
|
-
"Product"
|
934
|
-
);
|
902
|
+
request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(shopifyProductId, "Product");
|
935
903
|
}
|
936
904
|
if (shopifyProductId) {
|
937
|
-
request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(
|
938
|
-
shopifyProductId,
|
939
|
-
"Product"
|
940
|
-
);
|
905
|
+
request2.params.shopify_product_ids = Utilities4.getIdFromGraphUrl(shopifyProductId, "Product");
|
941
906
|
}
|
942
907
|
if (shopifyVariantId) {
|
943
|
-
request2.params.shopify_variant_ids = Utilities4.getIdFromGraphUrl(
|
944
|
-
shopifyVariantId,
|
945
|
-
"ProductVariant"
|
946
|
-
);
|
908
|
+
request2.params.shopify_variant_ids = Utilities4.getIdFromGraphUrl(shopifyVariantId, "ProductVariant");
|
947
909
|
}
|
948
910
|
if (shopifyCollectionId) {
|
949
|
-
request2.params.shopify_collection_ids = Utilities4.getIdFromGraphUrl(
|
950
|
-
shopifyCollectionId,
|
951
|
-
"Collection"
|
952
|
-
);
|
911
|
+
request2.params.shopify_collection_ids = Utilities4.getIdFromGraphUrl(shopifyCollectionId, "Collection");
|
953
912
|
}
|
954
913
|
if (limit) {
|
955
914
|
request2.params.limit = limit;
|
956
915
|
}
|
957
916
|
return request2;
|
958
|
-
}, [
|
959
|
-
dataSource,
|
960
|
-
shopifyProductId,
|
961
|
-
shopifyVariantId,
|
962
|
-
shopifyCollectionId,
|
963
|
-
limit
|
964
|
-
]);
|
917
|
+
}, [dataSource, shopifyProductId, shopifyVariantId, shopifyCollectionId, limit]);
|
965
918
|
(0, import_react6.useEffect)(() => {
|
966
919
|
let isMounted = true;
|
967
920
|
if (!Rebuy || !initialized) return;
|
968
921
|
const fetchData = async () => {
|
969
|
-
const { data, metadata: metadata2 } = await Rebuy.getStorefrontData(
|
970
|
-
request.endpoint,
|
971
|
-
request.params
|
972
|
-
);
|
922
|
+
const { data, metadata: metadata2 } = await Rebuy.getStorefrontData(request.endpoint, request.params);
|
973
923
|
if (isMounted) {
|
974
924
|
setProducts(
|
975
925
|
Array.isArray(data) ? data.map((product2) => ({
|
@@ -1002,24 +952,11 @@ var RebuyWidgetContainerBase = ({
|
|
1002
952
|
};
|
1003
953
|
var RebuyWidgetContainer = RebuyWidgetContainerBase;
|
1004
954
|
|
1005
|
-
// src/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.module.css
|
1006
|
-
var RebuyCompleteTheLook_default = {
|
1007
|
-
container: "RebuyCompleteTheLook_container",
|
1008
|
-
productGrid: "RebuyCompleteTheLook_productGrid",
|
1009
|
-
productItem: "RebuyCompleteTheLook_productItem"
|
1010
|
-
};
|
1011
|
-
|
1012
955
|
// src/components/ProductCard/ProductCard.tsx
|
1013
956
|
var import_react7 = require("@remix-run/react");
|
1014
957
|
var import_hydrogen4 = require("@shopify/hydrogen");
|
1015
958
|
var import_react8 = require("react");
|
1016
959
|
|
1017
|
-
// src/components/ProductCard/ProductCard.module.css
|
1018
|
-
var ProductCard_default = {
|
1019
|
-
container: "ProductCard_container",
|
1020
|
-
productInfo: "ProductCard_productInfo"
|
1021
|
-
};
|
1022
|
-
|
1023
960
|
// src/components/AddToCartBtn/HydrogenAddToCartBtn.tsx
|
1024
961
|
var import_hydrogen2 = require("@shopify/hydrogen");
|
1025
962
|
|
@@ -1080,22 +1017,13 @@ var HydrogenReactAddToCartBtn = ({
|
|
1080
1017
|
linesAdd(linesToAdd);
|
1081
1018
|
addToCartCallback?.();
|
1082
1019
|
};
|
1083
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
1084
|
-
|
1085
|
-
{
|
1086
|
-
|
1087
|
-
|
1088
|
-
|
1089
|
-
|
1090
|
-
children: [
|
1091
|
-
addToCartBtnText,
|
1092
|
-
moneyData && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
|
1093
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: " | " }),
|
1094
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_hydrogen_react2.Money, { data: moneyData, withoutTrailingZeros: true })
|
1095
|
-
] })
|
1096
|
-
]
|
1097
|
-
}
|
1098
|
-
);
|
1020
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("button", { className: AddToCartBtn_default.button, disabled, onClick: handleAddToCart, type: "button", children: [
|
1021
|
+
addToCartBtnText,
|
1022
|
+
moneyData && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
|
1023
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: " | " }),
|
1024
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_hydrogen_react2.Money, { data: moneyData, withoutTrailingZeros: true })
|
1025
|
+
] })
|
1026
|
+
] });
|
1099
1027
|
};
|
1100
1028
|
|
1101
1029
|
// src/components/AddToCartBtn/AddToCartBtn.tsx
|
@@ -1152,24 +1080,12 @@ var ProductPrice_default = {
|
|
1152
1080
|
|
1153
1081
|
// src/components/ProductPrice/ProductPrice.tsx
|
1154
1082
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
1155
|
-
var RebuyProductPrice = ({
|
1156
|
-
selectedVariant
|
1157
|
-
}) => {
|
1083
|
+
var RebuyProductPrice = ({ selectedVariant }) => {
|
1158
1084
|
if (!selectedVariant) return null;
|
1159
1085
|
const { compareAtPriceV2: compareAtPrice, priceV2: price } = selectedVariant;
|
1160
1086
|
const isDiscounted = (price2, compareAtPrice2) => Number(compareAtPrice2?.amount) > Number(price2?.amount);
|
1161
|
-
const CompareAtPrice = ({
|
1162
|
-
data: compareAtPrice2
|
1163
|
-
}) => {
|
1164
|
-
return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
1165
|
-
import_hydrogen3.Money,
|
1166
|
-
{
|
1167
|
-
as: "span",
|
1168
|
-
className: ProductPrice_default.compareAtPrice,
|
1169
|
-
data: compareAtPrice2,
|
1170
|
-
withoutTrailingZeros: true
|
1171
|
-
}
|
1172
|
-
);
|
1087
|
+
const CompareAtPrice = ({ data: compareAtPrice2 }) => {
|
1088
|
+
return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_hydrogen3.Money, { as: "span", className: ProductPrice_default.compareAtPrice, data: compareAtPrice2, withoutTrailingZeros: true });
|
1173
1089
|
};
|
1174
1090
|
return price && /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: ProductPrice_default.priceContainer, children: [
|
1175
1091
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_hydrogen3.Money, { data: price, withoutTrailingZeros: true }),
|
@@ -1204,17 +1120,12 @@ var VariantSelect_default = {
|
|
1204
1120
|
|
1205
1121
|
// src/components/VariantSelect/VariantSelect.tsx
|
1206
1122
|
var import_jsx_runtime8 = require("react/jsx-runtime");
|
1207
|
-
var VariantSelect = ({
|
1208
|
-
handleSelectedVariant,
|
1209
|
-
product
|
1210
|
-
}) => {
|
1123
|
+
var VariantSelect = ({ handleSelectedVariant, product }) => {
|
1211
1124
|
const getOptionsLabel = (product2) => {
|
1212
1125
|
const options = product2.variants.nodes[0].selectedOptions;
|
1213
1126
|
const optionsFromKeys = options ? Object.keys(options[0]) : [];
|
1214
1127
|
const optionsFromValues = options ? options.map((option) => option.name) : [];
|
1215
|
-
const useValues = optionsFromKeys.every(
|
1216
|
-
(key) => ["name", "value"].includes(key)
|
1217
|
-
);
|
1128
|
+
const useValues = optionsFromKeys.every((key) => ["name", "value"].includes(key));
|
1218
1129
|
return (useValues ? optionsFromValues : optionsFromKeys).join(" / ");
|
1219
1130
|
};
|
1220
1131
|
return product?.variants.nodes.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
|
@@ -1228,6 +1139,12 @@ var VariantSelect = ({
|
|
1228
1139
|
) });
|
1229
1140
|
};
|
1230
1141
|
|
1142
|
+
// src/components/ProductCard/ProductCard.module.css
|
1143
|
+
var ProductCard_default = {
|
1144
|
+
container: "ProductCard_container",
|
1145
|
+
productInfo: "ProductCard_productInfo"
|
1146
|
+
};
|
1147
|
+
|
1231
1148
|
// src/components/ProductCard/ProductCard.tsx
|
1232
1149
|
var import_jsx_runtime9 = require("react/jsx-runtime");
|
1233
1150
|
var ProductCard = ({
|
@@ -1237,14 +1154,10 @@ var ProductCard = ({
|
|
1237
1154
|
product,
|
1238
1155
|
productCardTitleLevel
|
1239
1156
|
}) => {
|
1240
|
-
const [selectedVariant, setSelectedVariant] = (0, import_react8.useState)(
|
1241
|
-
product.variants.nodes[0]
|
1242
|
-
);
|
1157
|
+
const [selectedVariant, setSelectedVariant] = (0, import_react8.useState)(product.variants.nodes[0]);
|
1243
1158
|
const { image } = selectedVariant;
|
1244
1159
|
const handleSelectedVariant = (product2, variant_id) => {
|
1245
|
-
const updatedVariant = product2.variants.nodes.find(
|
1246
|
-
(variant) => variant.id === variant_id
|
1247
|
-
);
|
1160
|
+
const updatedVariant = product2.variants.nodes.find((variant) => variant.id === variant_id);
|
1248
1161
|
if (updatedVariant) {
|
1249
1162
|
setSelectedVariant(updatedVariant);
|
1250
1163
|
}
|
@@ -1260,21 +1173,9 @@ var ProductCard = ({
|
|
1260
1173
|
}
|
1261
1174
|
) }),
|
1262
1175
|
/* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: ProductCard_default.productInfo, children: [
|
1263
|
-
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_react7.Link, { to: `/products/${product.handle}`, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
1264
|
-
Title,
|
1265
|
-
{
|
1266
|
-
level: productCardTitleLevel,
|
1267
|
-
text: product.title
|
1268
|
-
}
|
1269
|
-
) }),
|
1176
|
+
/* @__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 }) }),
|
1270
1177
|
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RebuyProductPrice, { selectedVariant }),
|
1271
|
-
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
1272
|
-
VariantSelect,
|
1273
|
-
{
|
1274
|
-
handleSelectedVariant,
|
1275
|
-
product
|
1276
|
-
}
|
1277
|
-
)
|
1178
|
+
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(VariantSelect, { handleSelectedVariant, product })
|
1278
1179
|
] })
|
1279
1180
|
] }),
|
1280
1181
|
/* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
|
@@ -1327,6 +1228,13 @@ var getTitleLevel = (level, decreaseLevel = false) => {
|
|
1327
1228
|
}
|
1328
1229
|
};
|
1329
1230
|
|
1231
|
+
// src/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.module.css
|
1232
|
+
var RebuyCompleteTheLook_default = {
|
1233
|
+
container: "RebuyCompleteTheLook_container",
|
1234
|
+
productGrid: "RebuyCompleteTheLook_productGrid",
|
1235
|
+
productItem: "RebuyCompleteTheLook_productItem"
|
1236
|
+
};
|
1237
|
+
|
1330
1238
|
// src/widgets/RebuyCompleteTheLook/RebuyCompleteTheLook.tsx
|
1331
1239
|
var import_jsx_runtime10 = require("react/jsx-runtime");
|
1332
1240
|
var RebuyCompleteTheLook = (props) => {
|
@@ -1343,14 +1251,7 @@ var RebuyCompleteTheLook = (props) => {
|
|
1343
1251
|
return null;
|
1344
1252
|
}
|
1345
1253
|
return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("section", { className: RebuyCompleteTheLook_default.container, children: [
|
1346
|
-
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
1347
|
-
Title,
|
1348
|
-
{
|
1349
|
-
level: getTitleLevel(customTitleLevel),
|
1350
|
-
style: customTitleStyle,
|
1351
|
-
text: customTitle
|
1352
|
-
}
|
1353
|
-
),
|
1254
|
+
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
|
1354
1255
|
/* @__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)(
|
1355
1256
|
ProductCard,
|
1356
1257
|
{
|
@@ -1358,10 +1259,7 @@ var RebuyCompleteTheLook = (props) => {
|
|
1358
1259
|
addToCartCallback,
|
1359
1260
|
isHydrogenReact: props.isHydrogenReact,
|
1360
1261
|
product,
|
1361
|
-
productCardTitleLevel: getTitleLevel(
|
1362
|
-
customTitleLevel,
|
1363
|
-
true
|
1364
|
-
)
|
1262
|
+
productCardTitleLevel: getTitleLevel(customTitleLevel, true)
|
1365
1263
|
}
|
1366
1264
|
) }, product.id)) })
|
1367
1265
|
] });
|
@@ -1370,84 +1268,6 @@ var RebuyCompleteTheLook = (props) => {
|
|
1370
1268
|
// src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.tsx
|
1371
1269
|
var import_react11 = require("react");
|
1372
1270
|
|
1373
|
-
// src/widgets/RebuyDynamicBundleProducts/BundlePrice.tsx
|
1374
|
-
var import_hydrogen5 = require("@shopify/hydrogen");
|
1375
|
-
|
1376
|
-
// src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.module.css
|
1377
|
-
var RebuyDynamicBundleProducts_default = {
|
1378
|
-
container: "RebuyDynamicBundleProducts_container",
|
1379
|
-
addCartBtnContainer: "RebuyDynamicBundleProducts_addCartBtnContainer",
|
1380
|
-
bundleContainer: "RebuyDynamicBundleProducts_bundleContainer",
|
1381
|
-
select: "RebuyDynamicBundleProducts_select",
|
1382
|
-
bundleItemRowContainer: "RebuyDynamicBundleProducts_bundleItemRowContainer",
|
1383
|
-
unselected: "RebuyDynamicBundleProducts_unselected",
|
1384
|
-
bundleItemRow: "RebuyDynamicBundleProducts_bundleItemRow",
|
1385
|
-
bundleItemInput: "RebuyDynamicBundleProducts_bundleItemInput",
|
1386
|
-
bundleItemLabel: "RebuyDynamicBundleProducts_bundleItemLabel",
|
1387
|
-
bundleImages: "RebuyDynamicBundleProducts_bundleImages",
|
1388
|
-
bundleImage: "RebuyDynamicBundleProducts_bundleImage",
|
1389
|
-
fadeIn: "RebuyDynamicBundleProducts_fadeIn",
|
1390
|
-
bundleImageDelimiter: "RebuyDynamicBundleProducts_bundleImageDelimiter",
|
1391
|
-
compareAtPrice: "RebuyDynamicBundleProducts_compareAtPrice"
|
1392
|
-
};
|
1393
|
-
|
1394
|
-
// src/widgets/RebuyDynamicBundleProducts/BundlePrice.tsx
|
1395
|
-
var import_jsx_runtime11 = require("react/jsx-runtime");
|
1396
|
-
var BundlePrice = ({ products }) => {
|
1397
|
-
const isDisabled = products.filter((product) => product.selected).length < 1;
|
1398
|
-
const totalBundlePrice = () => {
|
1399
|
-
let total = 0;
|
1400
|
-
let currencyCode = "USD";
|
1401
|
-
for (const product of products) {
|
1402
|
-
if (product.selected && product.selectedVariant) {
|
1403
|
-
const { priceV2: price2 } = product.selectedVariant;
|
1404
|
-
total += Number(price2?.amount);
|
1405
|
-
currencyCode = price2?.currencyCode || "USD";
|
1406
|
-
}
|
1407
|
-
}
|
1408
|
-
return {
|
1409
|
-
amount: String(total),
|
1410
|
-
currencyCode
|
1411
|
-
};
|
1412
|
-
};
|
1413
|
-
const totalBundleCompareAtPrice = () => {
|
1414
|
-
let compareAtTotal = 0;
|
1415
|
-
let currencyCode = "USD";
|
1416
|
-
for (const product of products) {
|
1417
|
-
if (product.selected && product.selectedVariant) {
|
1418
|
-
const { compareAtPriceV2: compareAtPrice2, priceV2: price2 } = product.selectedVariant;
|
1419
|
-
currencyCode = price2?.currencyCode || "USD";
|
1420
|
-
compareAtTotal += Number((compareAtPrice2 || price2)?.amount);
|
1421
|
-
}
|
1422
|
-
}
|
1423
|
-
return {
|
1424
|
-
amount: String(compareAtTotal),
|
1425
|
-
currencyCode
|
1426
|
-
};
|
1427
|
-
};
|
1428
|
-
const isDiscounted = (price2, compareAtPrice2) => Number(compareAtPrice2?.amount) > Number(price2?.amount);
|
1429
|
-
const price = totalBundlePrice();
|
1430
|
-
const compareAtPrice = totalBundleCompareAtPrice();
|
1431
|
-
const CompareAtPrice = ({
|
1432
|
-
data: compareAtPrice2
|
1433
|
-
}) => {
|
1434
|
-
return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
1435
|
-
import_hydrogen5.Money,
|
1436
|
-
{
|
1437
|
-
as: "span",
|
1438
|
-
className: RebuyDynamicBundleProducts_default.compareAtPrice,
|
1439
|
-
data: compareAtPrice2,
|
1440
|
-
withoutTrailingZeros: true
|
1441
|
-
}
|
1442
|
-
);
|
1443
|
-
};
|
1444
|
-
return products.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "flex items-center flex-col", children: !isDisabled && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("p", { className: "flex items-center gap-2 mb-2", children: [
|
1445
|
-
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: "Total Price:" }),
|
1446
|
-
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_hydrogen5.Money, { as: "span", data: price, withoutTrailingZeros: true }),
|
1447
|
-
isDiscounted(price, compareAtPrice) && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CompareAtPrice, { data: compareAtPrice })
|
1448
|
-
] }) });
|
1449
|
-
};
|
1450
|
-
|
1451
1271
|
// src/utils/convertToRebuyProduct.tsx
|
1452
1272
|
var convertToRebuyProduct = (isHydrogenReact, product) => {
|
1453
1273
|
const mainProductVariants = isHydrogenReact ? product?.variants?.nodes?.map((variant) => {
|
@@ -1507,9 +1327,7 @@ var convertToRebuyProduct = (isHydrogenReact, product) => {
|
|
1507
1327
|
},
|
1508
1328
|
handle: product?.handle || "",
|
1509
1329
|
id: product?.id || "",
|
1510
|
-
images: [
|
1511
|
-
{ altText: "", height: 100, id: "", url: "", width: 100 }
|
1512
|
-
],
|
1330
|
+
images: [{ altText: "", height: 100, id: "", url: "", width: 100 }],
|
1513
1331
|
media: [],
|
1514
1332
|
metafields: [],
|
1515
1333
|
options: [],
|
@@ -1518,12 +1336,9 @@ var convertToRebuyProduct = (isHydrogenReact, product) => {
|
|
1518
1336
|
minVariantPrice: { amount: "0", currencyCode: "USD" }
|
1519
1337
|
},
|
1520
1338
|
selected: true,
|
1521
|
-
selectedOptions: product?.selectedVariant?.selectedOptions?.reduce(
|
1522
|
-
|
1523
|
-
|
1524
|
-
},
|
1525
|
-
{}
|
1526
|
-
) || {},
|
1339
|
+
selectedOptions: product?.selectedVariant?.selectedOptions?.reduce((acc, option) => {
|
1340
|
+
return { ...acc, [option.name]: option.value };
|
1341
|
+
}, {}) || {},
|
1527
1342
|
selectedSellingPlan: {},
|
1528
1343
|
selectedSellingPlanAllocation: {},
|
1529
1344
|
selectedVariant: {
|
@@ -1600,12 +1415,9 @@ var convertToRebuyProduct = (isHydrogenReact, product) => {
|
|
1600
1415
|
minVariantPrice: { amount: "0", currencyCode: "USD" }
|
1601
1416
|
},
|
1602
1417
|
selected: true,
|
1603
|
-
selectedOptions: product?.selectedOrFirstAvailableVariant?.selectedOptions?.reduce(
|
1604
|
-
|
1605
|
-
|
1606
|
-
},
|
1607
|
-
{}
|
1608
|
-
) || {},
|
1418
|
+
selectedOptions: product?.selectedOrFirstAvailableVariant?.selectedOptions?.reduce((acc, option) => {
|
1419
|
+
return { ...acc, [option.name]: option.value };
|
1420
|
+
}, {}) || {},
|
1609
1421
|
selectedSellingPlan: {},
|
1610
1422
|
selectedSellingPlanAllocation: {},
|
1611
1423
|
selectedVariant: {
|
@@ -1681,15 +1493,35 @@ var convertToRebuyProduct = (isHydrogenReact, product) => {
|
|
1681
1493
|
|
1682
1494
|
// src/widgets/RebuyDynamicBundleProducts/BundleImages.tsx
|
1683
1495
|
var import_react9 = require("@remix-run/react");
|
1684
|
-
var
|
1496
|
+
var import_hydrogen5 = require("@shopify/hydrogen");
|
1685
1497
|
var import_react10 = require("react");
|
1686
|
-
|
1498
|
+
|
1499
|
+
// src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.module.css
|
1500
|
+
var RebuyDynamicBundleProducts_default = {
|
1501
|
+
container: "RebuyDynamicBundleProducts_container",
|
1502
|
+
addCartBtnContainer: "RebuyDynamicBundleProducts_addCartBtnContainer",
|
1503
|
+
bundleContainer: "RebuyDynamicBundleProducts_bundleContainer",
|
1504
|
+
select: "RebuyDynamicBundleProducts_select",
|
1505
|
+
bundleItemRowContainer: "RebuyDynamicBundleProducts_bundleItemRowContainer",
|
1506
|
+
unselected: "RebuyDynamicBundleProducts_unselected",
|
1507
|
+
bundleItemRow: "RebuyDynamicBundleProducts_bundleItemRow",
|
1508
|
+
bundleItemInput: "RebuyDynamicBundleProducts_bundleItemInput",
|
1509
|
+
bundleItemLabel: "RebuyDynamicBundleProducts_bundleItemLabel",
|
1510
|
+
bundleImages: "RebuyDynamicBundleProducts_bundleImages",
|
1511
|
+
bundleImage: "RebuyDynamicBundleProducts_bundleImage",
|
1512
|
+
"fade-in": "RebuyDynamicBundleProducts_fade-in",
|
1513
|
+
bundleImageDelimiter: "RebuyDynamicBundleProducts_bundleImageDelimiter",
|
1514
|
+
compareAtPrice: "RebuyDynamicBundleProducts_compareAtPrice"
|
1515
|
+
};
|
1516
|
+
|
1517
|
+
// src/widgets/RebuyDynamicBundleProducts/BundleImages.tsx
|
1518
|
+
var import_jsx_runtime11 = require("react/jsx-runtime");
|
1687
1519
|
var BundleImages = ({ products }) => {
|
1688
1520
|
const selected = products.filter((product) => product.selected);
|
1689
|
-
return /* @__PURE__ */ (0,
|
1521
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("ul", { className: RebuyDynamicBundleProducts_default.bundleImages, children: products.map((product, index) => {
|
1690
1522
|
const image = product.selectedVariant?.image;
|
1691
|
-
const productImage = image ? /* @__PURE__ */ (0,
|
1692
|
-
|
1523
|
+
const productImage = image ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
1524
|
+
import_hydrogen5.Image,
|
1693
1525
|
{
|
1694
1526
|
alt: image.altText || `Picture of ${product.title}`,
|
1695
1527
|
className: RebuyDynamicBundleProducts_default.bundleImage,
|
@@ -1703,66 +1535,53 @@ var BundleImages = ({ products }) => {
|
|
1703
1535
|
product.title
|
1704
1536
|
);
|
1705
1537
|
const showDelimiter = selected[0]?.id !== product.id;
|
1706
|
-
return /* @__PURE__ */ (0,
|
1707
|
-
showDelimiter && /* @__PURE__ */ (0,
|
1708
|
-
/* @__PURE__ */ (0,
|
1538
|
+
return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react10.Fragment, { children: product.selected && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
|
1539
|
+
showDelimiter && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { className: RebuyDynamicBundleProducts_default.bundleImageDelimiter, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: "+" }) }),
|
1540
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)("li", { className: "flex items-center", children: product.default ? (
|
1709
1541
|
// Already on product page
|
1710
1542
|
productImage
|
1711
1543
|
) : (
|
1712
1544
|
// Link to product
|
1713
|
-
/* @__PURE__ */ (0,
|
1714
|
-
import_react9.Link,
|
1715
|
-
{
|
1716
|
-
title: product.title,
|
1717
|
-
to: `/products/${product.handle}`,
|
1718
|
-
children: productImage
|
1719
|
-
}
|
1720
|
-
)
|
1545
|
+
/* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_react9.Link, { title: product.title, to: `/products/${product.handle}`, children: productImage })
|
1721
1546
|
) })
|
1722
1547
|
] }) }, product.id + "-BundleImages-" + index);
|
1723
1548
|
}) });
|
1724
1549
|
};
|
1725
1550
|
|
1726
1551
|
// src/widgets/RebuyDynamicBundleProducts/Select.tsx
|
1727
|
-
var
|
1552
|
+
var import_jsx_runtime12 = require("react/jsx-runtime");
|
1728
1553
|
var Select = ({ onSelectVariant, product }) => {
|
1729
1554
|
const getOptionsLabel = (product2) => {
|
1730
1555
|
const options = product2.variants.nodes[0].selectedOptions;
|
1731
1556
|
const optionsFromKeys = options ? Object.keys(options[0]) : [];
|
1732
1557
|
const optionsFromValues = options ? options.map((option) => option.name) : [];
|
1733
|
-
const useValues = optionsFromKeys.every(
|
1734
|
-
(key) => ["name", "value"].includes(key)
|
1735
|
-
);
|
1558
|
+
const useValues = optionsFromKeys.every((key) => ["name", "value"].includes(key));
|
1736
1559
|
return (useValues ? optionsFromValues : optionsFromKeys).join(" / ");
|
1737
1560
|
};
|
1738
|
-
return product && /* @__PURE__ */ (0,
|
1561
|
+
return product && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
|
1739
1562
|
"select",
|
1740
1563
|
{
|
1741
1564
|
"aria-label": "select variant",
|
1742
1565
|
className: RebuyDynamicBundleProducts_default.select,
|
1743
1566
|
onChange: (e) => onSelectVariant(product, e.target.value),
|
1744
1567
|
value: product.selectedVariant.id,
|
1745
|
-
children: /* @__PURE__ */ (0,
|
1568
|
+
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")) })
|
1746
1569
|
}
|
1747
1570
|
);
|
1748
1571
|
};
|
1749
1572
|
|
1750
1573
|
// src/widgets/RebuyDynamicBundleProducts/BundleSelection.tsx
|
1751
|
-
var
|
1752
|
-
var BundleSelection = ({
|
1753
|
-
|
1754
|
-
onToggleBundleItem,
|
1755
|
-
products
|
1756
|
-
}) => {
|
1757
|
-
return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("ul", { children: products.map((product, index) => {
|
1574
|
+
var import_jsx_runtime13 = require("react/jsx-runtime");
|
1575
|
+
var BundleSelection = ({ onSelectVariant, onToggleBundleItem, products }) => {
|
1576
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("ul", { children: products.map((product, index) => {
|
1758
1577
|
const { availableForSale } = product.selectedVariant;
|
1759
1578
|
const isOutOfStock = !availableForSale;
|
1760
|
-
return /* @__PURE__ */ (0,
|
1579
|
+
return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
1761
1580
|
"li",
|
1762
1581
|
{
|
1763
1582
|
className: `${RebuyDynamicBundleProducts_default.bundleItemRowContainer} ${!product.selected && RebuyDynamicBundleProducts_default.unselected}`,
|
1764
|
-
children: /* @__PURE__ */ (0,
|
1765
|
-
/* @__PURE__ */ (0,
|
1583
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleItemRow, children: [
|
1584
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
|
1766
1585
|
"input",
|
1767
1586
|
{
|
1768
1587
|
checked: product.selected && availableForSale,
|
@@ -1774,32 +1593,14 @@ var BundleSelection = ({
|
|
1774
1593
|
value: product.id
|
1775
1594
|
}
|
1776
1595
|
),
|
1777
|
-
/* @__PURE__ */ (0,
|
1778
|
-
/* @__PURE__ */ (0,
|
1779
|
-
"
|
1780
|
-
{
|
1781
|
-
|
1782
|
-
|
1783
|
-
|
1784
|
-
|
1785
|
-
product.default && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("b", { children: "This item:" }),
|
1786
|
-
product.title,
|
1787
|
-
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
1788
|
-
RebuyProductPrice,
|
1789
|
-
{
|
1790
|
-
selectedVariant: product.selectedVariant
|
1791
|
-
}
|
1792
|
-
)
|
1793
|
-
]
|
1794
|
-
}
|
1795
|
-
),
|
1796
|
-
product.variants.nodes.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
|
1797
|
-
Select,
|
1798
|
-
{
|
1799
|
-
onSelectVariant,
|
1800
|
-
product
|
1801
|
-
}
|
1802
|
-
)
|
1596
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleItemInput, children: [
|
1597
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("label", { className: RebuyDynamicBundleProducts_default.bundleItemLabel, htmlFor: `${product.id}-toggle`, children: [
|
1598
|
+
isOutOfStock && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("b", { children: "SOLD OUT" }),
|
1599
|
+
product.default && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("b", { children: "This item:" }),
|
1600
|
+
product.title,
|
1601
|
+
/* @__PURE__ */ (0, import_jsx_runtime13.jsx)(RebuyProductPrice, { selectedVariant: product.selectedVariant })
|
1602
|
+
] }),
|
1603
|
+
product.variants.nodes.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Select, { onSelectVariant, product })
|
1803
1604
|
] })
|
1804
1605
|
] })
|
1805
1606
|
},
|
@@ -1808,6 +1609,54 @@ var BundleSelection = ({
|
|
1808
1609
|
}) });
|
1809
1610
|
};
|
1810
1611
|
|
1612
|
+
// src/widgets/RebuyDynamicBundleProducts/BundlePrice.tsx
|
1613
|
+
var import_hydrogen6 = require("@shopify/hydrogen");
|
1614
|
+
var import_jsx_runtime14 = require("react/jsx-runtime");
|
1615
|
+
var BundlePrice = ({ products }) => {
|
1616
|
+
const isDisabled = products.filter((product) => product.selected).length < 1;
|
1617
|
+
const totalBundlePrice = () => {
|
1618
|
+
let total = 0;
|
1619
|
+
let currencyCode = "USD";
|
1620
|
+
for (const product of products) {
|
1621
|
+
if (product.selected && product.selectedVariant) {
|
1622
|
+
const { priceV2: price2 } = product.selectedVariant;
|
1623
|
+
total += Number(price2?.amount);
|
1624
|
+
currencyCode = price2?.currencyCode || "USD";
|
1625
|
+
}
|
1626
|
+
}
|
1627
|
+
return {
|
1628
|
+
amount: String(total),
|
1629
|
+
currencyCode
|
1630
|
+
};
|
1631
|
+
};
|
1632
|
+
const totalBundleCompareAtPrice = () => {
|
1633
|
+
let compareAtTotal = 0;
|
1634
|
+
let currencyCode = "USD";
|
1635
|
+
for (const product of products) {
|
1636
|
+
if (product.selected && product.selectedVariant) {
|
1637
|
+
const { compareAtPriceV2: compareAtPrice2, priceV2: price2 } = product.selectedVariant;
|
1638
|
+
currencyCode = price2?.currencyCode || "USD";
|
1639
|
+
compareAtTotal += Number((compareAtPrice2 || price2)?.amount);
|
1640
|
+
}
|
1641
|
+
}
|
1642
|
+
return {
|
1643
|
+
amount: String(compareAtTotal),
|
1644
|
+
currencyCode
|
1645
|
+
};
|
1646
|
+
};
|
1647
|
+
const isDiscounted = (price2, compareAtPrice2) => Number(compareAtPrice2?.amount) > Number(price2?.amount);
|
1648
|
+
const price = totalBundlePrice();
|
1649
|
+
const compareAtPrice = totalBundleCompareAtPrice();
|
1650
|
+
const CompareAtPrice = ({ data: compareAtPrice2 }) => {
|
1651
|
+
return compareAtPrice2 && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_hydrogen6.Money, { as: "span", className: RebuyDynamicBundleProducts_default.compareAtPrice, data: compareAtPrice2, withoutTrailingZeros: true });
|
1652
|
+
};
|
1653
|
+
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: [
|
1654
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { children: "Total Price:" }),
|
1655
|
+
/* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_hydrogen6.Money, { as: "span", data: price, withoutTrailingZeros: true }),
|
1656
|
+
isDiscounted(price, compareAtPrice) && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(CompareAtPrice, { data: compareAtPrice })
|
1657
|
+
] }) });
|
1658
|
+
};
|
1659
|
+
|
1811
1660
|
// src/widgets/RebuyDynamicBundleProducts/RebuyDynamicBundleProducts.tsx
|
1812
1661
|
var import_jsx_runtime15 = require("react/jsx-runtime");
|
1813
1662
|
var RebuyDynamicBundleProducts = (props) => {
|
@@ -1823,10 +1672,7 @@ var RebuyDynamicBundleProducts = (props) => {
|
|
1823
1672
|
} = props;
|
1824
1673
|
const [bundleProducts, setBundleProducts] = (0, import_react11.useState)([]);
|
1825
1674
|
(0, import_react11.useEffect)(() => {
|
1826
|
-
const mainProduct = convertToRebuyProduct(
|
1827
|
-
isHydrogenReact || false,
|
1828
|
-
product
|
1829
|
-
);
|
1675
|
+
const mainProduct = convertToRebuyProduct(isHydrogenReact || false, product);
|
1830
1676
|
const formattedProducts = products.map((product2) => {
|
1831
1677
|
return {
|
1832
1678
|
...product2,
|
@@ -1845,9 +1691,7 @@ var RebuyDynamicBundleProducts = (props) => {
|
|
1845
1691
|
);
|
1846
1692
|
const onSelectVariant = (0, import_react11.useCallback)(
|
1847
1693
|
(product2, variant_id) => {
|
1848
|
-
const variant = product2.variants.nodes.find(
|
1849
|
-
({ id }) => id === variant_id
|
1850
|
-
);
|
1694
|
+
const variant = product2.variants.nodes.find(({ id }) => id === variant_id);
|
1851
1695
|
if (variant) {
|
1852
1696
|
product2.selectedVariant = variant;
|
1853
1697
|
product2.selected = variant.availableForSale || false;
|
@@ -1861,14 +1705,7 @@ var RebuyDynamicBundleProducts = (props) => {
|
|
1861
1705
|
return null;
|
1862
1706
|
}
|
1863
1707
|
return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("section", { className: RebuyDynamicBundleProducts_default.container, children: [
|
1864
|
-
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
|
1865
|
-
Title,
|
1866
|
-
{
|
1867
|
-
level: getTitleLevel(customTitleLevel),
|
1868
|
-
style: customTitleStyle,
|
1869
|
-
text: customTitle
|
1870
|
-
}
|
1871
|
-
),
|
1708
|
+
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
|
1872
1709
|
/* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: RebuyDynamicBundleProducts_default.bundleContainer, children: [
|
1873
1710
|
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(BundleImages, { products: bundleProducts }),
|
1874
1711
|
/* @__PURE__ */ (0, import_jsx_runtime15.jsx)(BundlePrice, { products: bundleProducts }),
|
@@ -1955,20 +1792,8 @@ var RebuyProductAddOnCard = ({
|
|
1955
1792
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: RebuyProductAddOns_default.addOnCardTextContent, children: [
|
1956
1793
|
!availableForSale && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("p", { className: RebuyProductAddOns_default.addOnCardOutOfStock, children: outOfStockText }),
|
1957
1794
|
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Title, { level: titleLevel, text: product.title }),
|
1958
|
-
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
1959
|
-
|
1960
|
-
{
|
1961
|
-
selectedVariant: product.selectedVariant
|
1962
|
-
}
|
1963
|
-
),
|
1964
|
-
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
|
1965
|
-
import_react12.Link,
|
1966
|
-
{
|
1967
|
-
className: RebuyProductAddOns_default.addOnCardLearnMore,
|
1968
|
-
to: `/products/${product.handle}`,
|
1969
|
-
children: learnMoreText
|
1970
|
-
}
|
1971
|
-
)
|
1795
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(RebuyProductPrice, { selectedVariant: product.selectedVariant }),
|
1796
|
+
/* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_react12.Link, { className: RebuyProductAddOns_default.addOnCardLearnMore, to: `/products/${product.handle}`, children: learnMoreText })
|
1972
1797
|
] })
|
1973
1798
|
] }) });
|
1974
1799
|
};
|
@@ -2019,10 +1844,7 @@ var RebuyProductAddOns = (props) => {
|
|
2019
1844
|
});
|
2020
1845
|
setAddedItems(products);
|
2021
1846
|
if (includeMainProduct) {
|
2022
|
-
setAddedItems([
|
2023
|
-
convertToRebuyProduct(isHydrogenReact || false, product),
|
2024
|
-
...products
|
2025
|
-
]);
|
1847
|
+
setAddedItems([convertToRebuyProduct(isHydrogenReact || false, product), ...products]);
|
2026
1848
|
} else {
|
2027
1849
|
setAddedItems(products);
|
2028
1850
|
}
|
@@ -2030,9 +1852,7 @@ var RebuyProductAddOns = (props) => {
|
|
2030
1852
|
const handleChange = (0, import_react13.useCallback)(
|
2031
1853
|
(event, product2) => {
|
2032
1854
|
const newProducts = [...products];
|
2033
|
-
const productIndex = newProducts.findIndex(
|
2034
|
-
(p) => p.id === product2.id
|
2035
|
-
);
|
1855
|
+
const productIndex = newProducts.findIndex((p) => p.id === product2.id);
|
2036
1856
|
if (productIndex !== -1) {
|
2037
1857
|
newProducts[productIndex] = {
|
2038
1858
|
...newProducts[productIndex],
|
@@ -2042,9 +1862,7 @@ var RebuyProductAddOns = (props) => {
|
|
2042
1862
|
if (event.target.checked) {
|
2043
1863
|
setAddedItems((prev) => [...prev, product2]);
|
2044
1864
|
} else {
|
2045
|
-
setAddedItems(
|
2046
|
-
(prev) => prev.filter((item) => item.id !== product2.id)
|
2047
|
-
);
|
1865
|
+
setAddedItems((prev) => prev.filter((item) => item.id !== product2.id));
|
2048
1866
|
}
|
2049
1867
|
}
|
2050
1868
|
},
|
@@ -2077,14 +1895,7 @@ var RebuyProductAddOns = (props) => {
|
|
2077
1895
|
return null;
|
2078
1896
|
}
|
2079
1897
|
return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.container, children: [
|
2080
|
-
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
2081
|
-
Title,
|
2082
|
-
{
|
2083
|
-
level: getTitleLevel(customTitleLevel),
|
2084
|
-
style: customTitleStyle,
|
2085
|
-
text: customTitle
|
2086
|
-
}
|
2087
|
-
),
|
1898
|
+
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
|
2088
1899
|
/* @__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)(
|
2089
1900
|
RebuyProductAddOnCard,
|
2090
1901
|
{
|
@@ -2098,23 +1909,11 @@ var RebuyProductAddOns = (props) => {
|
|
2098
1909
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.productAddOnsFooter, children: [
|
2099
1910
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.moneyContainer, children: [
|
2100
1911
|
subtotalText,
|
2101
|
-
subtotalWithOutProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
2102
|
-
import_hydrogen_react3.Money,
|
2103
|
-
{
|
2104
|
-
data: subtotalWithOutProduct,
|
2105
|
-
withoutTrailingZeros: true
|
2106
|
-
}
|
2107
|
-
)
|
1912
|
+
subtotalWithOutProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_hydrogen_react3.Money, { data: subtotalWithOutProduct, withoutTrailingZeros: true })
|
2108
1913
|
] }),
|
2109
1914
|
includeMainProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: RebuyProductAddOns_default.moneyContainer, children: [
|
2110
1915
|
withProductText,
|
2111
|
-
subtotalWithProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
2112
|
-
import_hydrogen_react3.Money,
|
2113
|
-
{
|
2114
|
-
data: subtotalWithProduct,
|
2115
|
-
withoutTrailingZeros: true
|
2116
|
-
}
|
2117
|
-
)
|
1916
|
+
subtotalWithProduct && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_hydrogen_react3.Money, { data: subtotalWithProduct, withoutTrailingZeros: true })
|
2118
1917
|
] }),
|
2119
1918
|
/* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: RebuyProductAddOns_default.addCartBtnContainer, children: includeMainProduct ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
2120
1919
|
AddToCartBtn,
|
@@ -2124,9 +1923,7 @@ var RebuyProductAddOns = (props) => {
|
|
2124
1923
|
disabled: addedItems.length === 0,
|
2125
1924
|
isHydrogenReact,
|
2126
1925
|
moneyData: subtotalWithProduct,
|
2127
|
-
selectedVariants: addedItems.map(
|
2128
|
-
(item) => item.selectedVariant
|
2129
|
-
)
|
1926
|
+
selectedVariants: addedItems.map((item) => item.selectedVariant)
|
2130
1927
|
}
|
2131
1928
|
) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
|
2132
1929
|
AddToCartBtn,
|
@@ -2136,9 +1933,7 @@ var RebuyProductAddOns = (props) => {
|
|
2136
1933
|
disabled: addedItems.length === 0,
|
2137
1934
|
isHydrogenReact,
|
2138
1935
|
moneyData: subtotalWithOutProduct,
|
2139
|
-
selectedVariants: addedItems.map(
|
2140
|
-
(item) => item.selectedVariant
|
2141
|
-
)
|
1936
|
+
selectedVariants: addedItems.map((item) => item.selectedVariant)
|
2142
1937
|
}
|
2143
1938
|
) })
|
2144
1939
|
] })
|
@@ -2167,14 +1962,7 @@ var RebuyProductRecommendations = (props) => {
|
|
2167
1962
|
return null;
|
2168
1963
|
}
|
2169
1964
|
return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("section", { className: RebuyProductRecommendations_default.container, children: [
|
2170
|
-
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
|
2171
|
-
Title,
|
2172
|
-
{
|
2173
|
-
level: getTitleLevel(customTitleLevel),
|
2174
|
-
style: customTitleStyle,
|
2175
|
-
text: customTitle
|
2176
|
-
}
|
2177
|
-
),
|
1965
|
+
/* @__PURE__ */ (0, import_jsx_runtime18.jsx)(Title, { level: getTitleLevel(customTitleLevel), style: customTitleStyle, text: customTitle }),
|
2178
1966
|
/* @__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)(
|
2179
1967
|
ProductCard,
|
2180
1968
|
{
|
@@ -2182,10 +1970,7 @@ var RebuyProductRecommendations = (props) => {
|
|
2182
1970
|
addToCartCallback,
|
2183
1971
|
isHydrogenReact: props.isHydrogenReact,
|
2184
1972
|
product,
|
2185
|
-
productCardTitleLevel: getTitleLevel(
|
2186
|
-
customTitleLevel,
|
2187
|
-
true
|
2188
|
-
)
|
1973
|
+
productCardTitleLevel: getTitleLevel(customTitleLevel, true)
|
2189
1974
|
}
|
2190
1975
|
) }, product.id)) })
|
2191
1976
|
] });
|