@zohofinance/commerce 1.1.0 → 2.1.0

package/ts-dist/custom-tags/sections-tag.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sections-tag.d.ts","sourceRoot":"","sources":["../../src/custom-tags/sections-tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAUzE,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,cAAc,CAAC;AAEnE,MAAM,CAAC,OAAO,MAAO,SAAQ,GAAG;IAC9B,OAAO,CAAC,QAAQ,CAAS;gBAEb,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAE,EAAE,MAAM,EAAE,MAAM;IAM1E,WAAW,CAAC,QAAQ,EAAE,MAAM;IAItB,MAAM,CAAC,OAAO,EAAE,OAAO;IAWvB,cAAc,CAAC,EACnB,aAAa,EACb,QAAQ,EACR,IAAI,EACL,EAAE;QACD,aAAa,EAAE,MAAM,EAAE,CAAC;QACxB,QAAQ,EAAE,YAAY,CAAC;QACvB,IAAI,EAAE,GAAG,CAAC;KACX;CA0FF"}
+{"version":3,"file":"sections-tag.d.ts","sourceRoot":"","sources":["../../src/custom-tags/sections-tag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AAYzE,OAAO,KAAK,EAAoB,YAAY,EAAE,MAAM,cAAc,CAAC;AAQnE,MAAM,CAAC,OAAO,MAAO,SAAQ,GAAG;IAC9B,OAAO,CAAC,QAAQ,CAAS;gBAEb,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,aAAa,EAAE,EAAE,MAAM,EAAE,MAAM;IAM1E,WAAW,CAAC,QAAQ,EAAE,MAAM;IAItB,MAAM,CAAC,OAAO,EAAE,OAAO;IAevB,cAAc,CAAC,EACnB,aAAa,EACb,QAAQ,EACR,IAAI,EACL,EAAE;QACD,aAAa,EAAE,MAAM,EAAE,CAAC;QACxB,QAAQ,EAAE,YAAY,CAAC;QACvB,IAAI,EAAE,GAAG,CAAC;KACX;CA6GF"}

package/ts-dist/custom-tags/sections-tag.js

@@ -1,8 +1,17 @@
 import { Tag } from 'liquidjs';
 import { readFileContent, readJSONFileContent } from '../utils/file-operations.js';
 import { prepareSectionData } from '../utils/prepare-section-data.js';
+import { buildSectionComponentAttr } from '../utils/editor-attributes.js';
 import { resolveSchemaSettings } from '../utils/resolve-schema-settings.js';
+import { resolveSchemaName } from '../utils/resolve-schema-translations.js';
 import { renderTrackedLiquidFile } from '../utils/liquid-render-frame.js';
+function inferJsonType(sectionsFileName) {
+    if (sectionsFileName.startsWith('header'))
+        return 'header';
+    if (sectionsFileName.startsWith('footer'))
+        return 'footer';
+    return 'template';
+}
 export default class extends Tag {
     sections;
     constructor(token, remainTokens, liquid) {
@@ -15,6 +24,10 @@ export default class extends Tag {
     }
     async render(context) {
         let { order, sections } = (await readJSONFileContent(`sections/${this.sections}.json`));
+        const editorMode = this.liquid.__editorMode;
+        if (editorMode) {
+            this.liquid.__editorJsonType = inferJsonType(this.sections);
+        }
         return this.renderSections({
             sections,
             section_order: order,
@@ -22,6 +35,8 @@ export default class extends Tag {
         });
     }
     async renderSections({ section_order, sections, data }) {
+        const editorMode = this.liquid.__editorMode;
+        const editorJsonType = this.liquid.__editorJsonType || 'template';
         let renderedSectionsArr = (section_order || []).map(async (section) => {
             let sectionToRender = sections[section].type || '';
             let fileContent = await readFileContent(this.getFilePath(`sections/${sectionToRender}.liquid`));
@@ -52,14 +67,25 @@ export default class extends Tag {
                     /* ignore */
                 }
             }
-            sections[section] = prepareSectionData(sections[section], schemaData, section);
-            return renderTrackedLiquidFile(this.liquid, this.getFilePath(`sections/${sectionToRender}.liquid`), {
-                ...data,
-                section: {
-                    ...sections[section],
-                    id: `section_${section}`
-                }
-            });
+            const cwd = process.cwd();
+            sections[section] = prepareSectionData(sections[section], schemaData, section, editorMode ? { jsonType: editorJsonType } : undefined, cwd);
+            const displayName = editorMode
+                ? resolveSchemaName(schemaData?.name, sectionToRender, cwd)
+                : '';
+            const sectionContext = {
+                ...sections[section],
+                id: `section_${section}`,
+                ...(editorMode ? {
+                    settingid: `setting_section_${sectionToRender}`,
+                    display_name: displayName
+                } : {})
+            };
+            const sectionHtml = await renderTrackedLiquidFile(this.liquid, this.getFilePath(`sections/${sectionToRender}.liquid`), { ...data, section: sectionContext });
+            if (editorMode) {
+                const attrJson = buildSectionComponentAttr(sectionToRender, section, editorJsonType, displayName);
+                return `<div data-zcommerce-component='${attrJson.replace(/'/g, '&#39;')}' style="display:contents">${sectionHtml}</div>`;
+            }
+            return sectionHtml;
         });
         const arr = await Promise.all(renderedSectionsArr);
         return arr.join('');

package/ts-dist/utils/editor-attributes.d.ts

@@ -0,0 +1,3 @@
+export declare function buildSectionComponentAttr(sectionType: string, sectionKey: string, jsonType: string, displayName?: string): string;
+export declare function buildBlockZcommerceAttributes(blockType: string, blockKey: string, sectionKey: string, jsonType: string, displayName?: string): string;
+//# sourceMappingURL=editor-attributes.d.ts.map

package/ts-dist/utils/editor-attributes.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"editor-attributes.d.ts","sourceRoot":"","sources":["../../src/utils/editor-attributes.ts"],"names":[],"mappings":"AAAA,wBAAgB,yBAAyB,CACvC,WAAW,EAAE,MAAM,EACnB,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,MAAM,EAChB,WAAW,CAAC,EAAE,MAAM,GACnB,MAAM,CASR;AAED,wBAAgB,6BAA6B,CAC3C,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,MAAM,EAChB,WAAW,CAAC,EAAE,MAAM,GACnB,MAAM,CAWR"}

package/ts-dist/utils/editor-attributes.js

@@ -0,0 +1,22 @@
+export function buildSectionComponentAttr(sectionType, sectionKey, jsonType, displayName) {
+    return JSON.stringify({
+        id: `section_${sectionKey}`,
+        'data-zcommerce-section-id': '',
+        'data-zcommerce-component-name': displayName || sectionType,
+        'data-zcommerce-component-key': `section_${sectionKey}`,
+        'data-zcommerce-json-type': jsonType,
+        settingid: `setting_section_${sectionType}`
+    });
+}
+export function buildBlockZcommerceAttributes(blockType, blockKey, sectionKey, jsonType, displayName) {
+    const id = `block_${blockKey}_section_${sectionKey}`;
+    const attrJson = JSON.stringify({
+        id,
+        'data-zcommerce-section-id': `section_${sectionKey}`,
+        'data-zcommerce-component-name': displayName || blockType,
+        'data-zcommerce-component-key': id,
+        'data-zcommerce-json-type': jsonType,
+        settingid: `setting_block_${blockType}`
+    }).replace(/'/g, ''');
+    return `data-zcommerce-component='${attrJson}'`;
+}

package/ts-dist/utils/prepare-section-data.d.ts

@@ -6,12 +6,15 @@ type SchemaSetting = {
 };
 type SchemaBlock = {
     type: string;
+    name?: string;
     settings?: SchemaSetting[];
 };
 type SectionSchema = {
     settings?: SchemaSetting[];
     blocks?: SchemaBlock[];
 };
-export declare function prepareSectionData(sectionData: SectionsType[string], schemaData?: SectionSchema, sectionKey?: string): import("types/common").SectionType;
+export declare function prepareSectionData(sectionData: SectionsType[string], schemaData?: SectionSchema, sectionKey?: string, editorOptions?: {
+    jsonType: string;
+}, cwd?: string): import("types/common").SectionType;
 export {};
 //# sourceMappingURL=prepare-section-data.d.ts.map

package/ts-dist/utils/prepare-section-data.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prepare-section-data.d.ts","sourceRoot":"","sources":["../../src/utils/prepare-section-data.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;CAC5B,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;CACxB,CAAC;AAwFF,wBAAgB,kBAAkB,CAChC,WAAW,EAAE,YAAY,CAAC,MAAM,CAAC,EACjC,UAAU,CAAC,EAAE,aAAa,EAC1B,UAAU,CAAC,EAAE,MAAM,sCAqDpB"}
+{"version":3,"file":"prepare-section-data.d.ts","sourceRoot":"","sources":["../../src/utils/prepare-section-data.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,KAAK,aAAa,GAAG;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;CAC5B,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC;IAC3B,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;CACxB,CAAC;AAwFF,wBAAgB,kBAAkB,CAChC,WAAW,EAAE,YAAY,CAAC,MAAM,CAAC,EACjC,UAAU,CAAC,EAAE,aAAa,EAC1B,UAAU,CAAC,EAAE,MAAM,EACnB,aAAa,CAAC,EAAE;IAAE,QAAQ,EAAE,MAAM,CAAA;CAAE,EACpC,GAAG,CAAC,EAAE,MAAM,sCAmFb"}

package/ts-dist/utils/prepare-section-data.js

@@ -1,4 +1,6 @@
 import { resolveThemeAssetUrlsInValue } from './resolve-theme-asset-url.js';
+import { buildBlockZcommerceAttributes } from './editor-attributes.js';
+import { resolveSchemaName } from './resolve-schema-translations.js';
 function isBlankImagePickerValue(value) {
     if (value === null || value === '') {
         return true;
@@ -61,7 +63,7 @@ function normalizeBlocksRecursively(blockData, sectionKey) {
             normalizeBlocksRecursively(child, sectionKey);
     }
 }
-export function prepareSectionData(sectionData, schemaData, sectionKey) {
+export function prepareSectionData(sectionData, schemaData, sectionKey, editorOptions, cwd) {
     normalizeBlocksRecursively(sectionData, sectionKey);
     if (schemaData?.settings && sectionData.settings) {
         applyImagePickerDefaults(sectionData.settings, schemaData.settings);
@@ -90,5 +92,26 @@ export function prepareSectionData(sectionData, schemaData, sectionKey) {
             return block;
         });
     }
+    if (editorOptions && Array.isArray(sectionData.blocks)) {
+        const { jsonType } = editorOptions;
+        const blockSchemaNameMap = new Map((schemaData?.blocks || []).map((b) => [b.type, b.name]));
+        sectionData.blocks = sectionData.blocks.map((block) => {
+            const rawKey = (block.block_key || block.id || '');
+            const cleanKey = rawKey.startsWith('block_')
+                ? rawKey.replace(/^block_/, '').replace(/_section_.*$/, '')
+                : rawKey;
+            const blockType = (block.type || '');
+            const existingDisplayName = block.display_name;
+            const displayName = existingDisplayName
+                || (cwd
+                    ? resolveSchemaName(blockSchemaNameMap.get(blockType), blockType, cwd)
+                    : blockType);
+            return {
+                ...block,
+                type: blockType,
+                zcommerce_attributes: buildBlockZcommerceAttributes(blockType, cleanKey, sectionKey || '', jsonType, displayName)
+            };
+        });
+    }
     return sectionData;
 }

package/ts-dist/utils/resolve-schema-translations.d.ts

@@ -0,0 +1,3 @@
+export declare function resolveSchemaTranslations<T>(schema: T, cwd: string): T;
+export declare function resolveSchemaName(name: string | undefined, fallback: string, cwd: string): string;
+//# sourceMappingURL=resolve-schema-translations.d.ts.map

package/ts-dist/utils/resolve-schema-translations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolve-schema-translations.d.ts","sourceRoot":"","sources":["../../src/utils/resolve-schema-translations.ts"],"names":[],"mappings":"AA+CA,wBAAgB,yBAAyB,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,GAAG,CAAC,CAItE;AAED,wBAAgB,iBAAiB,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAMjG"}

package/ts-dist/utils/resolve-schema-translations.js

@@ -0,0 +1,61 @@
+import path from 'path';
+import fs from 'fs-extra';
+const localeCache = new Map();
+function loadSchemaLocale(cwd) {
+    if (localeCache.has(cwd))
+        return localeCache.get(cwd);
+    const filePath = path.join(cwd, 'i18n', 'en.schema.json');
+    try {
+        const locale = fs.existsSync(filePath)
+            ? JSON.parse(fs.readFileSync(filePath, 'utf-8'))
+            : null;
+        localeCache.set(cwd, locale);
+        return locale;
+    }
+    catch {
+        localeCache.set(cwd, null);
+        return null;
+    }
+}
+function lookupTKey(key, locale) {
+    const parts = key.slice(2).split('.');
+    let node = locale;
+    for (const part of parts) {
+        if (node == null || typeof node !== 'object')
+            return undefined;
+        node = node[part];
+    }
+    return typeof node === 'string' ? node : undefined;
+}
+function resolveTKeysIn(value, locale) {
+    if (typeof value === 'string' && value.startsWith('t:')) {
+        return lookupTKey(value, locale) ?? value;
+    }
+    if (Array.isArray(value)) {
+        return value.map((item) => resolveTKeysIn(item, locale));
+    }
+    if (value !== null && typeof value === 'object') {
+        const out = {};
+        for (const [k, v] of Object.entries(value)) {
+            out[k] = resolveTKeysIn(v, locale);
+        }
+        return out;
+    }
+    return value;
+}
+export function resolveSchemaTranslations(schema, cwd) {
+    const locale = loadSchemaLocale(cwd);
+    if (!locale)
+        return schema;
+    return resolveTKeysIn(schema, locale);
+}
+export function resolveSchemaName(name, fallback, cwd) {
+    if (!name)
+        return fallback;
+    if (!name.startsWith('t:'))
+        return name;
+    const locale = loadSchemaLocale(cwd);
+    if (!locale)
+        return name;
+    return lookupTKey(name, locale) ?? name;
+}

package/ts-dist/utils/template-engine.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"template-engine.d.ts","sourceRoot":"","sources":["../../src/utils/template-engine.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAwBlC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,UAGN,MAAM,kBAAkB,CAAC;AAc1B,OAAO,EAEL,KAAK,YAAY,EAElB,MAAM,cAAc,CAAC;AAEtB,qBAAa,cAAc;;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,CAAC,QAAQ,CACT;IAEP,IAAI,OAAO,IAGK,CAAC,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CADzE;IACD,IAAI,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,EAGzE;IAED,OAAO,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QACzB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;QACpB,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAM;IAEP,GAAG,EAAE,MAAM,CAAC;gBAEA,OAAO,gBAAK,EAAE,UAAU,EAAE,UAAU;IAQhD,iBAAiB,CAAC,OAAO,KAAK;IA+DxB,mBAAmB,CAAC,EACxB,QAAQ,EACR,IAAI,EACL,EAAE;QACD,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;KACd,GAAG,OAAO,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,WAAW,CAAA;KAAE,CAAC;IA+F7C,cAAc,CAAC,EACnB,aAAa,EACb,QAAQ,EACR,IAAI,EACL,EAAE;QACD,aAAa,EAAE,MAAM,EAAE,CAAC;QACxB,QAAQ,EAAE,YAAY,CAAC;QACvB,IAAI,EAAE,GAAG,CAAC;KACX;IA6FK,YAAY,CAAC,EACjB,MAAgB,EAChB,sBAAsB,EACtB,IAAI,EACL,EAAE;QACD,MAAM,EAAE,MAAM,CAAC;QACf,sBAAsB,EAAE,MAAM,CAAC;QAC/B,IAAI,EAAE,MAAM,CAAC;KACd;IAgBK,YAAY,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAO1C,UAAU,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAI/C,WAAW,CAAC,QAAQ,EAAE,MAAM;IAI5B,OAAO;CAGR"}
+{"version":3,"file":"template-engine.d.ts","sourceRoot":"","sources":["../../src/utils/template-engine.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAwBlC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,UAGN,MAAM,kBAAkB,CAAC;AAgB1B,OAAO,EAEL,KAAK,YAAY,EAElB,MAAM,cAAc,CAAC;AAEtB,qBAAa,cAAc;;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,CAAC,QAAQ,CACT;IAEP,IAAI,OAAO,IAGK,CAAC,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,CADzE;IACD,IAAI,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,GAAG,IAAI,EAGzE;IAED,OAAO,EAAE;QACP,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QACzB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;QACpB,IAAI,CAAC,EAAE,MAAM,CAAC;KACf,CAAM;IAEP,GAAG,EAAE,MAAM,CAAC;gBAEA,OAAO,gBAAK,EAAE,UAAU,EAAE,UAAU;IAQhD,iBAAiB,CAAC,OAAO,KAAK;IA+DxB,mBAAmB,CAAC,EACxB,QAAQ,EACR,IAAI,EACL,EAAE;QACD,QAAQ,EAAE,MAAM,CAAC;QACjB,IAAI,EAAE,MAAM,CAAC;KACd,GAAG,OAAO,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,WAAW,CAAA;KAAE,CAAC;IA+F7C,cAAc,CAAC,EACnB,aAAa,EACb,QAAQ,EACR,IAAI,EACL,EAAE;QACD,aAAa,EAAE,MAAM,EAAE,CAAC;QACxB,QAAQ,EAAE,YAAY,CAAC;QACvB,IAAI,EAAE,GAAG,CAAC;KACX;IA+GK,YAAY,CAAC,EACjB,MAAgB,EAChB,sBAAsB,EACtB,IAAI,EACL,EAAE;QACD,MAAM,EAAE,MAAM,CAAC;QACf,sBAAsB,EAAE,MAAM,CAAC;QAC/B,IAAI,EAAE,MAAM,CAAC;KACd;IAgBK,YAAY,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAO1C,UAAU,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM;IAI/C,WAAW,CAAC,QAAQ,EAAE,MAAM;IAI5B,OAAO;CAGR"}

package/ts-dist/utils/template-engine.js

@@ -7,9 +7,11 @@ import { LiquidError } from '../utils/liquid-error.js';
 import { extractLiquidErrorLocation, toThemeRelativePath } from './stack-trace.js';
 import { promises as fs } from 'fs';
 import { prepareSectionData } from './prepare-section-data.js';
+import { buildSectionComponentAttr } from './editor-attributes.js';
 import { normalizeLiquidBlankAssignments } from './normalize-liquid-blank.js';
 import { createNormalizedLiquidFs } from './normalized-liquid-fs.js';
 import { resolveSchemaSettings } from './resolve-schema-settings.js';
+import { resolveSchemaName } from './resolve-schema-translations.js';
 import { attachCliStackTrace, withLiquidRenderFrame, renderTrackedLiquidFile, renderTrackedLiquidString } from './liquid-render-frame.js';
 export class TemplateEngine {
     engine;
@@ -159,6 +161,8 @@ export class TemplateEngine {
     async renderSections({ section_order, sections, data }) {
         let renderedSection = '';
         let renderedSectionsArr = [];
+        const editorMode = this.engine.__editorMode;
+        const editorJsonType = this.engine.__editorJsonType || 'template';
         for (const section of section_order || []) {
             let sectionToRender = sections[section].type || '';
             let liquidSection = `sections/${sectionToRender}.liquid`;
@@ -189,14 +193,24 @@ export class TemplateEngine {
                     console.error(`Failed to parse schema for section ${sectionToRender}:`, error);
                 }
             }
-            sections[section] = prepareSectionData(sections[section], schemaData, section);
+            sections[section] = prepareSectionData(sections[section], schemaData, section, editorMode ? { jsonType: editorJsonType } : undefined, this.cwd);
+            const sectionContext = {
+                ...sections[section],
+                id: `section_${section}`,
+                ...(editorMode ? {
+                    settingid: `setting_section_${sectionToRender}`,
+                    display_name: resolveSchemaName(schemaData?.name, sectionToRender, this.cwd)
+                } : {})
+            };
             let sectionData = await this.renderFile(this.getFilePath(`sections/${sectionToRender}.liquid`), {
                 ...data,
-                section: {
-                    ...sections[section],
-                    id: `section_${section}`
-                }
+                section: sectionContext
             });
+            if (editorMode) {
+                const displayName = resolveSchemaName(schemaData?.name, sectionToRender, this.cwd);
+                const attrJson = buildSectionComponentAttr(sectionToRender, section, editorJsonType, displayName);
+                sectionData = `<div data-zcommerce-component='${attrJson.replace(/'/g, '&#39;')}' style="display:contents">${sectionData}</div>`;
+            }
             renderedSectionsArr.push(sectionData);
         }
         await Promise.all(renderedSectionsArr).then((arr) => {

package/ts-dist/utils/theme-mocks.d.ts

@@ -0,0 +1,2 @@
+export declare function getMock<T>(name: string, builtin: T): T;
+//# sourceMappingURL=theme-mocks.d.ts.map

package/ts-dist/utils/theme-mocks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-mocks.d.ts","sourceRoot":"","sources":["../../src/utils/theme-mocks.ts"],"names":[],"mappings":"AAkCA,wBAAgB,OAAO,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,GAAG,CAAC,CAQtD"}

package/ts-dist/utils/theme-mocks.js

@@ -0,0 +1,40 @@
+import fs from 'fs';
+import path from 'path';
+/**
+ * Theme-level mock overrides for `theme dev` without --storeUrl.
+ *
+ * A theme may ship `mocks/<name>.json` next to `pages/` (e.g. mocks/products.json,
+ * mocks/global-objects.json). When present, it replaces the built-in mock of the same
+ * name, so a preview can use data that fits the theme. `mocks/` is not a theme folder:
+ * `theme build` never copies it and theme validation skips it.
+ *
+ * Objects are merged one level deep over the built-in (so a global-objects override can
+ * set just `store` and `menu` and keep `routes`); arrays and other values replace it.
+ * Files are read on every call so edits show up on the next page load.
+ */
+const MOCKS_DIR = 'mocks';
+function readOverride(name) {
+    const file = path.join(process.cwd(), MOCKS_DIR, `${name}.json`);
+    if (!fs.existsSync(file)) {
+        return undefined;
+    }
+    try {
+        return JSON.parse(fs.readFileSync(file, 'utf-8'));
+    }
+    catch (error) {
+        console.warn(`Ignoring ${MOCKS_DIR}/${name}.json: ${error.message}`);
+        return undefined;
+    }
+}
+function isPlainObject(value) {
+    return value !== null && typeof value === 'object' && !Array.isArray(value);
+}
+export function getMock(name, builtin) {
+    const override = readOverride(name);
+    if (override === undefined) {
+        return builtin;
+    }
+    return isPlainObject(override) && isPlainObject(builtin)
+        ? { ...builtin, ...override }
+        : override;
+}