@gem-sdk/pages 1.9.60 → 1.10.18

package/dist/cjs/pages/builder.js

@@ -13,14 +13,14 @@ var PopupManager = require('../components/builder/PopupManager.js');
 
 const BuilderPage = ({ components , seo , themeStyle , fontStyle , sectionData , pageType  })=>{
     const [loadSuccess, setLoadSuccess] = react.useState(false);
-    const initState = {
-        ROOT: {
-            uid: 'ROOT',
-            tag: 'Root',
-            label: 'Root',
-            childrens: []
-        }
-    };
+    const initState = react.useMemo(()=>({
+            ROOT: {
+                uid: 'ROOT',
+                tag: 'Root',
+                label: 'Root',
+                childrens: []
+            }
+        }), []);
     react.useEffect(()=>{
         setLoadSuccess(true);
     }, []);

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

@@ -1,9 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
-import { useMatchMutate, useShopStore, useBuilderPreviewStore, useSectionStore, useModalStore, cls } from '@gem-sdk/core';
-import { memo, useState, useCallback, useEffect } from 'react';
+import { useMatchMutate, useShopStore, useBuilderPreviewStore, useSectionStore, useModalStore } from '@gem-sdk/core';
+import { memo, useCallback, useEffect } from 'react';
 import { createFontUrl } from '../../libs/google-fonts.js';
 import { genCSS } from '../../libs/helpers/gen-css.js';
 import { getStorefrontApi } from '../../libs/get-storefront-api.js';
+import { shopifyCdnWithGoogleFonts } from '../../libs/shopify-cdn-with-google-fonts.js';
 
 const globalStyleId = 'global-style';
 const globalFontId = 'google-font-builder';
@@ -20,7 +21,6 @@ const Toolbox = ()=>{
     const addSection = useSectionStore((s)=>s.addSection);
     const changeSwatches = useShopStore((s)=>s.changeSwatches);
     const changeLayoutSettings = useShopStore((s)=>s.changeLayoutSettings);
-    const [initEventSuccess, setInitEventSuccess] = useState(false);
     const clearModal = useModalStore((s)=>s.clearModal);
     // Revalidate all query with key match query/
     const onRevalidateQuery = useCallback(()=>{
@@ -48,6 +48,14 @@ const Toolbox = ()=>{
                 const themeStyle = genCSS(detail.data, detail.mobileOnly);
                 const font = Object.entries(detail.data?.font).map(([, value])=>{
                     return value;
+                }).map((item)=>{
+                    if (item.type == 'custom') {
+                        const isGoogleFont = shopifyCdnWithGoogleFonts.find((ggFont)=>ggFont.family == item.family);
+                        if (isGoogleFont) {
+                            return isGoogleFont;
+                        }
+                    }
+                    return item;
                 });
                 const fontUrl = createFontUrl(font);
                 const globalStyle = document.getElementById(globalStyleId);
@@ -195,7 +203,6 @@ const Toolbox = ()=>{
         window.addEventListener('set-global-style', onChangeGlobalStyle);
         window.addEventListener('update-global-swatches-data', onChangeSwatchesData);
         window.addEventListener('on-off-header-footer', onChangeLayoutSettingData);
-        setInitEventSuccess(true);
         return ()=>{
             window.removeEventListener('update-shop-info', onChangeShopInfo);
             window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -206,7 +213,7 @@ const Toolbox = ()=>{
             window.removeEventListener('update-entity-prop', onUpdateEntityProp);
             window.removeEventListener('set-global-style', onChangeGlobalStyle);
             window.removeEventListener('update-global-swatches-data', onChangeSwatchesData);
-            window.addEventListener('on-off-header-footer', onChangeLayoutSettingData);
+            window.removeEventListener('on-off-header-footer', onChangeLayoutSettingData);
         };
     }, [
         onAddEntity,
@@ -221,9 +228,7 @@ const Toolbox = ()=>{
         onChangeLayoutSettingData
     ]);
     return /*#__PURE__*/ jsx("div", {
-        className: cls({
-            toolbox: initEventSuccess
-        })
+        className: "toolbox"
     });
 };
 var Toolbox$1 = /*#__PURE__*/ memo(Toolbox);