@gem-sdk/pages 2.0.0-staging.159 → 2.0.0-staging.711

package/dist/cjs/components/FooterForPostPurchase.js

@@ -13,7 +13,7 @@ const defaultMargin = {
 };
 const FooterForPostPurchase = (props)=>{
     return /*#__PURE__*/ jsxRuntime.jsx("div", {
-        className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE] gp-bg-white gp-font-sans'),
+        className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE] gp-font-sans'),
         children: /*#__PURE__*/ jsxRuntime.jsx("div", {
             className: "gp-flex gp-flex-1 gp-items-center gp-justify-between gp-py-6",
             style: {

package/dist/cjs/components/builder/Footer.js

@@ -45,7 +45,7 @@ const Footer = (props)=>{
     ]);
     return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
         children: pageType === 'POST_PURCHASE' ? /*#__PURE__*/ jsxRuntime.jsx("div", {
-            className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE] gp-bg-white gp-font-sans'),
+            className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE] gp-font-sans'),
             children: /*#__PURE__*/ jsxRuntime.jsx("div", {
                 className: "gp-flex gp-flex-1 gp-items-center gp-justify-between gp-py-6",
                 style: {
@@ -62,7 +62,7 @@ const Footer = (props)=>{
                 })
             })
         }) : /*#__PURE__*/ jsxRuntime.jsx("div", {
-            className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE] gp-bg-white gp-font-sans', {
+            className: core.cls('gp-footer-container gp-border-1 gp-group gp-flex gp-justify-center gp-border-y gp-border-[#EEEEEE gp-font-sans', {
                 'gp-fixed gp-bottom-0 gp-w-full': shouldFixed
             }),
             children: /*#__PURE__*/ jsxRuntime.jsxs("div", {

package/dist/cjs/components/builder/Header.js

@@ -22,7 +22,6 @@ const sizeCheck = {
 const Header = (props)=>{
     const { pageType, isOriginTemplate, openPageSetting } = props;
     const layoutSetting = core.useShopStore((s)=>s.layoutSettings);
-    core.usePageStore((s)=>s.sidebarMode);
     const activeHeader = layoutSetting?.showHeader || isOriginTemplate;
     const headerColor = activeHeader ? HEADER_ON_COLOR : HEADER_OFF_COLOR;
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {

package/dist/cjs/components/builder/Toolbar.js

@@ -411,6 +411,7 @@ const Toolbar = ()=>{
         if (!value || !currentComponentActive.current) {
             return;
         }
+        let isClickProcessing = false;
         const selector = getSelectorComponent({
             ...currentComponentActive.current
         });
@@ -419,6 +420,7 @@ const Toolbar = ()=>{
             const $parents = $component?.querySelectorAll('[data-toolbar-parent]');
             if ($parents.length) {
                 const onHover = ($parent)=>{
+                    if (isClickProcessing) return;
                     const uid = $parent.getAttribute('data-parent-uid');
                     if (!uid) return;
                     const $parentComponents = document.body.querySelector('#storefront')?.querySelectorAll(`[data-uid="${uid}"]`);
@@ -447,6 +449,7 @@ const Toolbar = ()=>{
                     }
                 };
                 const onClick = async ($parent)=>{
+                    isClickProcessing = true;
                     const uid = $parent.getAttribute('data-parent-uid');
                     if (!uid) return;
                     const isElementInsideProduct = async ()=>{
@@ -478,6 +481,9 @@ const Toolbar = ()=>{
                     });
                     outHover($parent);
                     window.dispatchEvent(event);
+                    setTimeout(()=>{
+                        isClickProcessing = false;
+                    }, 0);
                 };
                 $parents.forEach(($parent)=>{
                     $parent.addEventListener('mouseover', ()=>onHover($parent));

package/dist/cjs/components/builder/Toolbox.js

@@ -8,11 +8,12 @@ var core = require('@gem-sdk/core');
 var react = require('react');
 var getStorefrontApi = require('../../libs/get-storefront-api.js');
 var googleFonts = require('../../libs/google-fonts.js');
+var checkOptionFont = require('../../libs/helpers/check-option-font.js');
 var genCss = require('../../libs/helpers/gen-css.js');
 var genFonts = require('../../libs/helpers/gen-fonts.js');
 var shopifyCdnWithGoogleFonts = require('../../libs/shopify-cdn-with-google-fonts.js');
 var libsStore = require('../../store/libs-store.js');
-var checkOptionFont = require('../../libs/helpers/check-option-font.js');
+var getListFontWeightTypos = require('../composable/getListFontWeightTypos.js');
 
 const globalStyleId = 'global-style';
 const Toolbox = ()=>{
@@ -39,7 +40,7 @@ const Toolbox = ()=>{
     const changeLayoutSettings = core.useShopStore((s)=>s.changeLayoutSettings);
     const changeCreateThemeSectionCount = core.useShopStore((s)=>s.changeCreateThemeSectionCount);
     const changeShopPlan = core.useShopStore((s)=>s.changeShopPlan);
-    const changeShopifyPlan = core.useShopStore((s)=>s.changeShopifyPlan);
+    const updatePriceWithCurrency = core.useShopStore((s)=>s.updatePriceWithCurrency);
     const changeFontType = libsStore.libsStore((s)=>s.changeFontType);
     const fontType = libsStore.libsStore((s)=>s.fontType);
     const clearModal = core.useModalStore((s)=>s.clearModal);
@@ -138,9 +139,11 @@ const Toolbox = ()=>{
         try {
             if (detail.data) {
                 const themeStyle = genCss.genCSS(detail.data, detail.mobileOnly);
-                const font = Object.entries(detail.data?.font).map(([, value])=>{
-                    return value;
-                }).map((item)=>{
+                const fontWeights = getListFontWeightTypos.getListFontWeightTypos(detail.data?.typography);
+                const font = Object.entries(detail.data?.font).map(([, value])=>({
+                        ...value,
+                        variants: value.variants.filter((variant)=>fontWeights.includes(variant) || variant === 'regular' && fontWeights.includes('400')).map((variant)=>variant === 'regular' ? '400' : variant)
+                    })).map((item)=>{
                     if (item.type == 'custom') {
                         const isGoogleFont = shopifyCdnWithGoogleFonts.shopifyCdnWithGoogleFonts.find((ggFont)=>ggFont.family == item.family);
                         if (isGoogleFont) {
@@ -297,12 +300,12 @@ const Toolbox = ()=>{
     }, [
         changeShopPlan
     ]);
-    const onUpdateShopifyPlan = react.useCallback((e)=>{
-        const shopifyPlan = e.detail;
-        if (!shopifyPlan) return;
-        changeShopifyPlan(shopifyPlan);
+    const onUpdatePriceWithCurrency = react.useCallback((e)=>{
+        const showPriceCurrency = e.detail;
+        if (!showPriceCurrency) return;
+        updatePriceWithCurrency(showPriceCurrency);
     }, [
-        changeShopifyPlan
+        updatePriceWithCurrency
     ]);
     const onUpdateFontType = react.useCallback((e)=>{
         const fontType = e.detail;
@@ -428,7 +431,6 @@ const Toolbox = ()=>{
         window.addEventListener('on-off-header-footer', onChangeLayoutSettingData);
         window.addEventListener('update-create-theme-section-count', onUpdateCreateThemeSectionCount);
         window.addEventListener('update-shop-plan', onUpdateShopPlan);
-        window.addEventListener('update-shopify-plan', onUpdateShopifyPlan);
         window.addEventListener('set-dynamic-product', onUpdateDynamicProduct);
         window.addEventListener('set-dynamic-collection', onUpdateDynamicCollection);
         window.addEventListener('update-item-name', onUpdateItemName);
@@ -442,6 +444,7 @@ const Toolbox = ()=>{
         window.addEventListener('update-interaction-setting-type', onUpdateInteractionSettingType);
         window.addEventListener('change-sidebar-mode', onChangeSidebarMode);
         window.addEventListener('update-font-type', onUpdateFontType);
+        window.addEventListener('update-price-with-currency', onUpdatePriceWithCurrency);
         return ()=>{
             window.removeEventListener('update-shop-info', onChangeShopInfo);
             window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -455,7 +458,7 @@ const Toolbox = ()=>{
             window.removeEventListener('on-off-header-footer', onChangeLayoutSettingData);
             window.removeEventListener('update-create-theme-section-count', onUpdateCreateThemeSectionCount);
             window.removeEventListener('update-shop-plan', onUpdateShopPlan);
-            window.removeEventListener('update-shopify-plan', onUpdateShopifyPlan);
+            window.removeEventListener('update-price-with-currency', onUpdatePriceWithCurrency);
             window.removeEventListener('set-dynamic-product', onUpdateDynamicProduct);
             window.removeEventListener('set-dynamic-collection', onUpdateDynamicCollection);
             window.removeEventListener('update-item-name', onUpdateItemName);
@@ -471,7 +474,6 @@ const Toolbox = ()=>{
     }, [
         onAddEntity,
         onUpdateShopPlan,
-        onUpdateShopifyPlan,
         onForceUpdateEntityProps,
         onUpdateEntityProp,
         onInitBuilder,
@@ -495,7 +497,8 @@ const Toolbox = ()=>{
         onUpdateInteractionSettingType,
         onUpdateFontType,
         onChangeSidebarMode,
-        onUpdateDynamicDiscountOffer
+        onUpdateDynamicDiscountOffer,
+        onUpdatePriceWithCurrency
     ]);
     return /*#__PURE__*/ jsxRuntime.jsx("div", {
         className: "toolbox"

package/dist/cjs/components/composable/getListFontWeightTypos.js

@@ -0,0 +1,14 @@
+'use strict';
+
+const getListFontWeightTypos = (font)=>{
+    const fontWeights = new Set();
+    Object.values(font).forEach((fontStyle)=>{
+        // Check desktop fontWeight
+        if (fontStyle.desktop?.fontWeight) {
+            fontWeights.add(fontStyle.desktop.fontWeight);
+        }
+    });
+    return Array.from(fontWeights);
+};
+
+exports.getListFontWeightTypos = getListFontWeightTypos;

package/dist/cjs/components/image-to-layout/AddSectionImageToLayout.js

@@ -37,6 +37,7 @@ const defaultPadding = {
     mobile: 'var(--g-ct-p)'
 };
 const AddSectionImageToLayout = ({ editorImageToLayout })=>{
+    const { t } = core.useI18nStore();
     const layoutSetting = core.useShopStore((s)=>s.layoutSettings);
     const totalSection = core.useBuilderPreviewStore((state)=>state.state.ROOT.childrens?.length);
     const editingPageType = core.useShopStore((s)=>s.pageType);
@@ -82,11 +83,11 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
             children: [
                 /*#__PURE__*/ jsxRuntime.jsx("span", {
                     className: "gp-absolute gp-top-[-12px] gp-bg-white gp-px-[8px] gp-text-[14px] gp-font-normal gp-text-[#9E9E9E]",
-                    children: "Add section"
+                    children: t('Add section')
                 }),
                 ACTIONS_DATA.map((action)=>{
                     return /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                        className: `gp-relative gp-mx-1 gp-h-[60px] gp-w-[172px] w375:gp-w-auto w576:gp-w-auto gp-cursor-pointer gp-flex-col gp-items-center gp-justify-center gp-rounded-[3px] gp-bg-[#F4F4F4] hover:gp-bg-black/10 gp-flex`,
+                        className: `gp-relative gp-mx-1 gp-min-h-[60px] gp-border-box w375:gp-w-auto w576:gp-w-auto gp-cursor-pointer gp-flex-col gp-items-center gp-justify-center gp-rounded-[3px] gp-bg-[#F4F4F4] hover:gp-bg-black/10 gp-flex gp-p-2`,
                         id: action.id,
                         onClick: ()=>handleAddSectionAction(action.eventID),
                         "aria-hidden": true,
@@ -94,7 +95,7 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
                             /*#__PURE__*/ jsxRuntime.jsxs("div", {
                                 className: "gp-mb-[4px] gp-flex gp-gap-2 gp-text-[14px] gp-font-medium gp-text-[#212121]",
                                 children: [
-                                    action.title,
+                                    t(action.title),
                                     action.hasAILogo && /*#__PURE__*/ jsxRuntime.jsxs("svg", {
                                         width: "43",
                                         height: "20",
@@ -137,7 +138,7 @@ const AddSectionImageToLayout = ({ editorImageToLayout })=>{
                                 className: "gp-flex gp-items-center",
                                 children: /*#__PURE__*/ jsxRuntime.jsx("span", {
                                     className: "gp-mr-[3px] gp-text-center gp-text-[12px] gp-font-normal gp-text-[#676767]",
-                                    children: action.content
+                                    children: t(action.content)
                                 })
                             })
                         ]

package/dist/cjs/components/image-to-layout/DropElement.js

@@ -2,8 +2,16 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
+var core = require('@gem-sdk/core');
 
+const SALE_FUNNEL_PAGE_TYPES = [
+    'GP_FUNNEL_PAGE',
+    'GP_PRE_SALE_PAGE'
+];
 const DropElement = ()=>{
+    const { t } = core.useI18n();
+    const editingPageType = core.useShopStore((s)=>s.pageType);
+    const isFunnelSalesPage = SALE_FUNNEL_PAGE_TYPES.includes(editingPageType || '');
     const dispatchEventBuildWithSectionActiveTab = (value)=>{
         const event = new CustomEvent('editor:sidebar:build-with-section-active-tab', {
             bubbles: true,
@@ -13,6 +21,15 @@ const DropElement = ()=>{
         });
         window.dispatchEvent(event);
     };
+    const dispatchEventBuildWithTemplateActiveTab = (value)=>{
+        const event = new CustomEvent('editor:sidebar:build-with-template-active-tab', {
+            bubbles: true,
+            detail: {
+                value
+            }
+        });
+        window.dispatchEvent(event);
+    };
     const handleClickGenerate = (e)=>{
         const event = new CustomEvent('editor:sidebar:click-img-to-layout-gallery-btn', e);
         window.dispatchEvent(event);
@@ -101,22 +118,30 @@ const DropElement = ()=>{
                 children: [
                     /*#__PURE__*/ jsxRuntime.jsx("div", {
                         className: "gp-text-16 gp-font-medium gp-mb-4 gp-text-[#212121]",
-                        children: "Start with Sections from sidebar"
+                        children: isFunnelSalesPage ? t('Start building with Sections/Elements or') : t('Start with Sections from sidebar')
                     }),
                     /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                        className: "gp-flex gp-w-[291px] gp-justify-between",
+                        className: "gp-flex gp-gap-3 gp-justify-between",
                         children: [
                             /*#__PURE__*/ jsxRuntime.jsx("button", {
                                 "data-button-add-section": true,
-                                onClick: ()=>dispatchEventBuildWithSectionActiveTab(true),
-                                className: "gp-flex gp-h-[40px] gp-w-[136px] 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]",
-                                children: "Add sections"
+                                onClick: ()=>{
+                                    if (isFunnelSalesPage) {
+                                        dispatchEventBuildWithTemplateActiveTab('funnelExisting');
+                                    } else dispatchEventBuildWithSectionActiveTab(true);
+                                },
+                                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]",
+                                children: isFunnelSalesPage ? t('Use existing page designs') : t('Add sections')
                             }),
                             /*#__PURE__*/ jsxRuntime.jsx("button", {
                                 "data-button-add-elements": true,
-                                onClick: ()=>dispatchEventBuildWithSectionActiveTab(false),
-                                className: "gp-flex gp-h-[40px] gp-w-[136px] 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]",
-                                children: "Add elements"
+                                onClick: ()=>{
+                                    if (isFunnelSalesPage) {
+                                        dispatchEventBuildWithTemplateActiveTab('templates');
+                                    } else dispatchEventBuildWithSectionActiveTab(false);
+                                },
+                                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]",
+                                children: isFunnelSalesPage ? t('Explore templates') : t('Add elements')
                             })
                         ]
                     }),
@@ -155,7 +180,7 @@ const DropElement = ()=>{
                             "aria-hidden": "true",
                             id: "gp-img-to-layout-gallery-btn",
                             className: "gp-relative gp-cursor-pointer gp-text-[14px] gp-font-medium gp-text-[#3C67FF]",
-                            children: "Start with Generating from URL or image"
+                            children: t('Start with Generating from URL or image')
                         })
                     })
                 ]

package/dist/cjs/constants/index.js

@@ -8,5 +8,8 @@ exports.PublishedThemePageMetafields = void 0;
     PublishedThemePageMetafields["ANALYTICS_FB_PIXEL_ID"] = 'analytics_fb_pixel_id';
     PublishedThemePageMetafields["ANALYTICS_TIKTOK_PIXEL_ID"] = 'analytics_tiktok_pixel_id';
     PublishedThemePageMetafields["GLOBAL_META_DESCRIPTION"] = 'global-meta-description';
+    PublishedThemePageMetafields["GLOBAL_META_TITLE"] = 'global-meta-title';
     PublishedThemePageMetafields["GLOBAL_META_THUMBNAIL"] = 'global-meta-thumbnail';
+    PublishedThemePageMetafields["NOINDEX_KEY"] = 'noindex';
+    PublishedThemePageMetafields["NOFOLLOW_KEY"] = 'nofollow';
 })(exports.PublishedThemePageMetafields || (exports.PublishedThemePageMetafields = {}));

package/dist/cjs/libs/api/get-static-page-props-preview.js

@@ -10,6 +10,7 @@ var getFallback = require('../helpers/get-fallback.js');
 var normalize = require('../helpers/normalize.js');
 var parseJson = require('../helpers/parse-json.js');
 var customFonts = require('../custom-fonts.js');
+var sentry = require('../helpers/sentry.js');
 
 const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
         try {
@@ -31,6 +32,10 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
                 ])
             ]);
             if (theme.status === 'rejected') {
+                sentry.sentryCaptureException('PreviewThemePageDocument', theme.reason, {
+                    variables,
+                    theme
+                });
                 throw new Error(theme.reason?.[0]);
             }
             const dataBuilder = theme.value.previewThemePage;

package/dist/cjs/libs/api/get-static-page-props-v2.js

@@ -61,23 +61,28 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
             ]);
             const mobileOnly = dataBuilder.isMobile ?? false;
             const description = getMetafield.getPublishedThemePageMetafieldByKey(index.PublishedThemePageMetafields.GLOBAL_META_DESCRIPTION, dataBuilder?.metafields) || publishedShopMetaValue?.publishedShopMetas?.find((item)=>item?.key === index.PublishedThemePageMetafields.GLOBAL_META_DESCRIPTION)?.value;
+            const title = getMetafield.getPublishedThemePageMetafieldByKey(index.PublishedThemePageMetafields.GLOBAL_META_TITLE, dataBuilder?.metafields) || publishedShopMetaValue?.publishedShopMetas?.find((item)=>item?.key === index.PublishedThemePageMetafields.GLOBAL_META_TITLE)?.value;
             const thumbnail = parseJson.parseJson(getMetafield.getPublishedThemePageMetafieldByKey(index.PublishedThemePageMetafields.GLOBAL_META_THUMBNAIL, dataBuilder?.metafields) || publishedShopMetaValue?.publishedShopMetas?.find((item)=>item?.key === index.PublishedThemePageMetafields.GLOBAL_META_THUMBNAIL)?.value);
+            const noindex = getMetafield.getPublishedThemePageMetafieldByKey(index.PublishedThemePageMetafields.NOINDEX_KEY, dataBuilder?.metafields) || publishedShopMetaValue?.publishedShopMetas?.find((item)=>item?.key === index.PublishedThemePageMetafields.NOINDEX_KEY)?.value;
+            const nofollow = getMetafield.getPublishedThemePageMetafieldByKey(index.PublishedThemePageMetafields.NOFOLLOW_KEY, dataBuilder?.metafields) || publishedShopMetaValue?.publishedShopMetas?.find((item)=>item?.key === index.PublishedThemePageMetafields.NOFOLLOW_KEY)?.value;
             const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
             const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
             const favicon = shopData?.storeProperty?.favicon ?? '/favicon/favicon-32x32.png';
             const seo = {
                 defaultTitle: shopMeta?.shop.name,
-                title: dataBuilder?.name,
+                title: title || dataBuilder?.name,
                 description: description ?? shopMeta?.shop.description,
                 openGraph: {
                     site_name: shopMeta?.shop.name,
                     locale: shopMeta?.localization.country.isoCode,
-                    title: dataBuilder?.name ?? shopMeta?.shop.name,
+                    title: (title || dataBuilder?.name) ?? shopMeta?.shop.name,
                     description: description ?? shopMeta?.shop.description,
                     images: thumbnail ? [
                         thumbnail
                     ] : []
                 },
+                noindex: noindex === 'true',
+                nofollow: nofollow === 'true',
                 canonical: `https://${shopData?.storeProperty?.primaryDomain}/${slug}`,
                 additionalMetaTags: [
                     {

package/dist/cjs/libs/google-fonts.js

@@ -36,7 +36,27 @@ const composeFonts = (fonts)=>{
         };
     });
 };
-const createFontUrl = (fonts, option, fontType)=>{
+const handleGenerateFontParams = (variants, fontType = 'google')=>{
+    const regularWeights = [];
+    if (!variants.length) {
+        return fontType === 'bunny' ? '400' : 'wght@400';
+    }
+    // Get regular weights and remove italic variants
+    variants.forEach((variant)=>{
+        if (typeof variant !== 'string' || variant?.includes('italic')) {
+            return;
+        }
+        const weight = variant === 'regular' ? '400' : variant;
+        regularWeights.push(weight);
+    });
+    // Sort weights numerically (ex: [900, 700, 400] -> [400, 700, 900])
+    const sortedRegularWeights = regularWeights.sort((a, b)=>Number(a) - Number(b));
+    // Build the variant string with only regular weights
+    const axisPrefix = 'wght@';
+    const listVariantsGoogleFonts = sortedRegularWeights.map((weight)=>weight);
+    return fontType === 'google' ? `${axisPrefix}${listVariantsGoogleFonts.join(';')}` : sortedRegularWeights.join(',');
+};
+const createFontUrl = (fonts, option, fontType = 'google')=>{
     const mainFonts = fonts.filter((font)=>{
         return !([
             'bunny',
@@ -50,8 +70,8 @@ const createFontUrl = (fonts, option, fontType)=>{
         return index === arr.findIndex((t)=>t.family === font.family);
     });
     const family = composeFonts(uniqFonts).map((font)=>{
-        return `${font.family.replace(/ /g, '+')}:${font.variants.join(',')}`;
-    }).join('|');
+        return `${font.family.replace(/ /g, '+')}:${handleGenerateFontParams(font.variants, fontType)}`;
+    }).join(fontType === 'google' ? '&family=' : '|');
     params.append('family', family);
     params.append('display', display);
     if (option?.subset) {
@@ -61,7 +81,7 @@ const createFontUrl = (fonts, option, fontType)=>{
         params.append('effect', option.effect);
     }
     const bunnyFontUrl = `https://fonts.bunny.net/css?family=${family}`;
-    const googleFontUrl = `https://fonts.googleapis.com/css?${decodeURIComponent(params.toString())}`;
+    const googleFontUrl = `https://fonts.googleapis.com/css2?${decodeURIComponent(params.toString())}`;
     return fontType === 'bunny' ? bunnyFontUrl : googleFontUrl;
 };
 // eslint-disable-next-line max-params
@@ -87,7 +107,7 @@ async function getFonts(fonts, option, isImportFontByUrl = true, fontType) {
             }
         }
         return value;
-    } catch (e) {
+    } catch (_e) {
         return '';
     }
 }

package/dist/cjs/libs/helpers/gen-fonts.js

@@ -35,6 +35,9 @@ const getFontFromGroupSetting = (fonts, groupSetting)=>{
         }
     }
 };
+const uniqueArray = (arr)=>{
+    return Array.from(new Set(arr));
+};
 const getFontValue = (fonts, value)=>{
     let customFontFamily = value.custom?.fontFamily;
     if (typeof customFontFamily === 'string') {
@@ -60,15 +63,18 @@ const getFontValue = (fonts, value)=>{
         });
         const customFontWeight = value.custom?.fontWeight && variants.includes(value.custom?.fontWeight) ? value.custom?.fontWeight : variants[0];
         if (customFontWeight) {
+            const fontVariants = uniqueArray([
+                customFontWeight,
+                ...value?.attrs?.isAlwaysLoadBold ? [
+                    '700'
+                ] : []
+            ]);
             const isExist = fonts.find((item)=>item.family == fontFamily && item.variants.includes(customFontWeight));
             if (!isExist) {
                 const isFontFamily = fonts.find((item)=>item.family == fontFamily);
                 if (isFontFamily) {
                     isFontFamily.variants.push(customFontWeight);
                 } else {
-                    const fontVariants = [
-                        customFontWeight
-                    ];
                     if (customFontWeight !== '700') {
                         if (variants.includes('700')) {
                             fontVariants.push('700'); // Auto add 700 for bold in editor inline

package/dist/cjs/libs/helpers/normalize.js

@@ -74,7 +74,8 @@ function normalizePageSectionResponseV2(sections, orders) {
 const parseBuilderTemplateV2 = (data)=>{
     return normalizePageSectionResponseV2([
         ...data?.pageSections ?? [],
-        ...data?.themePageCustomSections ?? []
+        ...data?.themePageCustomSections ?? [],
+        ...data?.themeSections ?? []
     ], data?.sectionPosition);
 };
 const parseBuilderTemplate = (data)=>{

package/dist/cjs/libs/helpers/parse-json.js

@@ -4,7 +4,7 @@ const parseJson = (json)=>{
     if (!json) return null;
     try {
         return JSON.parse(json);
-    } catch (e) {
+    } catch (_e) {
         return null;
     }
 };

package/dist/cjs/libs/helpers/sentry.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var nextjs = require('@sentry/nextjs');
+
+const sentryCaptureException = (funcName, message, data, options)=>{
+    nextjs.withScope((scope)=>{
+        scope.setLevel(options?.level ?? 'log');
+        if (options?.tag) {
+            scope.setTag(options?.tag.key, options?.tag.value);
+        }
+        scope.setExtra('function', funcName);
+        scope.setExtra('data', JSON.stringify(data));
+        nextjs.captureMessage(`${funcName}: ${message}`);
+    });
+};
+
+exports.sentryCaptureException = sentryCaptureException;

package/dist/cjs/pages/404.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/dist/cjs/pages/500.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/dist/cjs/pages/CollectionGlobalProvider.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/dist/cjs/pages/builder.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
@@ -17,6 +18,7 @@ var Body = require('../components/builder/Body.js');
 
 const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, pageType, editorImageToLayout, isThemeSectionEditor, hiddenToolbar, pageName, isOriginTemplate })=>{
     const [loadSuccess, setLoadSuccess] = react.useState(false);
+    const { t } = core.useI18n();
     const isDisableHeaderFooter = ()=>{
         return isThemeSectionEditor;
     };
@@ -64,47 +66,50 @@ const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, page
                     components: components,
                     children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
                         data: sectionData,
-                        children: /*#__PURE__*/ jsxRuntime.jsxs(core.BuilderPreviewProvider, {
-                            pageName: pageName,
-                            state: initState,
-                            isThemeSectionEditor: isThemeSectionEditor,
-                            children: [
-                                /*#__PURE__*/ jsxRuntime.jsx(Toolbox.default, {}),
-                                !hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Toolbar.default, {}),
-                                /*#__PURE__*/ jsxRuntime.jsx(PopupManager.default, {}),
-                                loadSuccess && /*#__PURE__*/ jsxRuntime.jsxs("div", {
-                                    className: "builder gp-z-1 gp-relative",
-                                    children: [
-                                        !hiddenToolbar && (isDisableHeaderFooter() ? /*#__PURE__*/ jsxRuntime.jsx("div", {
-                                            className: "gp-h-[40px] gp-bg-[#ffffff] gp-border-b-[1px] gp-border-[#eeeeee]",
-                                            children: /*#__PURE__*/ jsxRuntime.jsx(SwitchView.default, {})
-                                        }) : /*#__PURE__*/ jsxRuntime.jsx(Header.default, {
-                                            pageType: pageType,
-                                            isOriginTemplate: isOriginTemplate,
-                                            openPageSetting: openPageSetting
-                                        })),
-                                        /*#__PURE__*/ jsxRuntime.jsx(Body.default, {
-                                            pageType: pageType,
-                                            isThemeSectionEditor: isThemeSectionEditor
-                                        }),
-                                        /*#__PURE__*/ jsxRuntime.jsx(ImageToLayout.default, {
-                                            editorImageToLayout: editorImageToLayout || false
-                                        }),
-                                        /*#__PURE__*/ jsxRuntime.jsx(AddSectionImageToLayout.default, {
-                                            editorImageToLayout: editorImageToLayout || false
-                                        }),
-                                        /*#__PURE__*/ jsxRuntime.jsx("div", {
-                                            id: "visual-content"
-                                        }),
-                                        !isDisableHeaderFooter() && !hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Footer.default, {
-                                            pageType: pageType,
-                                            isOriginTemplate: isOriginTemplate,
-                                            openPageSetting: openPageSetting
-                                        })
-                                    ]
-                                })
-                            ]
-                        }, "preview")
+                        children: /*#__PURE__*/ jsxRuntime.jsx(core.I18nProvider, {
+                            t: t,
+                            children: /*#__PURE__*/ jsxRuntime.jsxs(core.BuilderPreviewProvider, {
+                                pageName: pageName,
+                                state: initState,
+                                isThemeSectionEditor: isThemeSectionEditor,
+                                children: [
+                                    /*#__PURE__*/ jsxRuntime.jsx(Toolbox.default, {}),
+                                    !hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Toolbar.default, {}),
+                                    /*#__PURE__*/ jsxRuntime.jsx(PopupManager.default, {}),
+                                    loadSuccess && /*#__PURE__*/ jsxRuntime.jsxs("div", {
+                                        className: "builder gp-z-1 gp-relative",
+                                        children: [
+                                            !hiddenToolbar && (isDisableHeaderFooter() ? /*#__PURE__*/ jsxRuntime.jsx("div", {
+                                                className: "gp-h-[40px] gp-bg-[#ffffff] gp-border-b-[1px] gp-border-[#eeeeee]",
+                                                children: /*#__PURE__*/ jsxRuntime.jsx(SwitchView.default, {})
+                                            }) : /*#__PURE__*/ jsxRuntime.jsx(Header.default, {
+                                                pageType: pageType,
+                                                isOriginTemplate: isOriginTemplate,
+                                                openPageSetting: openPageSetting
+                                            })),
+                                            /*#__PURE__*/ jsxRuntime.jsx(Body.default, {
+                                                pageType: pageType,
+                                                isThemeSectionEditor: isThemeSectionEditor
+                                            }),
+                                            /*#__PURE__*/ jsxRuntime.jsx(ImageToLayout.default, {
+                                                editorImageToLayout: editorImageToLayout || false
+                                            }),
+                                            /*#__PURE__*/ jsxRuntime.jsx(AddSectionImageToLayout.default, {
+                                                editorImageToLayout: editorImageToLayout || false
+                                            }),
+                                            /*#__PURE__*/ jsxRuntime.jsx("div", {
+                                                id: "visual-content"
+                                            }),
+                                            !isDisableHeaderFooter() && !hiddenToolbar && /*#__PURE__*/ jsxRuntime.jsx(Footer.default, {
+                                                pageType: pageType,
+                                                isOriginTemplate: isOriginTemplate,
+                                                openPageSetting: openPageSetting
+                                            })
+                                        ]
+                                    })
+                                ]
+                            }, "preview")
+                        })
                     })
                 })
             })

package/dist/cjs/pages/collection-detail.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });