@gem-sdk/core 1.46.0-staging.4 → 1.46.0

package/dist/cjs/components/ComponentToolbarPreview.js

@@ -59,7 +59,8 @@ const ComponentToolbarPreview = (props)=>{
     const editProductElementList = [
         'Product Title',
         'Product Description',
-        'Product Price'
+        'Product Price',
+        'Product Vendor'
     ];
     const isOverToolbarPosition = (el, parent)=>{
         const parentLength = parents.length;
@@ -294,6 +295,11 @@ const ComponentToolbarPreview = (props)=>{
     const isEnableCreateThemeSection = ()=>{
         return editingPageType !== 'STATIC' && editingPageType !== 'POST_PURCHASE';
     };
+    const isEnableAIContent = ()=>{
+        const { isShopifySection, tag } = props;
+        if (isShopifySection || isThemeSection && !isThemeSectionEditor) return false;
+        return constant.ableGenerateContentElements.includes(tag);
+    };
     // if (!isActive) return null;
     return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
         children: [
@@ -459,7 +465,7 @@ const ComponentToolbarPreview = (props)=>{
                     props.tag === 'Section' && !props.isThemeSection && isEnableCreateThemeSection() && !props.isShopifySection && getIndexSection() < SECTION_LIMIT && /*#__PURE__*/ jsxRuntime.jsx(CreateThemeSection.CreateThemeSection, {
                         ...props
                     }),
-                    !props.isShopifySection && constant.ableGenerateContentElements.includes(props.tag) && /*#__PURE__*/ jsxRuntime.jsx(AIContentGenerator.AIContentGenerator, {
+                    isEnableAIContent() && /*#__PURE__*/ jsxRuntime.jsx(AIContentGenerator.AIContentGenerator, {
                         ...props
                     }),
                     props.tag == 'Sticky' && /*#__PURE__*/ jsxRuntime.jsx("div", {

package/dist/cjs/components/Render.liquid.js

@@ -20,6 +20,7 @@ require('dayjs');
 var composeAdvanceStyle = require('../helpers/compose-advance-style.js');
 var convert = require('../helpers/convert.js');
 var render = require('../helpers/render.js');
+var cssjson = require('cssjson');
 
 const componentsRenderWithParentId = [
     'CarouselItem'
@@ -181,19 +182,28 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
         };
     }
 };
+const isEmptyCSS = (cssString)=>{
+    if (!cssString) return true;
+    const cssJSON = cssjson.toJSON(cssString);
+    const isObjectEmpty = (obj)=>{
+        if (typeof obj !== 'object' || obj === null) return true;
+        return !Object.keys(obj).some((key)=>{
+            return key === 'attributes' && Object.keys(obj[key]).length > 0 || typeof obj[key] === 'object' && !isObjectEmpty(obj[key]);
+        });
+    };
+    return isObjectEmpty(cssJSON.children);
+};
 const RenderCustomCode = (item)=>{
     const { css, javascript, rootClassName } = item.advanced?.editorData || {};
     const replacedCSS = css?.replaceAll(rootClassName, item.uid);
     const replacedJS = javascript?.replaceAll(rootClassName, item.uid);
-    const cssCode = render.RenderIf(!!css, render.template`
-      <style
-        id="${`custom-css-${item?.uid}`}"
-      >${replacedCSS}</style>
+    const cssCode = render.RenderIf(!!css && !isEmptyCSS(replacedCSS), render.template`
+      <style id="${`custom-css-${item?.uid}`}">
+        ${replacedCSS}
+      </style>
     `);
     const jsCode = render.RenderIf(!!javascript, render.template`
-      <script
-        id="${`custom-js-${item?.uid}`}"
-      >
+      <script id="${`custom-js-${item?.uid}`}">
         try {
           ${replacedJS}
         } catch(err){}

package/dist/cjs/components/ai-generator/AIContentGenerator.js

@@ -108,7 +108,7 @@ const AIContentGenerator = ({ ...props })=>{
         ref: genTool,
         children: [
             /*#__PURE__*/ jsxRuntime.jsx("div", {
-                className: "gp-gen-content-toolbar gp-border-r-[#6a6a6a] gp-border-r gp-pr-1 gp-mr-1",
+                className: "gp-gen-content-toolbar gp-border-r gp-pr-1 gp-mr-1",
                 children: /*#__PURE__*/ jsxRuntime.jsxs("button", {
                     className: classNames({
                         'gp-toolbar-ai-active': isShowPopup

package/dist/cjs/graphql/queries/articles.generated.js

@@ -22,7 +22,9 @@ const ArticlesDocument = `
         descriptionMeta
         baseID
         platform
-        tags
+        tags {
+          name
+        }
         isSample
         platformCreatedAt
         author

package/dist/cjs/graphql/queries/blogs.generated.js

@@ -29,7 +29,9 @@ const BlogsDocument = `
               titleMeta
               descriptionMeta
               baseID
-              tags
+              tags {
+                name
+              }
               isSample
               platformCreatedAt
               author

package/dist/cjs/helpers/loop-component.js

@@ -0,0 +1,16 @@
+'use strict';
+
+function loopComponent(component, callback) {
+    if (component) {
+        callback(component);
+    }
+    if (component?.childrens?.length) {
+        // eslint-disable-next-line
+        for(let i = 0; i < component.childrens.length; i++){
+            const children = component.childrens[i];
+            loopComponent(children, callback);
+        }
+    }
+}
+
+exports.loopComponent = loopComponent;

package/dist/cjs/helpers/pascal-to-kebab-case.js

@@ -0,0 +1,7 @@
+'use strict';
+
+const pascalToKebab = (pascalCaseString)=>{
+    return pascalCaseString.replace(/[A-Z]/g, (match, offset)=>(offset ? '-' : '') + match.toLowerCase());
+};
+
+exports.pascalToKebab = pascalToKebab;

package/dist/cjs/helpers/third-party/addAppBlockId.js

@@ -0,0 +1,20 @@
+'use strict';
+
+var loopComponent = require('../loop-component.js');
+var composeAppBlockId = require('./composeAppBlockId.js');
+
+const addAppBlockId = (component)=>{
+    const strComponent = JSON.stringify(component) || '';
+    if (!strComponent.includes('appBlockId')) {
+        return component;
+    }
+    loopComponent.loopComponent(component, (component)=>handleSetBlockId(component));
+    return component;
+};
+const handleSetBlockId = (component)=>{
+    const { tag, uid } = component;
+    if (component.settings.appBlockId === undefined) return component;
+    component.settings.appBlockId = composeAppBlockId.composeAppBlockId(tag, uid);
+};
+
+exports.addAppBlockId = addAppBlockId;

package/dist/cjs/helpers/third-party/appConfig.js

@@ -0,0 +1,52 @@
+'use strict';
+
+const RechargeSubscriptionsConfig = {
+    RechargeSubscriptions: {
+        appName: 'recharge-subscriptions',
+        appId: '371eed76-0b44-4869-9813-730372ea378e'
+    }
+};
+const BonLoyaltyRewardsReferralsConfig = {
+    BonLoyaltyRewardsReferrals: {
+        appName: 'bon-loyalty',
+        appId: '63496a04-c097-48d1-8c11-475aec24b12e'
+    }
+};
+const SubifySubscriptionsConfig = {
+    SubifySubscriptionsApp: {
+        appName: 'subify-subscriptions-app',
+        appId: 'bc0dba25-cd46-4841-bea4-6bdfe9ac815f'
+    }
+};
+const SelleasyConfig = {
+    Selleasy: {
+        appName: 'selleasy',
+        appId: '790c1a03-a71f-4bc1-9869-00dad526d3c2'
+    }
+};
+const LoopSubscriptionsConfig = {
+    LoopSubscriptions: {
+        appName: 'loop-subscriptions',
+        appId: '267a7c64-5cb3-4552-b817-5485165f0a0b'
+    }
+};
+const SkioSubscriptionsYcS20Config = {
+    SkioSubscriptionsYcS20: {
+        appName: 'skio-subscriptions-yc-s20',
+        appId: 'de50f7a4-0bb0-4d4c-84e2-c03dce83436d'
+    }
+};
+const ShopifyFormsConfig = {
+    ShopifyForms: {
+        appName: 'forms',
+        appId: '8744a304-fcb1-4347-b211-bb6b4759a76a'
+    }
+};
+
+exports.BonLoyaltyRewardsReferralsConfig = BonLoyaltyRewardsReferralsConfig;
+exports.LoopSubscriptionsConfig = LoopSubscriptionsConfig;
+exports.RechargeSubscriptionsConfig = RechargeSubscriptionsConfig;
+exports.SelleasyConfig = SelleasyConfig;
+exports.ShopifyFormsConfig = ShopifyFormsConfig;
+exports.SkioSubscriptionsYcS20Config = SkioSubscriptionsYcS20Config;
+exports.SubifySubscriptionsConfig = SubifySubscriptionsConfig;

package/dist/cjs/helpers/third-party/appSetting.js

@@ -0,0 +1,99 @@
+'use strict';
+
+const RechargeSubscriptions = {
+    RechargeSubscriptions: {
+        'subscription-widget': {
+            product: '{{ product }}'
+        }
+    }
+};
+const LoyaltyRewardsReferrals = {
+    BonLoyaltyRewardsReferrals: {
+        'loyalty-page-block': null,
+        'loyalty-page-earning-block': null,
+        'loyalty-page-header-block': null,
+        'loyalty-page-profile-block': null,
+        'loyalty-page-redeem-block': null,
+        'loyalty-page-referral-block': null,
+        'loyalty-page-tier-block': null,
+        'product-point-preview': null
+    }
+};
+const SubifySubscriptions = {
+    SubifySubscriptionsApp: {
+        'app-block': {
+            product: '{{product}}',
+            use_app_block_wording: false,
+            widget_label: 'Purchase options',
+            one_time_purchase_text: 'One-Time Purchase',
+            subscription_text: 'Subscribe and save',
+            delivery_frequency_text: 'Delivery frequency',
+            prepaid_subscription_text: 'Subscription with prepaid',
+            skin1_priceSuffix: 'each',
+            skin1_save: 'Save(skin1)',
+            skin1_prepaid_payment_title: 'prepaid',
+            skin1_normal_payment_title: 'pay as you go',
+            skin2_discountSuffix: 'Save',
+            skin3_fullPrice: 'Full price',
+            skin3_priceSuffix: 'each',
+            skin3_discountSuffix: 'Off',
+            skin4_justOnce: 'Just once',
+            skin4_discountSuffix: 'Off',
+            skin4_priceSuffix: 'each',
+            skin4_fullPrice: '(Full price)',
+            skin4_sellingPlansTitle: 'Renews every:',
+            from: 'from',
+            max_discount_badge_title: 'UP To',
+            pay: 'Pay',
+            price_save_up_to: 'save up to'
+        }
+    }
+};
+const SelleasyWidget = {
+    Selleasy: {
+        'lb-upsell-fbt-block': null,
+        'lb-upsell-addon-block': null
+    }
+};
+const LoopSubscriptions = {
+    LoopSubscriptions: {
+        star_rating: {
+            product: '{{product}}'
+        }
+    }
+};
+const SkioSubscriptionsYcS20 = {
+    SkioSubscriptionsYcS20: {
+        'app-block': null
+    }
+};
+const ShopifyForms = {
+    ShopifyForms: {
+        inline: {
+            form_id: null
+        }
+    }
+};
+const overrideSettings = (tag, currentSetting, appSetting)=>{
+    switch(tag){
+        case 'ShopifyForms':
+            return {
+                ...currentSetting,
+                form_id: appSetting['formId']
+            };
+        default:
+            return currentSetting;
+    }
+};
+const composeSettingsByWidgetType = {
+    ...ShopifyForms,
+    ...SkioSubscriptionsYcS20,
+    ...LoopSubscriptions,
+    ...RechargeSubscriptions,
+    ...LoyaltyRewardsReferrals,
+    ...SubifySubscriptions,
+    ...SelleasyWidget
+};
+
+exports.composeSettingsByWidgetType = composeSettingsByWidgetType;
+exports.overrideSettings = overrideSettings;

package/dist/cjs/helpers/third-party/composeAppBlockId.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var pascalToKebabCase = require('../pascal-to-kebab-case.js');
+var constant = require('./constant.js');
+
+const composeAppBlockId = (tag, uid)=>{
+    const key = pascalToKebabCase.pascalToKebab(tag);
+    return `${constant.THIRD_PARTY_APP_BLOCK_ID_PREFIX}_${key}_${uid}`;
+};
+
+exports.composeAppBlockId = composeAppBlockId;

package/dist/cjs/helpers/third-party/constant.js

@@ -0,0 +1,17 @@
+'use strict';
+
+var appConfig = require('./appConfig.js');
+
+const mapShopifyAppMeta = {
+    ...appConfig.RechargeSubscriptionsConfig,
+    ...appConfig.BonLoyaltyRewardsReferralsConfig,
+    ...appConfig.SubifySubscriptionsConfig,
+    ...appConfig.SelleasyConfig,
+    ...appConfig.LoopSubscriptionsConfig,
+    ...appConfig.SkioSubscriptionsYcS20Config,
+    ...appConfig.ShopifyFormsConfig
+};
+const THIRD_PARTY_APP_BLOCK_ID_PREFIX = 'gp_app';
+
+exports.THIRD_PARTY_APP_BLOCK_ID_PREFIX = THIRD_PARTY_APP_BLOCK_ID_PREFIX;
+exports.mapShopifyAppMeta = mapShopifyAppMeta;

package/dist/cjs/helpers/third-party/generateAppBlockConfigs.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var loopComponent = require('../loop-component.js');
+var getAppBlockConfig = require('./getAppBlockConfig.js');
+
+const generateAppBlockConfigs = (component)=>{
+    const strComponent = JSON.stringify(component) || '';
+    if (!strComponent.includes('appBlockId')) return null;
+    const configs = [];
+    loopComponent.loopComponent(component, (component)=>{
+        const settings = component.settings || {};
+        const appBlockId = settings?.appBlockId || '';
+        if (!appBlockId) return;
+        const config = getAppBlockConfig.getAppBlockConfig(component.tag, appBlockId, settings);
+        if (!config) return;
+        configs.push(config);
+    });
+    if (!configs.length) return null;
+    return {
+        newBlocks: extractBlocks(configs),
+        newBlockOrder: extractBlockOrder(configs)
+    };
+};
+function extractBlocks(array) {
+    return array.reduce((acc, item)=>{
+        acc[item.key] = item.value;
+        return acc;
+    }, {});
+}
+function extractBlockOrder(array) {
+    return array.map((item)=>item.key);
+}
+
+exports.generateAppBlockConfigs = generateAppBlockConfigs;

package/dist/cjs/helpers/third-party/getAppBlockConfig.js

@@ -0,0 +1,24 @@
+'use strict';
+
+var appSetting = require('./appSetting.js');
+var getAppBlockType = require('./getAppBlockType.js');
+
+const getAppBlockConfig = (tag, appBlockId, settings)=>{
+    const appBlockType = getAppBlockType.getAppBlockType({
+        tag,
+        widgetType: settings?.widgetType
+    });
+    const settingByWidget = appSetting.composeSettingsByWidgetType[tag][settings?.widgetType];
+    const appSettings = appSetting.overrideSettings(tag, settingByWidget, settings);
+    return {
+        key: appBlockId,
+        value: {
+            type: appBlockType,
+            ...settingByWidget && {
+                settings: appSettings
+            }
+        }
+    };
+};
+
+exports.getAppBlockConfig = getAppBlockConfig;

package/dist/cjs/helpers/third-party/getAppBlockType.js

@@ -0,0 +1,12 @@
+'use strict';
+
+var constant = require('./constant.js');
+
+const getAppBlockType = ({ tag, widgetType })=>{
+    const shopifyAppMeta = constant.mapShopifyAppMeta[tag];
+    if (!shopifyAppMeta) return '';
+    const { appName, appId } = shopifyAppMeta;
+    return `shopify://apps/${appName}/blocks/${widgetType}/${appId}`;
+};
+
+exports.getAppBlockType = getAppBlockType;

package/dist/cjs/helpers/third-party/getAppBlocks.js

@@ -0,0 +1,30 @@
+'use strict';
+
+var addAppBlockId = require('./addAppBlockId.js');
+var generateAppBlockConfigs = require('./generateAppBlockConfigs.js');
+var mergeBlock = require('./mergeBlock.js');
+var mergeBlockOrder = require('./mergeBlockOrder.js');
+var removeGPAppItems = require('./removeGPAppItems.js');
+
+const getAppBlocks = (section)=>{
+    const { blocks: currentBlock, block_order: currentBlockOrder } = JSON.parse(section?.appBlocks || '{}');
+    const component = JSON.parse(section?.component || '');
+    const componentWithAppBlockId = addAppBlockId.addAppBlockId(component);
+    const appBlockConfigs = generateAppBlockConfigs.generateAppBlockConfigs(componentWithAppBlockId);
+    if (!appBlockConfigs) {
+        if (!currentBlock || !currentBlockOrder) return {};
+        return {
+            blocks: removeGPAppItems.removeAllGPAppItemsFromBlocks(currentBlock),
+            block_order: removeGPAppItems.removeAllGPAppItemsFromBlockOrder(currentBlockOrder)
+        };
+    }
+    const { newBlocks, newBlockOrder } = appBlockConfigs;
+    const blocks = mergeBlock.mergeBlocks(newBlocks, currentBlock);
+    const block_order = mergeBlockOrder.mergeBlockOrder(newBlockOrder, currentBlockOrder);
+    return {
+        blocks,
+        block_order
+    };
+};
+
+exports.getAppBlocks = getAppBlocks;

package/dist/cjs/helpers/third-party/mergeBlock.js

@@ -0,0 +1,19 @@
+'use strict';
+
+function mergeBlocks(newBlocks, blocks) {
+    if (!blocks) return newBlocks;
+    const result = {};
+    // Add all non-gp_app blocks from the original blocks
+    for (const [key, value] of Object.entries(blocks)){
+        if (!key.startsWith('gp_app')) {
+            result[key] = value;
+        }
+    }
+    // Add all blocks from new-blocks
+    for (const [key, value] of Object.entries(newBlocks)){
+        result[key] = value;
+    }
+    return result;
+}
+
+exports.mergeBlocks = mergeBlocks;

package/dist/cjs/helpers/third-party/mergeBlockOrder.js

@@ -0,0 +1,47 @@
+'use strict';
+
+var constant = require('./constant.js');
+
+function isGpAppItem(item) {
+    if (!item) return false;
+    return item.startsWith(constant.THIRD_PARTY_APP_BLOCK_ID_PREFIX);
+}
+function filterCurrentOrder(currentOrder, newOrderSet) {
+    return currentOrder.filter((item)=>!isGpAppItem(item) || newOrderSet.has(item));
+}
+function processNonGpAppItem(item, resultOrder) {
+    resultOrder.push(item);
+}
+function processGpAppItems(newOrder, newOrderIndex, resultOrder) {
+    while(newOrderIndex < newOrder.length && isGpAppItem(newOrder[newOrderIndex])){
+        resultOrder.push(newOrder[newOrderIndex]);
+        newOrderIndex++;
+    }
+    return newOrderIndex;
+}
+function addRemainingGpAppItems(newOrder, startIndex, resultOrder) {
+    for(let i = startIndex; i < newOrder.length; i++){
+        const item = newOrder[i];
+        if (item && isGpAppItem(item)) {
+            resultOrder.push(item);
+        }
+    }
+}
+function mergeBlockOrder(newOrder, currentOrder) {
+    if (!currentOrder) return newOrder;
+    const newOrderSet = new Set(newOrder);
+    const filteredCurrentOrder = filterCurrentOrder(currentOrder, newOrderSet);
+    const resultOrder = [];
+    let newOrderIndex = 0;
+    filteredCurrentOrder.forEach((item)=>{
+        if (!isGpAppItem(item)) {
+            processNonGpAppItem(item, resultOrder);
+            return;
+        }
+        newOrderIndex = processGpAppItems(newOrder, newOrderIndex, resultOrder);
+    });
+    addRemainingGpAppItems(newOrder, newOrderIndex, resultOrder);
+    return resultOrder;
+}
+
+exports.mergeBlockOrder = mergeBlockOrder;

package/dist/cjs/helpers/third-party/removeGPAppItems.js

@@ -0,0 +1,18 @@
+'use strict';
+
+var constant = require('./constant.js');
+
+const removeAllGPAppItemsFromBlocks = (blocks)=>{
+    for(const key in blocks){
+        if (key.startsWith(constant.THIRD_PARTY_APP_BLOCK_ID_PREFIX)) {
+            delete blocks[key];
+        }
+    }
+    return blocks;
+};
+const removeAllGPAppItemsFromBlockOrder = (blockOrder)=>{
+    return blockOrder.filter((item)=>!item.includes(constant.THIRD_PARTY_APP_BLOCK_ID_PREFIX));
+};
+
+exports.removeAllGPAppItemsFromBlockOrder = removeAllGPAppItemsFromBlockOrder;
+exports.removeAllGPAppItemsFromBlocks = removeAllGPAppItemsFromBlocks;

package/dist/cjs/index.js

@@ -104,6 +104,8 @@ var animations$1 = require('./types/animations.js');
 var getCollection = require('./helpers/queries/get-collection.js');
 var getProduct = require('./helpers/queries/get-product.js');
 var getProductBySlug = require('./helpers/queries/get-product-by-slug.js');
+var getAppBlocks = require('./helpers/third-party/getAppBlocks.js');
+var addAppBlockId = require('./helpers/third-party/addAppBlockId.js');
 
 
 
@@ -387,3 +389,5 @@ exports.fetchMedias = getProduct.fetchMedias;
 exports.fetchVariants = getProduct.fetchVariants;
 exports.getProduct = getProduct.getProduct;
 exports.getProductBySlug = getProductBySlug.getProductBySlug;
+exports.getAppBlocks = getAppBlocks.getAppBlocks;
+exports.addAppBlockId = addAppBlockId.addAppBlockId;

package/dist/esm/components/ComponentToolbarPreview.js

@@ -55,7 +55,8 @@ const ComponentToolbarPreview = (props)=>{
     const editProductElementList = [
         'Product Title',
         'Product Description',
-        'Product Price'
+        'Product Price',
+        'Product Vendor'
     ];
     const isOverToolbarPosition = (el, parent)=>{
         const parentLength = parents.length;
@@ -290,6 +291,11 @@ const ComponentToolbarPreview = (props)=>{
     const isEnableCreateThemeSection = ()=>{
         return editingPageType !== 'STATIC' && editingPageType !== 'POST_PURCHASE';
     };
+    const isEnableAIContent = ()=>{
+        const { isShopifySection, tag } = props;
+        if (isShopifySection || isThemeSection && !isThemeSectionEditor) return false;
+        return ableGenerateContentElements.includes(tag);
+    };
     // if (!isActive) return null;
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
@@ -455,7 +461,7 @@ const ComponentToolbarPreview = (props)=>{
                     props.tag === 'Section' && !props.isThemeSection && isEnableCreateThemeSection() && !props.isShopifySection && getIndexSection() < SECTION_LIMIT && /*#__PURE__*/ jsx(CreateThemeSection, {
                         ...props
                     }),
-                    !props.isShopifySection && ableGenerateContentElements.includes(props.tag) && /*#__PURE__*/ jsx(AIContentGenerator, {
+                    isEnableAIContent() && /*#__PURE__*/ jsx(AIContentGenerator, {
                         ...props
                     }),
                     props.tag == 'Sticky' && /*#__PURE__*/ jsx("div", {

package/dist/esm/components/Render.liquid.js

@@ -16,6 +16,7 @@ import 'dayjs';
 import { composeAdvanceStyle } from '../helpers/compose-advance-style.js';
 import { baseAssetURL, isLocalEnv } from '../helpers/convert.js';
 import { RenderIf, template } from '../helpers/render.js';
+import { toJSON } from 'cssjson';
 
 const componentsRenderWithParentId = [
     'CarouselItem'
@@ -177,19 +178,28 @@ const Render = ({ uid, builder, components, parentId, extraFiles = {}, pageConte
         };
     }
 };
+const isEmptyCSS = (cssString)=>{
+    if (!cssString) return true;
+    const cssJSON = toJSON(cssString);
+    const isObjectEmpty = (obj)=>{
+        if (typeof obj !== 'object' || obj === null) return true;
+        return !Object.keys(obj).some((key)=>{
+            return key === 'attributes' && Object.keys(obj[key]).length > 0 || typeof obj[key] === 'object' && !isObjectEmpty(obj[key]);
+        });
+    };
+    return isObjectEmpty(cssJSON.children);
+};
 const RenderCustomCode = (item)=>{
     const { css, javascript, rootClassName } = item.advanced?.editorData || {};
     const replacedCSS = css?.replaceAll(rootClassName, item.uid);
     const replacedJS = javascript?.replaceAll(rootClassName, item.uid);
-    const cssCode = RenderIf(!!css, template`
-      <style
-        id="${`custom-css-${item?.uid}`}"
-      >${replacedCSS}</style>
+    const cssCode = RenderIf(!!css && !isEmptyCSS(replacedCSS), template`
+      <style id="${`custom-css-${item?.uid}`}">
+        ${replacedCSS}
+      </style>
     `);
     const jsCode = RenderIf(!!javascript, template`
-      <script
-        id="${`custom-js-${item?.uid}`}"
-      >
+      <script id="${`custom-js-${item?.uid}`}">
         try {
           ${replacedJS}
         } catch(err){}

package/dist/esm/components/ai-generator/AIContentGenerator.js

@@ -106,7 +106,7 @@ const AIContentGenerator = ({ ...props })=>{
         ref: genTool,
         children: [
             /*#__PURE__*/ jsx("div", {
-                className: "gp-gen-content-toolbar gp-border-r-[#6a6a6a] gp-border-r gp-pr-1 gp-mr-1",
+                className: "gp-gen-content-toolbar gp-border-r gp-pr-1 gp-mr-1",
                 children: /*#__PURE__*/ jsxs("button", {
                     className: classNames({
                         'gp-toolbar-ai-active': isShowPopup

package/dist/esm/graphql/queries/articles.generated.js

@@ -20,7 +20,9 @@ const ArticlesDocument = `
         descriptionMeta
         baseID
         platform
-        tags
+        tags {
+          name
+        }
         isSample
         platformCreatedAt
         author

package/dist/esm/graphql/queries/blogs.generated.js

@@ -27,7 +27,9 @@ const BlogsDocument = `
               titleMeta
               descriptionMeta
               baseID
-              tags
+              tags {
+                name
+              }
               isSample
               platformCreatedAt
               author

package/dist/esm/helpers/loop-component.js

@@ -0,0 +1,14 @@
+function loopComponent(component, callback) {
+    if (component) {
+        callback(component);
+    }
+    if (component?.childrens?.length) {
+        // eslint-disable-next-line
+        for(let i = 0; i < component.childrens.length; i++){
+            const children = component.childrens[i];
+            loopComponent(children, callback);
+        }
+    }
+}
+
+export { loopComponent };

package/dist/esm/helpers/pascal-to-kebab-case.js

@@ -0,0 +1,5 @@
+const pascalToKebab = (pascalCaseString)=>{
+    return pascalCaseString.replace(/[A-Z]/g, (match, offset)=>(offset ? '-' : '') + match.toLowerCase());
+};
+
+export { pascalToKebab };

package/dist/esm/helpers/third-party/addAppBlockId.js

@@ -0,0 +1,18 @@
+import { loopComponent } from '../loop-component.js';
+import { composeAppBlockId } from './composeAppBlockId.js';
+
+const addAppBlockId = (component)=>{
+    const strComponent = JSON.stringify(component) || '';
+    if (!strComponent.includes('appBlockId')) {
+        return component;
+    }
+    loopComponent(component, (component)=>handleSetBlockId(component));
+    return component;
+};
+const handleSetBlockId = (component)=>{
+    const { tag, uid } = component;
+    if (component.settings.appBlockId === undefined) return component;
+    component.settings.appBlockId = composeAppBlockId(tag, uid);
+};
+
+export { addAppBlockId };

package/dist/esm/helpers/third-party/appConfig.js

@@ -0,0 +1,44 @@
+const RechargeSubscriptionsConfig = {
+    RechargeSubscriptions: {
+        appName: 'recharge-subscriptions',
+        appId: '371eed76-0b44-4869-9813-730372ea378e'
+    }
+};
+const BonLoyaltyRewardsReferralsConfig = {
+    BonLoyaltyRewardsReferrals: {
+        appName: 'bon-loyalty',
+        appId: '63496a04-c097-48d1-8c11-475aec24b12e'
+    }
+};
+const SubifySubscriptionsConfig = {
+    SubifySubscriptionsApp: {
+        appName: 'subify-subscriptions-app',
+        appId: 'bc0dba25-cd46-4841-bea4-6bdfe9ac815f'
+    }
+};
+const SelleasyConfig = {
+    Selleasy: {
+        appName: 'selleasy',
+        appId: '790c1a03-a71f-4bc1-9869-00dad526d3c2'
+    }
+};
+const LoopSubscriptionsConfig = {
+    LoopSubscriptions: {
+        appName: 'loop-subscriptions',
+        appId: '267a7c64-5cb3-4552-b817-5485165f0a0b'
+    }
+};
+const SkioSubscriptionsYcS20Config = {
+    SkioSubscriptionsYcS20: {
+        appName: 'skio-subscriptions-yc-s20',
+        appId: 'de50f7a4-0bb0-4d4c-84e2-c03dce83436d'
+    }
+};
+const ShopifyFormsConfig = {
+    ShopifyForms: {
+        appName: 'forms',
+        appId: '8744a304-fcb1-4347-b211-bb6b4759a76a'
+    }
+};
+
+export { BonLoyaltyRewardsReferralsConfig, LoopSubscriptionsConfig, RechargeSubscriptionsConfig, SelleasyConfig, ShopifyFormsConfig, SkioSubscriptionsYcS20Config, SubifySubscriptionsConfig };

package/dist/esm/helpers/third-party/appSetting.js

@@ -0,0 +1,96 @@
+const RechargeSubscriptions = {
+    RechargeSubscriptions: {
+        'subscription-widget': {
+            product: '{{ product }}'
+        }
+    }
+};
+const LoyaltyRewardsReferrals = {
+    BonLoyaltyRewardsReferrals: {
+        'loyalty-page-block': null,
+        'loyalty-page-earning-block': null,
+        'loyalty-page-header-block': null,
+        'loyalty-page-profile-block': null,
+        'loyalty-page-redeem-block': null,
+        'loyalty-page-referral-block': null,
+        'loyalty-page-tier-block': null,
+        'product-point-preview': null
+    }
+};
+const SubifySubscriptions = {
+    SubifySubscriptionsApp: {
+        'app-block': {
+            product: '{{product}}',
+            use_app_block_wording: false,
+            widget_label: 'Purchase options',
+            one_time_purchase_text: 'One-Time Purchase',
+            subscription_text: 'Subscribe and save',
+            delivery_frequency_text: 'Delivery frequency',
+            prepaid_subscription_text: 'Subscription with prepaid',
+            skin1_priceSuffix: 'each',
+            skin1_save: 'Save(skin1)',
+            skin1_prepaid_payment_title: 'prepaid',
+            skin1_normal_payment_title: 'pay as you go',
+            skin2_discountSuffix: 'Save',
+            skin3_fullPrice: 'Full price',
+            skin3_priceSuffix: 'each',
+            skin3_discountSuffix: 'Off',
+            skin4_justOnce: 'Just once',
+            skin4_discountSuffix: 'Off',
+            skin4_priceSuffix: 'each',
+            skin4_fullPrice: '(Full price)',
+            skin4_sellingPlansTitle: 'Renews every:',
+            from: 'from',
+            max_discount_badge_title: 'UP To',
+            pay: 'Pay',
+            price_save_up_to: 'save up to'
+        }
+    }
+};
+const SelleasyWidget = {
+    Selleasy: {
+        'lb-upsell-fbt-block': null,
+        'lb-upsell-addon-block': null
+    }
+};
+const LoopSubscriptions = {
+    LoopSubscriptions: {
+        star_rating: {
+            product: '{{product}}'
+        }
+    }
+};
+const SkioSubscriptionsYcS20 = {
+    SkioSubscriptionsYcS20: {
+        'app-block': null
+    }
+};
+const ShopifyForms = {
+    ShopifyForms: {
+        inline: {
+            form_id: null
+        }
+    }
+};
+const overrideSettings = (tag, currentSetting, appSetting)=>{
+    switch(tag){
+        case 'ShopifyForms':
+            return {
+                ...currentSetting,
+                form_id: appSetting['formId']
+            };
+        default:
+            return currentSetting;
+    }
+};
+const composeSettingsByWidgetType = {
+    ...ShopifyForms,
+    ...SkioSubscriptionsYcS20,
+    ...LoopSubscriptions,
+    ...RechargeSubscriptions,
+    ...LoyaltyRewardsReferrals,
+    ...SubifySubscriptions,
+    ...SelleasyWidget
+};
+
+export { composeSettingsByWidgetType, overrideSettings };

package/dist/esm/helpers/third-party/composeAppBlockId.js

@@ -0,0 +1,9 @@
+import { pascalToKebab } from '../pascal-to-kebab-case.js';
+import { THIRD_PARTY_APP_BLOCK_ID_PREFIX } from './constant.js';
+
+const composeAppBlockId = (tag, uid)=>{
+    const key = pascalToKebab(tag);
+    return `${THIRD_PARTY_APP_BLOCK_ID_PREFIX}_${key}_${uid}`;
+};
+
+export { composeAppBlockId };

package/dist/esm/helpers/third-party/constant.js

@@ -0,0 +1,14 @@
+import { RechargeSubscriptionsConfig, BonLoyaltyRewardsReferralsConfig, SubifySubscriptionsConfig, SelleasyConfig, LoopSubscriptionsConfig, SkioSubscriptionsYcS20Config, ShopifyFormsConfig } from './appConfig.js';
+
+const mapShopifyAppMeta = {
+    ...RechargeSubscriptionsConfig,
+    ...BonLoyaltyRewardsReferralsConfig,
+    ...SubifySubscriptionsConfig,
+    ...SelleasyConfig,
+    ...LoopSubscriptionsConfig,
+    ...SkioSubscriptionsYcS20Config,
+    ...ShopifyFormsConfig
+};
+const THIRD_PARTY_APP_BLOCK_ID_PREFIX = 'gp_app';
+
+export { THIRD_PARTY_APP_BLOCK_ID_PREFIX, mapShopifyAppMeta };

package/dist/esm/helpers/third-party/generateAppBlockConfigs.js

@@ -0,0 +1,32 @@
+import { loopComponent } from '../loop-component.js';
+import { getAppBlockConfig } from './getAppBlockConfig.js';
+
+const generateAppBlockConfigs = (component)=>{
+    const strComponent = JSON.stringify(component) || '';
+    if (!strComponent.includes('appBlockId')) return null;
+    const configs = [];
+    loopComponent(component, (component)=>{
+        const settings = component.settings || {};
+        const appBlockId = settings?.appBlockId || '';
+        if (!appBlockId) return;
+        const config = getAppBlockConfig(component.tag, appBlockId, settings);
+        if (!config) return;
+        configs.push(config);
+    });
+    if (!configs.length) return null;
+    return {
+        newBlocks: extractBlocks(configs),
+        newBlockOrder: extractBlockOrder(configs)
+    };
+};
+function extractBlocks(array) {
+    return array.reduce((acc, item)=>{
+        acc[item.key] = item.value;
+        return acc;
+    }, {});
+}
+function extractBlockOrder(array) {
+    return array.map((item)=>item.key);
+}
+
+export { generateAppBlockConfigs };

package/dist/esm/helpers/third-party/getAppBlockConfig.js

@@ -0,0 +1,22 @@
+import { composeSettingsByWidgetType, overrideSettings } from './appSetting.js';
+import { getAppBlockType } from './getAppBlockType.js';
+
+const getAppBlockConfig = (tag, appBlockId, settings)=>{
+    const appBlockType = getAppBlockType({
+        tag,
+        widgetType: settings?.widgetType
+    });
+    const settingByWidget = composeSettingsByWidgetType[tag][settings?.widgetType];
+    const appSettings = overrideSettings(tag, settingByWidget, settings);
+    return {
+        key: appBlockId,
+        value: {
+            type: appBlockType,
+            ...settingByWidget && {
+                settings: appSettings
+            }
+        }
+    };
+};
+
+export { getAppBlockConfig };

package/dist/esm/helpers/third-party/getAppBlockType.js

@@ -0,0 +1,10 @@
+import { mapShopifyAppMeta } from './constant.js';
+
+const getAppBlockType = ({ tag, widgetType })=>{
+    const shopifyAppMeta = mapShopifyAppMeta[tag];
+    if (!shopifyAppMeta) return '';
+    const { appName, appId } = shopifyAppMeta;
+    return `shopify://apps/${appName}/blocks/${widgetType}/${appId}`;
+};
+
+export { getAppBlockType };

package/dist/esm/helpers/third-party/getAppBlocks.js

@@ -0,0 +1,28 @@
+import { addAppBlockId } from './addAppBlockId.js';
+import { generateAppBlockConfigs } from './generateAppBlockConfigs.js';
+import { mergeBlocks } from './mergeBlock.js';
+import { mergeBlockOrder } from './mergeBlockOrder.js';
+import { removeAllGPAppItemsFromBlocks, removeAllGPAppItemsFromBlockOrder } from './removeGPAppItems.js';
+
+const getAppBlocks = (section)=>{
+    const { blocks: currentBlock, block_order: currentBlockOrder } = JSON.parse(section?.appBlocks || '{}');
+    const component = JSON.parse(section?.component || '');
+    const componentWithAppBlockId = addAppBlockId(component);
+    const appBlockConfigs = generateAppBlockConfigs(componentWithAppBlockId);
+    if (!appBlockConfigs) {
+        if (!currentBlock || !currentBlockOrder) return {};
+        return {
+            blocks: removeAllGPAppItemsFromBlocks(currentBlock),
+            block_order: removeAllGPAppItemsFromBlockOrder(currentBlockOrder)
+        };
+    }
+    const { newBlocks, newBlockOrder } = appBlockConfigs;
+    const blocks = mergeBlocks(newBlocks, currentBlock);
+    const block_order = mergeBlockOrder(newBlockOrder, currentBlockOrder);
+    return {
+        blocks,
+        block_order
+    };
+};
+
+export { getAppBlocks };

package/dist/esm/helpers/third-party/mergeBlock.js

@@ -0,0 +1,17 @@
+function mergeBlocks(newBlocks, blocks) {
+    if (!blocks) return newBlocks;
+    const result = {};
+    // Add all non-gp_app blocks from the original blocks
+    for (const [key, value] of Object.entries(blocks)){
+        if (!key.startsWith('gp_app')) {
+            result[key] = value;
+        }
+    }
+    // Add all blocks from new-blocks
+    for (const [key, value] of Object.entries(newBlocks)){
+        result[key] = value;
+    }
+    return result;
+}
+
+export { mergeBlocks };

package/dist/esm/helpers/third-party/mergeBlockOrder.js

@@ -0,0 +1,45 @@
+import { THIRD_PARTY_APP_BLOCK_ID_PREFIX } from './constant.js';
+
+function isGpAppItem(item) {
+    if (!item) return false;
+    return item.startsWith(THIRD_PARTY_APP_BLOCK_ID_PREFIX);
+}
+function filterCurrentOrder(currentOrder, newOrderSet) {
+    return currentOrder.filter((item)=>!isGpAppItem(item) || newOrderSet.has(item));
+}
+function processNonGpAppItem(item, resultOrder) {
+    resultOrder.push(item);
+}
+function processGpAppItems(newOrder, newOrderIndex, resultOrder) {
+    while(newOrderIndex < newOrder.length && isGpAppItem(newOrder[newOrderIndex])){
+        resultOrder.push(newOrder[newOrderIndex]);
+        newOrderIndex++;
+    }
+    return newOrderIndex;
+}
+function addRemainingGpAppItems(newOrder, startIndex, resultOrder) {
+    for(let i = startIndex; i < newOrder.length; i++){
+        const item = newOrder[i];
+        if (item && isGpAppItem(item)) {
+            resultOrder.push(item);
+        }
+    }
+}
+function mergeBlockOrder(newOrder, currentOrder) {
+    if (!currentOrder) return newOrder;
+    const newOrderSet = new Set(newOrder);
+    const filteredCurrentOrder = filterCurrentOrder(currentOrder, newOrderSet);
+    const resultOrder = [];
+    let newOrderIndex = 0;
+    filteredCurrentOrder.forEach((item)=>{
+        if (!isGpAppItem(item)) {
+            processNonGpAppItem(item, resultOrder);
+            return;
+        }
+        newOrderIndex = processGpAppItems(newOrder, newOrderIndex, resultOrder);
+    });
+    addRemainingGpAppItems(newOrder, newOrderIndex, resultOrder);
+    return resultOrder;
+}
+
+export { mergeBlockOrder };

package/dist/esm/helpers/third-party/removeGPAppItems.js

@@ -0,0 +1,15 @@
+import { THIRD_PARTY_APP_BLOCK_ID_PREFIX } from './constant.js';
+
+const removeAllGPAppItemsFromBlocks = (blocks)=>{
+    for(const key in blocks){
+        if (key.startsWith(THIRD_PARTY_APP_BLOCK_ID_PREFIX)) {
+            delete blocks[key];
+        }
+    }
+    return blocks;
+};
+const removeAllGPAppItemsFromBlockOrder = (blockOrder)=>{
+    return blockOrder.filter((item)=>!item.includes(THIRD_PARTY_APP_BLOCK_ID_PREFIX));
+};
+
+export { removeAllGPAppItemsFromBlockOrder, removeAllGPAppItemsFromBlocks };

package/dist/esm/index.js

@@ -107,3 +107,5 @@ export { AnimationDirectionType, AnimationEasingType, AnimationSetting, Animatio
 export { calculateFirstProduct, getCollection } from './helpers/queries/get-collection.js';
 export { fetchMedias, fetchVariants, getProduct } from './helpers/queries/get-product.js';
 export { getProductBySlug } from './helpers/queries/get-product-by-slug.js';
+export { getAppBlocks } from './helpers/third-party/getAppBlocks.js';
+export { addAppBlockId } from './helpers/third-party/addAppBlockId.js';

package/dist/types/index.d.ts

@@ -75,7 +75,7 @@ type Article$2 = {
     platform?: Maybe$1<ArticlePlatform$1>;
     platformCreatedAt?: Maybe$1<Scalars$2['Time']>;
     platformUpdatedAt?: Maybe$1<Scalars$2['Time']>;
-    tags: Array<Scalars$2['String']>;
+    tags?: Maybe$1<Array<Maybe$1<Tag$1>>>;
     templateSuffix?: Maybe$1<Scalars$2['String']>;
     title?: Maybe$1<Scalars$2['String']>;
     titleMeta?: Maybe$1<Scalars$2['String']>;
@@ -2333,6 +2333,7 @@ type Entity = {
     findPublishedThemePageOnlineStoreDataByID: PublishedThemePageOnlineStoreData$1;
     findPublishedThemeSectionByID: PublishedThemeSection$1;
     findPublishedThemeStyleByID: PublishedThemeStyle$1;
+    findTagByID: Tag$1;
 };
 type EntityFindMetafieldByIdArgs = {
     id: Scalars$2['ID'];
@@ -2373,6 +2374,9 @@ type EntityFindPublishedThemeSectionByIdArgs = {
 type EntityFindPublishedThemeStyleByIdArgs = {
     id: Scalars$2['ID'];
 };
+type EntityFindTagByIdArgs = {
+    id: Scalars$2['ID'];
+};
 type Media$1 = {
     alt?: Maybe$1<Scalars$2['String']>;
     contentType?: Maybe$1<Scalars$2['String']>;
@@ -6334,6 +6338,12 @@ type StoreProperty$1 = {
     primaryDomain?: Maybe$1<Scalars$2['String']>;
     swatchesConfig: Scalars$2['String'];
 };
+type Tag$1 = {
+    createdAt?: Maybe$1<Scalars$2['Time']>;
+    id: Scalars$2['ID'];
+    name?: Maybe$1<Scalars$2['String']>;
+    updatedAt?: Maybe$1<Scalars$2['Time']>;
+};
 type TagType$1 = 'ARTICLE' | 'BLOG' | 'COLLECTION' | 'PRODUCT';
 /**
  * TagWhereInput is used for filtering Tag objects.
@@ -6452,7 +6462,7 @@ type VariantProductOptionWhereInput$1 = {
     variantIDNEQ?: InputMaybe$1<Scalars$2['ID']>;
     variantIDNotIn?: InputMaybe$1<Array<Scalars$2['ID']>>;
 };
-type _Entity = Metafield$1 | Product$1 | PublishedCustomSection$1 | PublishedPageInteraction$1 | PublishedPageSection$1 | PublishedPageSectionMeta$1 | PublishedShopMeta$1 | PublishedThemePage$1 | PublishedThemePageCustomSection$1 | PublishedThemePageMeta$1 | PublishedThemePageOnlineStoreData$1 | PublishedThemeSection$1 | PublishedThemeStyle$1;
+type _Entity = Metafield$1 | Product$1 | PublishedCustomSection$1 | PublishedPageInteraction$1 | PublishedPageSection$1 | PublishedPageSectionMeta$1 | PublishedShopMeta$1 | PublishedThemePage$1 | PublishedThemePageCustomSection$1 | PublishedThemePageMeta$1 | PublishedThemePageOnlineStoreData$1 | PublishedThemeSection$1 | PublishedThemeStyle$1 | Tag$1;
 type _Service = {
     sdl?: Maybe$1<Scalars$2['String']>;
 };
@@ -6471,6 +6481,7 @@ type shop_EntityFindPublishedThemePageMetaByIdArgs = EntityFindPublishedThemePag
 type shop_EntityFindPublishedThemePageOnlineStoreDataByIdArgs = EntityFindPublishedThemePageOnlineStoreDataByIdArgs;
 type shop_EntityFindPublishedThemeSectionByIdArgs = EntityFindPublishedThemeSectionByIdArgs;
 type shop_EntityFindPublishedThemeStyleByIdArgs = EntityFindPublishedThemeStyleByIdArgs;
+type shop_EntityFindTagByIdArgs = EntityFindTagByIdArgs;
 type shop_Query_EntitiesArgs = Query_EntitiesArgs;
 type shop__Entity = _Entity;
 type shop__Service = _Service;
@@ -6553,6 +6564,7 @@ declare namespace shop {
     shop_EntityFindPublishedThemePageOnlineStoreDataByIdArgs as EntityFindPublishedThemePageOnlineStoreDataByIdArgs,
     shop_EntityFindPublishedThemeSectionByIdArgs as EntityFindPublishedThemeSectionByIdArgs,
     shop_EntityFindPublishedThemeStyleByIdArgs as EntityFindPublishedThemeStyleByIdArgs,
+    shop_EntityFindTagByIdArgs as EntityFindTagByIdArgs,
     Exact$1 as Exact,
     InputMaybe$1 as InputMaybe,
     MakeMaybe$1 as MakeMaybe,
@@ -6693,6 +6705,7 @@ declare namespace shop {
     ShopShopify$1 as ShopShopify,
     ShopTokenWhereInput$1 as ShopTokenWhereInput,
     StoreProperty$1 as StoreProperty,
+    Tag$1 as Tag,
     TagType$1 as TagType,
     TagWhereInput$1 as TagWhereInput,
     VariantProductOptionWhereInput$1 as VariantProductOptionWhereInput,
@@ -37217,7 +37230,8 @@ type ArticlesQueryVariables = Exact$1<{
 type ArticlesQueryResponse = {
     articles?: Maybe$1<(Pick<ArticleConnection$1, 'totalCount'> & {
         edges: Array<(Pick<ArticleEdge$1, 'cursor'> & {
-            node?: Maybe$1<(Pick<Article$2, 'id' | 'title' | 'handle' | 'description' | 'templateSuffix' | 'titleMeta' | 'descriptionMeta' | 'baseID' | 'platform' | 'tags' | 'isSample' | 'platformCreatedAt' | 'author'> & {
+            node?: Maybe$1<(Pick<Article$2, 'id' | 'title' | 'handle' | 'description' | 'templateSuffix' | 'titleMeta' | 'descriptionMeta' | 'baseID' | 'platform' | 'isSample' | 'platformCreatedAt' | 'author'> & {
+                tags: Array<never>;
                 content?: Maybe$1<Pick<ArticleContent$1, 'excerptHtml'>>;
                 blogs?: Maybe$1<{
                     edges: Array<{
@@ -37246,9 +37260,15 @@ type BlogsQueryResponse = {
             node?: Maybe$1<(Pick<Blog$1, 'baseID' | 'description' | 'descriptionMeta' | 'handle' | 'id' | 'platform' | 'tags' | 'templateSuffix' | 'title' | 'titleMeta'> & {
                 articles?: Maybe$1<(Pick<ArticleConnection$1, 'totalCount'> & {
                     edges: Array<(Pick<ArticleEdge$1, 'cursor'> & {
-                        node?: Maybe$1<(Pick<Article$2, 'id' | 'title' | 'handle' | 'description' | 'templateSuffix' | 'titleMeta' | 'descriptionMeta' | 'baseID' | 'tags' | 'isSample' | 'platformCreatedAt' | 'author'> & {
+                        node?: Maybe$1<(Pick<Article$2, 'id' | 'title' | 'handle' | 'description' | 'templateSuffix' | 'titleMeta' | 'descriptionMeta' | 'baseID' | 'platform' | 'isSample' | 'platformCreatedAt' | 'author'> & {
+                            tags: Array<never>;
                             content?: Maybe$1<Pick<ArticleContent$1, 'excerptHtml'>>;
-                            media?: Maybe$1<Pick<Media$1, 'width' | 'src' | 'height'>>;
+                            blogs?: Maybe$1<{
+                                edges: Array<{
+                                    node?: Maybe$1<Pick<Blog$1, 'title' | 'handle'>>;
+                                }>;
+                            }>;
+                            media?: Maybe$1<Pick<Media$1, 'alt' | 'width' | 'src' | 'height'>>;
                         })>;
                     })>;
                 })>;
@@ -37343,4 +37363,18 @@ type PublishedThemePageSelectFragment = Pick<PublishedThemePage$1, 'id' | 'name'
 
 declare const getProductBySlug: (fetcher: FetchFunc, slug?: string) => Promise<ProductSelectFragment>;
 
-export { AddOn, AddonProvider, AddonProviderProps, AdvancedType, AliReviewsWidgetType, AlignItemProp, AlignProp, AnimationBaseSetting, AnimationConfig, AnimationDirectionType, AnimationEasingType, AnimationFadeSettingType, AnimationSetting, AnimationSettingType, AnimationShakeSettingType, AnimationSlideSettingType, AnimationTrigger, AnimationTriggerType, AnimationType, AnimationZoomDirectionType, AnimationZoomSettingType, appAPI as AppAPIType, ArticleListProvider, ArticleListProviderProps, ArticleProvider, ArticleProviderProps, Background, BaseProps, BasePropsWrap, BlockEntity, BogosWidgetType, BoldSubscriptionsWidgetType, Border, BorderStyle, BuilderComponentProvider, BuilderComponentProviderProps, BuilderEntity, BuilderEntityNested, BuilderPreviewProvider, BuilderPreviewProviderProps, BuilderProvider, BuilderProviderProps, BuilderState, Builtin, CartLineProvider, CartLineProviderProps, CollectionDetailFilterDocument, CollectionDetailFilterQueryResponse, CollectionDetailFilterQueryVariables, CollectionDocument, CollectionProvider, CollectionProviderProps, CollectionQueryResponse, CollectionQueryVariables, CollectionSelectFragment, CollectionsDocument, CollectionsQueryResponse, CollectionsQueryVariables, ColorKey, ColorType$1 as ColorType, ColorValueType, Component, ComponentPreset, ComponentSetting, ContainerProp, ControlProp, ControlTriggerAction, ControlUI, CornerRadius, CornerRadiusType, CustomComponentConfig, DeepPartial, DynamicCollection, DynamicProduct, ExtractState, FeraReviewsV3WidgetType, FeraReviewsWidgetType, FetchCollectionArgs, FetchFunc, FetchProductParams, FlexDirectionProp, FontName, GRADIENT_BGR_KEY, GlobalStyleConfig, GlobalStyleResponsiveConfig, GlobalSwatchesData, GraphQLConnection, GroupPropType, GrowaveWidgetType, HSLAColorType, HSLColorType, HexColorType, ImageShape$1 as ImageShape, InitComponentType, InstantJudgeMeReviewsWidgetType, InstantKlaviyoWidgetType, InstantLooxReviewsWidgetType, JudgeMeReviewsWidgetType, KlaviyoWidgetType, LaiProductReviewsAdvancedWidgetType, LaiProductReviewsWidgetType, LibrarySaleFunnelDocument, LibrarySaleFunnelQueryResponse, LibrarySaleFunnelQueryVariables, LibraryTemplateDocument, LibraryTemplateQueryResponse, LibraryTemplateQueryVariables, LooxReviewsWidgetType, ModalProvider, ModalProviderProps, NameDevices$1 as NameDevices, NestedKeys, ObjectDeviceGlobalType, ObjectDevices, ObjectLayoutValue, OmnisendWidgetType, OnlyOne, OpinewDesignWidgetType, OpinewWidgetType, OptionNormalStyle, OptionSpecialStyle, Options, PageContext, PageProvider, PageProviderProps, PageType, PageViewUpDocument, PageViewUpMutationResponse, PageViewUpMutationVariables, PickyStoryWidgetType, PostPurchaseTypo, PreviewPageDocument, PreviewPageQueryResponse, PreviewPageQueryVariables, Primitive, ProductInputAnalytic, ProductListProvider, ProductListProviderProps, ProductOffer, ProductProvider, ProductProviderProps, ProductReviewsWidgetType, ProductSelectFragment, ProductsDocument, ProductsQueryResponse, ProductsQueryVariables, PublicStoreFrontData, PublishedThemePageSelectFragment, PublishedThemePagesDocument, PublishedThemePagesQueryResponse, PublishedThemePagesQueryVariables, RGBAColorType, RGBColorType, Ratio$1 as Ratio, RawChild, RenderMemo as Render, RenderChildren, RenderIf, Render as RenderLiquid, RenderMode, RenderPreviewMemo as RenderPreview, RequiredCursorEdge, ResponsiveKey, ResponsiveStateProp, RivyoWidgetType, RoundedSize, RyviuWidgetType, SaleFunnelDiscount$1 as SaleFunnelDiscount, SaleFunnelDiscountEdge$1 as SaleFunnelDiscountEdge, SaleFunnelDiscountObjectType$1 as SaleFunnelDiscountObjectType, SaleFunnelDiscountType$1 as SaleFunnelDiscountType, SaleFunnelDiscountValueType$1 as SaleFunnelDiscountValueType, SaleFunnelDiscountsDocument, SaleFunnelDiscountsQueryResponse, SaleFunnelDiscountsQueryVariables, Scalars$1 as Scalars, ScaleByDirection, SectionData, SectionEntity, SectionProvider, SectionProviderProps, SettingByAnimationType, SettingByAnimationValues, ShadowProps, ShadowStyle, ShadowStyleApplied, ShadowType, ShopProvider, ShopProviderProps, shop as ShopType, SizeProps, SizeSetting, SizeSettingGlobal, SizeType, SpacingType, StampedWidgetType, StateProp, StateSelector, StateType, StoreConfig, StorePropertyDocument, StorePropertyQueryResponse, StorePropertyQueryVariables, SwatchesOptionType, SwatchesOptionValue, ThemePageDocument, ThemePageQueryResponse, ThemePageQueryVariables, ThemeSectionStatus$1 as ThemeSectionStatus, TransformProp, TriggerConfig, TrustooWidgetType, TypographyProps, TypographySetting, TypographySettingV2, TypographyType, TypographyV2Attrs, TypographyV2Props, UltimateSalesBoostWidgetType, VariantSelectFragment, VitalsWidgetType, WiserV2WidgetType, WiserWidgetType, WrapRenderChildren, YotpoReviewsWidgetType, animations, baseAssetURL, calculateFirstProduct, checkAvailableVariantInStock, cls, composeAdvanceStyle, composeAdvanceStyleForPostPurchase, composeBackgroundCss, composeBorderCss, composeCornerCss, composeFallbackTypographyStyle, composeFontFamilyTypographyV2, composeGridLayout, composeMemo, composePositionLineHeight, composePostionIconList, composeRadius, composeRadiusResponsive, composeShadowCss, composeSize, composeSizeCss, composeSpacing, composeTextColorCss, composeTypography, composeTypographyAttr, composeTypographyClassName, composeTypographyCss, composeTypographyStyle, composeTypographyV2, composeTypographyV2Css, convertHTML, convertOldLayout, dataStringify, fetchMedias, fetchVariants, filterAttrInStyle, filterCornerInStyle, filterToolbarPreview, flattenConnection, fpixel, genSizeClass, genTypoClass, genVariable, generateCollectionQueryKey, generateProductQueryKey, generateProductsQueryKey, getAspectRatioGlobalSize, getBgImageByDevice, getBorderRadiusStyle, getBorderStyle, getCarouselContainerHeight, getCollection, getCornerCSSFromGlobal, getCustomRadius, getGlobalColorCSSProp, getGlobalColorClass, getGlobalColorResponsiveClass, getGlobalColorResponsiveStyle, getGlobalColorStateClass, getGlobalColorStateClassDynamicBtn, getGlobalColorStateResponsiveClass, getGlobalColorStateResponsiveClassDynamicBtn, getGlobalColorStateResponsiveStyle, getGlobalColorStateStyle, getGlobalColorStyle, getGlobalSizeGap, getGradientBgrStyleByDevice, getGradientBgrStyleForButton, getHeightByShapeGlobalSize, getPaddingGlobalSize, getProduct, getProductBySlug, getRadiusCSSFromGlobal, getRadiusStyleActiveState, getResponsiveStateValue, getResponsiveValue, getResponsiveValueByScreen, getSelectedVariant, getShortName, getSingleColorVariable, getSpacingVariable, getStyleBackgroundByDevice, getStyleBgColor, getStyleShadow, getStyleShadowState, getValueByDevice, getWidthByShapeGlobalSize, getWidthHeightGlobalSize, globalEvent, gridToArrayRegex, gtag, handleConvertBorderColor, handleConvertBorderStyle, handleConvertBorderWidth, handleConvertClassColor, handleConvertClassColorDynamicBtn, isBrowser, isColor, isColumnDirectionExist, isDefined, isEmptyChildren, isLocalEnv, isSafari, loadScript, makeAspectRatio, makeContainerWidthOrHeight, makeDotGapToCarouselStyle, makeFixedBgAttachment, makeGlobalSize, makeGlobalSizeHeightResponsive, makeGlobalSizeIcon, makeGlobalSizeWidthResponsive, makeHeight, makeLineClamp, makeStyle, makeStyleKey, makeStyleResponsive, makeStyleResponsiveByScreen, makeStyleResponsiveState, makeStyleState, makeStyleWithDefault, makeWidth, normalizeBuilderData, optionLayoutStyle, parseSelectedOption, parseValueWithUnit, prefetchQueries, props, removeAttrInStyle, removeNullUndefined, removePaddingYInStyle, removeUndefinedValuesFromObject, shopifyPriceRounding, splitStyle, styles, template, tiktokpixel, useAddToCart, useAddon, useAddons, useArticleListStore, useArticleStore, useArticlesQuery, useBlogsQuery, useBuilderComponent, useBuilderPreviewStore, useBuilderStore, useCartData, useCartDiscountCodesUpdate, useCartId, useCartLine, useCartLineStore, useCartNoteUpdate, useCartUI, useCheckAvailableVariantInStock, useCheckoutUrl, useCollection, useCollectionQuery, useCollectionStore, useCollectionsQuery, useConnectedShopify, useCreateCart, useCurrency, useCurrentDevice, useCurrentVariant, useCurrentVariantInStock, useEditorMode, useFeaturedImageGlobal, useFormatMoney, useInitialSwatchesOptions, useIsSampleProduct, useIsStorefrontProduct, useIsSyncProduct, useIsomorphicLayoutEffect, useLazyVideo, useLoadScript, useLocale, useMatchMutate, useMobileOnly, useModalStore, useMoney, useMoneyFormat, usePageStore, usePageType, usePluginEnable, usePrevious, useProduct, useProductList, useProductListProducts, useProductListSettings, useProductListStore, useProductListStyles, useProductOfferDiscount, useProductProperties, useProductQuery, useProductStore, useProductsQuery, useProductsQueryAll, useQuantity, useRemoveCartItem, useSection, useSectionStore, useSelectedOption, useShopStore, useStoreFront, useSuspenseFetch, useSwatches, useSwatchesOptions, useUniqProductID, useUpdateCartItem, useVariant, useVariantOutStock, useVariants, validateEmail };
+declare const getAppBlocks: (section: PublishedPageSection$1 & {
+    appBlocks: string;
+}) => {
+    blocks?: undefined;
+    block_order?: undefined;
+} | {
+    blocks: {
+        [key: string]: any;
+    };
+    block_order: string[];
+};
+
+declare const addAppBlockId: (component: Component) => Component;
+
+export { AddOn, AddonProvider, AddonProviderProps, AdvancedType, AliReviewsWidgetType, AlignItemProp, AlignProp, AnimationBaseSetting, AnimationConfig, AnimationDirectionType, AnimationEasingType, AnimationFadeSettingType, AnimationSetting, AnimationSettingType, AnimationShakeSettingType, AnimationSlideSettingType, AnimationTrigger, AnimationTriggerType, AnimationType, AnimationZoomDirectionType, AnimationZoomSettingType, appAPI as AppAPIType, ArticleListProvider, ArticleListProviderProps, ArticleProvider, ArticleProviderProps, Background, BaseProps, BasePropsWrap, BlockEntity, BogosWidgetType, BoldSubscriptionsWidgetType, Border, BorderStyle, BuilderComponentProvider, BuilderComponentProviderProps, BuilderEntity, BuilderEntityNested, BuilderPreviewProvider, BuilderPreviewProviderProps, BuilderProvider, BuilderProviderProps, BuilderState, Builtin, CartLineProvider, CartLineProviderProps, CollectionDetailFilterDocument, CollectionDetailFilterQueryResponse, CollectionDetailFilterQueryVariables, CollectionDocument, CollectionProvider, CollectionProviderProps, CollectionQueryResponse, CollectionQueryVariables, CollectionSelectFragment, CollectionsDocument, CollectionsQueryResponse, CollectionsQueryVariables, ColorKey, ColorType$1 as ColorType, ColorValueType, Component, ComponentPreset, ComponentSetting, ContainerProp, ControlProp, ControlTriggerAction, ControlUI, CornerRadius, CornerRadiusType, CustomComponentConfig, DeepPartial, DynamicCollection, DynamicProduct, ExtractState, FeraReviewsV3WidgetType, FeraReviewsWidgetType, FetchCollectionArgs, FetchFunc, FetchProductParams, FlexDirectionProp, FontName, GRADIENT_BGR_KEY, GlobalStyleConfig, GlobalStyleResponsiveConfig, GlobalSwatchesData, GraphQLConnection, GroupPropType, GrowaveWidgetType, HSLAColorType, HSLColorType, HexColorType, ImageShape$1 as ImageShape, InitComponentType, InstantJudgeMeReviewsWidgetType, InstantKlaviyoWidgetType, InstantLooxReviewsWidgetType, JudgeMeReviewsWidgetType, KlaviyoWidgetType, LaiProductReviewsAdvancedWidgetType, LaiProductReviewsWidgetType, LibrarySaleFunnelDocument, LibrarySaleFunnelQueryResponse, LibrarySaleFunnelQueryVariables, LibraryTemplateDocument, LibraryTemplateQueryResponse, LibraryTemplateQueryVariables, LooxReviewsWidgetType, ModalProvider, ModalProviderProps, NameDevices$1 as NameDevices, NestedKeys, ObjectDeviceGlobalType, ObjectDevices, ObjectLayoutValue, OmnisendWidgetType, OnlyOne, OpinewDesignWidgetType, OpinewWidgetType, OptionNormalStyle, OptionSpecialStyle, Options, PageContext, PageProvider, PageProviderProps, PageType, PageViewUpDocument, PageViewUpMutationResponse, PageViewUpMutationVariables, PickyStoryWidgetType, PostPurchaseTypo, PreviewPageDocument, PreviewPageQueryResponse, PreviewPageQueryVariables, Primitive, ProductInputAnalytic, ProductListProvider, ProductListProviderProps, ProductOffer, ProductProvider, ProductProviderProps, ProductReviewsWidgetType, ProductSelectFragment, ProductsDocument, ProductsQueryResponse, ProductsQueryVariables, PublicStoreFrontData, PublishedThemePageSelectFragment, PublishedThemePagesDocument, PublishedThemePagesQueryResponse, PublishedThemePagesQueryVariables, RGBAColorType, RGBColorType, Ratio$1 as Ratio, RawChild, RenderMemo as Render, RenderChildren, RenderIf, Render as RenderLiquid, RenderMode, RenderPreviewMemo as RenderPreview, RequiredCursorEdge, ResponsiveKey, ResponsiveStateProp, RivyoWidgetType, RoundedSize, RyviuWidgetType, SaleFunnelDiscount$1 as SaleFunnelDiscount, SaleFunnelDiscountEdge$1 as SaleFunnelDiscountEdge, SaleFunnelDiscountObjectType$1 as SaleFunnelDiscountObjectType, SaleFunnelDiscountType$1 as SaleFunnelDiscountType, SaleFunnelDiscountValueType$1 as SaleFunnelDiscountValueType, SaleFunnelDiscountsDocument, SaleFunnelDiscountsQueryResponse, SaleFunnelDiscountsQueryVariables, Scalars$1 as Scalars, ScaleByDirection, SectionData, SectionEntity, SectionProvider, SectionProviderProps, SettingByAnimationType, SettingByAnimationValues, ShadowProps, ShadowStyle, ShadowStyleApplied, ShadowType, ShopProvider, ShopProviderProps, shop as ShopType, SizeProps, SizeSetting, SizeSettingGlobal, SizeType, SpacingType, StampedWidgetType, StateProp, StateSelector, StateType, StoreConfig, StorePropertyDocument, StorePropertyQueryResponse, StorePropertyQueryVariables, SwatchesOptionType, SwatchesOptionValue, ThemePageDocument, ThemePageQueryResponse, ThemePageQueryVariables, ThemeSectionStatus$1 as ThemeSectionStatus, TransformProp, TriggerConfig, TrustooWidgetType, TypographyProps, TypographySetting, TypographySettingV2, TypographyType, TypographyV2Attrs, TypographyV2Props, UltimateSalesBoostWidgetType, VariantSelectFragment, VitalsWidgetType, WiserV2WidgetType, WiserWidgetType, WrapRenderChildren, YotpoReviewsWidgetType, addAppBlockId, animations, baseAssetURL, calculateFirstProduct, checkAvailableVariantInStock, cls, composeAdvanceStyle, composeAdvanceStyleForPostPurchase, composeBackgroundCss, composeBorderCss, composeCornerCss, composeFallbackTypographyStyle, composeFontFamilyTypographyV2, composeGridLayout, composeMemo, composePositionLineHeight, composePostionIconList, composeRadius, composeRadiusResponsive, composeShadowCss, composeSize, composeSizeCss, composeSpacing, composeTextColorCss, composeTypography, composeTypographyAttr, composeTypographyClassName, composeTypographyCss, composeTypographyStyle, composeTypographyV2, composeTypographyV2Css, convertHTML, convertOldLayout, dataStringify, fetchMedias, fetchVariants, filterAttrInStyle, filterCornerInStyle, filterToolbarPreview, flattenConnection, fpixel, genSizeClass, genTypoClass, genVariable, generateCollectionQueryKey, generateProductQueryKey, generateProductsQueryKey, getAppBlocks, getAspectRatioGlobalSize, getBgImageByDevice, getBorderRadiusStyle, getBorderStyle, getCarouselContainerHeight, getCollection, getCornerCSSFromGlobal, getCustomRadius, getGlobalColorCSSProp, getGlobalColorClass, getGlobalColorResponsiveClass, getGlobalColorResponsiveStyle, getGlobalColorStateClass, getGlobalColorStateClassDynamicBtn, getGlobalColorStateResponsiveClass, getGlobalColorStateResponsiveClassDynamicBtn, getGlobalColorStateResponsiveStyle, getGlobalColorStateStyle, getGlobalColorStyle, getGlobalSizeGap, getGradientBgrStyleByDevice, getGradientBgrStyleForButton, getHeightByShapeGlobalSize, getPaddingGlobalSize, getProduct, getProductBySlug, getRadiusCSSFromGlobal, getRadiusStyleActiveState, getResponsiveStateValue, getResponsiveValue, getResponsiveValueByScreen, getSelectedVariant, getShortName, getSingleColorVariable, getSpacingVariable, getStyleBackgroundByDevice, getStyleBgColor, getStyleShadow, getStyleShadowState, getValueByDevice, getWidthByShapeGlobalSize, getWidthHeightGlobalSize, globalEvent, gridToArrayRegex, gtag, handleConvertBorderColor, handleConvertBorderStyle, handleConvertBorderWidth, handleConvertClassColor, handleConvertClassColorDynamicBtn, isBrowser, isColor, isColumnDirectionExist, isDefined, isEmptyChildren, isLocalEnv, isSafari, loadScript, makeAspectRatio, makeContainerWidthOrHeight, makeDotGapToCarouselStyle, makeFixedBgAttachment, makeGlobalSize, makeGlobalSizeHeightResponsive, makeGlobalSizeIcon, makeGlobalSizeWidthResponsive, makeHeight, makeLineClamp, makeStyle, makeStyleKey, makeStyleResponsive, makeStyleResponsiveByScreen, makeStyleResponsiveState, makeStyleState, makeStyleWithDefault, makeWidth, normalizeBuilderData, optionLayoutStyle, parseSelectedOption, parseValueWithUnit, prefetchQueries, props, removeAttrInStyle, removeNullUndefined, removePaddingYInStyle, removeUndefinedValuesFromObject, shopifyPriceRounding, splitStyle, styles, template, tiktokpixel, useAddToCart, useAddon, useAddons, useArticleListStore, useArticleStore, useArticlesQuery, useBlogsQuery, useBuilderComponent, useBuilderPreviewStore, useBuilderStore, useCartData, useCartDiscountCodesUpdate, useCartId, useCartLine, useCartLineStore, useCartNoteUpdate, useCartUI, useCheckAvailableVariantInStock, useCheckoutUrl, useCollection, useCollectionQuery, useCollectionStore, useCollectionsQuery, useConnectedShopify, useCreateCart, useCurrency, useCurrentDevice, useCurrentVariant, useCurrentVariantInStock, useEditorMode, useFeaturedImageGlobal, useFormatMoney, useInitialSwatchesOptions, useIsSampleProduct, useIsStorefrontProduct, useIsSyncProduct, useIsomorphicLayoutEffect, useLazyVideo, useLoadScript, useLocale, useMatchMutate, useMobileOnly, useModalStore, useMoney, useMoneyFormat, usePageStore, usePageType, usePluginEnable, usePrevious, useProduct, useProductList, useProductListProducts, useProductListSettings, useProductListStore, useProductListStyles, useProductOfferDiscount, useProductProperties, useProductQuery, useProductStore, useProductsQuery, useProductsQueryAll, useQuantity, useRemoveCartItem, useSection, useSectionStore, useSelectedOption, useShopStore, useStoreFront, useSuspenseFetch, useSwatches, useSwatchesOptions, useUniqProductID, useUpdateCartItem, useVariant, useVariantOutStock, useVariants, validateEmail };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gem-sdk/core",
-  "version": "1.46.0-staging.4",
+  "version": "1.46.0",
   "license": "MIT",
   "sideEffects": false,
   "main": "dist/cjs/index.js",
@@ -27,12 +27,13 @@
     "type-check": "yarn tsc --noEmit"
   },
   "devDependencies": {
-    "@gem-sdk/adapter-shopify": "1.45.0",
-    "@gem-sdk/styles": "1.46.0-staging.1",
+    "@gem-sdk/adapter-shopify": "1.46.0",
+    "@gem-sdk/styles": "1.46.0",
     "@types/classnames": "^2.3.1"
   },
   "dependencies": {
     "classnames": "^2.5.1",
+    "cssjson": "2.1.3",
     "dayjs": "^1.11.11",
     "react-error-boundary": "4.0.10",
     "swr": "2.1.2",