@gem-sdk/pages 1.5.14 → 1.5.23

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 (79) hide show
  1. package/dist/cjs/components/ErrorBoundary.js +32 -24
  2. package/dist/cjs/components/ErrorFallback.js +19 -2
  3. package/dist/cjs/components/FacebookPixel.js +25 -20
  4. package/dist/cjs/components/Footer.js +462 -0
  5. package/dist/cjs/components/GoogleAnalytic.js +49 -23
  6. package/dist/cjs/components/Header.js +211 -0
  7. package/dist/cjs/components/TikTokPixel.js +9 -6
  8. package/dist/cjs/components/builder/Toolbox.js +215 -188
  9. package/dist/cjs/layouts/main.js +19 -5
  10. package/dist/cjs/libs/api/get-builder-props.js +26 -24
  11. package/dist/cjs/libs/api/get-collection-props.js +59 -55
  12. package/dist/cjs/libs/api/get-home-page-props-v2.js +121 -114
  13. package/dist/cjs/libs/api/get-home-page-props.js +133 -123
  14. package/dist/cjs/libs/api/get-preview-props.js +10 -10
  15. package/dist/cjs/libs/api/get-product-props.js +64 -62
  16. package/dist/cjs/libs/api/get-static-page-props-preview.js +128 -121
  17. package/dist/cjs/libs/api/get-static-page-props-v2.js +126 -119
  18. package/dist/cjs/libs/api/get-static-page-props.js +130 -120
  19. package/dist/cjs/libs/fetcher.js +59 -63
  20. package/dist/cjs/libs/get-layout.js +5 -2
  21. package/dist/cjs/libs/get-storefront-api.js +7 -7
  22. package/dist/cjs/libs/getStaticPaths.js +5 -5
  23. package/dist/cjs/libs/google-fonts.js +54 -61
  24. package/dist/cjs/libs/helpers/gen-css.js +103 -94
  25. package/dist/cjs/libs/helpers/generate-manifres.js +1 -1
  26. package/dist/cjs/libs/helpers/get-fallback.js +24 -22
  27. package/dist/cjs/libs/helpers/normalize.js +82 -80
  28. package/dist/cjs/libs/helpers/parse-json.js +10 -12
  29. package/dist/cjs/libs/helpers/user-agent.js +2 -2
  30. package/dist/cjs/libs/hooks/use-tracking-view.js +36 -31
  31. package/dist/cjs/libs/parse-html.js +33 -26
  32. package/dist/cjs/pages/404.js +34 -2
  33. package/dist/cjs/pages/500.js +63 -8
  34. package/dist/cjs/pages/builder.js +69 -14
  35. package/dist/cjs/pages/collection-detail.js +48 -7
  36. package/dist/cjs/pages/preview.js +18 -12
  37. package/dist/cjs/pages/product-detail.js +53 -7
  38. package/dist/cjs/pages/static-v2.js +62 -7
  39. package/dist/cjs/pages/static.js +60 -6
  40. package/dist/esm/components/ErrorBoundary.js +32 -24
  41. package/dist/esm/components/ErrorFallback.js +19 -2
  42. package/dist/esm/components/FacebookPixel.js +25 -20
  43. package/dist/esm/components/Footer.js +458 -0
  44. package/dist/esm/components/GoogleAnalytic.js +49 -23
  45. package/dist/esm/components/Header.js +207 -0
  46. package/dist/esm/components/TikTokPixel.js +9 -6
  47. package/dist/esm/components/builder/Toolbox.js +217 -190
  48. package/dist/esm/layouts/main.js +19 -5
  49. package/dist/esm/libs/api/get-builder-props.js +26 -24
  50. package/dist/esm/libs/api/get-collection-props.js +59 -55
  51. package/dist/esm/libs/api/get-home-page-props-v2.js +121 -114
  52. package/dist/esm/libs/api/get-home-page-props.js +133 -123
  53. package/dist/esm/libs/api/get-preview-props.js +10 -10
  54. package/dist/esm/libs/api/get-product-props.js +64 -62
  55. package/dist/esm/libs/api/get-static-page-props-preview.js +128 -121
  56. package/dist/esm/libs/api/get-static-page-props-v2.js +126 -119
  57. package/dist/esm/libs/api/get-static-page-props.js +130 -120
  58. package/dist/esm/libs/fetcher.js +59 -63
  59. package/dist/esm/libs/get-layout.js +5 -2
  60. package/dist/esm/libs/get-storefront-api.js +7 -7
  61. package/dist/esm/libs/getStaticPaths.js +5 -5
  62. package/dist/esm/libs/google-fonts.js +54 -61
  63. package/dist/esm/libs/helpers/gen-css.js +103 -94
  64. package/dist/esm/libs/helpers/generate-manifres.js +1 -1
  65. package/dist/esm/libs/helpers/get-fallback.js +24 -22
  66. package/dist/esm/libs/helpers/normalize.js +82 -80
  67. package/dist/esm/libs/helpers/parse-json.js +10 -12
  68. package/dist/esm/libs/helpers/user-agent.js +2 -2
  69. package/dist/esm/libs/hooks/use-tracking-view.js +36 -31
  70. package/dist/esm/libs/parse-html.js +33 -26
  71. package/dist/esm/pages/404.js +34 -2
  72. package/dist/esm/pages/500.js +63 -8
  73. package/dist/esm/pages/builder.js +69 -14
  74. package/dist/esm/pages/collection-detail.js +48 -7
  75. package/dist/esm/pages/preview.js +18 -12
  76. package/dist/esm/pages/product-detail.js +53 -7
  77. package/dist/esm/pages/static-v2.js +62 -7
  78. package/dist/esm/pages/static.js +60 -6
  79. package/package.json +1 -1
@@ -0,0 +1,458 @@
1
+ import { jsxs, jsx } from 'react/jsx-runtime';
2
+ import { useShopStore } from '@gem-sdk/core';
3
+
4
+ const Footer = ()=>{
5
+ const layoutSetting = useShopStore((s)=>s.layoutSettings);
6
+ if (!layoutSetting?.showFooter) return null;
7
+ return /*#__PURE__*/ jsxs("div", {
8
+ children: [
9
+ /*#__PURE__*/ jsxs("div", {
10
+ className: "mobile:flex mx-4 hidden h-[138px] flex-col items-center justify-center gap-4",
11
+ children: [
12
+ /*#__PURE__*/ jsxs("div", {
13
+ className: "flex w-full justify-between",
14
+ children: [
15
+ /*#__PURE__*/ jsxs("svg", {
16
+ width: "60",
17
+ height: "50",
18
+ viewBox: "0 0 60 50",
19
+ fill: "none",
20
+ xmlns: "http://www.w3.org/2000/svg",
21
+ children: [
22
+ /*#__PURE__*/ jsx("rect", {
23
+ width: "60",
24
+ height: "36",
25
+ rx: "1",
26
+ fill: "#D6D6D6"
27
+ }),
28
+ /*#__PURE__*/ jsx("rect", {
29
+ y: "40",
30
+ width: "48",
31
+ height: "3",
32
+ rx: "1",
33
+ fill: "#D6D6D6"
34
+ }),
35
+ /*#__PURE__*/ jsx("rect", {
36
+ y: "47",
37
+ width: "36",
38
+ height: "3",
39
+ rx: "1",
40
+ fill: "#D6D6D6"
41
+ })
42
+ ]
43
+ }),
44
+ /*#__PURE__*/ jsxs("div", {
45
+ className: "flex gap-6",
46
+ children: [
47
+ /*#__PURE__*/ jsxs("svg", {
48
+ width: "60",
49
+ height: "36",
50
+ viewBox: "0 0 60 36",
51
+ fill: "none",
52
+ xmlns: "http://www.w3.org/2000/svg",
53
+ children: [
54
+ /*#__PURE__*/ jsx("rect", {
55
+ width: "60",
56
+ height: "6",
57
+ rx: "3",
58
+ fill: "#D6D6D6"
59
+ }),
60
+ /*#__PURE__*/ jsx("rect", {
61
+ y: "10",
62
+ width: "36",
63
+ height: "6",
64
+ rx: "3",
65
+ fill: "#D6D6D6"
66
+ }),
67
+ /*#__PURE__*/ jsx("rect", {
68
+ y: "20",
69
+ width: "36",
70
+ height: "6",
71
+ rx: "3",
72
+ fill: "#D6D6D6"
73
+ }),
74
+ /*#__PURE__*/ jsx("rect", {
75
+ y: "30",
76
+ width: "36",
77
+ height: "6",
78
+ rx: "3",
79
+ fill: "#D6D6D6"
80
+ })
81
+ ]
82
+ }),
83
+ /*#__PURE__*/ jsxs("svg", {
84
+ width: "60",
85
+ height: "26",
86
+ viewBox: "0 0 60 26",
87
+ fill: "none",
88
+ xmlns: "http://www.w3.org/2000/svg",
89
+ children: [
90
+ /*#__PURE__*/ jsx("rect", {
91
+ width: "60",
92
+ height: "6",
93
+ rx: "3",
94
+ fill: "#D6D6D6"
95
+ }),
96
+ /*#__PURE__*/ jsx("rect", {
97
+ y: "10",
98
+ width: "36",
99
+ height: "6",
100
+ rx: "3",
101
+ fill: "#D6D6D6"
102
+ }),
103
+ /*#__PURE__*/ jsx("rect", {
104
+ y: "20",
105
+ width: "36",
106
+ height: "6",
107
+ rx: "3",
108
+ fill: "#D6D6D6"
109
+ })
110
+ ]
111
+ }),
112
+ /*#__PURE__*/ jsxs("svg", {
113
+ width: "60",
114
+ height: "26",
115
+ viewBox: "0 0 60 26",
116
+ fill: "none",
117
+ xmlns: "http://www.w3.org/2000/svg",
118
+ children: [
119
+ /*#__PURE__*/ jsx("rect", {
120
+ width: "60",
121
+ height: "6",
122
+ rx: "3",
123
+ fill: "#D6D6D6"
124
+ }),
125
+ /*#__PURE__*/ jsx("rect", {
126
+ y: "10",
127
+ width: "36",
128
+ height: "6",
129
+ rx: "3",
130
+ fill: "#D6D6D6"
131
+ }),
132
+ /*#__PURE__*/ jsx("rect", {
133
+ y: "20",
134
+ width: "36",
135
+ height: "6",
136
+ rx: "3",
137
+ fill: "#D6D6D6"
138
+ })
139
+ ]
140
+ }),
141
+ /*#__PURE__*/ jsxs("svg", {
142
+ width: "60",
143
+ height: "26",
144
+ viewBox: "0 0 60 26",
145
+ fill: "none",
146
+ xmlns: "http://www.w3.org/2000/svg",
147
+ children: [
148
+ /*#__PURE__*/ jsx("rect", {
149
+ width: "60",
150
+ height: "6",
151
+ rx: "3",
152
+ fill: "#D6D6D6"
153
+ }),
154
+ /*#__PURE__*/ jsx("rect", {
155
+ y: "10",
156
+ width: "36",
157
+ height: "6",
158
+ rx: "3",
159
+ fill: "#D6D6D6"
160
+ }),
161
+ /*#__PURE__*/ jsx("rect", {
162
+ y: "20",
163
+ width: "36",
164
+ height: "6",
165
+ rx: "3",
166
+ fill: "#D6D6D6"
167
+ })
168
+ ]
169
+ })
170
+ ]
171
+ })
172
+ ]
173
+ }),
174
+ /*#__PURE__*/ jsxs("div", {
175
+ className: "flex gap-2",
176
+ children: [
177
+ /*#__PURE__*/ jsx("svg", {
178
+ width: "24",
179
+ height: "24",
180
+ viewBox: "0 0 24 24",
181
+ fill: "none",
182
+ xmlns: "http://www.w3.org/2000/svg",
183
+ children: /*#__PURE__*/ jsx("rect", {
184
+ width: "24",
185
+ height: "24",
186
+ rx: "12",
187
+ fill: "#D6D6D6"
188
+ })
189
+ }),
190
+ /*#__PURE__*/ jsx("svg", {
191
+ width: "24",
192
+ height: "24",
193
+ viewBox: "0 0 24 24",
194
+ fill: "none",
195
+ xmlns: "http://www.w3.org/2000/svg",
196
+ children: /*#__PURE__*/ jsx("rect", {
197
+ width: "24",
198
+ height: "24",
199
+ rx: "12",
200
+ fill: "#D6D6D6"
201
+ })
202
+ }),
203
+ /*#__PURE__*/ jsx("svg", {
204
+ width: "24",
205
+ height: "24",
206
+ viewBox: "0 0 24 24",
207
+ fill: "none",
208
+ xmlns: "http://www.w3.org/2000/svg",
209
+ children: /*#__PURE__*/ jsx("rect", {
210
+ width: "24",
211
+ height: "24",
212
+ rx: "12",
213
+ fill: "#D6D6D6"
214
+ })
215
+ }),
216
+ /*#__PURE__*/ jsx("svg", {
217
+ width: "24",
218
+ height: "24",
219
+ viewBox: "0 0 24 24",
220
+ fill: "none",
221
+ xmlns: "http://www.w3.org/2000/svg",
222
+ children: /*#__PURE__*/ jsx("rect", {
223
+ width: "24",
224
+ height: "24",
225
+ rx: "12",
226
+ fill: "#D6D6D6"
227
+ })
228
+ })
229
+ ]
230
+ })
231
+ ]
232
+ }),
233
+ /*#__PURE__*/ jsxs("div", {
234
+ className: "mobile:hidden mx-4 flex h-24 items-center justify-between",
235
+ children: [
236
+ /*#__PURE__*/ jsx("div", {
237
+ children: /*#__PURE__*/ jsxs("svg", {
238
+ width: "60",
239
+ height: "50",
240
+ viewBox: "0 0 60 50",
241
+ fill: "none",
242
+ xmlns: "http://www.w3.org/2000/svg",
243
+ children: [
244
+ /*#__PURE__*/ jsx("rect", {
245
+ width: "60",
246
+ height: "36",
247
+ rx: "1",
248
+ fill: "#D6D6D6"
249
+ }),
250
+ /*#__PURE__*/ jsx("rect", {
251
+ y: "40",
252
+ width: "48",
253
+ height: "3",
254
+ rx: "1",
255
+ fill: "#D6D6D6"
256
+ }),
257
+ /*#__PURE__*/ jsx("rect", {
258
+ y: "47",
259
+ width: "36",
260
+ height: "3",
261
+ rx: "1",
262
+ fill: "#D6D6D6"
263
+ })
264
+ ]
265
+ })
266
+ }),
267
+ /*#__PURE__*/ jsxs("div", {
268
+ className: "flex gap-6",
269
+ children: [
270
+ /*#__PURE__*/ jsxs("svg", {
271
+ width: "60",
272
+ height: "36",
273
+ viewBox: "0 0 60 36",
274
+ fill: "none",
275
+ xmlns: "http://www.w3.org/2000/svg",
276
+ children: [
277
+ /*#__PURE__*/ jsx("rect", {
278
+ width: "60",
279
+ height: "6",
280
+ rx: "3",
281
+ fill: "#D6D6D6"
282
+ }),
283
+ /*#__PURE__*/ jsx("rect", {
284
+ y: "10",
285
+ width: "36",
286
+ height: "6",
287
+ rx: "3",
288
+ fill: "#D6D6D6"
289
+ }),
290
+ /*#__PURE__*/ jsx("rect", {
291
+ y: "20",
292
+ width: "36",
293
+ height: "6",
294
+ rx: "3",
295
+ fill: "#D6D6D6"
296
+ }),
297
+ /*#__PURE__*/ jsx("rect", {
298
+ y: "30",
299
+ width: "36",
300
+ height: "6",
301
+ rx: "3",
302
+ fill: "#D6D6D6"
303
+ })
304
+ ]
305
+ }),
306
+ /*#__PURE__*/ jsxs("svg", {
307
+ width: "60",
308
+ height: "26",
309
+ viewBox: "0 0 60 26",
310
+ fill: "none",
311
+ xmlns: "http://www.w3.org/2000/svg",
312
+ children: [
313
+ /*#__PURE__*/ jsx("rect", {
314
+ width: "60",
315
+ height: "6",
316
+ rx: "3",
317
+ fill: "#D6D6D6"
318
+ }),
319
+ /*#__PURE__*/ jsx("rect", {
320
+ y: "10",
321
+ width: "36",
322
+ height: "6",
323
+ rx: "3",
324
+ fill: "#D6D6D6"
325
+ }),
326
+ /*#__PURE__*/ jsx("rect", {
327
+ y: "20",
328
+ width: "36",
329
+ height: "6",
330
+ rx: "3",
331
+ fill: "#D6D6D6"
332
+ })
333
+ ]
334
+ }),
335
+ /*#__PURE__*/ jsxs("svg", {
336
+ width: "60",
337
+ height: "26",
338
+ viewBox: "0 0 60 26",
339
+ fill: "none",
340
+ xmlns: "http://www.w3.org/2000/svg",
341
+ children: [
342
+ /*#__PURE__*/ jsx("rect", {
343
+ width: "60",
344
+ height: "6",
345
+ rx: "3",
346
+ fill: "#D6D6D6"
347
+ }),
348
+ /*#__PURE__*/ jsx("rect", {
349
+ y: "10",
350
+ width: "36",
351
+ height: "6",
352
+ rx: "3",
353
+ fill: "#D6D6D6"
354
+ }),
355
+ /*#__PURE__*/ jsx("rect", {
356
+ y: "20",
357
+ width: "36",
358
+ height: "6",
359
+ rx: "3",
360
+ fill: "#D6D6D6"
361
+ })
362
+ ]
363
+ }),
364
+ /*#__PURE__*/ jsxs("svg", {
365
+ width: "60",
366
+ height: "26",
367
+ viewBox: "0 0 60 26",
368
+ fill: "none",
369
+ xmlns: "http://www.w3.org/2000/svg",
370
+ children: [
371
+ /*#__PURE__*/ jsx("rect", {
372
+ width: "60",
373
+ height: "6",
374
+ rx: "3",
375
+ fill: "#D6D6D6"
376
+ }),
377
+ /*#__PURE__*/ jsx("rect", {
378
+ y: "10",
379
+ width: "36",
380
+ height: "6",
381
+ rx: "3",
382
+ fill: "#D6D6D6"
383
+ }),
384
+ /*#__PURE__*/ jsx("rect", {
385
+ y: "20",
386
+ width: "36",
387
+ height: "6",
388
+ rx: "3",
389
+ fill: "#D6D6D6"
390
+ })
391
+ ]
392
+ })
393
+ ]
394
+ }),
395
+ /*#__PURE__*/ jsxs("div", {
396
+ className: "flex gap-2",
397
+ children: [
398
+ /*#__PURE__*/ jsx("svg", {
399
+ width: "24",
400
+ height: "24",
401
+ viewBox: "0 0 24 24",
402
+ fill: "none",
403
+ xmlns: "http://www.w3.org/2000/svg",
404
+ children: /*#__PURE__*/ jsx("rect", {
405
+ width: "24",
406
+ height: "24",
407
+ rx: "12",
408
+ fill: "#D6D6D6"
409
+ })
410
+ }),
411
+ /*#__PURE__*/ jsx("svg", {
412
+ width: "24",
413
+ height: "24",
414
+ viewBox: "0 0 24 24",
415
+ fill: "none",
416
+ xmlns: "http://www.w3.org/2000/svg",
417
+ children: /*#__PURE__*/ jsx("rect", {
418
+ width: "24",
419
+ height: "24",
420
+ rx: "12",
421
+ fill: "#D6D6D6"
422
+ })
423
+ }),
424
+ /*#__PURE__*/ jsx("svg", {
425
+ width: "24",
426
+ height: "24",
427
+ viewBox: "0 0 24 24",
428
+ fill: "none",
429
+ xmlns: "http://www.w3.org/2000/svg",
430
+ children: /*#__PURE__*/ jsx("rect", {
431
+ width: "24",
432
+ height: "24",
433
+ rx: "12",
434
+ fill: "#D6D6D6"
435
+ })
436
+ }),
437
+ /*#__PURE__*/ jsx("svg", {
438
+ width: "24",
439
+ height: "24",
440
+ viewBox: "0 0 24 24",
441
+ fill: "none",
442
+ xmlns: "http://www.w3.org/2000/svg",
443
+ children: /*#__PURE__*/ jsx("rect", {
444
+ width: "24",
445
+ height: "24",
446
+ rx: "12",
447
+ fill: "#D6D6D6"
448
+ })
449
+ })
450
+ ]
451
+ })
452
+ ]
453
+ })
454
+ ]
455
+ });
456
+ };
457
+
458
+ export { Footer as default };
@@ -4,30 +4,53 @@ import { useRouter } from 'next/router';
4
4
  import Script from 'next/script';
5
5
  import { useEffect } from 'react';
6
6
 
7
- const GoogleAnalytic = ({ trackingId }) => {
8
- const router = useRouter();
9
- useEffect(() => {
10
- const handleRouteChange = (url) => {
11
- gtag.pageview(url, trackingId);
12
- };
13
- router.events.on('routeChangeComplete', handleRouteChange);
14
- router.events.on('hashChangeComplete', handleRouteChange);
15
- return () => {
16
- router.events.off('routeChangeComplete', handleRouteChange);
17
- router.events.off('hashChangeComplete', handleRouteChange);
18
- };
19
- }, [trackingId, router.events]);
20
- if (!trackingId)
21
- return null;
22
- if (trackingId.startsWith('UA-'))
23
- return (jsxs(Fragment, { children: [jsx(Script, { src: "https://www.google-analytics.com/analytics.js", async: true, strategy: "afterInteractive" }), jsx(Script, { strategy: "afterInteractive", id: "google-analytics", dangerouslySetInnerHTML: {
24
- __html: `window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
7
+ const GoogleAnalytic = ({ trackingId })=>{
8
+ const router = useRouter();
9
+ useEffect(()=>{
10
+ const handleRouteChange = (url)=>{
11
+ gtag.pageview(url, trackingId);
12
+ };
13
+ router.events.on('routeChangeComplete', handleRouteChange);
14
+ router.events.on('hashChangeComplete', handleRouteChange);
15
+ return ()=>{
16
+ router.events.off('routeChangeComplete', handleRouteChange);
17
+ router.events.off('hashChangeComplete', handleRouteChange);
18
+ };
19
+ }, [
20
+ trackingId,
21
+ router.events
22
+ ]);
23
+ if (!trackingId) return null;
24
+ if (trackingId.startsWith('UA-')) return /*#__PURE__*/ jsxs(Fragment, {
25
+ children: [
26
+ /*#__PURE__*/ jsx(Script, {
27
+ src: "https://www.google-analytics.com/analytics.js",
28
+ async: true,
29
+ strategy: "afterInteractive"
30
+ }),
31
+ /*#__PURE__*/ jsx(Script, {
32
+ strategy: "afterInteractive",
33
+ id: "google-analytics",
34
+ dangerouslySetInnerHTML: {
35
+ __html: `window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
25
36
  ga('create', '${trackingId}', 'auto');
26
37
  ga('require', 'ec');
27
38
  ga('send', 'pageview');
28
- `,
29
- } })] }));
30
- return (jsxs(Fragment, { children: [jsx(Script, { strategy: "afterInteractive", src: `https://www.googletagmanager.com/gtag/js?id=${trackingId}` }), jsx(Script, { id: "gtag-init", strategy: "afterInteractive", dangerouslySetInnerHTML: {
39
+ `
40
+ }
41
+ })
42
+ ]
43
+ });
44
+ return /*#__PURE__*/ jsxs(Fragment, {
45
+ children: [
46
+ /*#__PURE__*/ jsx(Script, {
47
+ strategy: "afterInteractive",
48
+ src: `https://www.googletagmanager.com/gtag/js?id=${trackingId}`
49
+ }),
50
+ /*#__PURE__*/ jsx(Script, {
51
+ id: "gtag-init",
52
+ strategy: "afterInteractive",
53
+ dangerouslySetInnerHTML: {
31
54
  __html: `
32
55
  window.dataLayer = window.dataLayer || [];
33
56
  function gtag(){dataLayer.push(arguments);}
@@ -35,8 +58,11 @@ const GoogleAnalytic = ({ trackingId }) => {
35
58
  gtag('config', '${trackingId}', {
36
59
  page_path: window.location.pathname,
37
60
  });
38
- `,
39
- } })] }));
61
+ `
62
+ }
63
+ })
64
+ ]
65
+ });
40
66
  };
41
67
 
42
68
  export { GoogleAnalytic };