@gem-sdk/core 1.53.0-dev.0 → 1.53.0-staging.3

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 (32) hide show
  1. package/dist/cjs/components/ComponentToolbarPreview.js +104 -115
  2. package/dist/cjs/components/ComponentWrapperPreview.js +2 -16
  3. package/dist/cjs/components/Render.liquid.js +7 -21
  4. package/dist/cjs/contexts/PageContext.js +1 -29
  5. package/dist/cjs/graphql/fragments/published-theme-page.generated.js +0 -8
  6. package/dist/cjs/helpers/animations.js +6 -6
  7. package/dist/cjs/helpers/background.js +1 -1
  8. package/dist/cjs/hooks/animation/useApplyAnimation.js +0 -2
  9. package/dist/cjs/index.js +0 -13
  10. package/dist/cjs/types/animations.js +0 -2
  11. package/dist/esm/components/ComponentToolbarPreview.js +104 -115
  12. package/dist/esm/components/ComponentWrapperPreview.js +2 -16
  13. package/dist/esm/components/Render.liquid.js +7 -21
  14. package/dist/esm/contexts/PageContext.js +1 -29
  15. package/dist/esm/graphql/fragments/published-theme-page.generated.js +0 -8
  16. package/dist/esm/helpers/animations.js +6 -6
  17. package/dist/esm/helpers/background.js +1 -1
  18. package/dist/esm/hooks/animation/useApplyAnimation.js +0 -2
  19. package/dist/esm/index.js +0 -3
  20. package/dist/esm/types/animations.js +0 -2
  21. package/dist/types/index.d.ts +517 -2962
  22. package/package.json +3 -3
  23. package/dist/cjs/components/InteractionSuffix.js +0 -115
  24. package/dist/cjs/graphql-app-api/queries/ShopLibraryPage.generated.js +0 -17
  25. package/dist/cjs/helpers/interaction/index.js +0 -66
  26. package/dist/cjs/hooks/useInteraction.js +0 -19
  27. package/dist/cjs/types/custom.js +0 -51
  28. package/dist/esm/components/InteractionSuffix.js +0 -113
  29. package/dist/esm/graphql-app-api/queries/ShopLibraryPage.generated.js +0 -15
  30. package/dist/esm/helpers/interaction/index.js +0 -64
  31. package/dist/esm/hooks/useInteraction.js +0 -17
  32. package/dist/esm/types/custom.js +0 -51
@@ -7,7 +7,6 @@ var react = require('react');
7
7
  require('zustand');
8
8
  var BuilderPreviewContext = require('../contexts/BuilderPreviewContext.js');
9
9
  var ShopContext = require('../contexts/ShopContext.js');
10
- var PageContext = require('../contexts/PageContext.js');
11
10
  require('@gem-sdk/adapter-shopify');
12
11
  require('swr');
13
12
  require('swr/mutation');
@@ -22,7 +21,6 @@ var useToolbarPostPurchase = require('../hooks/useToolbarPostPurchase.js');
22
21
  var constant = require('./constant.js');
23
22
  var AIContentGenerator = require('./ai-generator/AIContentGenerator.js');
24
23
  var AIGenContentLoading = require('./ai-generator/AIGenContentLoading.js');
25
- var InteractionSuffix = require('./InteractionSuffix.js');
26
24
  require('../helpers/convert.js');
27
25
 
28
26
  const SECTION_LIMIT = 25;
@@ -39,7 +37,6 @@ const ComponentToolbarPreview = (props)=>{
39
37
  const isShopifySection = props.isShopifySection;
40
38
  const storefrontUrl = ShopContext.useShopStore((s)=>s.storefrontUrl);
41
39
  const editingPageType = ShopContext.useShopStore((s)=>s.pageType);
42
- const interactionData = PageContext.usePageStore((s)=>s.interactionData);
43
40
  const getParents = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getParents);
44
41
  const root = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getItem('ROOT'));
45
42
  const isThemeSectionEditor = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.isThemeSectionEditor);
@@ -59,9 +56,6 @@ const ComponentToolbarPreview = (props)=>{
59
56
  const isSaleFunnelPage = react.useMemo(()=>editingPageType === 'POST_PURCHASE', [
60
57
  editingPageType
61
58
  ]);
62
- const isSelectOnPage = react.useMemo(()=>interactionData?.isSelectOnPage, [
63
- interactionData
64
- ]);
65
59
  const { checkDisableDelete, getTooltipText, checkDisableDuplicate } = useToolbarPostPurchase.usePostPurchase(props.uid, props.tag || '');
66
60
  const editProductElementList = [
67
61
  'Product Title',
@@ -78,6 +72,10 @@ const ComponentToolbarPreview = (props)=>{
78
72
  'Article Excerpt',
79
73
  'Article Tags'
80
74
  ];
75
+ const editAbleElementList = [
76
+ ...editProductElementList,
77
+ ...editArticleElementList
78
+ ];
81
79
  const isOverToolbarPosition = (el, parent)=>{
82
80
  const parentLength = parents.length;
83
81
  const rect = el.getBoundingClientRect();
@@ -450,7 +448,6 @@ const ComponentToolbarPreview = (props)=>{
450
448
  }
451
449
  return /*#__PURE__*/ jsxRuntime.jsxs("div", {
452
450
  "data-toolbar-parent": true,
453
- "data-component-tag": parent.tag,
454
451
  "data-parent-uid": parent.uid,
455
452
  "data-toolbar-theme-section": isThemeSectionEditor,
456
453
  "data-toolbar-parent-revert": isShowParentRevert,
@@ -501,117 +498,109 @@ const ComponentToolbarPreview = (props)=>{
501
498
  ]
502
499
  }, parent.uid);
503
500
  }),
504
- !isSelectOnPage && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
505
- children: [
506
- props.tag === 'Section' && !props.isThemeSection && isEnableCreateThemeSection() && !props.isShopifySection && getIndexSection() < SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
507
- ...props
508
- }),
509
- isEnableAIContent() && /*#__PURE__*/ jsxRuntime.jsx(AIContentGenerator.AIContentGenerator, {
510
- ...props
511
- }),
512
- props.tag == 'Sticky' && /*#__PURE__*/ jsxRuntime.jsx("div", {
513
- "data-toolbar-zoom-out": true,
514
- onClick: (e)=>onZoomOut(e),
515
- "aria-hidden": "true",
516
- children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
517
- width: "16",
518
- height: "16",
519
- viewBox: "0 0 16 16",
520
- fill: "none",
521
- xmlns: "http://www.w3.org/2000/svg",
522
- children: /*#__PURE__*/ jsxRuntime.jsx("path", {
523
- fillRule: "evenodd",
524
- clipRule: "evenodd",
525
- d: "M14.5 7C14.7761 7 15 6.77614 15 6.5C15 6.22386 14.7761 6 14.5 6L10.7072 6L14.8536 1.85355C15.0489 1.65829 15.0489 1.34171 14.8536 1.14645C14.6584 0.951186 14.3418 0.951185 14.1465 1.14645L10 5.29297L10 1.5C10 1.22386 9.77614 1 9.5 1C9.22386 1 9 1.22386 9 1.5L9 6.5C9 6.77614 9.22386 7 9.5 7L14.5 7ZM6 10.7073L6 14.5C6 14.7761 6.22386 15 6.5 15C6.77614 15 7 14.7761 7 14.5L7 9.5C7 9.22386 6.77614 9 6.5 9H1.5C1.22386 9 1 9.22386 1 9.5C1 9.77614 1.22386 10 1.5 10H5.29306L1.14662 14.1464C0.951353 14.3417 0.951353 14.6583 1.14662 14.8536C1.34188 15.0488 1.65846 15.0488 1.85372 14.8536L6 10.7073Z",
526
- fill: "currentColor"
527
- })
528
- })
529
- }),
530
- editProductElementList.includes(toolbarName() ?? '') && /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
531
- "data-toolbar-title": true,
532
- enable: true,
533
- "data-toolbar-disable": false,
534
- text: "Edit content in Shopify",
535
- position: "top",
536
- onClick: goToShopifyEditLink,
537
- "aria-hidden": "true",
538
- children: /*#__PURE__*/ jsxRuntime.jsxs("svg", {
539
- width: "16",
540
- height: "16",
541
- viewBox: "0 0 16 16",
542
- fill: "none",
543
- xmlns: "http://www.w3.org/2000/svg",
544
- children: [
545
- /*#__PURE__*/ jsxRuntime.jsx("path", {
546
- fillRule: "evenodd",
547
- clipRule: "evenodd",
548
- d: "M8.61129 2.47348C8.61129 2.47348 8.47099 2.51557 8.23248 2.59274C8.19039 2.46647 8.13427 2.30512 8.05009 2.15079C7.78352 1.6387 7.39068 1.37212 6.91366 1.36511C6.87858 1.36511 6.85052 1.36511 6.81545 1.37212C6.80843 1.36511 6.80142 1.35634 6.7944 1.34757C6.78739 1.3388 6.78037 1.33003 6.77336 1.32302C6.56992 1.09854 6.30335 0.993314 5.98768 1.00033C5.37737 1.02137 4.76706 1.46332 4.269 2.249C3.91825 2.80319 3.65869 3.49767 3.58153 4.03082C3.38823 4.09074 3.21092 4.14586 3.05516 4.19429C2.64595 4.32151 2.3851 4.40261 2.37494 4.40261C2.01718 4.51485 2.01016 4.52888 1.96106 4.85859C1.92598 5.11113 1 12.2945 1 12.2945L7.14764 13.3583C7.18955 13.118 7.30454 12.8953 7.47848 12.7214L8.70249 11.4974V2.45945C8.66741 2.45945 8.63234 2.46647 8.61129 2.47348ZM6.82948 3.02767L6.62554 3.09101C6.27515 3.19989 5.90094 3.31617 5.5317 3.42752C5.65797 2.94349 5.89648 2.46647 6.19111 2.15079C6.30335 2.03154 6.45067 1.90527 6.63306 1.8281C6.80142 2.18587 6.83649 2.68393 6.82948 3.02767ZM5.99469 1.4072C6.13499 1.4072 6.26126 1.43526 6.36649 1.50541C6.19813 1.58959 6.0438 1.71586 5.88947 1.87721C5.50364 2.29109 5.202 2.94349 5.08274 3.56783C4.74459 3.66991 4.41804 3.77199 4.10838 3.8688L4.01646 3.89753C4.22691 2.90841 5.05468 1.43526 5.99469 1.4072ZM4.80214 7.0122C4.81874 7.26957 5.09737 7.44833 5.43473 7.66478C5.95252 7.99699 6.60867 8.41798 6.66813 9.3482C6.7453 10.5548 6.02977 11.3826 4.99154 11.4457C3.7569 11.5229 3.06943 10.7933 3.06943 10.7933L3.32899 9.67791C3.32899 9.67791 4.01646 10.197 4.56363 10.1619C4.92139 10.1409 5.04767 9.84627 5.04065 9.64283C5.01607 9.26796 4.73308 9.06671 4.41569 8.84101C4.00848 8.55142 3.54465 8.22157 3.49735 7.4331C3.42018 6.24756 4.19885 5.05501 5.91051 4.94277C6.57694 4.90068 6.91366 5.06904 6.91366 5.06904L6.52082 6.53518C6.52082 6.53518 6.08589 6.33876 5.56678 6.36682C4.80915 6.41592 4.79512 6.89294 4.80214 7.0122ZM7.23635 2.9014C7.22934 2.59274 7.19426 2.15781 7.04695 1.78601C7.50994 1.87721 7.74143 2.39632 7.83964 2.71199C7.70008 2.75665 7.54275 2.80575 7.37118 2.8593L7.23635 2.9014Z",
549
- fill: "currentColor"
550
- }),
551
- /*#__PURE__*/ jsxRuntime.jsx("path", {
552
- d: "M10.7719 3.44156C10.7757 3.47543 11.1733 6.16931 11.541 8.65883L8.95503 11.2448V2.57871C9.16548 2.78214 9.71265 3.31528 9.71265 3.31528C9.71265 3.31528 10.6106 3.32931 10.6597 3.33633C10.7088 3.34334 10.7649 3.37842 10.7719 3.44156Z",
553
- fill: "currentColor"
554
- }),
555
- /*#__PURE__*/ jsxRuntime.jsx("path", {
556
- d: "M14.8056 8.644L14.0424 7.88088C13.7832 7.62163 13.3629 7.62163 13.1036 7.88088L12.1519 8.83258L13.8539 10.5345L14.8056 9.58282C15.0648 9.32357 15.0648 8.90325 14.8056 8.644Z",
557
- fill: "currentColor"
558
- }),
559
- /*#__PURE__*/ jsxRuntime.jsx("path", {
560
- d: "M7.85018 13.0942L11.6419 9.30246L13.3438 11.0044L9.55212 14.7961C9.43782 14.9104 9.28573 14.9791 9.1244 14.9892L7.93427 15.0641C7.73484 15.0767 7.56961 14.9114 7.58216 14.712L7.65706 13.5219C7.66721 13.3606 7.73588 13.2085 7.85018 13.0942Z",
561
- fill: "currentColor"
562
- })
563
- ]
564
- })
565
- }),
566
- /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
567
- enable: props.tag == 'Section' && getSectionNumber() >= SECTION_LIMIT,
568
- text: "Page has reached Shopify’s 25 section-limit",
569
- position: "bottom",
570
- "data-toolbar-duplicate": true,
571
- "data-toolbar-disable": props.tag == 'Section' && getSectionNumber() >= SECTION_LIMIT || isDisableDuplicate,
572
- onClick: isDisableDuplicate ? undefined : (e)=>onDuplicate(e),
573
- "aria-hidden": "true",
574
- className: isDisableDuplicate ? '!gp-cursor-not-allowed' : '',
575
- children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
576
- width: "16",
577
- height: "16",
578
- viewBox: "0 0 16 16",
579
- fill: "none",
580
- children: /*#__PURE__*/ jsxRuntime.jsx("path", {
581
- fillRule: "evenodd",
582
- clipRule: "evenodd",
583
- d: "M6.08423 1.21289C5.53194 1.21289 5.08423 1.66061 5.08423 2.21289V3.78711H4.26172C3.43329 3.78711 2.76172 4.45868 2.76172 5.28711V13.2871C2.76172 14.1155 3.43329 14.7871 4.26172 14.7871H10.2617C11.0901 14.7871 11.7617 14.1155 11.7617 13.2871V12.4629H13.0842C13.6365 12.4629 14.0842 12.0152 14.0842 11.4629V2.21289C14.0842 1.66061 13.6365 1.21289 13.0842 1.21289H6.08423ZM10.7617 12.4629H6.08423C5.53194 12.4629 5.08423 12.0152 5.08423 11.4629V4.78711H4.26172C3.98558 4.78711 3.76172 5.01097 3.76172 5.28711V13.2871C3.76172 13.5633 3.98558 13.7871 4.26172 13.7871H10.2617C10.5379 13.7871 10.7617 13.5633 10.7617 13.2871V12.4629Z",
584
- fill: "currentColor"
585
- })
586
- })
587
- }),
588
- /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
589
- "data-toolbar-delete": true,
590
- onClick: (e)=>isDisableDelete ? null : onDelete(e),
591
- enable: isDisableDelete,
592
- "data-toolbar-disable": isDisableDelete,
593
- width: tooltipText.width,
594
- text: tooltipText.text,
595
- position: deleteTooltipPosition,
596
- "aria-hidden": "true",
597
- children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
598
- width: "16",
599
- height: "16",
600
- viewBox: "0 0 16 16",
601
- fill: "none",
602
- children: /*#__PURE__*/ jsxRuntime.jsx("path", {
603
- fillRule: "evenodd",
604
- clipRule: "evenodd",
605
- d: "M11 2.88965V2.38965C11 1.56122 10.3284 0.889648 9.5 0.889648H6.5C5.67157 0.889648 5 1.56122 5 2.38965V2.88965H2C1.72386 2.88965 1.5 3.11351 1.5 3.38965C1.5 3.66579 1.72386 3.88965 2 3.88965H3.21997V13.1099C3.21997 14.2144 4.1154 15.1099 5.21997 15.1099H11.22C12.3245 15.1099 13.22 14.2144 13.22 13.1099V3.88965H14C14.2761 3.88965 14.5 3.66579 14.5 3.38965C14.5 3.11351 14.2761 2.88965 14 2.88965H11ZM6 2.88965H10V2.38965C10 2.11351 9.77614 1.88965 9.5 1.88965H6.5C6.22386 1.88965 6 2.11351 6 2.38965V2.88965ZM6.24976 6.13965C6.66397 6.13965 6.99976 6.47543 6.99976 6.88965V11.3896C6.99976 11.8039 6.66397 12.1396 6.24976 12.1396C5.83554 12.1396 5.49976 11.8039 5.49976 11.3896V6.88965C5.49976 6.47543 5.83554 6.13965 6.24976 6.13965ZM10.4998 6.88965C10.4998 6.47543 10.164 6.13965 9.74976 6.13965C9.33554 6.13965 8.99976 6.47543 8.99976 6.88965V11.3896C8.99976 11.8039 9.33554 12.1396 9.74976 12.1396C10.164 12.1396 10.4998 11.8039 10.4998 11.3896V6.88965Z",
606
- fill: "currentColor"
607
- })
501
+ props.tag === 'Section' && !props.isThemeSection && isEnableCreateThemeSection() && !props.isShopifySection && getIndexSection() < SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
502
+ ...props
503
+ }),
504
+ isEnableAIContent() && /*#__PURE__*/ jsxRuntime.jsx(AIContentGenerator.AIContentGenerator, {
505
+ ...props
506
+ }),
507
+ props.tag == 'Sticky' && /*#__PURE__*/ jsxRuntime.jsx("div", {
508
+ "data-toolbar-zoom-out": true,
509
+ onClick: (e)=>onZoomOut(e),
510
+ "aria-hidden": "true",
511
+ children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
512
+ width: "16",
513
+ height: "16",
514
+ viewBox: "0 0 16 16",
515
+ fill: "none",
516
+ xmlns: "http://www.w3.org/2000/svg",
517
+ children: /*#__PURE__*/ jsxRuntime.jsx("path", {
518
+ fillRule: "evenodd",
519
+ clipRule: "evenodd",
520
+ d: "M14.5 7C14.7761 7 15 6.77614 15 6.5C15 6.22386 14.7761 6 14.5 6L10.7072 6L14.8536 1.85355C15.0489 1.65829 15.0489 1.34171 14.8536 1.14645C14.6584 0.951186 14.3418 0.951185 14.1465 1.14645L10 5.29297L10 1.5C10 1.22386 9.77614 1 9.5 1C9.22386 1 9 1.22386 9 1.5L9 6.5C9 6.77614 9.22386 7 9.5 7L14.5 7ZM6 10.7073L6 14.5C6 14.7761 6.22386 15 6.5 15C6.77614 15 7 14.7761 7 14.5L7 9.5C7 9.22386 6.77614 9 6.5 9H1.5C1.22386 9 1 9.22386 1 9.5C1 9.77614 1.22386 10 1.5 10H5.29306L1.14662 14.1464C0.951353 14.3417 0.951353 14.6583 1.14662 14.8536C1.34188 15.0488 1.65846 15.0488 1.85372 14.8536L6 10.7073Z",
521
+ fill: "currentColor"
522
+ })
523
+ })
524
+ }),
525
+ editAbleElementList.includes(toolbarName() ?? '') && /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
526
+ "data-toolbar-title": true,
527
+ enable: true,
528
+ "data-toolbar-disable": false,
529
+ text: "Edit content in Shopify",
530
+ position: "top",
531
+ onClick: goToShopifyEditLink,
532
+ "aria-hidden": "true",
533
+ children: /*#__PURE__*/ jsxRuntime.jsxs("svg", {
534
+ width: "16",
535
+ height: "16",
536
+ viewBox: "0 0 16 16",
537
+ fill: "none",
538
+ xmlns: "http://www.w3.org/2000/svg",
539
+ children: [
540
+ /*#__PURE__*/ jsxRuntime.jsx("path", {
541
+ fillRule: "evenodd",
542
+ clipRule: "evenodd",
543
+ d: "M8.61129 2.47348C8.61129 2.47348 8.47099 2.51557 8.23248 2.59274C8.19039 2.46647 8.13427 2.30512 8.05009 2.15079C7.78352 1.6387 7.39068 1.37212 6.91366 1.36511C6.87858 1.36511 6.85052 1.36511 6.81545 1.37212C6.80843 1.36511 6.80142 1.35634 6.7944 1.34757C6.78739 1.3388 6.78037 1.33003 6.77336 1.32302C6.56992 1.09854 6.30335 0.993314 5.98768 1.00033C5.37737 1.02137 4.76706 1.46332 4.269 2.249C3.91825 2.80319 3.65869 3.49767 3.58153 4.03082C3.38823 4.09074 3.21092 4.14586 3.05516 4.19429C2.64595 4.32151 2.3851 4.40261 2.37494 4.40261C2.01718 4.51485 2.01016 4.52888 1.96106 4.85859C1.92598 5.11113 1 12.2945 1 12.2945L7.14764 13.3583C7.18955 13.118 7.30454 12.8953 7.47848 12.7214L8.70249 11.4974V2.45945C8.66741 2.45945 8.63234 2.46647 8.61129 2.47348ZM6.82948 3.02767L6.62554 3.09101C6.27515 3.19989 5.90094 3.31617 5.5317 3.42752C5.65797 2.94349 5.89648 2.46647 6.19111 2.15079C6.30335 2.03154 6.45067 1.90527 6.63306 1.8281C6.80142 2.18587 6.83649 2.68393 6.82948 3.02767ZM5.99469 1.4072C6.13499 1.4072 6.26126 1.43526 6.36649 1.50541C6.19813 1.58959 6.0438 1.71586 5.88947 1.87721C5.50364 2.29109 5.202 2.94349 5.08274 3.56783C4.74459 3.66991 4.41804 3.77199 4.10838 3.8688L4.01646 3.89753C4.22691 2.90841 5.05468 1.43526 5.99469 1.4072ZM4.80214 7.0122C4.81874 7.26957 5.09737 7.44833 5.43473 7.66478C5.95252 7.99699 6.60867 8.41798 6.66813 9.3482C6.7453 10.5548 6.02977 11.3826 4.99154 11.4457C3.7569 11.5229 3.06943 10.7933 3.06943 10.7933L3.32899 9.67791C3.32899 9.67791 4.01646 10.197 4.56363 10.1619C4.92139 10.1409 5.04767 9.84627 5.04065 9.64283C5.01607 9.26796 4.73308 9.06671 4.41569 8.84101C4.00848 8.55142 3.54465 8.22157 3.49735 7.4331C3.42018 6.24756 4.19885 5.05501 5.91051 4.94277C6.57694 4.90068 6.91366 5.06904 6.91366 5.06904L6.52082 6.53518C6.52082 6.53518 6.08589 6.33876 5.56678 6.36682C4.80915 6.41592 4.79512 6.89294 4.80214 7.0122ZM7.23635 2.9014C7.22934 2.59274 7.19426 2.15781 7.04695 1.78601C7.50994 1.87721 7.74143 2.39632 7.83964 2.71199C7.70008 2.75665 7.54275 2.80575 7.37118 2.8593L7.23635 2.9014Z",
544
+ fill: "currentColor"
545
+ }),
546
+ /*#__PURE__*/ jsxRuntime.jsx("path", {
547
+ d: "M10.7719 3.44156C10.7757 3.47543 11.1733 6.16931 11.541 8.65883L8.95503 11.2448V2.57871C9.16548 2.78214 9.71265 3.31528 9.71265 3.31528C9.71265 3.31528 10.6106 3.32931 10.6597 3.33633C10.7088 3.34334 10.7649 3.37842 10.7719 3.44156Z",
548
+ fill: "currentColor"
549
+ }),
550
+ /*#__PURE__*/ jsxRuntime.jsx("path", {
551
+ d: "M14.8056 8.644L14.0424 7.88088C13.7832 7.62163 13.3629 7.62163 13.1036 7.88088L12.1519 8.83258L13.8539 10.5345L14.8056 9.58282C15.0648 9.32357 15.0648 8.90325 14.8056 8.644Z",
552
+ fill: "currentColor"
553
+ }),
554
+ /*#__PURE__*/ jsxRuntime.jsx("path", {
555
+ d: "M7.85018 13.0942L11.6419 9.30246L13.3438 11.0044L9.55212 14.7961C9.43782 14.9104 9.28573 14.9791 9.1244 14.9892L7.93427 15.0641C7.73484 15.0767 7.56961 14.9114 7.58216 14.712L7.65706 13.5219C7.66721 13.3606 7.73588 13.2085 7.85018 13.0942Z",
556
+ fill: "currentColor"
608
557
  })
558
+ ]
559
+ })
560
+ }),
561
+ /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
562
+ enable: props.tag == 'Section' && getSectionNumber() >= SECTION_LIMIT,
563
+ text: "Page has reached Shopify’s 25 section-limit",
564
+ position: "bottom",
565
+ "data-toolbar-duplicate": true,
566
+ "data-toolbar-disable": props.tag == 'Section' && getSectionNumber() >= SECTION_LIMIT || isDisableDuplicate,
567
+ onClick: isDisableDuplicate ? undefined : (e)=>onDuplicate(e),
568
+ "aria-hidden": "true",
569
+ className: isDisableDuplicate ? '!gp-cursor-not-allowed' : '',
570
+ children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
571
+ width: "16",
572
+ height: "16",
573
+ viewBox: "0 0 16 16",
574
+ fill: "none",
575
+ children: /*#__PURE__*/ jsxRuntime.jsx("path", {
576
+ fillRule: "evenodd",
577
+ clipRule: "evenodd",
578
+ d: "M6.08423 1.21289C5.53194 1.21289 5.08423 1.66061 5.08423 2.21289V3.78711H4.26172C3.43329 3.78711 2.76172 4.45868 2.76172 5.28711V13.2871C2.76172 14.1155 3.43329 14.7871 4.26172 14.7871H10.2617C11.0901 14.7871 11.7617 14.1155 11.7617 13.2871V12.4629H13.0842C13.6365 12.4629 14.0842 12.0152 14.0842 11.4629V2.21289C14.0842 1.66061 13.6365 1.21289 13.0842 1.21289H6.08423ZM10.7617 12.4629H6.08423C5.53194 12.4629 5.08423 12.0152 5.08423 11.4629V4.78711H4.26172C3.98558 4.78711 3.76172 5.01097 3.76172 5.28711V13.2871C3.76172 13.5633 3.98558 13.7871 4.26172 13.7871H10.2617C10.5379 13.7871 10.7617 13.5633 10.7617 13.2871V12.4629Z",
579
+ fill: "currentColor"
609
580
  })
610
- ]
581
+ })
611
582
  }),
612
- /*#__PURE__*/ jsxRuntime.jsx(InteractionSuffix.InteractionSuffix, {
613
- tag: props.tag,
614
- uid: props.uid
583
+ /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
584
+ "data-toolbar-delete": true,
585
+ onClick: (e)=>isDisableDelete ? null : onDelete(e),
586
+ enable: isDisableDelete,
587
+ "data-toolbar-disable": isDisableDelete,
588
+ width: tooltipText.width,
589
+ text: tooltipText.text,
590
+ position: deleteTooltipPosition,
591
+ "aria-hidden": "true",
592
+ children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
593
+ width: "16",
594
+ height: "16",
595
+ viewBox: "0 0 16 16",
596
+ fill: "none",
597
+ children: /*#__PURE__*/ jsxRuntime.jsx("path", {
598
+ fillRule: "evenodd",
599
+ clipRule: "evenodd",
600
+ d: "M11 2.88965V2.38965C11 1.56122 10.3284 0.889648 9.5 0.889648H6.5C5.67157 0.889648 5 1.56122 5 2.38965V2.88965H2C1.72386 2.88965 1.5 3.11351 1.5 3.38965C1.5 3.66579 1.72386 3.88965 2 3.88965H3.21997V13.1099C3.21997 14.2144 4.1154 15.1099 5.21997 15.1099H11.22C12.3245 15.1099 13.22 14.2144 13.22 13.1099V3.88965H14C14.2761 3.88965 14.5 3.66579 14.5 3.38965C14.5 3.11351 14.2761 2.88965 14 2.88965H11ZM6 2.88965H10V2.38965C10 2.11351 9.77614 1.88965 9.5 1.88965H6.5C6.22386 1.88965 6 2.11351 6 2.38965V2.88965ZM6.24976 6.13965C6.66397 6.13965 6.99976 6.47543 6.99976 6.88965V11.3896C6.99976 11.8039 6.66397 12.1396 6.24976 12.1396C5.83554 12.1396 5.49976 11.8039 5.49976 11.3896V6.88965C5.49976 6.47543 5.83554 6.13965 6.24976 6.13965ZM10.4998 6.88965C10.4998 6.47543 10.164 6.13965 9.74976 6.13965C9.33554 6.13965 8.99976 6.47543 8.99976 6.88965V11.3896C8.99976 11.8039 9.33554 12.1396 9.74976 12.1396C10.164 12.1396 10.4998 11.8039 10.4998 11.3896V6.88965Z",
601
+ fill: "currentColor"
602
+ })
603
+ })
615
604
  })
616
605
  ]
617
606
  }, props.uid),
@@ -5,7 +5,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  var jsxRuntime = require('react/jsx-runtime');
6
6
  var react = require('react');
7
7
  var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
8
- var useInteraction = require('../hooks/useInteraction.js');
9
8
  var constant = require('./constant.js');
10
9
  var RenderCustomCode = require('./RenderCustomCode.js');
11
10
  var ComponentToolbarPreview = require('./ComponentToolbarPreview.js');
@@ -33,19 +32,6 @@ const ComponentWrapperPreview = ({ children, ...props })=>{
33
32
  }, [
34
33
  props.uid
35
34
  ]);
36
- const currentProps = props;
37
- const { getAnimationByUid } = useInteraction.useInteraction();
38
- const animationByInteraction = getAnimationByUid(props.uid);
39
- if (animationByInteraction) {
40
- currentProps.advanced = {
41
- ...currentProps.advanced,
42
- animation: {
43
- desktop: animationByInteraction,
44
- tablet: animationByInteraction,
45
- mobile: animationByInteraction
46
- }
47
- };
48
- }
49
35
  const pageType = shop.usePageType();
50
36
  if (props.type === 'section') {
51
37
  return null;
@@ -150,7 +136,7 @@ const ComponentWrapperPreview = ({ children, ...props })=>{
150
136
  return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
151
137
  children: [
152
138
  /*#__PURE__*/ jsxRuntime.jsx(ComponentAnimation.default, {
153
- ...currentProps
139
+ ...props
154
140
  }),
155
141
  /*#__PURE__*/ jsxRuntime.jsx(RenderCustomCode.default, {
156
142
  uid: props.uid,
@@ -179,7 +165,7 @@ const ComponentWrapperPreview = ({ children, ...props })=>{
179
165
  return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
180
166
  children: [
181
167
  /*#__PURE__*/ jsxRuntime.jsx(ComponentAnimation.default, {
182
- ...currentProps
168
+ ...props
183
169
  }),
184
170
  /*#__PURE__*/ jsxRuntime.jsx(RenderCustomCode.default, {
185
171
  uid: props.uid,
@@ -39,6 +39,7 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
39
39
  const item = builder[uid];
40
40
  const Component = components[item?.tag];
41
41
  if (!Component) {
42
+ console.log('Miss component: ', item);
42
43
  return {
43
44
  liquid: '',
44
45
  extraFiles
@@ -75,9 +76,6 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
75
76
  parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null,
76
77
  pageContext,
77
78
  ...passProps,
78
- builderAttrs: {
79
- ...passProps.builderAttrs
80
- },
81
79
  rawChildren: item.childrens.map((id)=>{
82
80
  return {
83
81
  ...builder[id],
@@ -113,14 +111,11 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
113
111
  isText: componentTexts.includes(item.tag) ? true : null,
114
112
  parentId: componentsRenderWithParentId.includes(item.tag) ? parentId : null,
115
113
  pageContext,
116
- ...passProps,
117
- builderAttrs: {
118
- ...passProps.builderAttrs
119
- }
114
+ ...passProps
120
115
  });
121
116
  });
122
117
  } else {
123
- liquid = render.template`<div gp-el-wrapper style="${!componentIconList.includes(item.tag) ? style : ''}" class="${item.uid} ${!item?.childrens?.length && item.tag === 'IconListItemHoz' ? 'hidden' : ''}">
118
+ liquid = render.template`<div style="${!componentIconList.includes(item.tag) ? style : ''}" class="${item.uid} ${!item?.childrens?.length && item.tag === 'IconListItemHoz' ? 'hidden' : ''}">
124
119
  ${render.RenderIf(item?.childrens?.length, ()=>{
125
120
  return Component({
126
121
  builderProps: {
@@ -135,9 +130,6 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
135
130
  },
136
131
  pageContext,
137
132
  ...passProps,
138
- builderAttrs: {
139
- ...passProps.builderAttrs
140
- },
141
133
  rawChildren: item.childrens.map((id)=>{
142
134
  return {
143
135
  ...builder[id],
@@ -174,10 +166,7 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
174
166
  pageContext,
175
167
  isText: componentTexts.includes(item.tag) ? true : null,
176
168
  style: componentIconList.includes(item.tag) ? style : null,
177
- ...passProps,
178
- builderAttrs: {
179
- ...passProps.builderAttrs
180
- }
169
+ ...passProps
181
170
  });
182
171
  })}
183
172
  </div>`;
@@ -215,7 +204,7 @@ const RenderCustomCode = (item)=>{
215
204
  };
216
205
  const appendAnimation = (props, liquid)=>{
217
206
  const { advanced, tag } = props;
218
- const { animation, op: opacity, hasAnimationInteraction, displayInitInteraction = true } = advanced ?? {};
207
+ const { animation, op: opacity } = advanced ?? {};
219
208
  const getAnimationType = (settings, type)=>{
220
209
  return settings?.triggerConfig?.[type]?.animation ?? 'none';
221
210
  };
@@ -229,8 +218,7 @@ const appendAnimation = (props, liquid)=>{
229
218
  const hoverDesktop = getAnimationType(getSettingsByDevice('desktop'), 'hover');
230
219
  const appearTablet = getAnimationType(getSettingsByDevice('tablet'), 'appear');
231
220
  const appearMobile = getAnimationType(getSettingsByDevice('mobile'), 'appear');
232
- const enableAnimation = animation?.desktop?.enabled && (appearDesktop !== 'none' || hoverDesktop !== 'none') || animation?.tablet?.enabled && appearTablet !== 'none' || animation?.mobile?.enabled && appearMobile !== 'none' || !!hasAnimationInteraction;
233
- const enableAnimationWhenInit = animation?.desktop?.enabled && (appearDesktop !== 'none' || hoverDesktop !== 'none') || animation?.tablet?.enabled && appearTablet !== 'none' || animation?.mobile?.enabled && appearMobile !== 'none';
221
+ const enableAnimation = animation?.desktop?.enabled && (appearDesktop !== 'none' || hoverDesktop !== 'none') || animation?.tablet?.enabled && appearTablet !== 'none' || animation?.mobile?.enabled && appearMobile !== 'none';
234
222
  if (!enableAnimation) return liquid;
235
223
  const getInitVisibility = (device)=>getSettingsByDevice(device)?.enabled && ![
236
224
  'shake',
@@ -243,12 +231,10 @@ const appendAnimation = (props, liquid)=>{
243
231
  };
244
232
  return render.template`
245
233
  <gp-animation
246
- display-init="${!displayInitInteraction ? 'hide' : 'show'}"
247
234
  gp-data='${JSON.stringify({
248
235
  config: animation,
249
236
  tag,
250
- opacity,
251
- notEnableAnimationWhenInit: !enableAnimationWhenInit
237
+ opacity
252
238
  })}'
253
239
  style="${{
254
240
  display: 'contents'
@@ -31,31 +31,6 @@ const createPageStoreProvider = (data)=>zustand.createStore((set)=>({
31
31
  set({
32
32
  publicStoreFrontData: publicStoreFrontData
33
33
  });
34
- },
35
- setInteractionIsSelectOnPage: (value)=>{
36
- set((state)=>({
37
- interactionData: {
38
- ...state.interactionData,
39
- isSelectOnPage: value
40
- }
41
- }));
42
- },
43
- setInteractionItem: (item)=>{
44
- set((state)=>({
45
- interactionData: {
46
- ...state.interactionData,
47
- item,
48
- isSelectOnPage: state.interactionData?.isSelectOnPage || false
49
- }
50
- }));
51
- },
52
- setInteractionSelectType: (selectType)=>{
53
- set((state)=>({
54
- interactionData: {
55
- ...state.interactionData,
56
- selectType
57
- }
58
- }));
59
34
  }
60
35
  }));
61
36
  const PageProvider = ({ children, dynamicProduct, dynamicCollection, productOffers, publicStoreFrontData, ...passProps })=>{
@@ -63,10 +38,7 @@ const PageProvider = ({ children, dynamicProduct, dynamicCollection, productOffe
63
38
  dynamicProduct,
64
39
  dynamicCollection,
65
40
  productOffers,
66
- publicStoreFrontData,
67
- interactionData: {
68
- selectType: 'element'
69
- }
41
+ publicStoreFrontData
70
42
  }), [
71
43
  dynamicProduct,
72
44
  dynamicCollection,
@@ -28,10 +28,6 @@
28
28
  themePageCustomFonts {
29
29
  ...CustomFontSelect
30
30
  }
31
- interaction {
32
- id
33
- value
34
- }
35
31
  }
36
32
  `;
37
33
  const PreviewThemePageSelect = `
@@ -59,10 +55,6 @@ const PreviewThemePageSelect = `
59
55
  themePageCustomCode {
60
56
  ...CustomCodeSelect
61
57
  }
62
- interaction {
63
- id
64
- value
65
- }
66
58
  }
67
59
  `;
68
60
 
@@ -46,7 +46,7 @@ const animations = ()=>{
46
46
  });
47
47
  return cloneOptions;
48
48
  };
49
- const slide = (target, options, reverse)=>{
49
+ const slide = (target, options)=>{
50
50
  const normalizedOptions = normalizeOptions(options);
51
51
  const { direction, distance } = normalizedOptions;
52
52
  const coordinate = [
@@ -67,11 +67,11 @@ const animations = ()=>{
67
67
  transform: `translate${coordinate}(0)`
68
68
  }
69
69
  ];
70
- return generateAnimationInstance(target, reverse ? preset.reverse() : preset, {
70
+ return generateAnimationInstance(target, preset, {
71
71
  ...generateOptions(normalizedOptions, 500)
72
72
  });
73
73
  };
74
- const fade = (target, options, reverse)=>{
74
+ const fade = (target, options)=>{
75
75
  const normalizedOptions = normalizeOptions(options);
76
76
  const preset = [
77
77
  {
@@ -81,7 +81,7 @@ const animations = ()=>{
81
81
  opacity: 1
82
82
  }
83
83
  ];
84
- return generateAnimationInstance(target, reverse ? preset.reverse() : preset, {
84
+ return generateAnimationInstance(target, preset, {
85
85
  ...generateOptions(normalizedOptions, 500)
86
86
  });
87
87
  };
@@ -101,7 +101,7 @@ const animations = ()=>{
101
101
  easing: EASING[easing ?? 'linear']
102
102
  };
103
103
  };
104
- const zoom = (target, options, reverse)=>{
104
+ const zoom = (target, options)=>{
105
105
  const normalizedOptions = normalizeOptions(options);
106
106
  const { scale, zoomDirection, isFade } = normalizedOptions;
107
107
  const [i1, i2] = scale.in;
@@ -127,7 +127,7 @@ const animations = ()=>{
127
127
  }
128
128
  ];
129
129
  const zoomPreset = zoomDirection === 'in' ? zoomInPreset : zoomOutPreset;
130
- return generateAnimationInstance(target, reverse ? zoomPreset.reverse() : zoomPreset, {
130
+ return generateAnimationInstance(target, zoomPreset, {
131
131
  ...generateOptions(normalizedOptions, 700)
132
132
  });
133
133
  };
@@ -121,7 +121,7 @@ const getBgAttachmentByDevice = (background, device)=>{
121
121
  return background?.[device]?.attachment;
122
122
  };
123
123
  const composeBackgroundCss = (backgroundColor)=>{
124
- return `${backgroundColor ? `background-color: ${colors.getSingleColorVariable(backgroundColor)};` : undefined}`;
124
+ return `${backgroundColor ? `background-color: ${colors.getSingleColorVariable(backgroundColor)} !important;` : undefined}`;
125
125
  };
126
126
  const makeFixedBgAttachment = (background)=>{
127
127
  if (!background) return;
@@ -8,7 +8,6 @@ var useAnimationTarget = require('./useAnimationTarget.js');
8
8
  var useAnimationConfig = require('./useAnimationConfig.js');
9
9
  var useAnimationActions = require('./useAnimationActions.js');
10
10
  var useAnimationPreview = require('./useAnimationPreview.js');
11
- require('../../types/custom.js');
12
11
  var animations = require('../../types/animations.js');
13
12
 
14
13
  const useApplyAnimation = ({ props })=>{
@@ -41,7 +40,6 @@ const useApplyAnimation = ({ props })=>{
41
40
  setting,
42
41
  target: item.target
43
42
  }));
44
- console.log('listAnimations', listAnimations);
45
43
  cancelAnimation();
46
44
  setAnimation(listAnimations);
47
45
  }, [
package/dist/cjs/index.js CHANGED
@@ -30,7 +30,6 @@ var LibraryTemplate_generated = require('./graphql-app-api/queries/LibraryTempla
30
30
  var ThemePage_generated = require('./graphql-app-api/queries/ThemePage.generated.js');
31
31
  var SaleFunnelDiscounts_generated = require('./graphql-app-api/queries/SaleFunnelDiscounts.generated.js');
32
32
  var LibrarySaleFunnelDiscount_generated = require('./graphql-app-api/queries/LibrarySaleFunnelDiscount.generated.js');
33
- var ShopLibraryPage_generated = require('./graphql-app-api/queries/ShopLibraryPage.generated.js');
34
33
  var borders = require('./helpers/borders.js');
35
34
  var carousel = require('./helpers/carousel.js');
36
35
  var cls = require('./helpers/cls.js');
@@ -99,7 +98,6 @@ var useProductList = require('./hooks/useProductList.js');
99
98
  var useSuspenseFetch = require('./hooks/useSuspenseFetch.js');
100
99
  var useSwatchesOptions = require('./hooks/useSwatchesOptions.js');
101
100
  var useInitialSwatchesOptions = require('./hooks/useInitialSwatchesOptions.js');
102
- var custom = require('./types/custom.js');
103
101
  var shop$1 = require('./types/shop.js');
104
102
  var appAPI = require('./types/appAPI.js');
105
103
  var globalStyle = require('./types/global-style.js');
@@ -109,7 +107,6 @@ var getProduct = require('./helpers/queries/get-product.js');
109
107
  var getProductBySlug = require('./helpers/queries/get-product-by-slug.js');
110
108
  var getAppBlocks = require('./helpers/third-party/getAppBlocks.js');
111
109
  var addAppBlockId = require('./helpers/third-party/addAppBlockId.js');
112
- var index = require('./helpers/interaction/index.js');
113
110
 
114
111
 
115
112
 
@@ -161,7 +158,6 @@ exports.LibraryTemplateDocument = LibraryTemplate_generated.LibraryTemplateDocum
161
158
  exports.ThemePageDocument = ThemePage_generated.ThemePageDocument;
162
159
  exports.SaleFunnelDiscountsDocument = SaleFunnelDiscounts_generated.SaleFunnelDiscountsDocument;
163
160
  exports.LibrarySaleFunnelDocument = LibrarySaleFunnelDiscount_generated.LibrarySaleFunnelDocument;
164
- exports.ShopLibraryPageDocument = ShopLibraryPage_generated.ShopLibraryPageDocument;
165
161
  exports.composeBorderCss = borders.composeBorderCss;
166
162
  exports.getBorderRadiusStyle = borders.getBorderRadiusStyle;
167
163
  exports.getBorderStyle = borders.getBorderStyle;
@@ -364,14 +360,6 @@ exports.useProductListStyles = useProductList.useProductListStyles;
364
360
  exports.useSuspenseFetch = useSuspenseFetch.default;
365
361
  exports.useSwatchesOptions = useSwatchesOptions.default;
366
362
  exports.useInitialSwatchesOptions = useInitialSwatchesOptions.default;
367
- Object.defineProperty(exports, 'InteractionTargetEvent', {
368
- enumerable: true,
369
- get: function () { return custom.InteractionTargetEvent; }
370
- });
371
- Object.defineProperty(exports, 'InteractionTriggerEvent', {
372
- enumerable: true,
373
- get: function () { return custom.InteractionTriggerEvent; }
374
- });
375
363
  exports.ShopType = shop$1;
376
364
  exports.AppAPIType = appAPI;
377
365
  exports.OptionNormalStyle = globalStyle.OptionNormalStyle;
@@ -408,4 +396,3 @@ exports.getProduct = getProduct.getProduct;
408
396
  exports.getProductBySlug = getProductBySlug.getProductBySlug;
409
397
  exports.getAppBlocks = getAppBlocks.getAppBlocks;
410
398
  exports.addAppBlockId = addAppBlockId.addAppBlockId;
411
- exports.useInteraction = index.useInteraction;
@@ -32,8 +32,6 @@ exports.AnimationTriggerType = void 0;
32
32
  (function(AnimationTriggerType) {
33
33
  AnimationTriggerType["Appear"] = 'appear';
34
34
  AnimationTriggerType["Hover"] = 'hover';
35
- AnimationTriggerType["Hidden"] = 'hidden';
36
- AnimationTriggerType["AppearByTrigger"] = 'appearByTrigger';
37
35
  })(exports.AnimationTriggerType || (exports.AnimationTriggerType = {}));
38
36
  exports.AnimationZoomDirectionType = void 0;
39
37
  (function(AnimationZoomDirectionType) {