@gem-sdk/pages 1.64.0 → 2.0.0-dev.168

package/dist/cjs/components/ErrorBoundary.js

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

package/dist/cjs/components/ErrorFallback.js

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

package/dist/cjs/components/FacebookPixel.js

@@ -1,25 +1,23 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@gem-sdk/core');
-var router = require('next/router');
+var navigation = require('next/navigation');
 var Script = require('next/script');
 var react = require('react');
 
 const FacebookPixel = ({ pixelId })=>{
-    const router$1 = router.useRouter();
+    const pathName = navigation.usePathname();
+    const searchParams = navigation.useSearchParams();
     react.useEffect(()=>{
         const handleRouteChange = ()=>{
             core.fpixel.pageview();
         };
-        router$1.events.on('routeChangeComplete', handleRouteChange);
-        router$1.events.on('hashChangeComplete', handleRouteChange);
-        return ()=>{
-            router$1.events.off('routeChangeComplete', handleRouteChange);
-            router$1.events.off('hashChangeComplete', handleRouteChange);
-        };
+        handleRouteChange();
     }, [
-        router$1.events
+        pathName,
+        searchParams
     ]);
     if (!pixelId) return null;
     return /*#__PURE__*/ jsxRuntime.jsx(Script, {

package/dist/cjs/components/FooterForPostPurchase.js

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

package/dist/cjs/components/GoogleAnalytic.js

@@ -1,29 +1,28 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@gem-sdk/core');
-var router = require('next/router');
+var navigation = require('next/navigation');
 var Script = require('next/script');
 var react = require('react');
 
 const GoogleAnalytic = ({ trackingId })=>{
-    const router$1 = router.useRouter();
+    const searchParams = navigation.useSearchParams();
+    const pathName = navigation.usePathname();
     react.useEffect(()=>{
+        const url = pathName + searchParams.toString();
         const handleRouteChange = (url)=>{
             core.gtag.pageview(url, trackingId);
         };
-        router$1.events.on('routeChangeComplete', handleRouteChange);
-        router$1.events.on('hashChangeComplete', handleRouteChange);
-        return ()=>{
-            router$1.events.off('routeChangeComplete', handleRouteChange);
-            router$1.events.off('hashChangeComplete', handleRouteChange);
-        };
+        handleRouteChange(url);
     }, [
         trackingId,
-        router$1.events
+        pathName,
+        searchParams
     ]);
     const handleOnReady = ()=>{
-        core.gtag.pageview(router$1.pathname, trackingId);
+        core.gtag.pageview(pathName, trackingId);
     };
     if (!trackingId) return null;
     if (trackingId.startsWith('UA-')) return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {

package/dist/cjs/components/TikTokPixel.js

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

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

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

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

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

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

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -5,7 +6,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@gem-sdk/core');
 var SwitchView = require('./SwitchView.js');
-var InteractionSelectOnPageHeader = require('./InteractionSelectOnPageHeader.js');
 
 const defaultMargin = {
     desktop: '16px',
@@ -22,7 +22,7 @@ const sizeCheck = {
 const Header = (props)=>{
     const { pageType, isOriginTemplate, openPageSetting } = props;
     const layoutSetting = core.useShopStore((s)=>s.layoutSettings);
-    const sidebarMode = core.usePageStore((s)=>s.sidebarMode);
+    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, {
@@ -122,7 +122,7 @@ const Header = (props)=>{
                                 })
                             ]
                         }),
-                        !(isOriginTemplate || pageType === 'STATIC') && /*#__PURE__*/ jsxRuntime.jsx("button", {
+                        !isOriginTemplate && /*#__PURE__*/ jsxRuntime.jsx("button", {
                             className: "gp-header gp-invisible gp-absolute gp-left-[8px] gp-flex gp-h-[24px] gp-cursor-pointer gp-items-center gp-justify-center gp-rounded gp-bg-[#EEEEEE] gp-p-[4px] hover:gp-bg-[#f4f4f4] group-hover:gp-visible",
                             onClick: openPageSetting,
                             children: /*#__PURE__*/ jsxRuntime.jsxs("div", {
@@ -180,8 +180,7 @@ const Header = (props)=>{
                         })
                     ]
                 })
-            }),
-            sidebarMode === 'interaction' && /*#__PURE__*/ jsxRuntime.jsx(InteractionSelectOnPageHeader.default, {})
+            })
         ]
     });
 };

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

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

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

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

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

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

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

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -20,6 +21,7 @@ const Toolbox = ()=>{
     const changeStorefrontInfo = core.useShopStore((s)=>s.changeStorefrontInfo);
     const setDynamicProduct = core.usePageStore((s)=>s.setDynamicProduct);
     const setPostPurchaseProductOffers = core.usePageStore((s)=>s.setPostPurchaseProductOffers);
+    const setDynamicDiscountOffer = core.usePageStore((s)=>s.setDynamicDiscountOffer);
     const setSalePageProductId = core.usePageStore((s)=>s.setSalePageProductId);
     const setDynamicCollection = core.usePageStore((s)=>s.setDynamicCollection);
     const initState = core.useBuilderPreviewStore((s)=>s.initState);
@@ -345,6 +347,13 @@ const Toolbox = ()=>{
     }, [
         setPostPurchaseProductOffers
     ]);
+    const onUpdateDynamicDiscountOffer = react.useCallback((e)=>{
+        const dynamicDiscountOffer = e.detail;
+        if (!dynamicDiscountOffer) return;
+        setDynamicDiscountOffer(dynamicDiscountOffer);
+    }, [
+        setDynamicDiscountOffer
+    ]);
     const onUpdateSalePageProductId = react.useCallback((e)=>{
         const id = e.detail;
         if (!id) return;
@@ -416,6 +425,7 @@ const Toolbox = ()=>{
         window.addEventListener('update-item-name', onUpdateItemName);
         window.addEventListener('update-item-attribute', onUpdateItemAttribute);
         window.addEventListener('set-product-offer', onUpdateProductOffers);
+        window.addEventListener('set-dynamic-discount-offer', onUpdateDynamicDiscountOffer);
         window.addEventListener('update-sale-page-product-id', onUpdateSalePageProductId);
         window.addEventListener('limit-create-theme-section', onLimitCreateThemeSection);
         window.addEventListener('update-interaction-is-select-on-page', onUpdateInteractionIsSelectOnPage);
@@ -473,7 +483,8 @@ const Toolbox = ()=>{
         onUpdateInteractionIsSelectOnPage,
         onUpdateInteractionSettingType,
         onUpdateFontType,
-        onChangeSidebarMode
+        onChangeSidebarMode,
+        onUpdateDynamicDiscountOffer
     ]);
     return /*#__PURE__*/ jsxRuntime.jsx("div", {
         className: "toolbox"

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

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

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

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

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

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

package/dist/cjs/index.js

@@ -18,12 +18,6 @@ var userAgent = require('./libs/helpers/user-agent.js');
 var normalize = require('./libs/helpers/normalize.js');
 var getFallback = require('./libs/helpers/get-fallback.js');
 var common = require('./libs/helpers/common.js');
-var collectionDetail = require('./pages/collection-detail.js');
-var preview = require('./pages/preview.js');
-var productDetail = require('./pages/product-detail.js');
-var _static = require('./pages/static.js');
-var builder = require('./pages/builder.js');
-var staticV2 = require('./pages/static-v2.js');
 var getStaticPaths = require('./libs/getStaticPaths.js');
 var genFonts = require('./libs/helpers/gen-fonts.js');
 var googleFonts = require('./libs/google-fonts.js');
@@ -35,7 +29,12 @@ var _500 = require('./pages/500.js');
 var GoogleAnalytic = require('./components/GoogleAnalytic.js');
 var FacebookPixel = require('./components/FacebookPixel.js');
 var TikTokPixel = require('./components/TikTokPixel.js');
-var parseHtml = require('./libs/parse-html.js');
+var collectionDetail = require('./pages/collection-detail.js');
+var preview = require('./pages/preview.js');
+var productDetail = require('./pages/product-detail.js');
+var _static = require('./pages/static.js');
+var builder = require('./pages/builder.js');
+var staticV2 = require('./pages/static-v2.js');
 
 
 
@@ -60,12 +59,6 @@ exports.normalizePageSectionResponseV2 = normalize.normalizePageSectionResponseV
 exports.parseBuilderTemplateV2 = normalize.parseBuilderTemplateV2;
 exports.getFallbackV2 = getFallback.getFallbackV2;
 exports.retryWithDelay = common.retryWithDelay;
-exports.CollectionDetailPage = collectionDetail.default;
-exports.PreviewPage = preview.PreviewPage;
-exports.ProductDetailPage = productDetail.default;
-exports.StaticPage = _static.default;
-exports.BuilderPage = builder.BuilderPage;
-exports.StaticPageV2 = staticV2.StaticPageV2;
 exports.getStaticPaths = getStaticPaths.getStaticPaths;
 exports.getFontFromGroupSetting = genFonts.getFontFromGroupSetting;
 exports.getFontsFromDataBuilder = genFonts.getFontsFromDataBuilder;
@@ -79,4 +72,9 @@ exports.Page500 = _500.Page500;
 exports.GoogleAnalytic = GoogleAnalytic.GoogleAnalytic;
 exports.FacebookPixel = FacebookPixel.FacebookPixel;
 exports.TikTokPixel = TikTokPixel.TikTokPixel;
-exports.parseHtml = parseHtml.parseHtml;
+exports.CollectionDetailPage = collectionDetail.default;
+exports.PreviewPage = preview.PreviewPage;
+exports.ProductDetailPage = productDetail.default;
+exports.StaticPage = _static.default;
+exports.BuilderPage = builder.BuilderPage;
+exports.StaticPageV2 = staticV2.StaticPageV2;

package/dist/cjs/layouts/main.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -10,7 +11,7 @@ const MainLayout = ({ children, ...props })=>{
     const mobileOnly = core.useShopStore((s)=>s.mobileOnly);
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [
-            parseHtml.parseHtml('custom-code-body', props?.customCodeBody),
+            parseHtml.parseHtml(props?.customCodeBody),
             /*#__PURE__*/ jsxRuntime.jsx("div", {
                 className: core.cls({
                     'gp-max-w-mobile gp-mx-auto gp-w-full': mobileOnly

package/dist/cjs/libs/api/get-builder-props.js

@@ -5,16 +5,20 @@ var adapterShopify = require('@gem-sdk/adapter-shopify');
 var parseJson = require('../helpers/parse-json.js');
 
 const getBuilderProps = async (fetcher, shopifyFetcher)=>{
-    const [storeProperty, shopifyMeta] = await Promise.allSettled([
+    const [storeProperty, shopifyMeta, shopifyInfo] = await Promise.allSettled([
         fetcher([
             core.StorePropertyDocument
         ]),
         shopifyFetcher([
             adapterShopify.ShopMetaDocument
+        ]),
+        fetcher([
+            core.ShopShopifyDocument
         ])
     ]);
     const shopMeta = shopifyMeta.status === 'fulfilled' ? shopifyMeta.value : undefined;
     const shopData = storeProperty.status === 'fulfilled' ? storeProperty.value : undefined;
+    const shopInfo = shopifyInfo.status === 'fulfilled' ? shopifyInfo.value : undefined;
     const seo = shopMeta ? {
         titleTemplate: `%s | ${shopMeta.shop.name}`,
         defaultTitle: shopMeta?.shop.name,
@@ -34,7 +38,8 @@ const getBuilderProps = async (fetcher, shopifyFetcher)=>{
         swr: {
             revalidateOnMount: true
         },
-        seo
+        seo,
+        timezone: shopInfo?.shopShopify?.timezone
     });
 };
 

package/dist/cjs/libs/api/get-post-purchase-props-preview.js

@@ -253,6 +253,7 @@ const getPostPurchasePropsPreview = (fetcher, librarySaleFunnelID, storeFrontFet
                 productOffers
             });
         } catch (err) {
+            console.log('error', err);
             nextjs.captureException(err);
             throw err;
         }

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

@@ -10,7 +10,6 @@ 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 {
@@ -32,10 +31,6 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
                 ])
             ]);
             if (theme.status === 'rejected') {
-                sentry.sentryCaptureException('PreviewThemePageDocument', JSON.stringify(theme), {
-                    variables,
-                    theme
-                });
                 throw new Error(theme.reason?.[0]);
             }
             const dataBuilder = theme.value.previewThemePage;
@@ -148,7 +143,7 @@ const getStaticPagePropsPreview = (fetcher, shopifyFetcher)=>async (slug)=>{
                 customCodeHeader: dataBuilder.customCode?.header ?? null,
                 customCodeBody: dataBuilder.customCode?.body ?? null,
                 customFonts: customFonts$1,
-                interaction: dataBuilder?.interaction
+                pageBackground: normalize.extractPageBackground(dataBuilder)
             });
         } catch (err) {
             nextjs.captureException(err);

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

@@ -152,7 +152,8 @@ const getStaticPagePropsV2 = (fetcher, shopifyFetcher)=>async (slug)=>{
                 customCodeBody: dataBuilder.themePageCustomCode?.body ?? null,
                 pageHandle: dataBuilder.handle ?? null,
                 customFonts: customFonts$1,
-                interaction: dataBuilder?.interaction
+                interaction: dataBuilder?.interaction,
+                pageBackground: normalize.extractPageBackground(dataBuilder)
             });
         } catch (err) {
             nextjs.captureException(err);

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

@@ -4,7 +4,7 @@ var core = require('@gem-sdk/core');
 var merge = require('deepmerge');
 
 const baseDevices = {
-    tablet: '1023px',
+    tablet: '1024px',
     mobile: '767px'
 };
 const devicesOrder = [

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

@@ -83,6 +83,14 @@ const parseBuilderTemplate = (data)=>{
         ...data?.themePageCustomSections ?? []
     ], data?.sectionPosition);
 };
+const extractPageBackground = (data)=>{
+    try {
+        const pageBackgroundStr = data?.metafields?.find((item)=>item?.key === 'page_background')?.value;
+        return JSON.parse(pageBackgroundStr ?? '{}');
+    } catch  {
+        return {};
+    }
+};
 const parseBuilderLibraryTemplate = (data)=>{
     return normalizePageSectionResponseV2([
         ...data?.sections ?? []
@@ -94,6 +102,7 @@ const parseShopLibraryPageTemplate = (data)=>{
     ], data?.sectionPosition);
 };
 
+exports.extractPageBackground = extractPageBackground;
 exports.normalizeBuilderData = normalizeBuilderData;
 exports.normalizePageSectionResponseV2 = normalizePageSectionResponseV2;
 exports.parseBuilderLibraryTemplate = parseBuilderLibraryTemplate;

package/dist/cjs/libs/hooks/use-tracking-view.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 var core = require('@gem-sdk/core');

package/dist/cjs/libs/parse-html.js

@@ -2,27 +2,35 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var parse = require('html-react-parser');
+var Script = require('next/script');
 
-const parseHtml = (key, html, isHead)=>{
+const parseHtml = (html, isHead)=>{
     if (!html) return undefined;
     try {
         return parse(html, {
             replace: (node)=>{
-                if (node.type !== 'script' || !(node instanceof parse.Element)) return null;
-                const child = node.children?.[0];
-                if (!child) return null;
-                if (!(child instanceof parse.Text) && !isHead) return /*#__PURE__*/ jsxRuntime.jsx("script", {
-                    id: key,
-                    ...node.attribs
-                }, key);
-                if (child instanceof parse.Text && isHead) {
-                    return /*#__PURE__*/ jsxRuntime.jsx("script", {
-                        id: key,
-                        ...node.attribs,
-                        dangerouslySetInnerHTML: {
-                            __html: child.data
+                if (node.type === 'script' && node instanceof parse.Element) {
+                    const child = node.children?.[0];
+                    if (child instanceof parse.Text) {
+                        if (isHead) return /*#__PURE__*/ jsxRuntime.jsx("script", {
+                            ...node.attribs,
+                            dangerouslySetInnerHTML: {
+                                __html: child.data
+                            }
+                        });
+                        else return /*#__PURE__*/ jsxRuntime.jsx(Script, {
+                            ...node.attribs,
+                            dangerouslySetInnerHTML: {
+                                __html: child.data
+                            }
+                        });
+                    } else {
+                        if (!isHead) {
+                            return /*#__PURE__*/ jsxRuntime.jsx(Script, {
+                                ...node.attribs
+                            });
                         }
-                    }, key);
+                    }
                 }
             }
         });

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,9 +1,8 @@
+'use client';
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@gem-sdk/core');
-var nextSeo = require('next-seo');
-var Head = require('next/head');
 var react = require('react');
 var Toolbox = require('../components/builder/Toolbox.js');
 var Header = require('../components/builder/Header.js');
@@ -15,7 +14,7 @@ var Toolbar = require('../components/builder/Toolbar.js');
 var SwitchView = require('../components/builder/SwitchView.js');
 var Body = require('../components/builder/Body.js');
 
-const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, pageType, editorImageToLayout, isThemeSectionEditor, hiddenToolbar, pageName, isOriginTemplate })=>{
+const BuilderPage = ({ components, themeStyle, fontStyle, sectionData, pageType, editorImageToLayout, isThemeSectionEditor, hiddenToolbar, pageName, isOriginTemplate })=>{
     const [loadSuccess, setLoadSuccess] = react.useState(false);
     const isDisableHeaderFooter = ()=>{
         return isThemeSectionEditor;
@@ -38,26 +37,19 @@ const BuilderPage = ({ components, seo, themeStyle, fontStyle, sectionData, page
     };
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [
-            /*#__PURE__*/ jsxRuntime.jsx(nextSeo.NextSeo, {
-                ...seo
+            themeStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
+                type: "text/css",
+                id: "global-style",
+                dangerouslySetInnerHTML: {
+                    __html: themeStyle
+                }
             }),
-            /*#__PURE__*/ jsxRuntime.jsxs(Head, {
-                children: [
-                    themeStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
-                        type: "text/css",
-                        id: "global-style",
-                        dangerouslySetInnerHTML: {
-                            __html: themeStyle
-                        }
-                    }),
-                    fontStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
-                        "data-id": "google-fonts",
-                        type: "text/css",
-                        dangerouslySetInnerHTML: {
-                            __html: fontStyle
-                        }
-                    })
-                ]
+            fontStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
+                "data-id": "google-fonts",
+                type: "text/css",
+                dangerouslySetInnerHTML: {
+                    __html: fontStyle
+                }
             }),
             /*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
                 children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {

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

@@ -1,56 +1,47 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var core = require('@gem-sdk/core');
-var nextSeo = require('next-seo');
 var dynamic = require('next/dynamic');
-var Head = require('next/head');
-var router = require('next/router');
+var react = require('react');
 
 const CollectionProvider = dynamic(()=>import('@gem-sdk/core').then((m)=>m.CollectionProvider));
-const CollectionDetailPage = ({ seo, components, builderData, sectionData, themeStyle, collection, fontStyle })=>{
-    const router$1 = router.useRouter();
-    if (router$1.isFallback) {
-        return /*#__PURE__*/ jsxRuntime.jsx("div", {
-            children: "Loading..."
-        });
-    }
+const CollectionDetailPage = ({ components, builderData, sectionData, themeStyle, collection, fontStyle })=>{
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [
-            /*#__PURE__*/ jsxRuntime.jsx(nextSeo.NextSeo, {
-                ...seo
+            themeStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
+                "data-id": "global-style",
+                type: "text/css",
+                dangerouslySetInnerHTML: {
+                    __html: themeStyle
+                }
             }),
-            /*#__PURE__*/ jsxRuntime.jsxs(Head, {
-                children: [
-                    themeStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
-                        "data-id": "global-style",
-                        type: "text/css",
-                        dangerouslySetInnerHTML: {
-                            __html: themeStyle
-                        }
-                    }),
-                    fontStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
-                        "data-id": "google-fonts",
-                        type: "text/css",
-                        dangerouslySetInnerHTML: {
-                            __html: fontStyle
-                        }
-                    })
-                ]
+            fontStyle && /*#__PURE__*/ jsxRuntime.jsx("style", {
+                "data-id": "google-fonts",
+                type: "text/css",
+                dangerouslySetInnerHTML: {
+                    __html: fontStyle
+                }
             }),
-            /*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
-                children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
-                    components: components,
-                    children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
-                        data: sectionData,
-                        children: /*#__PURE__*/ jsxRuntime.jsx(CollectionProvider, {
-                            collection: collection,
-                            children: builderData && /*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
-                                state: builderData,
-                                children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
-                                    uid: "ROOT"
+            /*#__PURE__*/ jsxRuntime.jsx(react.Suspense, {
+                fallback: /*#__PURE__*/ jsxRuntime.jsx("div", {
+                    children: "Loading..."
+                }),
+                children: /*#__PURE__*/ jsxRuntime.jsx(core.PageProvider, {
+                    children: /*#__PURE__*/ jsxRuntime.jsx(core.BuilderComponentProvider, {
+                        components: components,
+                        children: /*#__PURE__*/ jsxRuntime.jsx(core.SectionProvider, {
+                            data: sectionData,
+                            children: /*#__PURE__*/ jsxRuntime.jsx(CollectionProvider, {
+                                collection: collection,
+                                children: builderData && /*#__PURE__*/ jsxRuntime.jsx(core.BuilderProvider, {
+                                    state: builderData,
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(core.Render, {
+                                        uid: "ROOT"
+                                    })
                                 })
                             })
                         })

package/dist/cjs/pages/preview.js

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