@shopify/hydrogen-react 2022.7.1 → 2022.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- package/dist/dev/Metafield.cjs.map +1 -1
- package/dist/dev/Metafield.js.map +1 -1
- package/dist/dev/cart-hooks.cjs +0 -41
- package/dist/dev/cart-hooks.cjs.map +1 -1
- package/dist/dev/cart-hooks.js +2 -43
- package/dist/dev/cart-hooks.js.map +1 -1
- package/dist/dev/cart-queries.cjs +0 -102
- package/dist/dev/cart-queries.cjs.map +1 -1
- package/dist/dev/cart-queries.js +1 -103
- package/dist/dev/cart-queries.js.map +1 -1
- package/dist/dev/index.cjs +0 -3
- package/dist/dev/index.cjs.map +1 -1
- package/dist/dev/index.js +0 -3
- package/dist/dev/index.js.map +1 -1
- package/dist/dev/storefront-api-constants.cjs +1 -1
- package/dist/dev/storefront-api-constants.cjs.map +1 -1
- package/dist/dev/storefront-api-constants.js +1 -1
- package/dist/dev/storefront-api-constants.js.map +1 -1
- package/dist/dev/useCartActions.cjs.map +1 -1
- package/dist/dev/useCartActions.js.map +1 -1
- package/dist/prod/Metafield.cjs.map +1 -1
- package/dist/prod/Metafield.js.map +1 -1
- package/dist/prod/cart-hooks.cjs +0 -41
- package/dist/prod/cart-hooks.cjs.map +1 -1
- package/dist/prod/cart-hooks.js +2 -43
- package/dist/prod/cart-hooks.js.map +1 -1
- package/dist/prod/cart-queries.cjs +0 -102
- package/dist/prod/cart-queries.cjs.map +1 -1
- package/dist/prod/cart-queries.js +1 -103
- package/dist/prod/cart-queries.js.map +1 -1
- package/dist/prod/index.cjs +0 -3
- package/dist/prod/index.cjs.map +1 -1
- package/dist/prod/index.js +0 -3
- package/dist/prod/index.js.map +1 -1
- package/dist/prod/storefront-api-constants.cjs +1 -1
- package/dist/prod/storefront-api-constants.cjs.map +1 -1
- package/dist/prod/storefront-api-constants.js +1 -1
- package/dist/prod/storefront-api-constants.js.map +1 -1
- package/dist/prod/useCartActions.cjs.map +1 -1
- package/dist/prod/useCartActions.js.map +1 -1
- package/dist/types/index.d.cts +0 -1
- package/dist/types/index.d.ts +0 -1
- package/dist/types/storefront-api-constants.d.ts +1 -1
- package/dist/types/storefront-api-types.d.ts +278 -73
- package/dist/types/useCartActions.d.ts +1 -1
- package/dist/umd/hydrogen-react.dev.js +252 -393
- package/dist/umd/hydrogen-react.dev.js.map +1 -1
- package/dist/umd/hydrogen-react.prod.js +57 -157
- package/dist/umd/hydrogen-react.prod.js.map +1 -1
- package/package.json +2 -1
- package/storefront.schema.json +1 -1
|
@@ -23,387 +23,6 @@
|
|
|
23
23
|
}
|
|
24
24
|
const React__default = /* @__PURE__ */ _interopDefaultLegacy(React);
|
|
25
25
|
const React__namespace = /* @__PURE__ */ _interopNamespace(React);
|
|
26
|
-
const SFAPI_VERSION = "2022-07";
|
|
27
|
-
var _jsxFileName$b = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";
|
|
28
|
-
const ShopifyContext = React.createContext({
|
|
29
|
-
storeDomain: "test.myshopify.com",
|
|
30
|
-
storefrontToken: "abc123",
|
|
31
|
-
storefrontApiVersion: SFAPI_VERSION,
|
|
32
|
-
country: {
|
|
33
|
-
isoCode: "US"
|
|
34
|
-
},
|
|
35
|
-
language: {
|
|
36
|
-
isoCode: "EN"
|
|
37
|
-
},
|
|
38
|
-
locale: "EN-US"
|
|
39
|
-
});
|
|
40
|
-
function ShopifyProvider({
|
|
41
|
-
children,
|
|
42
|
-
shopifyConfig
|
|
43
|
-
}) {
|
|
44
|
-
if (!shopifyConfig) {
|
|
45
|
-
throw new Error(`The 'shopifyConfig' prop must be passed to '<ShopifyProvider/>'`);
|
|
46
|
-
}
|
|
47
|
-
if (shopifyConfig.storefrontApiVersion !== SFAPI_VERSION) {
|
|
48
|
-
console.warn(`This version of Hydrogen-UI is built for Shopify's Storefront API version ${SFAPI_VERSION}, but it looks like you're using version ${shopifyConfig.storefrontApiVersion}. There may be issues or bugs if you use a mismatched version of Hydrogen-UI and the Storefront API.`);
|
|
49
|
-
}
|
|
50
|
-
const finalConfig = React.useMemo(() => ({
|
|
51
|
-
...shopifyConfig,
|
|
52
|
-
storeDomain: shopifyConfig.storeDomain.replace(/^https?:\/\//, "")
|
|
53
|
-
}), [shopifyConfig]);
|
|
54
|
-
return /* @__PURE__ */ React__default.default.createElement(ShopifyContext.Provider, {
|
|
55
|
-
value: finalConfig,
|
|
56
|
-
__self: this,
|
|
57
|
-
__source: {
|
|
58
|
-
fileName: _jsxFileName$b,
|
|
59
|
-
lineNumber: 49,
|
|
60
|
-
columnNumber: 5
|
|
61
|
-
}
|
|
62
|
-
}, children);
|
|
63
|
-
}
|
|
64
|
-
function useShop() {
|
|
65
|
-
const shopContext = React.useContext(ShopifyContext);
|
|
66
|
-
if (!shopContext) {
|
|
67
|
-
throw new Error(`'useShop()' must be a descendent of <ShopifyProvider/>`);
|
|
68
|
-
}
|
|
69
|
-
return shopContext;
|
|
70
|
-
}
|
|
71
|
-
function flattenConnection(connection) {
|
|
72
|
-
if (!connection) {
|
|
73
|
-
const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead`;
|
|
74
|
-
{
|
|
75
|
-
throw new Error(noConnectionErr);
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
if (connection.nodes) {
|
|
79
|
-
return connection.nodes;
|
|
80
|
-
}
|
|
81
|
-
if (connection.edges) {
|
|
82
|
-
return connection.edges.map((edge) => {
|
|
83
|
-
if (!(edge == null ? void 0 : edge.node)) {
|
|
84
|
-
throw new Error("Connection edges must contain nodes");
|
|
85
|
-
}
|
|
86
|
-
return edge.node;
|
|
87
|
-
});
|
|
88
|
-
}
|
|
89
|
-
{
|
|
90
|
-
console.warn(
|
|
91
|
-
`The connection did not contain either "nodes" or "edges.node". A empty array will be returned in its place.`
|
|
92
|
-
);
|
|
93
|
-
}
|
|
94
|
-
return [];
|
|
95
|
-
}
|
|
96
|
-
const CartLineAdd = (cartFragment) => `
|
|
97
|
-
mutation CartLineAdd($cartId: ID!, $lines: [CartLineInput!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
98
|
-
cartLinesAdd(cartId: $cartId, lines: $lines) {
|
|
99
|
-
cart {
|
|
100
|
-
...CartFragment
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
${cartFragment}
|
|
106
|
-
`;
|
|
107
|
-
const CartCreate = (cartFragment) => `
|
|
108
|
-
mutation CartCreate($input: CartInput!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
109
|
-
cartCreate(input: $input) {
|
|
110
|
-
cart {
|
|
111
|
-
...CartFragment
|
|
112
|
-
}
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
|
|
116
|
-
${cartFragment}
|
|
117
|
-
`;
|
|
118
|
-
const CartLineRemove = (cartFragment) => `
|
|
119
|
-
mutation CartLineRemove($cartId: ID!, $lines: [ID!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
120
|
-
cartLinesRemove(cartId: $cartId, lineIds: $lines) {
|
|
121
|
-
cart {
|
|
122
|
-
...CartFragment
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
${cartFragment}
|
|
128
|
-
`;
|
|
129
|
-
const CartLineUpdate = (cartFragment) => `
|
|
130
|
-
mutation CartLineUpdate($cartId: ID!, $lines: [CartLineUpdateInput!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
131
|
-
cartLinesUpdate(cartId: $cartId, lines: $lines) {
|
|
132
|
-
cart {
|
|
133
|
-
...CartFragment
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
${cartFragment}
|
|
139
|
-
`;
|
|
140
|
-
const CartNoteUpdate = (cartFragment) => `
|
|
141
|
-
mutation CartNoteUpdate($cartId: ID!, $note: String, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
142
|
-
cartNoteUpdate(cartId: $cartId, note: $note) {
|
|
143
|
-
cart {
|
|
144
|
-
...CartFragment
|
|
145
|
-
}
|
|
146
|
-
}
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
${cartFragment}
|
|
150
|
-
`;
|
|
151
|
-
const CartBuyerIdentityUpdate = (cartFragment) => `
|
|
152
|
-
mutation CartBuyerIdentityUpdate(
|
|
153
|
-
$cartId: ID!
|
|
154
|
-
$buyerIdentity: CartBuyerIdentityInput!
|
|
155
|
-
$numCartLines: Int = 250
|
|
156
|
-
$country: CountryCode = ZZ
|
|
157
|
-
) @inContext(country: $country) {
|
|
158
|
-
cartBuyerIdentityUpdate(cartId: $cartId, buyerIdentity: $buyerIdentity) {
|
|
159
|
-
cart {
|
|
160
|
-
...CartFragment
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
}
|
|
164
|
-
|
|
165
|
-
${cartFragment}
|
|
166
|
-
`;
|
|
167
|
-
const CartAttributesUpdate = (cartFragment) => `
|
|
168
|
-
mutation CartAttributesUpdate($attributes: [AttributeInput!]!, $cartId: ID!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
169
|
-
cartAttributesUpdate(attributes: $attributes, cartId: $cartId) {
|
|
170
|
-
cart {
|
|
171
|
-
...CartFragment
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
${cartFragment}
|
|
177
|
-
`;
|
|
178
|
-
const CartDiscountCodesUpdate = (cartFragment) => `
|
|
179
|
-
mutation CartDiscountCodesUpdate($cartId: ID!, $discountCodes: [String!], $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
180
|
-
cartDiscountCodesUpdate(cartId: $cartId, discountCodes: $discountCodes) {
|
|
181
|
-
cart {
|
|
182
|
-
...CartFragment
|
|
183
|
-
}
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
${cartFragment}
|
|
188
|
-
`;
|
|
189
|
-
const CartQuery = (cartFragment) => `
|
|
190
|
-
query CartQuery($id: ID!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
191
|
-
cart(id: $id) {
|
|
192
|
-
...CartFragment
|
|
193
|
-
}
|
|
194
|
-
}
|
|
195
|
-
|
|
196
|
-
${cartFragment}
|
|
197
|
-
`;
|
|
198
|
-
const defaultCartFragment$1 = `
|
|
199
|
-
fragment CartFragment on Cart {
|
|
200
|
-
id
|
|
201
|
-
checkoutUrl
|
|
202
|
-
totalQuantity
|
|
203
|
-
buyerIdentity {
|
|
204
|
-
countryCode
|
|
205
|
-
customer {
|
|
206
|
-
id
|
|
207
|
-
email
|
|
208
|
-
firstName
|
|
209
|
-
lastName
|
|
210
|
-
displayName
|
|
211
|
-
}
|
|
212
|
-
email
|
|
213
|
-
phone
|
|
214
|
-
}
|
|
215
|
-
lines(first: $numCartLines) {
|
|
216
|
-
edges {
|
|
217
|
-
node {
|
|
218
|
-
id
|
|
219
|
-
quantity
|
|
220
|
-
attributes {
|
|
221
|
-
key
|
|
222
|
-
value
|
|
223
|
-
}
|
|
224
|
-
cost {
|
|
225
|
-
totalAmount {
|
|
226
|
-
amount
|
|
227
|
-
currencyCode
|
|
228
|
-
}
|
|
229
|
-
compareAtAmountPerQuantity {
|
|
230
|
-
amount
|
|
231
|
-
currencyCode
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
merchandise {
|
|
235
|
-
... on ProductVariant {
|
|
236
|
-
id
|
|
237
|
-
availableForSale
|
|
238
|
-
compareAtPriceV2 {
|
|
239
|
-
...MoneyFragment
|
|
240
|
-
}
|
|
241
|
-
priceV2 {
|
|
242
|
-
...MoneyFragment
|
|
243
|
-
}
|
|
244
|
-
requiresShipping
|
|
245
|
-
title
|
|
246
|
-
image {
|
|
247
|
-
...ImageFragment
|
|
248
|
-
}
|
|
249
|
-
product {
|
|
250
|
-
handle
|
|
251
|
-
title
|
|
252
|
-
id
|
|
253
|
-
}
|
|
254
|
-
selectedOptions {
|
|
255
|
-
name
|
|
256
|
-
value
|
|
257
|
-
}
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
}
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
cost {
|
|
264
|
-
subtotalAmount {
|
|
265
|
-
...MoneyFragment
|
|
266
|
-
}
|
|
267
|
-
totalAmount {
|
|
268
|
-
...MoneyFragment
|
|
269
|
-
}
|
|
270
|
-
totalDutyAmount {
|
|
271
|
-
...MoneyFragment
|
|
272
|
-
}
|
|
273
|
-
totalTaxAmount {
|
|
274
|
-
...MoneyFragment
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
note
|
|
278
|
-
attributes {
|
|
279
|
-
key
|
|
280
|
-
value
|
|
281
|
-
}
|
|
282
|
-
discountCodes {
|
|
283
|
-
code
|
|
284
|
-
}
|
|
285
|
-
}
|
|
286
|
-
|
|
287
|
-
fragment MoneyFragment on MoneyV2 {
|
|
288
|
-
currencyCode
|
|
289
|
-
amount
|
|
290
|
-
}
|
|
291
|
-
fragment ImageFragment on Image {
|
|
292
|
-
id
|
|
293
|
-
url
|
|
294
|
-
altText
|
|
295
|
-
width
|
|
296
|
-
height
|
|
297
|
-
}
|
|
298
|
-
`;
|
|
299
|
-
const CART_ID_STORAGE_KEY = "shopifyCartId";
|
|
300
|
-
const STOREFRONT_API_PUBLIC_TOKEN_HEADER = "X-Shopify-Storefront-Access-Token";
|
|
301
|
-
const SHOPIFY_STOREFRONT_ID_HEADER = "Shopify-Storefront-Id";
|
|
302
|
-
const SHOPIFY_STOREFRONT_Y_HEADER = "Shopify-Storefront-Y";
|
|
303
|
-
const SHOPIFY_STOREFRONT_S_HEADER = "Shopify-Storefront-S";
|
|
304
|
-
const SHOPIFY_Y = "_shopify_y";
|
|
305
|
-
const SHOPIFY_S = "_shopify_s";
|
|
306
|
-
var g = /* @__PURE__ */ new Set([
|
|
307
|
-
"domain",
|
|
308
|
-
"path",
|
|
309
|
-
"max-age",
|
|
310
|
-
"expires",
|
|
311
|
-
"samesite",
|
|
312
|
-
"secure",
|
|
313
|
-
"httponly"
|
|
314
|
-
]);
|
|
315
|
-
function u$1(a2) {
|
|
316
|
-
let r2 = {}, e2, t2, n2 = 0, m = a2.split(/;\s*/g), s2, i2;
|
|
317
|
-
for (; n2 < m.length; n2++)
|
|
318
|
-
if (t2 = m[n2], e2 = t2.indexOf("="), ~e2) {
|
|
319
|
-
if (s2 = t2.substring(0, e2++).trim(), i2 = t2.substring(e2).trim(), i2[0] === '"' && (i2 = i2.substring(1, i2.length - 1)), ~i2.indexOf("%"))
|
|
320
|
-
try {
|
|
321
|
-
i2 = decodeURIComponent(i2);
|
|
322
|
-
} catch (f2) {
|
|
323
|
-
}
|
|
324
|
-
g.has(t2 = s2.toLowerCase()) ? t2 === "expires" ? r2.expires = new Date(i2) : t2 === "max-age" ? r2.maxage = +i2 : r2[t2] = i2 : r2[s2] = i2;
|
|
325
|
-
} else
|
|
326
|
-
(s2 = t2.trim().toLowerCase()) && (s2 === "httponly" || s2 === "secure") && (r2[s2] = true);
|
|
327
|
-
return r2;
|
|
328
|
-
}
|
|
329
|
-
function useCartFetch() {
|
|
330
|
-
const {
|
|
331
|
-
storeDomain,
|
|
332
|
-
storefrontApiVersion,
|
|
333
|
-
storefrontToken,
|
|
334
|
-
storefrontId
|
|
335
|
-
} = useShop();
|
|
336
|
-
return React.useCallback(({
|
|
337
|
-
query,
|
|
338
|
-
variables
|
|
339
|
-
}) => {
|
|
340
|
-
const headers = {
|
|
341
|
-
"Content-Type": "application/json",
|
|
342
|
-
"X-SDK-Variant": "hydrogen",
|
|
343
|
-
"X-SDK-Version": storefrontApiVersion,
|
|
344
|
-
[STOREFRONT_API_PUBLIC_TOKEN_HEADER]: storefrontToken
|
|
345
|
-
};
|
|
346
|
-
if (storefrontId) {
|
|
347
|
-
headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;
|
|
348
|
-
}
|
|
349
|
-
const cookieData = u$1(document.cookie);
|
|
350
|
-
if (cookieData[SHOPIFY_Y] && cookieData[SHOPIFY_S]) {
|
|
351
|
-
headers[SHOPIFY_STOREFRONT_Y_HEADER] = cookieData[SHOPIFY_Y];
|
|
352
|
-
headers[SHOPIFY_STOREFRONT_S_HEADER] = cookieData[SHOPIFY_S];
|
|
353
|
-
}
|
|
354
|
-
return fetch(`https://${storeDomain}/api/${storefrontApiVersion}/graphql.json`, {
|
|
355
|
-
method: "POST",
|
|
356
|
-
headers,
|
|
357
|
-
body: JSON.stringify({
|
|
358
|
-
query: query.toString(),
|
|
359
|
-
variables
|
|
360
|
-
})
|
|
361
|
-
}).then((res) => res.json()).catch((error) => {
|
|
362
|
-
return {
|
|
363
|
-
data: void 0,
|
|
364
|
-
errors: error.toString()
|
|
365
|
-
};
|
|
366
|
-
});
|
|
367
|
-
}, [storeDomain, storefrontApiVersion, storefrontToken, storefrontId]);
|
|
368
|
-
}
|
|
369
|
-
function useInstantCheckout() {
|
|
370
|
-
const [cart, updateCart] = React.useState();
|
|
371
|
-
const [checkoutUrl, updateCheckoutUrl] = React.useState();
|
|
372
|
-
const [error, updateError] = React.useState();
|
|
373
|
-
const fetch2 = useCartFetch();
|
|
374
|
-
const createInstantCheckout = React.useCallback(async (cartInput) => {
|
|
375
|
-
var _a, _b;
|
|
376
|
-
const {
|
|
377
|
-
data,
|
|
378
|
-
errors
|
|
379
|
-
} = await fetch2({
|
|
380
|
-
query: CartCreate(defaultCartFragment$1),
|
|
381
|
-
variables: {
|
|
382
|
-
input: cartInput
|
|
383
|
-
}
|
|
384
|
-
});
|
|
385
|
-
if (errors) {
|
|
386
|
-
updateError(errors.toString());
|
|
387
|
-
updateCart(void 0);
|
|
388
|
-
updateCheckoutUrl(void 0);
|
|
389
|
-
}
|
|
390
|
-
if ((_a = data == null ? void 0 : data.cartCreate) == null ? void 0 : _a.cart) {
|
|
391
|
-
const dataCart = data.cartCreate.cart;
|
|
392
|
-
updateCart({
|
|
393
|
-
...dataCart,
|
|
394
|
-
lines: flattenConnection(dataCart.lines),
|
|
395
|
-
note: (_b = dataCart.note) != null ? _b : void 0
|
|
396
|
-
});
|
|
397
|
-
updateCheckoutUrl(dataCart.checkoutUrl);
|
|
398
|
-
}
|
|
399
|
-
}, [fetch2]);
|
|
400
|
-
return {
|
|
401
|
-
cart,
|
|
402
|
-
checkoutUrl,
|
|
403
|
-
error,
|
|
404
|
-
createInstantCheckout
|
|
405
|
-
};
|
|
406
|
-
}
|
|
407
26
|
/*! *****************************************************************************
|
|
408
27
|
Copyright (c) Microsoft Corporation.
|
|
409
28
|
|
|
@@ -457,7 +76,7 @@ fragment ImageFragment on Image {
|
|
|
457
76
|
return t2 === n2;
|
|
458
77
|
};
|
|
459
78
|
}
|
|
460
|
-
function u(t2) {
|
|
79
|
+
function u$1(t2) {
|
|
461
80
|
return "string" == typeof t2 ? { type: t2 } : t2;
|
|
462
81
|
}
|
|
463
82
|
function c(t2, n2) {
|
|
@@ -481,7 +100,7 @@ fragment ImageFragment on Image {
|
|
|
481
100
|
var s2 = t(f(r(n2.states[n2.initial].entry).map(function(t2) {
|
|
482
101
|
return o(t2, i2.actions);
|
|
483
102
|
}), n2.context, e), 2), l2 = s2[0], v2 = s2[1], y = { config: n2, _options: i2, initialState: { value: n2.initial, actions: l2, context: v2, matches: a(n2.initial) }, transition: function(e2, i3) {
|
|
484
|
-
var s3, l3, v3 = "string" == typeof e2 ? { value: e2, context: n2.context } : e2, p = v3.value, g2 = v3.context, d = u(i3), x = n2.states[p];
|
|
103
|
+
var s3, l3, v3 = "string" == typeof e2 ? { value: e2, context: n2.context } : e2, p = v3.value, g2 = v3.context, d = u$1(i3), x = n2.states[p];
|
|
485
104
|
if (x.on) {
|
|
486
105
|
var m = r(x.on[d.type]);
|
|
487
106
|
try {
|
|
@@ -533,7 +152,7 @@ fragment ImageFragment on Image {
|
|
|
533
152
|
};
|
|
534
153
|
function v(t2) {
|
|
535
154
|
var r2 = t2.initialState, i2 = n.NotStarted, o2 = /* @__PURE__ */ new Set(), c2 = { _machine: t2, send: function(e2) {
|
|
536
|
-
i2 === n.Running && (r2 = t2.transition(r2, e2), l(r2, u(e2)), o2.forEach(function(t3) {
|
|
155
|
+
i2 === n.Running && (r2 = t2.transition(r2, e2), l(r2, u$1(e2)), o2.forEach(function(t3) {
|
|
537
156
|
return t3(r2);
|
|
538
157
|
}));
|
|
539
158
|
}, subscribe: function(t3) {
|
|
@@ -1019,6 +638,248 @@ fragment ImageFragment on Image {
|
|
|
1019
638
|
var storeSnapshot = withSelector.exports.useSyncExternalStoreWithSelector(subscribe, getSnapshot, getSnapshot, identity, isEqual);
|
|
1020
639
|
return [storeSnapshot, service.send, service];
|
|
1021
640
|
}
|
|
641
|
+
function flattenConnection(connection) {
|
|
642
|
+
if (!connection) {
|
|
643
|
+
const noConnectionErr = `flattenConnection(): needs a 'connection' to flatten, but received '${connection}' instead`;
|
|
644
|
+
{
|
|
645
|
+
throw new Error(noConnectionErr);
|
|
646
|
+
}
|
|
647
|
+
}
|
|
648
|
+
if (connection.nodes) {
|
|
649
|
+
return connection.nodes;
|
|
650
|
+
}
|
|
651
|
+
if (connection.edges) {
|
|
652
|
+
return connection.edges.map((edge) => {
|
|
653
|
+
if (!(edge == null ? void 0 : edge.node)) {
|
|
654
|
+
throw new Error("Connection edges must contain nodes");
|
|
655
|
+
}
|
|
656
|
+
return edge.node;
|
|
657
|
+
});
|
|
658
|
+
}
|
|
659
|
+
{
|
|
660
|
+
console.warn(
|
|
661
|
+
`The connection did not contain either "nodes" or "edges.node". A empty array will be returned in its place.`
|
|
662
|
+
);
|
|
663
|
+
}
|
|
664
|
+
return [];
|
|
665
|
+
}
|
|
666
|
+
const CartLineAdd = (cartFragment) => `
|
|
667
|
+
mutation CartLineAdd($cartId: ID!, $lines: [CartLineInput!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
668
|
+
cartLinesAdd(cartId: $cartId, lines: $lines) {
|
|
669
|
+
cart {
|
|
670
|
+
...CartFragment
|
|
671
|
+
}
|
|
672
|
+
}
|
|
673
|
+
}
|
|
674
|
+
|
|
675
|
+
${cartFragment}
|
|
676
|
+
`;
|
|
677
|
+
const CartCreate = (cartFragment) => `
|
|
678
|
+
mutation CartCreate($input: CartInput!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
679
|
+
cartCreate(input: $input) {
|
|
680
|
+
cart {
|
|
681
|
+
...CartFragment
|
|
682
|
+
}
|
|
683
|
+
}
|
|
684
|
+
}
|
|
685
|
+
|
|
686
|
+
${cartFragment}
|
|
687
|
+
`;
|
|
688
|
+
const CartLineRemove = (cartFragment) => `
|
|
689
|
+
mutation CartLineRemove($cartId: ID!, $lines: [ID!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
690
|
+
cartLinesRemove(cartId: $cartId, lineIds: $lines) {
|
|
691
|
+
cart {
|
|
692
|
+
...CartFragment
|
|
693
|
+
}
|
|
694
|
+
}
|
|
695
|
+
}
|
|
696
|
+
|
|
697
|
+
${cartFragment}
|
|
698
|
+
`;
|
|
699
|
+
const CartLineUpdate = (cartFragment) => `
|
|
700
|
+
mutation CartLineUpdate($cartId: ID!, $lines: [CartLineUpdateInput!]!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
701
|
+
cartLinesUpdate(cartId: $cartId, lines: $lines) {
|
|
702
|
+
cart {
|
|
703
|
+
...CartFragment
|
|
704
|
+
}
|
|
705
|
+
}
|
|
706
|
+
}
|
|
707
|
+
|
|
708
|
+
${cartFragment}
|
|
709
|
+
`;
|
|
710
|
+
const CartNoteUpdate = (cartFragment) => `
|
|
711
|
+
mutation CartNoteUpdate($cartId: ID!, $note: String, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
712
|
+
cartNoteUpdate(cartId: $cartId, note: $note) {
|
|
713
|
+
cart {
|
|
714
|
+
...CartFragment
|
|
715
|
+
}
|
|
716
|
+
}
|
|
717
|
+
}
|
|
718
|
+
|
|
719
|
+
${cartFragment}
|
|
720
|
+
`;
|
|
721
|
+
const CartBuyerIdentityUpdate = (cartFragment) => `
|
|
722
|
+
mutation CartBuyerIdentityUpdate(
|
|
723
|
+
$cartId: ID!
|
|
724
|
+
$buyerIdentity: CartBuyerIdentityInput!
|
|
725
|
+
$numCartLines: Int = 250
|
|
726
|
+
$country: CountryCode = ZZ
|
|
727
|
+
) @inContext(country: $country) {
|
|
728
|
+
cartBuyerIdentityUpdate(cartId: $cartId, buyerIdentity: $buyerIdentity) {
|
|
729
|
+
cart {
|
|
730
|
+
...CartFragment
|
|
731
|
+
}
|
|
732
|
+
}
|
|
733
|
+
}
|
|
734
|
+
|
|
735
|
+
${cartFragment}
|
|
736
|
+
`;
|
|
737
|
+
const CartAttributesUpdate = (cartFragment) => `
|
|
738
|
+
mutation CartAttributesUpdate($attributes: [AttributeInput!]!, $cartId: ID!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
739
|
+
cartAttributesUpdate(attributes: $attributes, cartId: $cartId) {
|
|
740
|
+
cart {
|
|
741
|
+
...CartFragment
|
|
742
|
+
}
|
|
743
|
+
}
|
|
744
|
+
}
|
|
745
|
+
|
|
746
|
+
${cartFragment}
|
|
747
|
+
`;
|
|
748
|
+
const CartDiscountCodesUpdate = (cartFragment) => `
|
|
749
|
+
mutation CartDiscountCodesUpdate($cartId: ID!, $discountCodes: [String!], $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
750
|
+
cartDiscountCodesUpdate(cartId: $cartId, discountCodes: $discountCodes) {
|
|
751
|
+
cart {
|
|
752
|
+
...CartFragment
|
|
753
|
+
}
|
|
754
|
+
}
|
|
755
|
+
}
|
|
756
|
+
|
|
757
|
+
${cartFragment}
|
|
758
|
+
`;
|
|
759
|
+
const CartQuery = (cartFragment) => `
|
|
760
|
+
query CartQuery($id: ID!, $numCartLines: Int = 250, $country: CountryCode = ZZ) @inContext(country: $country) {
|
|
761
|
+
cart(id: $id) {
|
|
762
|
+
...CartFragment
|
|
763
|
+
}
|
|
764
|
+
}
|
|
765
|
+
|
|
766
|
+
${cartFragment}
|
|
767
|
+
`;
|
|
768
|
+
const SFAPI_VERSION = "2022-10";
|
|
769
|
+
var _jsxFileName$b = "/home/runner/work/hydrogen-ui/hydrogen-ui/packages/react/src/ShopifyProvider.tsx";
|
|
770
|
+
const ShopifyContext = React.createContext({
|
|
771
|
+
storeDomain: "test.myshopify.com",
|
|
772
|
+
storefrontToken: "abc123",
|
|
773
|
+
storefrontApiVersion: SFAPI_VERSION,
|
|
774
|
+
country: {
|
|
775
|
+
isoCode: "US"
|
|
776
|
+
},
|
|
777
|
+
language: {
|
|
778
|
+
isoCode: "EN"
|
|
779
|
+
},
|
|
780
|
+
locale: "EN-US"
|
|
781
|
+
});
|
|
782
|
+
function ShopifyProvider({
|
|
783
|
+
children,
|
|
784
|
+
shopifyConfig
|
|
785
|
+
}) {
|
|
786
|
+
if (!shopifyConfig) {
|
|
787
|
+
throw new Error(`The 'shopifyConfig' prop must be passed to '<ShopifyProvider/>'`);
|
|
788
|
+
}
|
|
789
|
+
if (shopifyConfig.storefrontApiVersion !== SFAPI_VERSION) {
|
|
790
|
+
console.warn(`This version of Hydrogen-UI is built for Shopify's Storefront API version ${SFAPI_VERSION}, but it looks like you're using version ${shopifyConfig.storefrontApiVersion}. There may be issues or bugs if you use a mismatched version of Hydrogen-UI and the Storefront API.`);
|
|
791
|
+
}
|
|
792
|
+
const finalConfig = React.useMemo(() => ({
|
|
793
|
+
...shopifyConfig,
|
|
794
|
+
storeDomain: shopifyConfig.storeDomain.replace(/^https?:\/\//, "")
|
|
795
|
+
}), [shopifyConfig]);
|
|
796
|
+
return /* @__PURE__ */ React__default.default.createElement(ShopifyContext.Provider, {
|
|
797
|
+
value: finalConfig,
|
|
798
|
+
__self: this,
|
|
799
|
+
__source: {
|
|
800
|
+
fileName: _jsxFileName$b,
|
|
801
|
+
lineNumber: 49,
|
|
802
|
+
columnNumber: 5
|
|
803
|
+
}
|
|
804
|
+
}, children);
|
|
805
|
+
}
|
|
806
|
+
function useShop() {
|
|
807
|
+
const shopContext = React.useContext(ShopifyContext);
|
|
808
|
+
if (!shopContext) {
|
|
809
|
+
throw new Error(`'useShop()' must be a descendent of <ShopifyProvider/>`);
|
|
810
|
+
}
|
|
811
|
+
return shopContext;
|
|
812
|
+
}
|
|
813
|
+
const CART_ID_STORAGE_KEY = "shopifyCartId";
|
|
814
|
+
const STOREFRONT_API_PUBLIC_TOKEN_HEADER = "X-Shopify-Storefront-Access-Token";
|
|
815
|
+
const SHOPIFY_STOREFRONT_ID_HEADER = "Shopify-Storefront-Id";
|
|
816
|
+
const SHOPIFY_STOREFRONT_Y_HEADER = "Shopify-Storefront-Y";
|
|
817
|
+
const SHOPIFY_STOREFRONT_S_HEADER = "Shopify-Storefront-S";
|
|
818
|
+
const SHOPIFY_Y = "_shopify_y";
|
|
819
|
+
const SHOPIFY_S = "_shopify_s";
|
|
820
|
+
var g = /* @__PURE__ */ new Set([
|
|
821
|
+
"domain",
|
|
822
|
+
"path",
|
|
823
|
+
"max-age",
|
|
824
|
+
"expires",
|
|
825
|
+
"samesite",
|
|
826
|
+
"secure",
|
|
827
|
+
"httponly"
|
|
828
|
+
]);
|
|
829
|
+
function u(a2) {
|
|
830
|
+
let r2 = {}, e2, t2, n2 = 0, m = a2.split(/;\s*/g), s2, i2;
|
|
831
|
+
for (; n2 < m.length; n2++)
|
|
832
|
+
if (t2 = m[n2], e2 = t2.indexOf("="), ~e2) {
|
|
833
|
+
if (s2 = t2.substring(0, e2++).trim(), i2 = t2.substring(e2).trim(), i2[0] === '"' && (i2 = i2.substring(1, i2.length - 1)), ~i2.indexOf("%"))
|
|
834
|
+
try {
|
|
835
|
+
i2 = decodeURIComponent(i2);
|
|
836
|
+
} catch (f2) {
|
|
837
|
+
}
|
|
838
|
+
g.has(t2 = s2.toLowerCase()) ? t2 === "expires" ? r2.expires = new Date(i2) : t2 === "max-age" ? r2.maxage = +i2 : r2[t2] = i2 : r2[s2] = i2;
|
|
839
|
+
} else
|
|
840
|
+
(s2 = t2.trim().toLowerCase()) && (s2 === "httponly" || s2 === "secure") && (r2[s2] = true);
|
|
841
|
+
return r2;
|
|
842
|
+
}
|
|
843
|
+
function useCartFetch() {
|
|
844
|
+
const {
|
|
845
|
+
storeDomain,
|
|
846
|
+
storefrontApiVersion,
|
|
847
|
+
storefrontToken,
|
|
848
|
+
storefrontId
|
|
849
|
+
} = useShop();
|
|
850
|
+
return React.useCallback(({
|
|
851
|
+
query,
|
|
852
|
+
variables
|
|
853
|
+
}) => {
|
|
854
|
+
const headers = {
|
|
855
|
+
"Content-Type": "application/json",
|
|
856
|
+
"X-SDK-Variant": "hydrogen",
|
|
857
|
+
"X-SDK-Version": storefrontApiVersion,
|
|
858
|
+
[STOREFRONT_API_PUBLIC_TOKEN_HEADER]: storefrontToken
|
|
859
|
+
};
|
|
860
|
+
if (storefrontId) {
|
|
861
|
+
headers[SHOPIFY_STOREFRONT_ID_HEADER] = storefrontId;
|
|
862
|
+
}
|
|
863
|
+
const cookieData = u(document.cookie);
|
|
864
|
+
if (cookieData[SHOPIFY_Y] && cookieData[SHOPIFY_S]) {
|
|
865
|
+
headers[SHOPIFY_STOREFRONT_Y_HEADER] = cookieData[SHOPIFY_Y];
|
|
866
|
+
headers[SHOPIFY_STOREFRONT_S_HEADER] = cookieData[SHOPIFY_S];
|
|
867
|
+
}
|
|
868
|
+
return fetch(`https://${storeDomain}/api/${storefrontApiVersion}/graphql.json`, {
|
|
869
|
+
method: "POST",
|
|
870
|
+
headers,
|
|
871
|
+
body: JSON.stringify({
|
|
872
|
+
query: query.toString(),
|
|
873
|
+
variables
|
|
874
|
+
})
|
|
875
|
+
}).then((res) => res.json()).catch((error) => {
|
|
876
|
+
return {
|
|
877
|
+
data: void 0,
|
|
878
|
+
errors: error.toString()
|
|
879
|
+
};
|
|
880
|
+
});
|
|
881
|
+
}, [storeDomain, storefrontApiVersion, storefrontToken, storefrontId]);
|
|
882
|
+
}
|
|
1022
883
|
function useCartActions({
|
|
1023
884
|
numCartLines,
|
|
1024
885
|
cartFragment,
|
|
@@ -2614,7 +2475,7 @@ fragment ImageFragment on Image {
|
|
|
2614
2475
|
__self: this,
|
|
2615
2476
|
__source: {
|
|
2616
2477
|
fileName: _jsxFileName$4,
|
|
2617
|
-
lineNumber:
|
|
2478
|
+
lineNumber: 154,
|
|
2618
2479
|
columnNumber: 9
|
|
2619
2480
|
}
|
|
2620
2481
|
}, refArray.map((ref, index2) => /* @__PURE__ */ React__default.default.createElement("li", {
|
|
@@ -2622,7 +2483,7 @@ fragment ImageFragment on Image {
|
|
|
2622
2483
|
__self: this,
|
|
2623
2484
|
__source: {
|
|
2624
2485
|
fileName: _jsxFileName$4,
|
|
2625
|
-
lineNumber:
|
|
2486
|
+
lineNumber: 158,
|
|
2626
2487
|
columnNumber: 13
|
|
2627
2488
|
}
|
|
2628
2489
|
}, ref)));
|
|
@@ -2636,7 +2497,7 @@ fragment ImageFragment on Image {
|
|
|
2636
2497
|
__self: this,
|
|
2637
2498
|
__source: {
|
|
2638
2499
|
fileName: _jsxFileName$4,
|
|
2639
|
-
lineNumber:
|
|
2500
|
+
lineNumber: 167,
|
|
2640
2501
|
columnNumber: 11
|
|
2641
2502
|
}
|
|
2642
2503
|
}) : null;
|
|
@@ -2648,7 +2509,7 @@ fragment ImageFragment on Image {
|
|
|
2648
2509
|
__self: this,
|
|
2649
2510
|
__source: {
|
|
2650
2511
|
fileName: _jsxFileName$4,
|
|
2651
|
-
lineNumber:
|
|
2512
|
+
lineNumber: 172,
|
|
2652
2513
|
columnNumber: 11
|
|
2653
2514
|
}
|
|
2654
2515
|
}, /* @__PURE__ */ React__default.default.createElement(Image, {
|
|
@@ -2656,7 +2517,7 @@ fragment ImageFragment on Image {
|
|
|
2656
2517
|
__self: this,
|
|
2657
2518
|
__source: {
|
|
2658
2519
|
fileName: _jsxFileName$4,
|
|
2659
|
-
lineNumber:
|
|
2520
|
+
lineNumber: 173,
|
|
2660
2521
|
columnNumber: 13
|
|
2661
2522
|
}
|
|
2662
2523
|
})) : null;
|
|
@@ -2668,7 +2529,7 @@ fragment ImageFragment on Image {
|
|
|
2668
2529
|
__self: this,
|
|
2669
2530
|
__source: {
|
|
2670
2531
|
fileName: _jsxFileName$4,
|
|
2671
|
-
lineNumber:
|
|
2532
|
+
lineNumber: 178,
|
|
2672
2533
|
columnNumber: 16
|
|
2673
2534
|
}
|
|
2674
2535
|
});
|
|
@@ -2681,7 +2542,7 @@ fragment ImageFragment on Image {
|
|
|
2681
2542
|
__self: this,
|
|
2682
2543
|
__source: {
|
|
2683
2544
|
fileName: _jsxFileName$4,
|
|
2684
|
-
lineNumber:
|
|
2545
|
+
lineNumber: 185,
|
|
2685
2546
|
columnNumber: 5
|
|
2686
2547
|
}
|
|
2687
2548
|
}, (_i = parsedMetafield.value) == null ? void 0 : _i.toString());
|
|
@@ -3309,8 +3170,6 @@ fragment ImageFragment on Image {
|
|
|
3309
3170
|
exports2.parseMetafield = parseMetafield;
|
|
3310
3171
|
exports2.parseMetafieldValue = parseMetafieldValue;
|
|
3311
3172
|
exports2.useCart = useCart;
|
|
3312
|
-
exports2.useCartFetch = useCartFetch;
|
|
3313
|
-
exports2.useInstantCheckout = useInstantCheckout;
|
|
3314
3173
|
exports2.useMoney = useMoney;
|
|
3315
3174
|
exports2.useProduct = useProduct;
|
|
3316
3175
|
exports2.useShop = useShop;
|