@gem-sdk/pages 2.1.42 → 2.2.0-staging.39
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.
- package/dist/cjs/components/image-to-layout/DropElement.js +27 -8
- package/dist/cjs/libs/api/get-static-page-props-v2.js +7 -6
- package/dist/cjs/libs/helpers/gen-favicon.js +22 -0
- package/dist/esm/components/image-to-layout/DropElement.js +27 -8
- package/dist/esm/libs/api/get-static-page-props-v2.js +7 -6
- package/dist/esm/libs/helpers/gen-favicon.js +20 -0
- package/package.json +5 -5
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var core = require('@gem-sdk/core');
|
|
4
5
|
|
|
5
6
|
const DropElement = ()=>{
|
|
7
|
+
const editingPageType = core.useShopStore((s)=>s.pageType);
|
|
6
8
|
const dispatchEventBuildWithSectionActiveTab = (value)=>{
|
|
7
9
|
const event = new CustomEvent('editor:sidebar:build-with-section-active-tab', {
|
|
8
10
|
bubbles: true,
|
|
@@ -12,6 +14,15 @@ const DropElement = ()=>{
|
|
|
12
14
|
});
|
|
13
15
|
window.dispatchEvent(event);
|
|
14
16
|
};
|
|
17
|
+
const dispatchEventBuildWithTemplateActiveTab = (value)=>{
|
|
18
|
+
const event = new CustomEvent('editor:sidebar:build-with-template-active-tab', {
|
|
19
|
+
bubbles: true,
|
|
20
|
+
detail: {
|
|
21
|
+
value
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
window.dispatchEvent(event);
|
|
25
|
+
};
|
|
15
26
|
const handleClickGenerate = (e)=>{
|
|
16
27
|
const event = new CustomEvent('editor:sidebar:click-img-to-layout-gallery-btn', e);
|
|
17
28
|
window.dispatchEvent(event);
|
|
@@ -100,22 +111,30 @@ const DropElement = ()=>{
|
|
|
100
111
|
children: [
|
|
101
112
|
/*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
102
113
|
className: "gp-text-16 gp-font-medium gp-mb-4 gp-text-[#212121]",
|
|
103
|
-
children:
|
|
114
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Start building with Sections/Elements or' : 'Start with Sections from sidebar'
|
|
104
115
|
}),
|
|
105
116
|
/*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
106
|
-
className: "gp-flex gp-
|
|
117
|
+
className: "gp-flex gp-gap-3 gp-justify-between",
|
|
107
118
|
children: [
|
|
108
119
|
/*#__PURE__*/ jsxRuntime.jsx("button", {
|
|
109
120
|
"data-button-add-section": true,
|
|
110
|
-
onClick: ()=>
|
|
111
|
-
|
|
112
|
-
|
|
121
|
+
onClick: ()=>{
|
|
122
|
+
if (editingPageType === 'GP_FUNNEL_PAGE') {
|
|
123
|
+
dispatchEventBuildWithTemplateActiveTab('funnelExisting');
|
|
124
|
+
} else dispatchEventBuildWithSectionActiveTab(true);
|
|
125
|
+
},
|
|
126
|
+
className: "gp-flex gp-h-[40px] gp-px-6 gp-items-center gp-font-medium gp-justify-center gp-rounded-[8px] gp-bg-[#1C1C1C] gp-text-[14px] gp-text-white hover:gp-bg-[#3B3B3B]",
|
|
127
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Use existing page designs' : 'Add sections'
|
|
113
128
|
}),
|
|
114
129
|
/*#__PURE__*/ jsxRuntime.jsx("button", {
|
|
115
130
|
"data-button-add-elements": true,
|
|
116
|
-
onClick: ()=>
|
|
117
|
-
|
|
118
|
-
|
|
131
|
+
onClick: ()=>{
|
|
132
|
+
if (editingPageType === 'GP_FUNNEL_PAGE') {
|
|
133
|
+
dispatchEventBuildWithTemplateActiveTab('templates');
|
|
134
|
+
} else dispatchEventBuildWithSectionActiveTab(false);
|
|
135
|
+
},
|
|
136
|
+
className: "gp-flex gp-h-[40px] gp-px-6 gp-items-center gp-font-medium gp-justify-center gp-rounded-[8px] gp-bg-[#f4f4f4] gp-text-[14px] gp-text-[#212121] hover:gp-bg-[#E2E2E2]",
|
|
137
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Explore templates' : 'Add elements'
|
|
119
138
|
})
|
|
120
139
|
]
|
|
121
140
|
}),
|
|
@@ -10,6 +10,7 @@ var normalize = require('../helpers/normalize.js');
|
|
|
10
10
|
var parseJson = require('../helpers/parse-json.js');
|
|
11
11
|
var nextjs = require('@sentry/nextjs');
|
|
12
12
|
var customFonts = require('../custom-fonts.js');
|
|
13
|
+
var genFavicon = require('../helpers/gen-favicon.js');
|
|
13
14
|
|
|
14
15
|
const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
15
16
|
try {
|
|
@@ -60,7 +61,7 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
60
61
|
const thumbnail = parseJson.parseJson(dataBuilder?.themePageDataSEO?.find((item)=>item?.key === 'global-meta-thumbnail')?.value);
|
|
61
62
|
const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
|
|
62
63
|
const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
|
|
63
|
-
const favicon = shopData?.storeProperty?.favicon ?? '
|
|
64
|
+
const favicon = shopData?.storeProperty?.favicon ?? '';
|
|
64
65
|
const seo = {
|
|
65
66
|
defaultTitle: shopMeta?.shop.name,
|
|
66
67
|
title: dataBuilder?.name,
|
|
@@ -85,17 +86,17 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
85
86
|
{
|
|
86
87
|
rel: 'icon',
|
|
87
88
|
sizes: '32x32',
|
|
88
|
-
href:
|
|
89
|
+
href: genFavicon.genResizeFaviconUrl(favicon, 32)
|
|
89
90
|
},
|
|
90
91
|
{
|
|
91
92
|
rel: 'icon',
|
|
92
93
|
sizes: '16x16',
|
|
93
|
-
href:
|
|
94
|
+
href: genFavicon.genResizeFaviconUrl(favicon, 16)
|
|
94
95
|
},
|
|
95
96
|
{
|
|
96
97
|
rel: 'apple-touch-icon',
|
|
97
98
|
sizes: '180x180',
|
|
98
|
-
href:
|
|
99
|
+
href: genFavicon.genResizeFaviconUrl(favicon, 180)
|
|
99
100
|
},
|
|
100
101
|
{
|
|
101
102
|
rel: 'manifest',
|
|
@@ -110,13 +111,13 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
110
111
|
description: shopMeta?.shop.description,
|
|
111
112
|
icons: [
|
|
112
113
|
{
|
|
113
|
-
src:
|
|
114
|
+
src: genFavicon.genResizeFaviconUrl(favicon, 192),
|
|
114
115
|
sizes: '192x192',
|
|
115
116
|
type: 'image/png',
|
|
116
117
|
purpose: 'any maskable'
|
|
117
118
|
},
|
|
118
119
|
{
|
|
119
|
-
src:
|
|
120
|
+
src: genFavicon.genResizeFaviconUrl(favicon, 512),
|
|
120
121
|
sizes: '512x512',
|
|
121
122
|
type: 'image/png'
|
|
122
123
|
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
const genResizeFaviconUrl = (faviconUrl, size)=>{
|
|
4
|
+
if (!faviconUrl) {
|
|
5
|
+
return '/favicon/favicon-32x32.png';
|
|
6
|
+
}
|
|
7
|
+
const urlParts = faviconUrl.split('.');
|
|
8
|
+
const extension = urlParts.pop();
|
|
9
|
+
if ([
|
|
10
|
+
'jpg',
|
|
11
|
+
'jpeg',
|
|
12
|
+
'png',
|
|
13
|
+
'gif',
|
|
14
|
+
'webp',
|
|
15
|
+
'ico'
|
|
16
|
+
].includes(extension?.toLocaleLowerCase())) {
|
|
17
|
+
return `${urlParts.join('.')}_x${size}.${extension}`;
|
|
18
|
+
}
|
|
19
|
+
return faviconUrl;
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
exports.genResizeFaviconUrl = genResizeFaviconUrl;
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import { useShopStore } from '@gem-sdk/core';
|
|
2
3
|
|
|
3
4
|
const DropElement = ()=>{
|
|
5
|
+
const editingPageType = useShopStore((s)=>s.pageType);
|
|
4
6
|
const dispatchEventBuildWithSectionActiveTab = (value)=>{
|
|
5
7
|
const event = new CustomEvent('editor:sidebar:build-with-section-active-tab', {
|
|
6
8
|
bubbles: true,
|
|
@@ -10,6 +12,15 @@ const DropElement = ()=>{
|
|
|
10
12
|
});
|
|
11
13
|
window.dispatchEvent(event);
|
|
12
14
|
};
|
|
15
|
+
const dispatchEventBuildWithTemplateActiveTab = (value)=>{
|
|
16
|
+
const event = new CustomEvent('editor:sidebar:build-with-template-active-tab', {
|
|
17
|
+
bubbles: true,
|
|
18
|
+
detail: {
|
|
19
|
+
value
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
window.dispatchEvent(event);
|
|
23
|
+
};
|
|
13
24
|
const handleClickGenerate = (e)=>{
|
|
14
25
|
const event = new CustomEvent('editor:sidebar:click-img-to-layout-gallery-btn', e);
|
|
15
26
|
window.dispatchEvent(event);
|
|
@@ -98,22 +109,30 @@ const DropElement = ()=>{
|
|
|
98
109
|
children: [
|
|
99
110
|
/*#__PURE__*/ jsx("div", {
|
|
100
111
|
className: "gp-text-16 gp-font-medium gp-mb-4 gp-text-[#212121]",
|
|
101
|
-
children:
|
|
112
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Start building with Sections/Elements or' : 'Start with Sections from sidebar'
|
|
102
113
|
}),
|
|
103
114
|
/*#__PURE__*/ jsxs("div", {
|
|
104
|
-
className: "gp-flex gp-
|
|
115
|
+
className: "gp-flex gp-gap-3 gp-justify-between",
|
|
105
116
|
children: [
|
|
106
117
|
/*#__PURE__*/ jsx("button", {
|
|
107
118
|
"data-button-add-section": true,
|
|
108
|
-
onClick: ()=>
|
|
109
|
-
|
|
110
|
-
|
|
119
|
+
onClick: ()=>{
|
|
120
|
+
if (editingPageType === 'GP_FUNNEL_PAGE') {
|
|
121
|
+
dispatchEventBuildWithTemplateActiveTab('funnelExisting');
|
|
122
|
+
} else dispatchEventBuildWithSectionActiveTab(true);
|
|
123
|
+
},
|
|
124
|
+
className: "gp-flex gp-h-[40px] gp-px-6 gp-items-center gp-font-medium gp-justify-center gp-rounded-[8px] gp-bg-[#1C1C1C] gp-text-[14px] gp-text-white hover:gp-bg-[#3B3B3B]",
|
|
125
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Use existing page designs' : 'Add sections'
|
|
111
126
|
}),
|
|
112
127
|
/*#__PURE__*/ jsx("button", {
|
|
113
128
|
"data-button-add-elements": true,
|
|
114
|
-
onClick: ()=>
|
|
115
|
-
|
|
116
|
-
|
|
129
|
+
onClick: ()=>{
|
|
130
|
+
if (editingPageType === 'GP_FUNNEL_PAGE') {
|
|
131
|
+
dispatchEventBuildWithTemplateActiveTab('templates');
|
|
132
|
+
} else dispatchEventBuildWithSectionActiveTab(false);
|
|
133
|
+
},
|
|
134
|
+
className: "gp-flex gp-h-[40px] gp-px-6 gp-items-center gp-font-medium gp-justify-center gp-rounded-[8px] gp-bg-[#f4f4f4] gp-text-[14px] gp-text-[#212121] hover:gp-bg-[#E2E2E2]",
|
|
135
|
+
children: editingPageType === 'GP_FUNNEL_PAGE' ? 'Explore templates' : 'Add elements'
|
|
117
136
|
})
|
|
118
137
|
]
|
|
119
138
|
}),
|
|
@@ -8,6 +8,7 @@ import { parseBuilderTemplateV2 } from '../helpers/normalize.js';
|
|
|
8
8
|
import { parseJson, serializableJson } from '../helpers/parse-json.js';
|
|
9
9
|
import { captureException } from '@sentry/nextjs';
|
|
10
10
|
import { getCustomFonts } from '../custom-fonts.js';
|
|
11
|
+
import { genResizeFaviconUrl } from '../helpers/gen-favicon.js';
|
|
11
12
|
|
|
12
13
|
const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
13
14
|
try {
|
|
@@ -58,7 +59,7 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
58
59
|
const thumbnail = parseJson(dataBuilder?.themePageDataSEO?.find((item)=>item?.key === 'global-meta-thumbnail')?.value);
|
|
59
60
|
const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
|
|
60
61
|
const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
|
|
61
|
-
const favicon = shopData?.storeProperty?.favicon ?? '
|
|
62
|
+
const favicon = shopData?.storeProperty?.favicon ?? '';
|
|
62
63
|
const seo = {
|
|
63
64
|
defaultTitle: shopMeta?.shop.name,
|
|
64
65
|
title: dataBuilder?.name,
|
|
@@ -83,17 +84,17 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
83
84
|
{
|
|
84
85
|
rel: 'icon',
|
|
85
86
|
sizes: '32x32',
|
|
86
|
-
href:
|
|
87
|
+
href: genResizeFaviconUrl(favicon, 32)
|
|
87
88
|
},
|
|
88
89
|
{
|
|
89
90
|
rel: 'icon',
|
|
90
91
|
sizes: '16x16',
|
|
91
|
-
href:
|
|
92
|
+
href: genResizeFaviconUrl(favicon, 16)
|
|
92
93
|
},
|
|
93
94
|
{
|
|
94
95
|
rel: 'apple-touch-icon',
|
|
95
96
|
sizes: '180x180',
|
|
96
|
-
href:
|
|
97
|
+
href: genResizeFaviconUrl(favicon, 180)
|
|
97
98
|
},
|
|
98
99
|
{
|
|
99
100
|
rel: 'manifest',
|
|
@@ -108,13 +109,13 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
108
109
|
description: shopMeta?.shop.description,
|
|
109
110
|
icons: [
|
|
110
111
|
{
|
|
111
|
-
src:
|
|
112
|
+
src: genResizeFaviconUrl(favicon, 192),
|
|
112
113
|
sizes: '192x192',
|
|
113
114
|
type: 'image/png',
|
|
114
115
|
purpose: 'any maskable'
|
|
115
116
|
},
|
|
116
117
|
{
|
|
117
|
-
src:
|
|
118
|
+
src: genResizeFaviconUrl(favicon, 512),
|
|
118
119
|
sizes: '512x512',
|
|
119
120
|
type: 'image/png'
|
|
120
121
|
}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
const genResizeFaviconUrl = (faviconUrl, size)=>{
|
|
2
|
+
if (!faviconUrl) {
|
|
3
|
+
return '/favicon/favicon-32x32.png';
|
|
4
|
+
}
|
|
5
|
+
const urlParts = faviconUrl.split('.');
|
|
6
|
+
const extension = urlParts.pop();
|
|
7
|
+
if ([
|
|
8
|
+
'jpg',
|
|
9
|
+
'jpeg',
|
|
10
|
+
'png',
|
|
11
|
+
'gif',
|
|
12
|
+
'webp',
|
|
13
|
+
'ico'
|
|
14
|
+
].includes(extension?.toLocaleLowerCase())) {
|
|
15
|
+
return `${urlParts.join('.')}_x${size}.${extension}`;
|
|
16
|
+
}
|
|
17
|
+
return faviconUrl;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
export { genResizeFaviconUrl };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gem-sdk/pages",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.2.0-staging.39",
|
|
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": "2.
|
|
30
|
-
"@gem-sdk/plugin-cookie-bar": "2.1.0",
|
|
31
|
-
"@gem-sdk/plugin-quick-view": "2.1.0",
|
|
32
|
-
"@gem-sdk/plugin-sticky-add-to-cart": "2.1.0"
|
|
29
|
+
"@gem-sdk/core": "2.2.0-staging.33",
|
|
30
|
+
"@gem-sdk/plugin-cookie-bar": "2.1.27-staging.0",
|
|
31
|
+
"@gem-sdk/plugin-quick-view": "2.1.27-staging.0",
|
|
32
|
+
"@gem-sdk/plugin-sticky-add-to-cart": "2.1.27-staging.0"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"next": ">=13"
|