@gem-sdk/pages 1.35.0 → 1.36.6

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

@@ -29,6 +29,7 @@ const Toolbox = ()=>{
     const addSection = core.useSectionStore((s)=>s.addSection);
     const changeSwatches = core.useShopStore((s)=>s.changeSwatches);
     const updateItemName = core.useBuilderPreviewStore((s)=>s.updateItemName);
+    const updateItemAttribute = core.useBuilderPreviewStore((s)=>s.updateItemAttribute);
     const changeLayoutSettings = core.useShopStore((s)=>s.changeLayoutSettings);
     const changeCreateThemeSectionCount = core.useShopStore((s)=>s.changeCreateThemeSectionCount);
     const changeShopPlan = core.useShopStore((s)=>s.changeShopPlan);
@@ -304,6 +305,14 @@ const Toolbox = ()=>{
     }, [
         updateItemName
     ]);
+    const onUpdateItemAttribute = react.useCallback((e)=>{
+        const detail = e.detail;
+        if (detail.uid) {
+            updateItemAttribute(detail.uid, detail.value || '', detail.attr || '');
+        }
+    }, [
+        updateItemAttribute
+    ]);
     react.useEffect(()=>{
         if (fonts) {
             setFontsToHead('google-font-element', fonts);
@@ -328,6 +337,7 @@ const Toolbox = ()=>{
         window.addEventListener('set-dynamic-product', onUpdateDynamicProduct);
         window.addEventListener('set-dynamic-collection', onUpdateDynamicCollection);
         window.addEventListener('update-item-name', onUpdateItemName);
+        window.addEventListener('update-item-attribute', onUpdateItemAttribute);
         return ()=>{
             window.removeEventListener('update-shop-info', onChangeShopInfo);
             window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -344,6 +354,7 @@ const Toolbox = ()=>{
             window.removeEventListener('set-dynamic-product', onUpdateDynamicProduct);
             window.removeEventListener('set-dynamic-collection', onUpdateDynamicCollection);
             window.removeEventListener('update-item-name', onUpdateItemName);
+            window.removeEventListener('update-item-attribute', onUpdateItemAttribute);
         };
     }, [
         onAddEntity,
@@ -361,7 +372,8 @@ const Toolbox = ()=>{
         onUpdateCreateThemeSectionCount,
         onUpdateDynamicProduct,
         onUpdateDynamicCollection,
-        onUpdateItemName
+        onUpdateItemName,
+        onUpdateItemAttribute
     ]);
     return /*#__PURE__*/ jsxRuntime.jsx("div", {
         className: "toolbox"

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

@@ -2,20 +2,6 @@
 
 var genFonts = require('./helpers/gen-fonts.js');
 
-const CHROME_UA = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36';
-const IE_UA = 'Mozilla/5.0 (Windows NT 10.0; Trident/7.0; rv:11.0) like Gecko';
-async function getFontForUA(url, UA) {
-    return fetch(url, {
-        headers: {
-            'User-Agent': UA
-        }
-    }).then((res)=>{
-        if (res.status === 200) {
-            return res.text();
-        }
-        return '';
-    });
-}
 const composeFonts = (fonts)=>{
     const uniqFonts = fonts.filter((font, index, arr)=>{
         return index === arr.findIndex((t)=>t.family === font.family);
@@ -56,31 +42,19 @@ const createFontUrl = (fonts, option)=>{
     }
     return `https://fonts.googleapis.com/css?${decodeURIComponent(params.toString())}`;
 };
-async function getFonts(fonts, option, maxSize) {
+async function getFonts(fonts, option) {
     /**
    * The order of IE -> Chrome is important, other wise chrome starts loading woff1.
    * CSS cascading 🤷‍♂️.
    */ const url = createFontUrl(fonts, option);
     if (!url) return '';
     try {
-        const [ie, chrome] = await Promise.all([
-            getFontForUA(url, IE_UA),
-            getFontForUA(url, CHROME_UA)
-        ]);
-        const value = ie + chrome;
-        if (maxSize) {
-            const textEncoder = new TextEncoder();
-            const size = value ? textEncoder.encode(value).length : 0;
-            if (Math.ceil(size / 1024) >= maxSize) {
-                return `@import url('${url}');`;
-            }
-        }
-        return value;
+        return `@import url('${url}');`;
     } catch (e) {
         return '';
     }
 }
-const getFontFromGlobalStyle = (data, maxSize)=>{
+const getFontFromGlobalStyle = (data)=>{
     if (!data) return '';
     try {
         const globalStyle = JSON.parse(data);
@@ -88,7 +62,7 @@ const getFontFromGlobalStyle = (data, maxSize)=>{
         const fonts = Object.entries(fontData).map(([, value])=>{
             return value;
         });
-        return getFonts(fonts, undefined, maxSize);
+        return getFonts(fonts);
     } catch  {
         return '';
     }

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

@@ -25,6 +25,7 @@ const Toolbox = ()=>{
     const addSection = useSectionStore((s)=>s.addSection);
     const changeSwatches = useShopStore((s)=>s.changeSwatches);
     const updateItemName = useBuilderPreviewStore((s)=>s.updateItemName);
+    const updateItemAttribute = useBuilderPreviewStore((s)=>s.updateItemAttribute);
     const changeLayoutSettings = useShopStore((s)=>s.changeLayoutSettings);
     const changeCreateThemeSectionCount = useShopStore((s)=>s.changeCreateThemeSectionCount);
     const changeShopPlan = useShopStore((s)=>s.changeShopPlan);
@@ -300,6 +301,14 @@ const Toolbox = ()=>{
     }, [
         updateItemName
     ]);
+    const onUpdateItemAttribute = useCallback((e)=>{
+        const detail = e.detail;
+        if (detail.uid) {
+            updateItemAttribute(detail.uid, detail.value || '', detail.attr || '');
+        }
+    }, [
+        updateItemAttribute
+    ]);
     useEffect(()=>{
         if (fonts) {
             setFontsToHead('google-font-element', fonts);
@@ -324,6 +333,7 @@ const Toolbox = ()=>{
         window.addEventListener('set-dynamic-product', onUpdateDynamicProduct);
         window.addEventListener('set-dynamic-collection', onUpdateDynamicCollection);
         window.addEventListener('update-item-name', onUpdateItemName);
+        window.addEventListener('update-item-attribute', onUpdateItemAttribute);
         return ()=>{
             window.removeEventListener('update-shop-info', onChangeShopInfo);
             window.removeEventListener('revalidate-query', onRevalidateQuery);
@@ -340,6 +350,7 @@ const Toolbox = ()=>{
             window.removeEventListener('set-dynamic-product', onUpdateDynamicProduct);
             window.removeEventListener('set-dynamic-collection', onUpdateDynamicCollection);
             window.removeEventListener('update-item-name', onUpdateItemName);
+            window.removeEventListener('update-item-attribute', onUpdateItemAttribute);
         };
     }, [
         onAddEntity,
@@ -357,7 +368,8 @@ const Toolbox = ()=>{
         onUpdateCreateThemeSectionCount,
         onUpdateDynamicProduct,
         onUpdateDynamicCollection,
-        onUpdateItemName
+        onUpdateItemName,
+        onUpdateItemAttribute
     ]);
     return /*#__PURE__*/ jsx("div", {
         className: "toolbox"

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

@@ -1,19 +1,5 @@
 import { getFontsFromDataBuilder } from './helpers/gen-fonts.js';
 
-const CHROME_UA = 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.61 Safari/537.36';
-const IE_UA = 'Mozilla/5.0 (Windows NT 10.0; Trident/7.0; rv:11.0) like Gecko';
-async function getFontForUA(url, UA) {
-    return fetch(url, {
-        headers: {
-            'User-Agent': UA
-        }
-    }).then((res)=>{
-        if (res.status === 200) {
-            return res.text();
-        }
-        return '';
-    });
-}
 const composeFonts = (fonts)=>{
     const uniqFonts = fonts.filter((font, index, arr)=>{
         return index === arr.findIndex((t)=>t.family === font.family);
@@ -54,31 +40,19 @@ const createFontUrl = (fonts, option)=>{
     }
     return `https://fonts.googleapis.com/css?${decodeURIComponent(params.toString())}`;
 };
-async function getFonts(fonts, option, maxSize) {
+async function getFonts(fonts, option) {
     /**
    * The order of IE -> Chrome is important, other wise chrome starts loading woff1.
    * CSS cascading 🤷‍♂️.
    */ const url = createFontUrl(fonts, option);
     if (!url) return '';
     try {
-        const [ie, chrome] = await Promise.all([
-            getFontForUA(url, IE_UA),
-            getFontForUA(url, CHROME_UA)
-        ]);
-        const value = ie + chrome;
-        if (maxSize) {
-            const textEncoder = new TextEncoder();
-            const size = value ? textEncoder.encode(value).length : 0;
-            if (Math.ceil(size / 1024) >= maxSize) {
-                return `@import url('${url}');`;
-            }
-        }
-        return value;
+        return `@import url('${url}');`;
     } catch (e) {
         return '';
     }
 }
-const getFontFromGlobalStyle = (data, maxSize)=>{
+const getFontFromGlobalStyle = (data)=>{
     if (!data) return '';
     try {
         const globalStyle = JSON.parse(data);
@@ -86,7 +60,7 @@ const getFontFromGlobalStyle = (data, maxSize)=>{
         const fonts = Object.entries(fontData).map(([, value])=>{
             return value;
         });
-        return getFonts(fonts, undefined, maxSize);
+        return getFonts(fonts);
     } catch  {
         return '';
     }

package/dist/types/index.d.ts

@@ -167,8 +167,8 @@ type FontOption = {
     subset?: string;
     effect?: string;
 };
-declare function getFonts(fonts: FontItem[], option?: FontOption, maxSize?: number): Promise<string>;
-declare const getFontFromGlobalStyle: (data?: string, maxSize?: number) => Promise<string> | "";
+declare function getFonts(fonts: FontItem[], option?: FontOption): Promise<string>;
+declare const getFontFromGlobalStyle: (data?: string) => Promise<string> | "";
 
 declare const getFontsFromDataBuilder: (dataBuilder: Record<string, any>) => FontItem[];
 declare const getFontFromGroupSetting: (fonts: FontItem[], groupSetting: Record<string, any>) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/pages",
-  "version": "1.35.0",
+  "version": "1.36.6",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",
@@ -25,7 +25,7 @@
     "next-seo": "^6.0.0"
   },
   "devDependencies": {
-    "@gem-sdk/core": "1.35.0",
+    "@gem-sdk/core": "1.36.6",
     "@gem-sdk/plugin-cookie-bar": "1.35.0",
     "@gem-sdk/plugin-quick-view": "1.35.0",
     "@gem-sdk/plugin-sticky-add-to-cart": "1.35.0"