@gem-sdk/pages 1.23.0-staging.34 → 1.23.0-staging.349
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/builder/Toolbar.js +317 -149
- package/dist/cjs/components/builder/Toolbox.js +106 -53
- package/dist/cjs/components/builder/toolbar/Onboarding.js +110 -0
- package/dist/cjs/components/image-to-layout/AddSectionImageToLayout.js +1 -7
- package/dist/cjs/components/image-to-layout/DropElement.js +128 -87
- package/dist/cjs/components/image-to-layout/ImageToLayout.js +2 -8
- package/dist/cjs/libs/api/get-home-page-props-v2.js +3 -1
- package/dist/cjs/libs/api/get-static-page-props-preview.js +3 -1
- package/dist/cjs/libs/google-fonts.js +6 -1
- package/dist/cjs/libs/helpers/gen-fonts.js +15 -4
- package/dist/cjs/pages/builder.js +43 -41
- package/dist/cjs/pages/collection-detail.js +12 -10
- package/dist/cjs/pages/product-detail.js +18 -16
- package/dist/cjs/pages/static-v2.js +14 -12
- package/dist/cjs/pages/static.js +13 -11
- package/dist/esm/components/builder/Toolbar.js +318 -150
- package/dist/esm/components/builder/Toolbox.js +107 -54
- package/dist/esm/components/builder/toolbar/Onboarding.js +106 -0
- package/dist/esm/components/image-to-layout/AddSectionImageToLayout.js +1 -7
- package/dist/esm/components/image-to-layout/DropElement.js +128 -87
- package/dist/esm/components/image-to-layout/ImageToLayout.js +2 -8
- package/dist/esm/libs/api/get-home-page-props-v2.js +4 -2
- package/dist/esm/libs/api/get-static-page-props-preview.js +4 -2
- package/dist/esm/libs/google-fonts.js +6 -1
- package/dist/esm/libs/helpers/gen-fonts.js +15 -4
- package/dist/esm/pages/builder.js +44 -42
- package/dist/esm/pages/collection-detail.js +13 -11
- package/dist/esm/pages/product-detail.js +19 -17
- package/dist/esm/pages/static-v2.js +15 -13
- package/dist/esm/pages/static.js +14 -12
- package/dist/types/index.d.ts +1 -0
- package/package.json +3 -3
- package/dist/cjs/components/image-to-layout/ImageToLayoutInput.js +0 -193
- package/dist/cjs/components/image-to-layout/PagesSuggestion.js +0 -80
- package/dist/esm/components/image-to-layout/ImageToLayoutInput.js +0 -191
- package/dist/esm/components/image-to-layout/PagesSuggestion.js +0 -78
|
@@ -35,7 +35,8 @@ const getHomePagePropsV2 = (fetcher, shopifyFetcher)=>async ()=>{
|
|
|
35
35
|
throw new Error(`No data builder found for Home page`);
|
|
36
36
|
}
|
|
37
37
|
const homeTemplate = normalize.parseBuilderTemplateV2(dataBuilder);
|
|
38
|
-
const [fontStyle, fallback] = await Promise.all([
|
|
38
|
+
const [elementFontStyle, fontStyle, fallback] = await Promise.all([
|
|
39
|
+
googleFonts.getFontStyleFromPageTemplate(homeTemplate),
|
|
39
40
|
googleFonts.getFontFromGlobalStyle(dataBuilder?.pageStyle?.data),
|
|
40
41
|
getFallback.getFallbackV2(fetcher, homeTemplate)
|
|
41
42
|
]);
|
|
@@ -115,6 +116,7 @@ const getHomePagePropsV2 = (fetcher, shopifyFetcher)=>async ()=>{
|
|
|
115
116
|
return parseJson.serializableJson({
|
|
116
117
|
themeStyle: genCss.genCSS(dataBuilder?.pageStyle?.data, mobileOnly),
|
|
117
118
|
fontStyle,
|
|
119
|
+
elementFontStyle,
|
|
118
120
|
builderData: homeTemplate,
|
|
119
121
|
swr: {
|
|
120
122
|
fallback
|
|
@@ -38,7 +38,8 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
38
38
|
throw new Error(`No data builder found for slug: /preview/${slug}`);
|
|
39
39
|
}
|
|
40
40
|
const pageTemplate = normalize.parseBuilderTemplateV2(dataBuilder);
|
|
41
|
-
const [fontStyle, fallback] = await Promise.all([
|
|
41
|
+
const [elementFontStyle, fontStyle, fallback] = await Promise.all([
|
|
42
|
+
googleFonts.getFontStyleFromPageTemplate(pageTemplate),
|
|
42
43
|
googleFonts.getFontFromGlobalStyle(dataBuilder?.pageStyle?.data),
|
|
43
44
|
getFallback.getFallbackV2(fetcher, pageTemplate)
|
|
44
45
|
]);
|
|
@@ -120,6 +121,7 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
|
|
|
120
121
|
return parseJson.serializableJson({
|
|
121
122
|
themeStyle: genCss.genCSS(dataBuilder?.pageStyle?.data, mobileOnly),
|
|
122
123
|
fontStyle,
|
|
124
|
+
elementFontStyle,
|
|
123
125
|
builderData: pageTemplate,
|
|
124
126
|
pageType,
|
|
125
127
|
moneyFormat: shopMeta?.shop.moneyFormat ?? null,
|
|
@@ -9,7 +9,12 @@ async function getFontForUA(url, UA) {
|
|
|
9
9
|
headers: {
|
|
10
10
|
'User-Agent': UA
|
|
11
11
|
}
|
|
12
|
-
}).then((res)=>
|
|
12
|
+
}).then((res)=>{
|
|
13
|
+
if (res.status === 200) {
|
|
14
|
+
return res.text();
|
|
15
|
+
}
|
|
16
|
+
return '';
|
|
17
|
+
});
|
|
13
18
|
}
|
|
14
19
|
const composeFonts = (fonts)=>{
|
|
15
20
|
const uniqFonts = fonts.filter((font, index, arr)=>{
|
|
@@ -19,7 +19,12 @@ const getFontFromGroupSetting = (fonts, groupSetting)=>{
|
|
|
19
19
|
const value = groupSetting[attr];
|
|
20
20
|
if (value) {
|
|
21
21
|
const customFontFamily = value.custom?.fontFamily;
|
|
22
|
-
|
|
22
|
+
let customFontVariants = value.custom?.fontVariants;
|
|
23
|
+
if (!customFontVariants?.length) {
|
|
24
|
+
customFontVariants = [
|
|
25
|
+
value.custom?.fontWeight
|
|
26
|
+
];
|
|
27
|
+
}
|
|
23
28
|
if (customFontFamily && customFontVariants?.length) {
|
|
24
29
|
const variants = customFontVariants.map((item)=>{
|
|
25
30
|
switch(item){
|
|
@@ -36,11 +41,17 @@ const getFontFromGroupSetting = (fonts, groupSetting)=>{
|
|
|
36
41
|
if (isFontFamily) {
|
|
37
42
|
isFontFamily.variants.push(customFontWeight);
|
|
38
43
|
} else {
|
|
44
|
+
const fontVariants = [
|
|
45
|
+
customFontWeight
|
|
46
|
+
];
|
|
47
|
+
if (customFontWeight !== '700') {
|
|
48
|
+
if (variants.includes('700')) {
|
|
49
|
+
fontVariants.push('700'); // Auto add 700 for bold in editor inline
|
|
50
|
+
}
|
|
51
|
+
}
|
|
39
52
|
fonts.push({
|
|
40
53
|
family: customFontFamily,
|
|
41
|
-
variants:
|
|
42
|
-
customFontWeight
|
|
43
|
-
],
|
|
54
|
+
variants: fontVariants,
|
|
44
55
|
subsets: [],
|
|
45
56
|
type: 'google'
|
|
46
57
|
});
|
|
@@ -14,7 +14,7 @@ var ImageToLayout = require('../components/image-to-layout/ImageToLayout.js');
|
|
|
14
14
|
var AddSectionImageToLayout = require('../components/image-to-layout/AddSectionImageToLayout.js');
|
|
15
15
|
var Toolbar = require('../components/builder/Toolbar.js');
|
|
16
16
|
|
|
17
|
-
const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, pageType, editorImageToLayout, isThemeSectionEditor })=>{
|
|
17
|
+
const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, pageType, editorImageToLayout, isThemeSectionEditor, hiddenToolbar })=>{
|
|
18
18
|
const [loadSuccess, setLoadSuccess] = react.useState(false);
|
|
19
19
|
const initState = react.useMemo(()=>({
|
|
20
20
|
ROOT: {
|
|
@@ -50,48 +50,50 @@ const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, page
|
|
|
50
50
|
})
|
|
51
51
|
]
|
|
52
52
|
}),
|
|
53
|
-
/*#__PURE__*/ jsxRuntime.jsx(core.
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
children: /*#__PURE__*/ jsxRuntime.jsx(
|
|
53
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
|
|
54
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
|
|
55
|
+
components: components,
|
|
56
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
|
|
57
|
+
data: sectionData,
|
|
58
|
+
children: /*#__PURE__*/ jsxRuntime.jsxs(core.BuilderPreviewProvider, {
|
|
59
|
+
state: initState,
|
|
60
|
+
isThemeSectionEditor: isThemeSectionEditor,
|
|
61
|
+
children: [
|
|
62
|
+
/*#__PURE__*/ jsxRuntime.jsx(Toolbox.default, {}),
|
|
63
|
+
!hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Toolbar.default, {}),
|
|
64
|
+
/*#__PURE__*/ jsxRuntime.jsx(PopupManager.default, {}),
|
|
65
|
+
loadSuccess && /*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
66
|
+
className: "builder z-1 relative",
|
|
67
|
+
children: [
|
|
68
|
+
!hiddenToolbar && (isThemeSectionEditor ? /*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
69
|
+
className: "h-[40px] bg-[#f4f4f4]"
|
|
70
|
+
}) : /*#__PURE__*/ jsxRuntime.jsx(Header.default, {})),
|
|
71
|
+
/*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
72
|
+
id: "storefront",
|
|
73
|
+
className: isThemeSectionEditor ? 'theme-section-editor' : '',
|
|
74
|
+
children: pageType === 'GP_COLLECTION' ? /*#__PURE__*/ jsxRuntime.jsx(CollectionGlobalProvider.default, {
|
|
75
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.RenderPreview, {
|
|
76
|
+
uid: "ROOT"
|
|
77
|
+
})
|
|
78
|
+
}) : /*#__PURE__*/ jsxRuntime.jsx(core.RenderPreview, {
|
|
75
79
|
uid: "ROOT"
|
|
76
80
|
})
|
|
77
|
-
})
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
]
|
|
94
|
-
}, "preview")
|
|
81
|
+
}),
|
|
82
|
+
/*#__PURE__*/ jsxRuntime.jsx(ImageToLayout.default, {
|
|
83
|
+
editorImageToLayout: editorImageToLayout || false
|
|
84
|
+
}),
|
|
85
|
+
/*#__PURE__*/ jsxRuntime.jsx(AddSectionImageToLayout.default, {
|
|
86
|
+
editorImageToLayout: editorImageToLayout || false
|
|
87
|
+
}),
|
|
88
|
+
/*#__PURE__*/ jsxRuntime.jsx("div", {
|
|
89
|
+
id: "visual-content"
|
|
90
|
+
}),
|
|
91
|
+
!isThemeSectionEditor && !hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Footer.default, {})
|
|
92
|
+
]
|
|
93
|
+
})
|
|
94
|
+
]
|
|
95
|
+
}, "preview")
|
|
96
|
+
})
|
|
95
97
|
})
|
|
96
98
|
})
|
|
97
99
|
]
|
|
@@ -40,16 +40,18 @@ const CollectionDetailPage = ({ seo, components, builderData, sectionData, theme
|
|
|
40
40
|
})
|
|
41
41
|
]
|
|
42
42
|
}),
|
|
43
|
-
/*#__PURE__*/ jsxRuntime.jsx(core.
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
43
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
|
|
44
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
|
|
45
|
+
components: components,
|
|
46
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
|
|
47
|
+
data: sectionData,
|
|
48
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(CollectionProvider, {
|
|
49
|
+
collection: collection,
|
|
50
|
+
children: builderData && /*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
|
|
51
|
+
state: builderData,
|
|
52
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
|
|
53
|
+
uid: "ROOT"
|
|
54
|
+
})
|
|
53
55
|
})
|
|
54
56
|
})
|
|
55
57
|
})
|
|
@@ -40,23 +40,25 @@ const ProductDetailPage = ({ themeStyle, fontStyle, seo, product, components, bu
|
|
|
40
40
|
})
|
|
41
41
|
]
|
|
42
42
|
}),
|
|
43
|
-
/*#__PURE__*/ jsxRuntime.jsx(core.
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
43
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
|
|
44
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
|
|
45
|
+
components: components,
|
|
46
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
|
|
47
|
+
data: sectionData,
|
|
48
|
+
children: /*#__PURE__*/ jsxRuntime.jsxs(ProductProvider, {
|
|
49
|
+
product: product,
|
|
50
|
+
children: [
|
|
51
|
+
builderData && /*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
|
|
52
|
+
state: builderData,
|
|
53
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
|
|
54
|
+
uid: "ROOT"
|
|
55
|
+
})
|
|
56
|
+
}),
|
|
57
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.AddOn, {
|
|
58
|
+
name: "sticky-add-to-cart"
|
|
54
59
|
})
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
name: "sticky-add-to-cart"
|
|
58
|
-
})
|
|
59
|
-
]
|
|
60
|
+
]
|
|
61
|
+
})
|
|
60
62
|
})
|
|
61
63
|
})
|
|
62
64
|
})
|
|
@@ -61,18 +61,20 @@ const StaticPageV2 = ({ components, builderData, sectionData, seo, themeStyle, f
|
|
|
61
61
|
}, fontStyle))
|
|
62
62
|
]
|
|
63
63
|
}),
|
|
64
|
-
/*#__PURE__*/ jsxRuntime.jsx(core.
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
64
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
|
|
65
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
|
|
66
|
+
components: components,
|
|
67
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
|
|
68
|
+
data: sectionData,
|
|
69
|
+
children: builderData?.map((builder)=>/*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
|
|
70
|
+
state: builder.data,
|
|
71
|
+
lazy: builder.lazy,
|
|
72
|
+
priority: builder.priority,
|
|
73
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
|
|
74
|
+
uid: builder.uid
|
|
75
|
+
})
|
|
76
|
+
}, builder.uid))
|
|
77
|
+
})
|
|
76
78
|
})
|
|
77
79
|
})
|
|
78
80
|
]
|
package/dist/cjs/pages/static.js
CHANGED
|
@@ -52,17 +52,19 @@ const StaticPage = ({ components, builderData, sectionData, seo, themeStyle, fon
|
|
|
52
52
|
})
|
|
53
53
|
]
|
|
54
54
|
}),
|
|
55
|
-
/*#__PURE__*/ jsxRuntime.jsx(core.
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
children:
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
55
|
+
/*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
|
|
56
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
|
|
57
|
+
components: components,
|
|
58
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
|
|
59
|
+
data: sectionData,
|
|
60
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
|
|
61
|
+
children: builderData && /*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
|
|
62
|
+
state: builderData,
|
|
63
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
|
|
64
|
+
uid: "ROOT"
|
|
65
|
+
})
|
|
66
|
+
}, "body")
|
|
67
|
+
})
|
|
66
68
|
})
|
|
67
69
|
})
|
|
68
70
|
})
|