@gem-sdk/core 1.22.31-new-feature.10 → 1.22.31-new-feature.13

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.
@@ -4,20 +4,23 @@ var jsxRuntime = require('react/jsx-runtime');
4
4
  var react = require('react');
5
5
  require('zustand');
6
6
  var BuilderPreviewContext = require('../contexts/BuilderPreviewContext.js');
7
- require('swr');
7
+ var ShopContext = require('../contexts/ShopContext.js');
8
8
  require('@gem-sdk/adapter-shopify');
9
+ require('swr');
9
10
  require('swr/mutation');
10
11
  require('vanilla-lazyload');
11
12
  require('../hooks/useCartUI.js');
12
13
  var CreateThemeSection = require('./theme-section/CreateThemeSection.js');
13
14
  var Tooltip = require('./toolbar/Tooltip.js');
15
+ var ThemeSectionStatus = require('./theme-section/ThemeSectionStatus.js');
14
16
  require('../helpers/convert.js');
15
17
 
16
18
  const SECTION_LIMIT = 25;
17
19
  const ComponentToolbarPreview = ({ ...props })=>{
20
+ const isThemeSection = props.isThemeSection;
21
+ const editingPageType = ShopContext.useShopStore((s)=>s.pageType);
18
22
  const getParents = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getParents);
19
23
  const root = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getItem('ROOT'));
20
- const isThemeSection = props.isThemeSection;
21
24
  const isThemeSectionEditor = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.isThemeSectionEditor);
22
25
  const [activeAddSection, setActiveAddSection] = react.useState(null);
23
26
  const [isShowParent, setIsShowParent] = react.useState(false);
@@ -272,7 +275,7 @@ const ComponentToolbarPreview = ({ ...props })=>{
272
275
  })
273
276
  ]
274
277
  }, parent.uid)),
275
- /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
278
+ editingPageType !== 'STATIC' && getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
276
279
  ...props
277
280
  }),
278
281
  /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
@@ -315,37 +318,15 @@ const ComponentToolbarPreview = ({ ...props })=>{
315
318
  })
316
319
  ]
317
320
  }),
321
+ editingPageType !== 'STATIC' && getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(ThemeSectionStatus.ThemeSectionStatus, {
322
+ ...props
323
+ }),
318
324
  /*#__PURE__*/ jsxRuntime.jsx("div", {
319
325
  "data-outline": true,
320
326
  "data-outline-section": props.tag == 'Section',
321
327
  "data-outline-theme-section": props.tag == 'Section' && !!isThemeSection || isThemeSectionEditor,
322
328
  "data-outline-limit": getIndexSection() >= SECTION_LIMIT
323
329
  }),
324
- props.tag === 'Section' && isThemeSection && /*#__PURE__*/ jsxRuntime.jsxs("div", {
325
- "data-theme-section-status": true,
326
- children: [
327
- /*#__PURE__*/ jsxRuntime.jsx("div", {
328
- "data-theme-section-status-icon": true,
329
- children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
330
- xmlns: "http://www.w3.org/2000/svg",
331
- width: "16",
332
- height: "16",
333
- viewBox: "0 0 16 16",
334
- fill: "none",
335
- children: /*#__PURE__*/ jsxRuntime.jsx("path", {
336
- fillRule: "evenodd",
337
- clipRule: "evenodd",
338
- d: "M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8.4668 4.61597C8.4668 4.89211 8.24294 5.11597 7.9668 5.11597C7.69065 5.11597 7.4668 4.89211 7.4668 4.61597C7.4668 4.33982 7.69065 4.11597 7.9668 4.11597C8.24294 4.11597 8.4668 4.33982 8.4668 4.61597ZM6.91309 5.48633C6.63694 5.48633 6.41309 5.71019 6.41309 5.98633C6.41309 6.26247 6.63694 6.48633 6.91309 6.48633H7.56006V10.3839C7.56006 10.9362 8.00777 11.3839 8.56006 11.3839H9.57144C9.84758 11.3839 10.0714 11.1601 10.0714 10.8839C10.0714 10.6078 9.84758 10.3839 9.57144 10.3839H8.56006V6.48633C8.56006 5.93404 8.11234 5.48633 7.56006 5.48633H6.91309Z",
339
- fill: "#9144DA"
340
- })
341
- })
342
- }),
343
- /*#__PURE__*/ jsxRuntime.jsx("span", {
344
- "data-theme-section-status-text": true,
345
- children: "Need to republish. Go to global edit to publish it"
346
- })
347
- ]
348
- }),
349
330
  props.tag == 'Section' && !isThemeSectionEditor && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
350
331
  children: [
351
332
  /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
@@ -23,17 +23,8 @@ const CreateThemeSection = ({ ...props })=>{
23
23
  const shopPlan = ShopContext.useShopStore((s)=>s.plan);
24
24
  const createThemeSectionCount = ShopContext.useShopStore((s)=>s.createThemeSectionCount);
25
25
  const isLimit = LIMIT_PLANS.includes(shopPlan ?? '');
26
- const isRenderTooltip = react.useMemo(()=>{
27
- return createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
28
- }, [
29
- createThemeSectionCount
30
- ]);
31
- const isRenderCreateThemeSection = react.useMemo(()=>{
32
- return props.tag === 'Section' && !isThemeSection;
33
- }, [
34
- props.tag,
35
- isThemeSection
36
- ]);
26
+ const isRenderCreateThemeSection = props.tag === 'Section' && !isThemeSection;
27
+ const isRenderTooltip = createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
37
28
  const timeoutRef = react.useRef();
38
29
  const [isShowTooltip, setIsShowTooltip] = react.useState(false);
39
30
  const showTooltip = ()=>{
@@ -0,0 +1,36 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+
5
+ const ThemeSectionStatus = ({ ...props })=>{
6
+ const isRenderThemeSectionStatus = props.tag === 'Section' && props?.isThemeSection && props?.needPublishing;
7
+ return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
8
+ children: isRenderThemeSectionStatus && /*#__PURE__*/ jsxRuntime.jsxs("div", {
9
+ "data-theme-section-status": true,
10
+ children: [
11
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
12
+ "data-theme-section-status-icon": true,
13
+ children: /*#__PURE__*/ jsxRuntime.jsx("svg", {
14
+ xmlns: "http://www.w3.org/2000/svg",
15
+ width: "16",
16
+ height: "16",
17
+ viewBox: "0 0 16 16",
18
+ fill: "none",
19
+ children: /*#__PURE__*/ jsxRuntime.jsx("path", {
20
+ fillRule: "evenodd",
21
+ clipRule: "evenodd",
22
+ d: "M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8.4668 4.61597C8.4668 4.89211 8.24294 5.11597 7.9668 5.11597C7.69065 5.11597 7.4668 4.89211 7.4668 4.61597C7.4668 4.33982 7.69065 4.11597 7.9668 4.11597C8.24294 4.11597 8.4668 4.33982 8.4668 4.61597ZM6.91309 5.48633C6.63694 5.48633 6.41309 5.71019 6.41309 5.98633C6.41309 6.26247 6.63694 6.48633 6.91309 6.48633H7.56006V10.3839C7.56006 10.9362 8.00777 11.3839 8.56006 11.3839H9.57144C9.84758 11.3839 10.0714 11.1601 10.0714 10.8839C10.0714 10.6078 9.84758 10.3839 9.57144 10.3839H8.56006V6.48633C8.56006 5.93404 8.11234 5.48633 7.56006 5.48633H6.91309Z",
23
+ fill: "#9144DA"
24
+ })
25
+ })
26
+ }),
27
+ /*#__PURE__*/ jsxRuntime.jsx("span", {
28
+ "data-theme-section-status-text": true,
29
+ children: "Need to republish. Go to global edit to publish it"
30
+ })
31
+ ]
32
+ })
33
+ });
34
+ };
35
+
36
+ exports.ThemeSectionStatus = ThemeSectionStatus;
@@ -69,7 +69,7 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
69
69
  }),
70
70
  /*#__PURE__*/ jsxRuntime.jsx("div", {
71
71
  className: "theme-section-tooltip__body-desc",
72
- children: "A global section that can be used on all your GemPages & pages."
72
+ children: "A global section that can be used on all your GemPages & Shopify pages."
73
73
  })
74
74
  ]
75
75
  }),
@@ -80,7 +80,7 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
80
80
  children: [
81
81
  /*#__PURE__*/ jsxRuntime.jsx("button", {
82
82
  onClick: (e)=>onActions(e),
83
- children: isLimit ? 'Upgrade to create Theme section' : 'Create theme section'
83
+ children: isLimit ? 'Upgrade to create Theme section' : 'Create Theme section'
84
84
  }),
85
85
  isLimit && /*#__PURE__*/ jsxRuntime.jsx("div", {
86
86
  onClick: openHelpCenter,
@@ -2,20 +2,23 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
2
  import { useState, useCallback, useEffect } from 'react';
3
3
  import 'zustand';
4
4
  import { useBuilderPreviewStore } from '../contexts/BuilderPreviewContext.js';
5
- import 'swr';
5
+ import { useShopStore } from '../contexts/ShopContext.js';
6
6
  import '@gem-sdk/adapter-shopify';
7
+ import 'swr';
7
8
  import 'swr/mutation';
8
9
  import 'vanilla-lazyload';
9
10
  import '../hooks/useCartUI.js';
10
11
  import { CreateThemeSection } from './theme-section/CreateThemeSection.js';
11
12
  import Tooltip from './toolbar/Tooltip.js';
13
+ import { ThemeSectionStatus } from './theme-section/ThemeSectionStatus.js';
12
14
  import '../helpers/convert.js';
13
15
 
14
16
  const SECTION_LIMIT = 25;
15
17
  const ComponentToolbarPreview = ({ ...props })=>{
18
+ const isThemeSection = props.isThemeSection;
19
+ const editingPageType = useShopStore((s)=>s.pageType);
16
20
  const getParents = useBuilderPreviewStore((s)=>s.getParents);
17
21
  const root = useBuilderPreviewStore((s)=>s.getItem('ROOT'));
18
- const isThemeSection = props.isThemeSection;
19
22
  const isThemeSectionEditor = useBuilderPreviewStore((s)=>s.isThemeSectionEditor);
20
23
  const [activeAddSection, setActiveAddSection] = useState(null);
21
24
  const [isShowParent, setIsShowParent] = useState(false);
@@ -270,7 +273,7 @@ const ComponentToolbarPreview = ({ ...props })=>{
270
273
  })
271
274
  ]
272
275
  }, parent.uid)),
273
- /*#__PURE__*/ jsx(CreateThemeSection, {
276
+ editingPageType !== 'STATIC' && getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsx(CreateThemeSection, {
274
277
  ...props
275
278
  }),
276
279
  /*#__PURE__*/ jsx(Tooltip, {
@@ -313,37 +316,15 @@ const ComponentToolbarPreview = ({ ...props })=>{
313
316
  })
314
317
  ]
315
318
  }),
319
+ editingPageType !== 'STATIC' && getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsx(ThemeSectionStatus, {
320
+ ...props
321
+ }),
316
322
  /*#__PURE__*/ jsx("div", {
317
323
  "data-outline": true,
318
324
  "data-outline-section": props.tag == 'Section',
319
325
  "data-outline-theme-section": props.tag == 'Section' && !!isThemeSection || isThemeSectionEditor,
320
326
  "data-outline-limit": getIndexSection() >= SECTION_LIMIT
321
327
  }),
322
- props.tag === 'Section' && isThemeSection && /*#__PURE__*/ jsxs("div", {
323
- "data-theme-section-status": true,
324
- children: [
325
- /*#__PURE__*/ jsx("div", {
326
- "data-theme-section-status-icon": true,
327
- children: /*#__PURE__*/ jsx("svg", {
328
- xmlns: "http://www.w3.org/2000/svg",
329
- width: "16",
330
- height: "16",
331
- viewBox: "0 0 16 16",
332
- fill: "none",
333
- children: /*#__PURE__*/ jsx("path", {
334
- fillRule: "evenodd",
335
- clipRule: "evenodd",
336
- d: "M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8.4668 4.61597C8.4668 4.89211 8.24294 5.11597 7.9668 5.11597C7.69065 5.11597 7.4668 4.89211 7.4668 4.61597C7.4668 4.33982 7.69065 4.11597 7.9668 4.11597C8.24294 4.11597 8.4668 4.33982 8.4668 4.61597ZM6.91309 5.48633C6.63694 5.48633 6.41309 5.71019 6.41309 5.98633C6.41309 6.26247 6.63694 6.48633 6.91309 6.48633H7.56006V10.3839C7.56006 10.9362 8.00777 11.3839 8.56006 11.3839H9.57144C9.84758 11.3839 10.0714 11.1601 10.0714 10.8839C10.0714 10.6078 9.84758 10.3839 9.57144 10.3839H8.56006V6.48633C8.56006 5.93404 8.11234 5.48633 7.56006 5.48633H6.91309Z",
337
- fill: "#9144DA"
338
- })
339
- })
340
- }),
341
- /*#__PURE__*/ jsx("span", {
342
- "data-theme-section-status-text": true,
343
- children: "Need to republish. Go to global edit to publish it"
344
- })
345
- ]
346
- }),
347
328
  props.tag == 'Section' && !isThemeSectionEditor && /*#__PURE__*/ jsxs(Fragment, {
348
329
  children: [
349
330
  /*#__PURE__*/ jsx(Tooltip, {
@@ -1,5 +1,5 @@
1
1
  import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
2
- import { useMemo, useRef, useState } from 'react';
2
+ import { useRef, useState } from 'react';
3
3
  import { ThemeSectionTooltip } from './ThemeSectionTooltip.js';
4
4
  import 'zustand';
5
5
  import { useShopStore } from '../../contexts/ShopContext.js';
@@ -21,17 +21,8 @@ const CreateThemeSection = ({ ...props })=>{
21
21
  const shopPlan = useShopStore((s)=>s.plan);
22
22
  const createThemeSectionCount = useShopStore((s)=>s.createThemeSectionCount);
23
23
  const isLimit = LIMIT_PLANS.includes(shopPlan ?? '');
24
- const isRenderTooltip = useMemo(()=>{
25
- return createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
26
- }, [
27
- createThemeSectionCount
28
- ]);
29
- const isRenderCreateThemeSection = useMemo(()=>{
30
- return props.tag === 'Section' && !isThemeSection;
31
- }, [
32
- props.tag,
33
- isThemeSection
34
- ]);
24
+ const isRenderCreateThemeSection = props.tag === 'Section' && !isThemeSection;
25
+ const isRenderTooltip = createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
35
26
  const timeoutRef = useRef();
36
27
  const [isShowTooltip, setIsShowTooltip] = useState(false);
37
28
  const showTooltip = ()=>{
@@ -0,0 +1,34 @@
1
+ import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
2
+
3
+ const ThemeSectionStatus = ({ ...props })=>{
4
+ const isRenderThemeSectionStatus = props.tag === 'Section' && props?.isThemeSection && props?.needPublishing;
5
+ return /*#__PURE__*/ jsx(Fragment, {
6
+ children: isRenderThemeSectionStatus && /*#__PURE__*/ jsxs("div", {
7
+ "data-theme-section-status": true,
8
+ children: [
9
+ /*#__PURE__*/ jsx("div", {
10
+ "data-theme-section-status-icon": true,
11
+ children: /*#__PURE__*/ jsx("svg", {
12
+ xmlns: "http://www.w3.org/2000/svg",
13
+ width: "16",
14
+ height: "16",
15
+ viewBox: "0 0 16 16",
16
+ fill: "none",
17
+ children: /*#__PURE__*/ jsx("path", {
18
+ fillRule: "evenodd",
19
+ clipRule: "evenodd",
20
+ d: "M15 8C15 11.866 11.866 15 8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8ZM8.4668 4.61597C8.4668 4.89211 8.24294 5.11597 7.9668 5.11597C7.69065 5.11597 7.4668 4.89211 7.4668 4.61597C7.4668 4.33982 7.69065 4.11597 7.9668 4.11597C8.24294 4.11597 8.4668 4.33982 8.4668 4.61597ZM6.91309 5.48633C6.63694 5.48633 6.41309 5.71019 6.41309 5.98633C6.41309 6.26247 6.63694 6.48633 6.91309 6.48633H7.56006V10.3839C7.56006 10.9362 8.00777 11.3839 8.56006 11.3839H9.57144C9.84758 11.3839 10.0714 11.1601 10.0714 10.8839C10.0714 10.6078 9.84758 10.3839 9.57144 10.3839H8.56006V6.48633C8.56006 5.93404 8.11234 5.48633 7.56006 5.48633H6.91309Z",
21
+ fill: "#9144DA"
22
+ })
23
+ })
24
+ }),
25
+ /*#__PURE__*/ jsx("span", {
26
+ "data-theme-section-status-text": true,
27
+ children: "Need to republish. Go to global edit to publish it"
28
+ })
29
+ ]
30
+ })
31
+ });
32
+ };
33
+
34
+ export { ThemeSectionStatus };
@@ -67,7 +67,7 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
67
67
  }),
68
68
  /*#__PURE__*/ jsx("div", {
69
69
  className: "theme-section-tooltip__body-desc",
70
- children: "A global section that can be used on all your GemPages & pages."
70
+ children: "A global section that can be used on all your GemPages & Shopify pages."
71
71
  })
72
72
  ]
73
73
  }),
@@ -78,7 +78,7 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
78
78
  children: [
79
79
  /*#__PURE__*/ jsx("button", {
80
80
  onClick: (e)=>onActions(e),
81
- children: isLimit ? 'Upgrade to create Theme section' : 'Create theme section'
81
+ children: isLimit ? 'Upgrade to create Theme section' : 'Create Theme section'
82
82
  }),
83
83
  isLimit && /*#__PURE__*/ jsx("div", {
84
84
  onClick: openHelpCenter,
@@ -39,6 +39,7 @@ type BlockEntity = {
39
39
  type?: 'component';
40
40
  name?: string;
41
41
  isThemeSection?: boolean;
42
+ needPublishing?: boolean;
42
43
  };
43
44
  type SectionEntity = {
44
45
  uid: string;
@@ -47,6 +48,7 @@ type SectionEntity = {
47
48
  type: 'section';
48
49
  name?: string;
49
50
  isThemeSection?: boolean;
51
+ needPublishing?: boolean;
50
52
  };
51
53
  type BuilderEntity = BlockEntity | SectionEntity;
52
54
  type BuilderEntityNested = Omit<BlockEntity, 'childrens'> & {
@@ -987,7 +989,7 @@ type ControlUI = {
987
989
  };
988
990
  isMoreSetting?: boolean;
989
991
  };
990
- type PageType = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'GP_ARTICLE' | 'GP_BLOG' | 'GP_COLLECTION' | 'GP_INDEX' | 'GP_PRODUCT' | 'GP_STATIC' | 'PRODUCT' | 'STATIC';
992
+ type PageType = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'GP_ARTICLE' | 'GP_BLOG' | 'GP_COLLECTION' | 'GP_INDEX' | 'GP_PRODUCT' | 'GP_STATIC' | 'PRODUCT' | 'STATIC' | 'THEME_SECTION';
991
993
  type ComponentPreset = {
992
994
  id: string;
993
995
  name: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/core",
3
- "version": "1.22.31-new-feature.10",
3
+ "version": "1.22.31-new-feature.13",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -25,7 +25,7 @@
25
25
  },
26
26
  "devDependencies": {
27
27
  "@gem-sdk/adapter-shopify": "1.22.31-staging.0",
28
- "@gem-sdk/styles": "1.22.31-new-feature.9"
28
+ "@gem-sdk/styles": "1.22.31-new-feature.13"
29
29
  },
30
30
  "dependencies": {
31
31
  "react-error-boundary": "4.0.10",