@gem-sdk/core 1.53.0-staging.25 → 1.53.0-staging.28

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 (8) hide show
  1. package/dist/cjs/components/theme-section/CreateThemeSection.js +5 -2
  2. package/dist/cjs/components/theme-section/ThemeSectionTooltip.js +62 -38
  3. package/dist/cjs/contexts/ShopContext.js +5 -0
  4. package/dist/esm/components/theme-section/CreateThemeSection.js +5 -2
  5. package/dist/esm/components/theme-section/ThemeSectionTooltip.js +62 -38
  6. package/dist/esm/contexts/ShopContext.js +5 -0
  7. package/dist/types/index.d.ts +11 -1
  8. package/package.json +2 -2
package/dist/cjs/components/theme-section/CreateThemeSection.js CHANGED
@@ -25,7 +25,9 @@ const LIMIT_PLANS = [
25
25
  const CreateThemeSection = ({ ...props })=>{
26
26
  const shopPlan = ShopContext.useShopStore((s)=>s.plan);
27
27
  const createThemeSectionCount = ShopContext.useShopStore((s)=>s.createThemeSectionCount);
28
- const isLimit = LIMIT_PLANS.includes(shopPlan ?? '');
28
+ const limitCreateThemeSection = ShopContext.useShopStore((s)=>s.limitCreateThemeSection);
29
+ const isFreeLimit = LIMIT_PLANS.includes(shopPlan ?? '');
30
+ const isLimit = isFreeLimit || limitCreateThemeSection?.isLimit;
29
31
  const isRenderTooltip = isLimit || createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
30
32
  const timeoutRef = react.useRef();
31
33
  const [isShowTooltip, setIsShowTooltip] = react.useState(false);
@@ -66,7 +68,8 @@ const CreateThemeSection = ({ ...props })=>{
66
68
  };
67
69
  return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
68
70
  children: /*#__PURE__*/ jsxRuntime.jsxs(ThemeSectionTooltip.ThemeSectionTooltip, {
69
- isLimit: isLimit,
71
+ isFreeLimit: isFreeLimit,
72
+ limitCreateThemeSection: limitCreateThemeSection,
70
73
  isShow: isShowTooltip,
71
74
  isRender: isRenderTooltip,
72
75
  onActions: onActions,
package/dist/cjs/components/theme-section/ThemeSectionTooltip.js CHANGED
@@ -27,9 +27,9 @@ const transitions = {
27
27
  opacity: 0
28
28
  }
29
29
  };
30
- const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter, onMouseLeave, onActions })=>{
30
+ const ThemeSectionTooltip = ({ isShow, isFreeLimit, isRender, children, limitCreateThemeSection, onMouseEnter, onMouseLeave, onActions })=>{
31
31
  const nodeRef = react.useRef(null);
32
- const actionBtnLabel = isLimit ? 'Upgrade to create Theme Section' : 'Create Theme Section';
32
+ const actionBtnLabel = isFreeLimit ? 'Upgrade to create Theme Section' : 'Create Theme Section';
33
33
  const openHelpCenter = ()=>{
34
34
  const url = 'https://help.gempages.net/articles/theme-section';
35
35
  window.open(url, '_blank');
@@ -46,52 +46,76 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
46
46
  timeout: TRANSITION_DURATION,
47
47
  nodeRef: nodeRef,
48
48
  unmountOnExit: true,
49
- children: (state)=>/*#__PURE__*/ jsxRuntime.jsxs("div", {
49
+ children: (state)=>/*#__PURE__*/ jsxRuntime.jsx("div", {
50
50
  className: "theme-section-tooltip",
51
51
  ref: nodeRef,
52
52
  style: {
53
53
  ...defaultStyles,
54
54
  ...transitions[state]
55
55
  },
56
- children: [
57
- /*#__PURE__*/ jsxRuntime.jsx("div", {
58
- className: "theme-section-tooltip__image",
59
- children: /*#__PURE__*/ jsxRuntime.jsx("img", {
60
- src: "https://ucarecdn.com/6a9f408a-aa8c-434a-890b-81067a14aceb/-/format/auto/-/preview/1920x1920/-/quality/lighter/theme-section-illustration.png",
61
- alt: ""
56
+ children: limitCreateThemeSection?.isLimit && !isFreeLimit ? /*#__PURE__*/ jsxRuntime.jsxs("div", {
57
+ className: "theme-section-tooltip__body theme-section-tooltip__body-limit",
58
+ children: [
59
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
60
+ className: "theme-section-tooltip__body-title theme-section-tooltip__body-limit__title",
61
+ children: "Upgrade plan"
62
+ }),
63
+ /*#__PURE__*/ jsxRuntime.jsxs("div", {
64
+ className: "theme-section-tooltip__body-desc theme-section-tooltip__body-limit__desc",
65
+ children: [
66
+ "You’ve reached the maximum number of theme sections on your plan (",
67
+ limitCreateThemeSection.total,
68
+ "/",
69
+ limitCreateThemeSection.limit,
70
+ ")"
71
+ ]
72
+ }),
73
+ /*#__PURE__*/ jsxRuntime.jsx("button", {
74
+ onClick: (e)=>onActions(e),
75
+ children: "Upgrade plan to create more"
62
76
  })
63
- }),
64
- /*#__PURE__*/ jsxRuntime.jsxs("div", {
65
- className: "theme-section-tooltip__body",
66
- children: [
67
- /*#__PURE__*/ jsxRuntime.jsx("div", {
68
- className: "theme-section-tooltip__body-title",
69
- children: "Create once, use everywhere with Theme Section"
70
- }),
71
- /*#__PURE__*/ jsxRuntime.jsx("div", {
72
- className: "theme-section-tooltip__body-desc",
73
- children: "A global section that can be used on all your GemPages & Shopify pages."
77
+ ]
78
+ }) : /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
79
+ children: [
80
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
81
+ className: "theme-section-tooltip__image",
82
+ children: /*#__PURE__*/ jsxRuntime.jsx("img", {
83
+ src: "https://ucarecdn.com/6a9f408a-aa8c-434a-890b-81067a14aceb/-/format/auto/-/preview/1920x1920/-/quality/lighter/theme-section-illustration.png",
84
+ alt: ""
74
85
  })
75
- ]
76
- }),
77
- /*#__PURE__*/ jsxRuntime.jsxs("div", {
78
- className: core.cls('theme-section-tooltip__action', {
79
- 'theme-section-tooltip__action-limit': isLimit
80
86
  }),
81
- children: [
82
- /*#__PURE__*/ jsxRuntime.jsx("button", {
83
- onClick: (e)=>onActions(e),
84
- children: actionBtnLabel
87
+ /*#__PURE__*/ jsxRuntime.jsxs("div", {
88
+ className: "theme-section-tooltip__body",
89
+ children: [
90
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
91
+ className: "theme-section-tooltip__body-title",
92
+ children: "Create once, use everywhere with Theme Section"
93
+ }),
94
+ /*#__PURE__*/ jsxRuntime.jsx("div", {
95
+ className: "theme-section-tooltip__body-desc",
96
+ children: "A global section that can be used on all your GemPages & Shopify pages."
97
+ })
98
+ ]
99
+ }),
100
+ /*#__PURE__*/ jsxRuntime.jsxs("div", {
101
+ className: core.cls('theme-section-tooltip__action', {
102
+ 'theme-section-tooltip__action-limit': isFreeLimit
85
103
  }),
86
- isLimit && /*#__PURE__*/ jsxRuntime.jsx("div", {
87
- onClick: openHelpCenter,
88
- "aria-hidden": true,
89
- className: "theme-section-tooltip__action-learn-more",
90
- children: "Learn more about Theme Section"
91
- })
92
- ]
93
- })
94
- ]
104
+ children: [
105
+ /*#__PURE__*/ jsxRuntime.jsx("button", {
106
+ onClick: (e)=>onActions(e),
107
+ children: actionBtnLabel
108
+ }),
109
+ isFreeLimit && /*#__PURE__*/ jsxRuntime.jsx("div", {
110
+ onClick: openHelpCenter,
111
+ "aria-hidden": true,
112
+ className: "theme-section-tooltip__action-learn-more",
113
+ children: "Learn more about Theme Section"
114
+ })
115
+ ]
116
+ })
117
+ ]
118
+ })
95
119
  })
96
120
  })
97
121
  ]
package/dist/cjs/contexts/ShopContext.js CHANGED
@@ -47,6 +47,11 @@ const createShopStoreProvider = (data)=>zustand.createStore((set)=>({
47
47
  set({
48
48
  plan
49
49
  });
50
+ },
51
+ changeLimitCreateThemeSection: (data)=>{
52
+ set({
53
+ limitCreateThemeSection: data
54
+ });
50
55
  }
51
56
  }));
52
57
  const ShopProvider = ({ children, addons, storeOption, queryOption, ...passProps })=>{
package/dist/esm/components/theme-section/CreateThemeSection.js CHANGED
@@ -23,7 +23,9 @@ const LIMIT_PLANS = [
23
23
  const CreateThemeSection = ({ ...props })=>{
24
24
  const shopPlan = useShopStore((s)=>s.plan);
25
25
  const createThemeSectionCount = useShopStore((s)=>s.createThemeSectionCount);
26
- const isLimit = LIMIT_PLANS.includes(shopPlan ?? '');
26
+ const limitCreateThemeSection = useShopStore((s)=>s.limitCreateThemeSection);
27
+ const isFreeLimit = LIMIT_PLANS.includes(shopPlan ?? '');
28
+ const isLimit = isFreeLimit || limitCreateThemeSection?.isLimit;
27
29
  const isRenderTooltip = isLimit || createThemeSectionCount === undefined || createThemeSectionCount < NUMBER_OF_THEME_SECTION_CREATED_TO_SHOW_TOOLTIP;
28
30
  const timeoutRef = useRef();
29
31
  const [isShowTooltip, setIsShowTooltip] = useState(false);
@@ -64,7 +66,8 @@ const CreateThemeSection = ({ ...props })=>{
64
66
  };
65
67
  return /*#__PURE__*/ jsx(Fragment, {
66
68
  children: /*#__PURE__*/ jsxs(ThemeSectionTooltip, {
67
- isLimit: isLimit,
69
+ isFreeLimit: isFreeLimit,
70
+ limitCreateThemeSection: limitCreateThemeSection,
68
71
  isShow: isShowTooltip,
69
72
  isRender: isRenderTooltip,
70
73
  onActions: onActions,
package/dist/esm/components/theme-section/ThemeSectionTooltip.js CHANGED
@@ -25,9 +25,9 @@ const transitions = {
25
25
  opacity: 0
26
26
  }
27
27
  };
28
- const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter, onMouseLeave, onActions })=>{
28
+ const ThemeSectionTooltip = ({ isShow, isFreeLimit, isRender, children, limitCreateThemeSection, onMouseEnter, onMouseLeave, onActions })=>{
29
29
  const nodeRef = useRef(null);
30
- const actionBtnLabel = isLimit ? 'Upgrade to create Theme Section' : 'Create Theme Section';
30
+ const actionBtnLabel = isFreeLimit ? 'Upgrade to create Theme Section' : 'Create Theme Section';
31
31
  const openHelpCenter = ()=>{
32
32
  const url = 'https://help.gempages.net/articles/theme-section';
33
33
  window.open(url, '_blank');
@@ -44,52 +44,76 @@ const ThemeSectionTooltip = ({ isShow, isLimit, isRender, children, onMouseEnter
44
44
  timeout: TRANSITION_DURATION,
45
45
  nodeRef: nodeRef,
46
46
  unmountOnExit: true,
47
- children: (state)=>/*#__PURE__*/ jsxs("div", {
47
+ children: (state)=>/*#__PURE__*/ jsx("div", {
48
48
  className: "theme-section-tooltip",
49
49
  ref: nodeRef,
50
50
  style: {
51
51
  ...defaultStyles,
52
52
  ...transitions[state]
53
53
  },
54
- children: [
55
- /*#__PURE__*/ jsx("div", {
56
- className: "theme-section-tooltip__image",
57
- children: /*#__PURE__*/ jsx("img", {
58
- src: "https://ucarecdn.com/6a9f408a-aa8c-434a-890b-81067a14aceb/-/format/auto/-/preview/1920x1920/-/quality/lighter/theme-section-illustration.png",
59
- alt: ""
54
+ children: limitCreateThemeSection?.isLimit && !isFreeLimit ? /*#__PURE__*/ jsxs("div", {
55
+ className: "theme-section-tooltip__body theme-section-tooltip__body-limit",
56
+ children: [
57
+ /*#__PURE__*/ jsx("div", {
58
+ className: "theme-section-tooltip__body-title theme-section-tooltip__body-limit__title",
59
+ children: "Upgrade plan"
60
+ }),
61
+ /*#__PURE__*/ jsxs("div", {
62
+ className: "theme-section-tooltip__body-desc theme-section-tooltip__body-limit__desc",
63
+ children: [
64
+ "You’ve reached the maximum number of theme sections on your plan (",
65
+ limitCreateThemeSection.total,
66
+ "/",
67
+ limitCreateThemeSection.limit,
68
+ ")"
69
+ ]
70
+ }),
71
+ /*#__PURE__*/ jsx("button", {
72
+ onClick: (e)=>onActions(e),
73
+ children: "Upgrade plan to create more"
60
74
  })
61
- }),
62
- /*#__PURE__*/ jsxs("div", {
63
- className: "theme-section-tooltip__body",
64
- children: [
65
- /*#__PURE__*/ jsx("div", {
66
- className: "theme-section-tooltip__body-title",
67
- children: "Create once, use everywhere with Theme Section"
68
- }),
69
- /*#__PURE__*/ jsx("div", {
70
- className: "theme-section-tooltip__body-desc",
71
- children: "A global section that can be used on all your GemPages & Shopify pages."
75
+ ]
76
+ }) : /*#__PURE__*/ jsxs(Fragment, {
77
+ children: [
78
+ /*#__PURE__*/ jsx("div", {
79
+ className: "theme-section-tooltip__image",
80
+ children: /*#__PURE__*/ jsx("img", {
81
+ src: "https://ucarecdn.com/6a9f408a-aa8c-434a-890b-81067a14aceb/-/format/auto/-/preview/1920x1920/-/quality/lighter/theme-section-illustration.png",
82
+ alt: ""
72
83
  })
73
- ]
74
- }),
75
- /*#__PURE__*/ jsxs("div", {
76
- className: cls('theme-section-tooltip__action', {
77
- 'theme-section-tooltip__action-limit': isLimit
78
84
  }),
79
- children: [
80
- /*#__PURE__*/ jsx("button", {
81
- onClick: (e)=>onActions(e),
82
- children: actionBtnLabel
85
+ /*#__PURE__*/ jsxs("div", {
86
+ className: "theme-section-tooltip__body",
87
+ children: [
88
+ /*#__PURE__*/ jsx("div", {
89
+ className: "theme-section-tooltip__body-title",
90
+ children: "Create once, use everywhere with Theme Section"
91
+ }),
92
+ /*#__PURE__*/ jsx("div", {
93
+ className: "theme-section-tooltip__body-desc",
94
+ children: "A global section that can be used on all your GemPages & Shopify pages."
95
+ })
96
+ ]
97
+ }),
98
+ /*#__PURE__*/ jsxs("div", {
99
+ className: cls('theme-section-tooltip__action', {
100
+ 'theme-section-tooltip__action-limit': isFreeLimit
83
101
  }),
84
- isLimit && /*#__PURE__*/ jsx("div", {
85
- onClick: openHelpCenter,
86
- "aria-hidden": true,
87
- className: "theme-section-tooltip__action-learn-more",
88
- children: "Learn more about Theme Section"
89
- })
90
- ]
91
- })
92
- ]
102
+ children: [
103
+ /*#__PURE__*/ jsx("button", {
104
+ onClick: (e)=>onActions(e),
105
+ children: actionBtnLabel
106
+ }),
107
+ isFreeLimit && /*#__PURE__*/ jsx("div", {
108
+ onClick: openHelpCenter,
109
+ "aria-hidden": true,
110
+ className: "theme-section-tooltip__action-learn-more",
111
+ children: "Learn more about Theme Section"
112
+ })
113
+ ]
114
+ })
115
+ ]
116
+ })
93
117
  })
94
118
  })
95
119
  ]
package/dist/esm/contexts/ShopContext.js CHANGED
@@ -45,6 +45,11 @@ const createShopStoreProvider = (data)=>createStore((set)=>({
45
45
  set({
46
46
  plan
47
47
  });
48
+ },
49
+ changeLimitCreateThemeSection: (data)=>{
50
+ set({
51
+ limitCreateThemeSection: data
52
+ });
48
53
  }
49
54
  }));
50
55
  const ShopProvider = ({ children, addons, storeOption, queryOption, ...passProps })=>{
package/dist/types/index.d.ts CHANGED
@@ -31178,6 +31178,11 @@ type ShopContextProps = {
31178
31178
  maxGenerateCount?: number;
31179
31179
  nextQuota?: number;
31180
31180
  };
31181
+ limitCreateThemeSection?: {
31182
+ isLimit?: boolean;
31183
+ total?: number;
31184
+ limit?: number;
31185
+ };
31181
31186
  changeLocale: (locale: string) => void;
31182
31187
  changeStorefrontInfo: (args: {
31183
31188
  url?: string;
@@ -31188,12 +31193,17 @@ type ShopContextProps = {
31188
31193
  changeLayoutSettings: (layoutSettings: LayoutSettings) => void;
31189
31194
  changeCreateThemeSectionCount: (count: number) => void;
31190
31195
  changeShopPlan: (plan: string) => void;
31196
+ changeLimitCreateThemeSection: (data: {
31197
+ isLimit?: boolean;
31198
+ total?: number;
31199
+ limit?: number;
31200
+ }) => void;
31191
31201
  };
31192
31202
  type ShopProviderProps = {
31193
31203
  children: React.ReactNode;
31194
31204
  key?: React.Key;
31195
31205
  addons: AddonContextProps['components'];
31196
- storeOption: Omit<ShopContextProps, 'changeLocale' | 'changeStorefrontInfo' | 'changeCurrency' | 'changeSwatches' | 'changeLayoutSettings' | 'changeCreateThemeSectionCount' | 'changeShopPlan'>;
31206
+ storeOption: Omit<ShopContextProps, 'changeLocale' | 'changeStorefrontInfo' | 'changeCurrency' | 'changeSwatches' | 'changeLayoutSettings' | 'changeCreateThemeSectionCount' | 'changeShopPlan' | 'changeLimitCreateThemeSection'>;
31197
31207
  queryOption?: React.ComponentProps<typeof SWRConfig>['value'];
31198
31208
  };
31199
31209
  declare const ShopProvider: React.FC<ShopProviderProps>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/core",
3
- "version": "1.53.0-staging.25",
3
+ "version": "1.53.0-staging.28",
4
4
  "license": "MIT",
5
5
  "sideEffects": false,
6
6
  "main": "dist/cjs/index.js",
@@ -28,7 +28,7 @@
28
28
  },
29
29
  "devDependencies": {
30
30
  "@gem-sdk/adapter-shopify": "1.53.0-staging.0",
31
- "@gem-sdk/styles": "1.53.0-staging.0",
31
+ "@gem-sdk/styles": "1.53.0-staging.28",
32
32
  "@types/classnames": "^2.3.1"
33
33
  },
34
34
  "dependencies": {