@gem-sdk/pages 1.53.0-dev.4 → 1.53.0-staging.4

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 (18) hide show
  1. package/dist/cjs/components/builder/Header.js +1 -5
  2. package/dist/cjs/components/builder/SwitchView.js +0 -1
  3. package/dist/cjs/components/builder/Toolbar.js +1 -3
  4. package/dist/cjs/components/builder/Toolbox.js +1 -25
  5. package/dist/cjs/libs/api/get-static-page-props-preview.js +1 -2
  6. package/dist/cjs/libs/api/get-static-page-props-v2.js +1 -2
  7. package/dist/cjs/pages/static-v2.js +5 -18
  8. package/dist/esm/components/builder/Header.js +2 -6
  9. package/dist/esm/components/builder/SwitchView.js +0 -1
  10. package/dist/esm/components/builder/Toolbar.js +1 -3
  11. package/dist/esm/components/builder/Toolbox.js +1 -25
  12. package/dist/esm/libs/api/get-static-page-props-preview.js +1 -2
  13. package/dist/esm/libs/api/get-static-page-props-v2.js +1 -2
  14. package/dist/esm/pages/static-v2.js +5 -18
  15. package/dist/types/index.d.ts +0 -1
  16. package/package.json +5 -5
  17. package/dist/cjs/components/builder/InteractionSelectOnPageHeader.js +0 -71
  18. package/dist/esm/components/builder/InteractionSelectOnPageHeader.js +0 -67
package/dist/cjs/components/builder/Header.js CHANGED
@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var core = require('@gem-sdk/core');
7
7
  var SwitchView = require('./SwitchView.js');
8
- var InteractionSelectOnPageHeader = require('./InteractionSelectOnPageHeader.js');
9
8
 
10
9
  const defaultMargin = {
11
10
  desktop: '16px',
@@ -22,10 +21,8 @@ const sizeCheck = {
22
21
  const Header = (props)=>{
23
22
  const { pageType, isOriginTemplate } = props;
24
23
  const layoutSetting = core.useShopStore((s)=>s.layoutSettings);
25
- const isSelectOnPage = core.usePageStore((s)=>s.interactionData?.isSelectOnPage);
26
24
  const activeHeader = layoutSetting?.showHeader || isOriginTemplate;
27
25
  const headerColor = activeHeader ? HEADER_ON_COLOR : HEADER_OFF_COLOR;
28
- console.log('isSelectOnPage', isSelectOnPage);
29
26
  return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
30
27
  children: [
31
28
  /*#__PURE__*/ jsxRuntime.jsx(SwitchView.default, {}),
@@ -180,8 +177,7 @@ const Header = (props)=>{
180
177
  })
181
178
  ]
182
179
  })
183
- }),
184
- isSelectOnPage && /*#__PURE__*/ jsxRuntime.jsx(InteractionSelectOnPageHeader.default, {})
180
+ })
185
181
  ]
186
182
  });
187
183
  };
package/dist/cjs/components/builder/SwitchView.js CHANGED
@@ -178,7 +178,6 @@ const Devices = ()=>{
178
178
  ]
179
179
  })
180
180
  });
181
- return null;
182
181
  };
183
182
 
184
183
  exports.default = Devices;
package/dist/cjs/components/builder/Toolbar.js CHANGED
@@ -579,14 +579,12 @@ const Toolbar = ()=>{
579
579
  if (await isElementInsideArticle()) {
580
580
  articleId = currentComponentActive.current?.articleId || '';
581
581
  }
582
- console.log('$parent$parent', $parent);
583
582
  const event = new CustomEvent('editor:toolbar:force-active-component', {
584
583
  bubbles: true,
585
584
  detail: {
586
585
  componentUid: uid,
587
586
  productId,
588
- articleId,
589
- elementTag: $parent.getAttribute('data-component-tag') || ''
587
+ articleId
590
588
  }
591
589
  });
592
590
  outHover($parent);
package/dist/cjs/components/builder/Toolbox.js CHANGED
@@ -36,9 +36,6 @@ const Toolbox = ()=>{
36
36
  const changeCreateThemeSectionCount = core.useShopStore((s)=>s.changeCreateThemeSectionCount);
37
37
  const changeShopPlan = core.useShopStore((s)=>s.changeShopPlan);
38
38
  const clearModal = core.useModalStore((s)=>s.clearModal);
39
- const setInteractionIsSelectOnPage = core.usePageStore((s)=>s.setInteractionIsSelectOnPage);
40
- const setInteractionItem = core.usePageStore((s)=>s.setInteractionItem);
41
- const setInteractionSelectType = core.usePageStore((s)=>s.setInteractionSelectType);
42
39
  const fonts = react.useMemo(()=>genFonts.getFontsFromDataBuilder(state), [
43
40
  state
44
41
  ]);
@@ -332,21 +329,6 @@ const Toolbox = ()=>{
332
329
  }, [
333
330
  setSalePageProductId
334
331
  ]);
335
- const onUpdateInteractionIsSelectOnPage = react.useCallback((e)=>{
336
- const isSelectOnPage = e.detail.value;
337
- const mode = e.detail.mode;
338
- setInteractionIsSelectOnPage(isSelectOnPage);
339
- setInteractionSelectType(mode);
340
- }, [
341
- setInteractionIsSelectOnPage,
342
- setInteractionSelectType
343
- ]);
344
- const onUpdateInteractionItem = react.useCallback((e)=>{
345
- const interactionItem = e.detail;
346
- setInteractionItem(interactionItem);
347
- }, [
348
- setInteractionItem
349
- ]);
350
332
  react.useEffect(()=>{
351
333
  if (fonts) {
352
334
  setFontsToHead('google-font-element', fonts);
@@ -374,8 +356,6 @@ const Toolbox = ()=>{
374
356
  window.addEventListener('update-item-attribute', onUpdateItemAttribute);
375
357
  window.addEventListener('set-product-offer', onUpdateProductOffers);
376
358
  window.addEventListener('update-sale-page-product-id', onUpdateSalePageProductId);
377
- window.addEventListener('update-interaction-is-select-on-page', onUpdateInteractionIsSelectOnPage);
378
- window.addEventListener('update-interaction-item', onUpdateInteractionItem);
379
359
  return ()=>{
380
360
  window.removeEventListener('update-shop-info', onChangeShopInfo);
381
361
  window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -395,8 +375,6 @@ const Toolbox = ()=>{
395
375
  window.removeEventListener('update-item-attribute', onUpdateItemAttribute);
396
376
  window.removeEventListener('set-product-offer', onUpdateProductOffers);
397
377
  window.removeEventListener('update-sale-page-product-id', onUpdateSalePageProductId);
398
- window.removeEventListener('update-interaction-is-select-on-page', onUpdateInteractionIsSelectOnPage);
399
- window.removeEventListener('update-interaction-item', onUpdateInteractionItem);
400
378
  };
401
379
  }, [
402
380
  onAddEntity,
@@ -417,9 +395,7 @@ const Toolbox = ()=>{
417
395
  onUpdateItemName,
418
396
  onUpdateItemAttribute,
419
397
  onUpdateProductOffers,
420
- onUpdateSalePageProductId,
421
- onUpdateInteractionItem,
422
- onUpdateInteractionIsSelectOnPage
398
+ onUpdateSalePageProductId
423
399
  ]);
424
400
  return /*#__PURE__*/ jsxRuntime.jsx("div", {
425
401
  className: "toolbox"
package/dist/cjs/libs/api/get-static-page-props-preview.js CHANGED
@@ -139,8 +139,7 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
139
139
  facebookPixelId: dataBuilder.themePageAnalytic?.fbPixelID ?? null,
140
140
  tiktokPixelId: dataBuilder.themePageAnalytic?.tiktokPixelID ?? null,
141
141
  customCodeHeader: dataBuilder.themePageCustomCode?.header ?? null,
142
- customCodeBody: dataBuilder.themePageCustomCode?.body ?? null,
143
- interaction: dataBuilder?.interaction
142
+ customCodeBody: dataBuilder.themePageCustomCode?.body ?? null
144
143
  });
145
144
  } catch (err) {
146
145
  nextjs.captureException(err);
package/dist/cjs/libs/api/get-static-page-props-v2.js CHANGED
@@ -141,8 +141,7 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
141
141
  customCodeHeader: dataBuilder.themePageCustomCode?.header ?? null,
142
142
  customCodeBody: dataBuilder.themePageCustomCode?.body ?? null,
143
143
  pageHandle: dataBuilder.handle ?? null,
144
- customFonts: customFonts$1,
145
- interaction: dataBuilder?.interaction
144
+ customFonts: customFonts$1
146
145
  });
147
146
  } catch (err) {
148
147
  nextjs.captureException(err);
package/dist/cjs/pages/static-v2.js CHANGED
@@ -9,11 +9,9 @@ var useTrackingView = require('../libs/hooks/use-tracking-view.js');
9
9
  var parseHtml = require('../libs/parse-html.js');
10
10
  var Header = require('../components/builder/Header.js');
11
11
  var FooterForPostPurchase = require('../components/FooterForPostPurchase.js');
12
- var Script = require('next/script');
13
12
 
14
- const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, fontStyle, elementFontStyle, customCodeHeader, shopToken, pageHandle, customFonts, isPostPurchase, shopName, productOffers, publicStoreFrontData, isPreview, interaction })=>{
13
+ const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, fontStyle, elementFontStyle, customCodeHeader, shopToken, pageHandle, customFonts, isPostPurchase, shopName, productOffers, publicStoreFrontData, isPreview })=>{
15
14
  const router$1 = router.useRouter();
16
- const baseAssetURL = process.env.NEXT_GP_BASE_ASSET_URL || 'https://d3kbi0je7pp4lw.cloudfront.net';
17
15
  useTrackingView.useTrackingView(shopToken, pageHandle, router$1.isFallback);
18
16
  if (router$1.isFallback) {
19
17
  return /*#__PURE__*/ jsxRuntime.jsx("div", {
@@ -81,28 +79,17 @@ const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, f
81
79
  isPostPurchase && /*#__PURE__*/ jsxRuntime.jsx(Header.default, {
82
80
  pageType: "POST_PURCHASE"
83
81
  }),
84
- /*#__PURE__*/ jsxRuntime.jsx("div", {
85
- dangerouslySetInnerHTML: {
86
- __html: `<div id="gp-interaction" style="display: none;">${JSON.stringify(interaction?.value || [])}</div>`
87
- }
88
- }),
89
82
  /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
90
83
  data: sectionData,
91
- children: builderData?.map((builder)=>/*#__PURE__*/ jsxRuntime.jsxs(core.BuilderProvider, {
84
+ children: builderData?.map((builder)=>/*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
92
85
  state: builder.data,
93
86
  lazy: builder.lazy,
94
87
  priority: builder.priority,
95
88
  isPostPurchase: isPostPurchase,
96
89
  isPreview: isPreview,
97
- children: [
98
- /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
99
- uid: builder.uid
100
- }),
101
- /*#__PURE__*/ jsxRuntime.jsx(Script, {
102
- defer: true,
103
- src: `${baseAssetURL}/assets-v2/gp-flow-action-lip.js`
104
- })
105
- ]
90
+ children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
91
+ uid: builder.uid
92
+ })
106
93
  }, builder.uid))
107
94
  }),
108
95
  isPostPurchase && /*#__PURE__*/ jsxRuntime.jsx(FooterForPostPurchase.default, {
package/dist/esm/components/builder/Header.js CHANGED
@@ -1,7 +1,6 @@
1
1
  import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
- import { useShopStore, usePageStore, cls, makeStyleResponsive } from '@gem-sdk/core';
2
+ import { useShopStore, cls, makeStyleResponsive } from '@gem-sdk/core';
3
3
  import Devices from './SwitchView.js';
4
- import InteractionSelectOnPageHeader from './InteractionSelectOnPageHeader.js';
5
4
 
6
5
  const defaultMargin = {
7
6
  desktop: '16px',
@@ -18,10 +17,8 @@ const sizeCheck = {
18
17
  const Header = (props)=>{
19
18
  const { pageType, isOriginTemplate } = props;
20
19
  const layoutSetting = useShopStore((s)=>s.layoutSettings);
21
- const isSelectOnPage = usePageStore((s)=>s.interactionData?.isSelectOnPage);
22
20
  const activeHeader = layoutSetting?.showHeader || isOriginTemplate;
23
21
  const headerColor = activeHeader ? HEADER_ON_COLOR : HEADER_OFF_COLOR;
24
- console.log('isSelectOnPage', isSelectOnPage);
25
22
  return /*#__PURE__*/ jsxs(Fragment, {
26
23
  children: [
27
24
  /*#__PURE__*/ jsx(Devices, {}),
@@ -176,8 +173,7 @@ const Header = (props)=>{
176
173
  })
177
174
  ]
178
175
  })
179
- }),
180
- isSelectOnPage && /*#__PURE__*/ jsx(InteractionSelectOnPageHeader, {})
176
+ })
181
177
  ]
182
178
  });
183
179
  };
package/dist/esm/components/builder/SwitchView.js CHANGED
@@ -174,7 +174,6 @@ const Devices = ()=>{
174
174
  ]
175
175
  })
176
176
  });
177
- return null;
178
177
  };
179
178
 
180
179
  export { Devices as default };
package/dist/esm/components/builder/Toolbar.js CHANGED
@@ -575,14 +575,12 @@ const Toolbar = ()=>{
575
575
  if (await isElementInsideArticle()) {
576
576
  articleId = currentComponentActive.current?.articleId || '';
577
577
  }
578
- console.log('$parent$parent', $parent);
579
578
  const event = new CustomEvent('editor:toolbar:force-active-component', {
580
579
  bubbles: true,
581
580
  detail: {
582
581
  componentUid: uid,
583
582
  productId,
584
- articleId,
585
- elementTag: $parent.getAttribute('data-component-tag') || ''
583
+ articleId
586
584
  }
587
585
  });
588
586
  outHover($parent);
package/dist/esm/components/builder/Toolbox.js CHANGED
@@ -32,9 +32,6 @@ const Toolbox = ()=>{
32
32
  const changeCreateThemeSectionCount = useShopStore((s)=>s.changeCreateThemeSectionCount);
33
33
  const changeShopPlan = useShopStore((s)=>s.changeShopPlan);
34
34
  const clearModal = useModalStore((s)=>s.clearModal);
35
- const setInteractionIsSelectOnPage = usePageStore((s)=>s.setInteractionIsSelectOnPage);
36
- const setInteractionItem = usePageStore((s)=>s.setInteractionItem);
37
- const setInteractionSelectType = usePageStore((s)=>s.setInteractionSelectType);
38
35
  const fonts = useMemo(()=>getFontsFromDataBuilder(state), [
39
36
  state
40
37
  ]);
@@ -328,21 +325,6 @@ const Toolbox = ()=>{
328
325
  }, [
329
326
  setSalePageProductId
330
327
  ]);
331
- const onUpdateInteractionIsSelectOnPage = useCallback((e)=>{
332
- const isSelectOnPage = e.detail.value;
333
- const mode = e.detail.mode;
334
- setInteractionIsSelectOnPage(isSelectOnPage);
335
- setInteractionSelectType(mode);
336
- }, [
337
- setInteractionIsSelectOnPage,
338
- setInteractionSelectType
339
- ]);
340
- const onUpdateInteractionItem = useCallback((e)=>{
341
- const interactionItem = e.detail;
342
- setInteractionItem(interactionItem);
343
- }, [
344
- setInteractionItem
345
- ]);
346
328
  useEffect(()=>{
347
329
  if (fonts) {
348
330
  setFontsToHead('google-font-element', fonts);
@@ -370,8 +352,6 @@ const Toolbox = ()=>{
370
352
  window.addEventListener('update-item-attribute', onUpdateItemAttribute);
371
353
  window.addEventListener('set-product-offer', onUpdateProductOffers);
372
354
  window.addEventListener('update-sale-page-product-id', onUpdateSalePageProductId);
373
- window.addEventListener('update-interaction-is-select-on-page', onUpdateInteractionIsSelectOnPage);
374
- window.addEventListener('update-interaction-item', onUpdateInteractionItem);
375
355
  return ()=>{
376
356
  window.removeEventListener('update-shop-info', onChangeShopInfo);
377
357
  window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -391,8 +371,6 @@ const Toolbox = ()=>{
391
371
  window.removeEventListener('update-item-attribute', onUpdateItemAttribute);
392
372
  window.removeEventListener('set-product-offer', onUpdateProductOffers);
393
373
  window.removeEventListener('update-sale-page-product-id', onUpdateSalePageProductId);
394
- window.removeEventListener('update-interaction-is-select-on-page', onUpdateInteractionIsSelectOnPage);
395
- window.removeEventListener('update-interaction-item', onUpdateInteractionItem);
396
374
  };
397
375
  }, [
398
376
  onAddEntity,
@@ -413,9 +391,7 @@ const Toolbox = ()=>{
413
391
  onUpdateItemName,
414
392
  onUpdateItemAttribute,
415
393
  onUpdateProductOffers,
416
- onUpdateSalePageProductId,
417
- onUpdateInteractionItem,
418
- onUpdateInteractionIsSelectOnPage
394
+ onUpdateSalePageProductId
419
395
  ]);
420
396
  return /*#__PURE__*/ jsx("div", {
421
397
  className: "toolbox"
package/dist/esm/libs/api/get-static-page-props-preview.js CHANGED
@@ -137,8 +137,7 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
137
137
  facebookPixelId: dataBuilder.themePageAnalytic?.fbPixelID ?? null,
138
138
  tiktokPixelId: dataBuilder.themePageAnalytic?.tiktokPixelID ?? null,
139
139
  customCodeHeader: dataBuilder.themePageCustomCode?.header ?? null,
140
- customCodeBody: dataBuilder.themePageCustomCode?.body ?? null,
141
- interaction: dataBuilder?.interaction
140
+ customCodeBody: dataBuilder.themePageCustomCode?.body ?? null
142
141
  });
143
142
  } catch (err) {
144
143
  captureException(err);
package/dist/esm/libs/api/get-static-page-props-v2.js CHANGED
@@ -139,8 +139,7 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
139
139
  customCodeHeader: dataBuilder.themePageCustomCode?.header ?? null,
140
140
  customCodeBody: dataBuilder.themePageCustomCode?.body ?? null,
141
141
  pageHandle: dataBuilder.handle ?? null,
142
- customFonts,
143
- interaction: dataBuilder?.interaction
142
+ customFonts
144
143
  });
145
144
  } catch (err) {
146
145
  captureException(err);
package/dist/esm/pages/static-v2.js CHANGED
@@ -7,11 +7,9 @@ import { useTrackingView } from '../libs/hooks/use-tracking-view.js';
7
7
  import { parseHtml } from '../libs/parse-html.js';
8
8
  import Header from '../components/builder/Header.js';
9
9
  import FooterForPostPurchase from '../components/FooterForPostPurchase.js';
10
- import Script from 'next/script';
11
10
 
12
- const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, fontStyle, elementFontStyle, customCodeHeader, shopToken, pageHandle, customFonts, isPostPurchase, shopName, productOffers, publicStoreFrontData, isPreview, interaction })=>{
11
+ const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, fontStyle, elementFontStyle, customCodeHeader, shopToken, pageHandle, customFonts, isPostPurchase, shopName, productOffers, publicStoreFrontData, isPreview })=>{
13
12
  const router = useRouter();
14
- const baseAssetURL = process.env.NEXT_GP_BASE_ASSET_URL || 'https://d3kbi0je7pp4lw.cloudfront.net';
15
13
  useTrackingView(shopToken, pageHandle, router.isFallback);
16
14
  if (router.isFallback) {
17
15
  return /*#__PURE__*/ jsx("div", {
@@ -79,28 +77,17 @@ const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, f
79
77
  isPostPurchase && /*#__PURE__*/ jsx(Header, {
80
78
  pageType: "POST_PURCHASE"
81
79
  }),
82
- /*#__PURE__*/ jsx("div", {
83
- dangerouslySetInnerHTML: {
84
- __html: `<div id="gp-interaction" style="display: none;">${JSON.stringify(interaction?.value || [])}</div>`
85
- }
86
- }),
87
80
  /*#__PURE__*/ jsx(SectionProvider, {
88
81
  data: sectionData,
89
- children: builderData?.map((builder)=>/*#__PURE__*/ jsxs(BuilderProvider, {
82
+ children: builderData?.map((builder)=>/*#__PURE__*/ jsx(BuilderProvider, {
90
83
  state: builder.data,
91
84
  lazy: builder.lazy,
92
85
  priority: builder.priority,
93
86
  isPostPurchase: isPostPurchase,
94
87
  isPreview: isPreview,
95
- children: [
96
- /*#__PURE__*/ jsx(Render, {
97
- uid: builder.uid
98
- }),
99
- /*#__PURE__*/ jsx(Script, {
100
- defer: true,
101
- src: `${baseAssetURL}/assets-v2/gp-flow-action-lip.js`
102
- })
103
- ]
88
+ children: /*#__PURE__*/ jsx(Render, {
89
+ uid: builder.uid
90
+ })
104
91
  }, builder.uid))
105
92
  }),
106
93
  isPostPurchase && /*#__PURE__*/ jsx(FooterForPostPurchase, {
package/dist/types/index.d.ts CHANGED
@@ -40,7 +40,6 @@ type PageBuilderProps = {
40
40
  customCodeBody?: string | null;
41
41
  isStorefront?: boolean;
42
42
  customFonts?: string | null;
43
- interaction?: ShopType.Maybe<Pick<ShopType.PublishedPageInteraction, "id" | "value">>;
44
43
  };
45
44
  type PageBuilderPropsV2 = {
46
45
  builderData?: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/pages",
3
- "version": "1.53.0-dev.4",
3
+ "version": "1.53.0-staging.4",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -26,10 +26,10 @@
26
26
  "next": "latest"
27
27
  },
28
28
  "devDependencies": {
29
- "@gem-sdk/core": "1.53.0-dev.4",
30
- "@gem-sdk/plugin-cookie-bar": "1.53.0-dev.4",
31
- "@gem-sdk/plugin-quick-view": "1.53.0-dev.4",
32
- "@gem-sdk/plugin-sticky-add-to-cart": "1.53.0-dev.4"
29
+ "@gem-sdk/core": "1.53.0-staging.4",
30
+ "@gem-sdk/plugin-cookie-bar": "1.53.0-staging.0",
31
+ "@gem-sdk/plugin-quick-view": "1.53.0-staging.0",
32
+ "@gem-sdk/plugin-sticky-add-to-cart": "1.53.0-staging.0"
33
33
  },
34
34
  "peerDependencies": {
35
35
  "next": ">=13"
package/dist/cjs/components/builder/InteractionSelectOnPageHeader.js DELETED
@@ -1,71 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var jsxRuntime = require('react/jsx-runtime');
6
- var core = require('@gem-sdk/core');
7
-
8
- const InteractionSelectOnPageHeader = ()=>{
9
- const selectType = core.usePageStore((s)=>s.interactionData?.selectType);
10
- const setInteractionSelectType = core.usePageStore((s)=>s.setInteractionSelectType);
11
- const { closeSelectOnPage } = core.useInteraction();
12
- return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
13
- children: [
14
- /*#__PURE__*/ jsxRuntime.jsxs("header", {
15
- className: "gp-flex gp-justify-between gp-items-center gp-h-10 gp-fixed gp-top-0 gp-left-0 gp-w-full gp-z-100 gp-bg-black gp-text-white",
16
- children: [
17
- /*#__PURE__*/ jsxRuntime.jsx("div", {
18
- className: "gp-ml-4 gp-text-xs gp-mt-1",
19
- children: "Select mode enabled"
20
- }),
21
- /*#__PURE__*/ jsxRuntime.jsxs("section", {
22
- className: "gp-flex gp-bg-[#3C67FF]/[0.15] gp-items-center gp-h-full gp-rounded-b-lg gp-pt-1 gp-gap-1",
23
- children: [
24
- /*#__PURE__*/ jsxRuntime.jsx("button", {
25
- "data-interaction-mode": "element",
26
- onClick: ()=>setInteractionSelectType('element'),
27
- className: `gp-h-full gp-w-[444px] gp-items-center gp-justify-center gp-bg-[#333333] gp-text-[12px] gp-leading-5 gp-font-medium gp-flex gp-rounded-t-[8px] ${selectType === 'element' ? 'gp-bg-[#3C67FF] gp-text-[#F9F9F9]' : 'gp-text-[#AAAAAA]'}`,
28
- style: {
29
- cursor: "url('https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-45eb24ff-a9ee-48ac-af8b-eac35e11918d.png?v=1724038301'), auto"
30
- },
31
- children: "Choose an element on page"
32
- }),
33
- /*#__PURE__*/ jsxRuntime.jsx("button", {
34
- "data-interaction-mode": "page",
35
- onClick: ()=>setInteractionSelectType('page'),
36
- className: `gp-h-full gp-w-[444px] gp-items-center gp-justify-center gp-bg-[#333333] gp-text-[12px] gp-leading-5 gp-font-medium gp-flex gp-rounded-t-[8px] ${selectType === 'page' ? 'gp-bg-[#3C67FF] gp-text-[#F9F9F9]' : 'gp-text-[#AAAAAA]'}`,
37
- style: {
38
- cursor: "url('https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-45eb24ff-a9ee-48ac-af8b-eac35e11918d.png?v=1724038301'), auto"
39
- },
40
- children: "Use entire page"
41
- })
42
- ]
43
- }),
44
- /*#__PURE__*/ jsxRuntime.jsx("button", {
45
- onClick: closeSelectOnPage,
46
- className: "gp-h-10 gp-w-10 gp-flex gp-items-center gp-justify-center gp-rounded-bl-lg",
47
- children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
48
- width: "12",
49
- height: "12",
50
- viewBox: "0 0 12 12",
51
- fill: "none",
52
- xmlns: "http://www.w3.org/2000/svg",
53
- children: /*#__PURE__*/ jsxRuntime.jsx("path", {
54
- d: "M9.96967 11.0303C10.2626 11.3232 10.7374 11.3232 11.0303 11.0303C11.3232 10.7374 11.3232 10.2626 11.0303 9.96967L7.06066 6L11.0303 2.03033C11.3232 1.73744 11.3232 1.26256 11.0303 0.96967C10.7374 0.676777 10.2626 0.676777 9.96967 0.96967L6 4.93934L2.03033 0.96967C1.73744 0.676777 1.26256 0.676777 0.96967 0.96967C0.676777 1.26256 0.676777 1.73744 0.96967 2.03033L4.93934 6L0.96967 9.96967C0.676777 10.2626 0.676777 10.7374 0.96967 11.0303C1.26256 11.3232 1.73744 11.3232 2.03033 11.0303L6 7.06066L9.96967 11.0303Z",
55
- fill: "#F9F9F9"
56
- })
57
- })
58
- })
59
- ]
60
- }),
61
- /*#__PURE__*/ jsxRuntime.jsx("div", {
62
- className: `gp-w-full gp-fixed gp-top-0 gp-left-0 gp-border-[#3C67FF] gp-border-[4px] gp-mt-[40px] ${selectType === 'page' ? 'gp-z-90 gp-bg-[#3c67ff]/[0.25]' : ''}`,
63
- style: {
64
- height: 'calc(100% - 40px)'
65
- }
66
- })
67
- ]
68
- });
69
- };
70
-
71
- exports.default = InteractionSelectOnPageHeader;
package/dist/esm/components/builder/InteractionSelectOnPageHeader.js DELETED
@@ -1,67 +0,0 @@
1
- import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
- import { usePageStore, useInteraction } from '@gem-sdk/core';
3
-
4
- const InteractionSelectOnPageHeader = ()=>{
5
- const selectType = usePageStore((s)=>s.interactionData?.selectType);
6
- const setInteractionSelectType = usePageStore((s)=>s.setInteractionSelectType);
7
- const { closeSelectOnPage } = useInteraction();
8
- return /*#__PURE__*/ jsxs(Fragment, {
9
- children: [
10
- /*#__PURE__*/ jsxs("header", {
11
- className: "gp-flex gp-justify-between gp-items-center gp-h-10 gp-fixed gp-top-0 gp-left-0 gp-w-full gp-z-100 gp-bg-black gp-text-white",
12
- children: [
13
- /*#__PURE__*/ jsx("div", {
14
- className: "gp-ml-4 gp-text-xs gp-mt-1",
15
- children: "Select mode enabled"
16
- }),
17
- /*#__PURE__*/ jsxs("section", {
18
- className: "gp-flex gp-bg-[#3C67FF]/[0.15] gp-items-center gp-h-full gp-rounded-b-lg gp-pt-1 gp-gap-1",
19
- children: [
20
- /*#__PURE__*/ jsx("button", {
21
- "data-interaction-mode": "element",
22
- onClick: ()=>setInteractionSelectType('element'),
23
- className: `gp-h-full gp-w-[444px] gp-items-center gp-justify-center gp-bg-[#333333] gp-text-[12px] gp-leading-5 gp-font-medium gp-flex gp-rounded-t-[8px] ${selectType === 'element' ? 'gp-bg-[#3C67FF] gp-text-[#F9F9F9]' : 'gp-text-[#AAAAAA]'}`,
24
- style: {
25
- cursor: "url('https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-45eb24ff-a9ee-48ac-af8b-eac35e11918d.png?v=1724038301'), auto"
26
- },
27
- children: "Choose an element on page"
28
- }),
29
- /*#__PURE__*/ jsx("button", {
30
- "data-interaction-mode": "page",
31
- onClick: ()=>setInteractionSelectType('page'),
32
- className: `gp-h-full gp-w-[444px] gp-items-center gp-justify-center gp-bg-[#333333] gp-text-[12px] gp-leading-5 gp-font-medium gp-flex gp-rounded-t-[8px] ${selectType === 'page' ? 'gp-bg-[#3C67FF] gp-text-[#F9F9F9]' : 'gp-text-[#AAAAAA]'}`,
33
- style: {
34
- cursor: "url('https://cdn.shopify.com/s/files/1/0858/3168/0279/files/gempages_502328832959710176-45eb24ff-a9ee-48ac-af8b-eac35e11918d.png?v=1724038301'), auto"
35
- },
36
- children: "Use entire page"
37
- })
38
- ]
39
- }),
40
- /*#__PURE__*/ jsx("button", {
41
- onClick: closeSelectOnPage,
42
- className: "gp-h-10 gp-w-10 gp-flex gp-items-center gp-justify-center gp-rounded-bl-lg",
43
- children: /*#__PURE__*/ jsx("svg", {
44
- width: "12",
45
- height: "12",
46
- viewBox: "0 0 12 12",
47
- fill: "none",
48
- xmlns: "http://www.w3.org/2000/svg",
49
- children: /*#__PURE__*/ jsx("path", {
50
- d: "M9.96967 11.0303C10.2626 11.3232 10.7374 11.3232 11.0303 11.0303C11.3232 10.7374 11.3232 10.2626 11.0303 9.96967L7.06066 6L11.0303 2.03033C11.3232 1.73744 11.3232 1.26256 11.0303 0.96967C10.7374 0.676777 10.2626 0.676777 9.96967 0.96967L6 4.93934L2.03033 0.96967C1.73744 0.676777 1.26256 0.676777 0.96967 0.96967C0.676777 1.26256 0.676777 1.73744 0.96967 2.03033L4.93934 6L0.96967 9.96967C0.676777 10.2626 0.676777 10.7374 0.96967 11.0303C1.26256 11.3232 1.73744 11.3232 2.03033 11.0303L6 7.06066L9.96967 11.0303Z",
51
- fill: "#F9F9F9"
52
- })
53
- })
54
- })
55
- ]
56
- }),
57
- /*#__PURE__*/ jsx("div", {
58
- className: `gp-w-full gp-fixed gp-top-0 gp-left-0 gp-border-[#3C67FF] gp-border-[4px] gp-mt-[40px] ${selectType === 'page' ? 'gp-z-90 gp-bg-[#3c67ff]/[0.25]' : ''}`,
59
- style: {
60
- height: 'calc(100% - 40px)'
61
- }
62
- })
63
- ]
64
- });
65
- };
66
-
67
- export { InteractionSelectOnPageHeader as default };