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

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 (10) hide show
  1. package/dist/cjs/components/ComponentToolbarPreview.js +6 -27
  2. package/dist/cjs/components/theme-section/CreateThemeSection.js +2 -11
  3. package/dist/cjs/components/theme-section/ThemeSectionStatus.js +36 -0
  4. package/dist/cjs/components/theme-section/ThemeSectionTooltip.js +2 -2
  5. package/dist/esm/components/ComponentToolbarPreview.js +6 -27
  6. package/dist/esm/components/theme-section/CreateThemeSection.js +3 -12
  7. package/dist/esm/components/theme-section/ThemeSectionStatus.js +34 -0
  8. package/dist/esm/components/theme-section/ThemeSectionTooltip.js +2 -2
  9. package/dist/types/index.d.ts +2 -0
  10. package/package.json +2 -2
package/dist/cjs/components/ComponentToolbarPreview.js CHANGED
@@ -11,13 +11,14 @@ require('vanilla-lazyload');
11
11
  require('../hooks/useCartUI.js');
12
12
  var CreateThemeSection = require('./theme-section/CreateThemeSection.js');
13
13
  var Tooltip = require('./toolbar/Tooltip.js');
14
+ var ThemeSectionStatus = require('./theme-section/ThemeSectionStatus.js');
14
15
  require('../helpers/convert.js');
15
16
 
16
17
  const SECTION_LIMIT = 25;
17
18
  const ComponentToolbarPreview = ({ ...props })=>{
19
+ const isThemeSection = props.isThemeSection;
18
20
  const getParents = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getParents);
19
21
  const root = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.getItem('ROOT'));
20
- const isThemeSection = props.isThemeSection;
21
22
  const isThemeSectionEditor = BuilderPreviewContext.useBuilderPreviewStore((s)=>s.isThemeSectionEditor);
22
23
  const [activeAddSection, setActiveAddSection] = react.useState(null);
23
24
  const [isShowParent, setIsShowParent] = react.useState(false);
@@ -272,7 +273,7 @@ const ComponentToolbarPreview = ({ ...props })=>{
272
273
  })
273
274
  ]
274
275
  }, parent.uid)),
275
- /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
276
+ getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
276
277
  ...props
277
278
  }),
278
279
  /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
@@ -315,37 +316,15 @@ const ComponentToolbarPreview = ({ ...props })=>{
315
316
  })
316
317
  ]
317
318
  }),
319
+ getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(ThemeSectionStatus.ThemeSectionStatus, {
320
+ ...props
321
+ }),
318
322
  /*#__PURE__*/ jsxRuntime.jsx("div", {
319
323
  "data-outline": true,
320
324
  "data-outline-section": props.tag == 'Section',
321
325
  "data-outline-theme-section": props.tag == 'Section' && !!isThemeSection || isThemeSectionEditor,
322
326
  "data-outline-limit": getIndexSection() >= SECTION_LIMIT
323
327
  }),
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
328
  props.tag == 'Section' && !isThemeSectionEditor && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
350
329
  children: [
351
330
  /*#__PURE__*/ jsxRuntime.jsx(Tooltip.default, {
package/dist/cjs/components/theme-section/CreateThemeSection.js CHANGED
@@ -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 = ()=>{
package/dist/cjs/components/theme-section/ThemeSectionStatus.js ADDED
@@ -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;
package/dist/cjs/components/theme-section/ThemeSectionTooltip.js CHANGED
@@ -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,
package/dist/esm/components/ComponentToolbarPreview.js CHANGED
@@ -9,13 +9,14 @@ import 'vanilla-lazyload';
9
9
  import '../hooks/useCartUI.js';
10
10
  import { CreateThemeSection } from './theme-section/CreateThemeSection.js';
11
11
  import Tooltip from './toolbar/Tooltip.js';
12
+ import { ThemeSectionStatus } from './theme-section/ThemeSectionStatus.js';
12
13
  import '../helpers/convert.js';
13
14
 
14
15
  const SECTION_LIMIT = 25;
15
16
  const ComponentToolbarPreview = ({ ...props })=>{
17
+ const isThemeSection = props.isThemeSection;
16
18
  const getParents = useBuilderPreviewStore((s)=>s.getParents);
17
19
  const root = useBuilderPreviewStore((s)=>s.getItem('ROOT'));
18
- const isThemeSection = props.isThemeSection;
19
20
  const isThemeSectionEditor = useBuilderPreviewStore((s)=>s.isThemeSectionEditor);
20
21
  const [activeAddSection, setActiveAddSection] = useState(null);
21
22
  const [isShowParent, setIsShowParent] = useState(false);
@@ -270,7 +271,7 @@ const ComponentToolbarPreview = ({ ...props })=>{
270
271
  })
271
272
  ]
272
273
  }, parent.uid)),
273
- /*#__PURE__*/ jsx(CreateThemeSection, {
274
+ getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsx(CreateThemeSection, {
274
275
  ...props
275
276
  }),
276
277
  /*#__PURE__*/ jsx(Tooltip, {
@@ -313,37 +314,15 @@ const ComponentToolbarPreview = ({ ...props })=>{
313
314
  })
314
315
  ]
315
316
  }),
317
+ getSectionNumber() <= SECTION_LIMIT && /*#__PURE__*/ jsx(ThemeSectionStatus, {
318
+ ...props
319
+ }),
316
320
  /*#__PURE__*/ jsx("div", {
317
321
  "data-outline": true,
318
322
  "data-outline-section": props.tag == 'Section',
319
323
  "data-outline-theme-section": props.tag == 'Section' && !!isThemeSection || isThemeSectionEditor,
320
324
  "data-outline-limit": getIndexSection() >= SECTION_LIMIT
321
325
  }),
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
326
  props.tag == 'Section' && !isThemeSectionEditor && /*#__PURE__*/ jsxs(Fragment, {
348
327
  children: [
349
328
  /*#__PURE__*/ jsx(Tooltip, {
package/dist/esm/components/theme-section/CreateThemeSection.js CHANGED
@@ -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 = ()=>{
package/dist/esm/components/theme-section/ThemeSectionStatus.js ADDED
@@ -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 };
package/dist/esm/components/theme-section/ThemeSectionTooltip.js CHANGED
@@ -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,
package/dist/types/index.d.ts CHANGED
@@ -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'> & {
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.11",
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.11"
29
29
  },
30
30
  "dependencies": {
31
31
  "react-error-boundary": "4.0.10",