meno-core 1.0.46 → 1.0.48

package/lib/server/ssr/ssrRenderer.ts

@@ -20,6 +20,7 @@ import { isComponentNode, isHtmlNode, isLinkNode, isEmbedNode, isLocaleListNode,
 import type { ListNode } from '../../shared/registry/nodeTypes/ListNodeType';
 import type { CMSService } from '../services/cmsService';
 import { extractAttributesFromNode, skipEmptyTemplateAttributes } from '../../shared/attributeNodeUtils';
+import { mergeNodeStyles } from '../../shared/styleNodeUtils';
 import { SSRRegistry } from '../../shared/registry/SSRRegistry';
 import { mergeResponsiveStyles } from '../../shared/responsiveStyleUtils';
 // Lazy-loaded: jsdom (used by isomorphic-dompurify on the server) can't be bundled by esbuild
@@ -242,6 +243,14 @@ function evaluateIfCondition(node: ComponentNode, ctx: SSRContext): boolean {
       resolved = processCMSTemplate(resolved, ctx.cmsContext.cms, ctx.locale, ctx.i18nConfig);
     }
 
+    // Unresolved template (e.g. {{prop}} where the prop is undefined and
+    // processStructure preserved the original template per evaluateTemplate's
+    // backward-compat fallback) → treat as falsy so missing context means
+    // "don't render", matching `if: false` and unset BooleanMapping values.
+    if (resolved.includes('{{') && resolved.includes('}}')) {
+      return false;
+    }
+
     // Evaluate truthiness - false, 0, empty string are falsy
     return Boolean(resolved) && resolved !== 'false' && resolved !== '0' && resolved !== '';
   }
@@ -1112,13 +1121,25 @@ async function renderNode(
   // Convert styles to utility classes instead of inline styles
   let utilityClasses: string[] = [];
   let resolvedStyle: StyleObject = {};
+  // For custom component instances, defer style→class conversion: forward the
+  // style object so renderComponent can deep-merge it into the structure root,
+  // then let the recursive renderNode call generate classes from the merged
+  // result. This matches the client (ComponentBuilder.mergeNodeStyles) so that
+  // an instance override of e.g. marginBottom actually replaces the structure's
+  // marginBottom instead of fighting it as a same-specificity utility class.
+  const isCustomComponentNode = nodeType === NODE_TYPE.COMPONENT && isComponentNode(node) && ssrComponentRegistry.has(node.component);
+  let deferredComponentStyle: StyleObject | ResponsiveStyleObject | undefined;
 
   if (nodeStyle) {
-    // Validate that all styles can generate utility classes (build-time warnings)
-    validateStyleCoverage(nodeStyle, `Node: ${nodeType || 'unknown'}`);
+    if (isCustomComponentNode) {
+      deferredComponentStyle = nodeStyle;
+    } else {
+      // Validate that all styles can generate utility classes (build-time warnings)
+      validateStyleCoverage(nodeStyle, `Node: ${nodeType || 'unknown'}`);
 
-    // Convert style object to utility class names (process templates in style values)
-    utilityClasses = processStyleToClasses(nodeStyle, ctx);
+      // Convert style object to utility class names (process templates in style values)
+      utilityClasses = processStyleToClasses(nodeStyle, ctx);
+    }
   } else if (nodeProps.style) {
     // If no node.style but props have style, keep it for backward compatibility
     if (isResponsiveStyle(nodeProps.style) && breakpoints && viewportWidth) {
@@ -1164,7 +1185,9 @@ async function renderNode(
     ...nodeProps,
     ...nodeAttributesWithoutClass,
     ...(mergedClassName ? { className: mergedClassName } : {}),
-    ...(Object.keys(resolvedStyle).length > 0 ? { style: resolvedStyle } : {})
+    ...(deferredComponentStyle
+      ? { style: deferredComponentStyle }
+      : Object.keys(resolvedStyle).length > 0 ? { style: resolvedStyle } : {})
   };
 
   // Check if this is a custom component
@@ -1243,42 +1266,25 @@ async function renderComponent(
 
     // Merge instance style overrides, className, and attributes
     // processedStructure is typically an HTML node (the component's root element)
-    // Handle both component nodes and HTML nodes
+    // Handle component nodes, HTML nodes, and Link nodes (Link and HTML share top-level style/attributes)
     const rootNode = processedStructure as ComponentNode & { props?: Record<string, unknown>; style?: any; attributes?: Record<string, string | number | boolean> };
-    if (isComponentNode(rootNode) || isHtmlNode(rootNode)) {
+    if (isComponentNode(rootNode) || isHtmlNode(rootNode) || isLinkNode(rootNode)) {
       if (!rootNode.props) {
         rootNode.props = {};
       }
 
-      // For HTML root nodes, merge styles into node.style (where the renderer reads them)
-      if (isHtmlNode(rootNode)) {
-        if (propsWithStyleAndAttrs.style) {
-          const existingStyle = rootNode.style;
-          if (existingStyle && typeof existingStyle === 'object') {
-            rootNode.style = {
-              ...(existingStyle as Record<string, any>),
-              ...(propsWithStyleAndAttrs.style as Record<string, any>)
-            };
-          } else {
-            rootNode.style = propsWithStyleAndAttrs.style as StyleObject | ResponsiveStyleObject;
-          }
-        }
-      } else {
-        // For component root nodes, merge into props.style
-        if (rootNode.props.style && typeof rootNode.props.style === 'object') {
-          rootNode.props.style = {
-            ...(rootNode.props.style as Record<string, unknown>),
-            ...(propsWithStyleAndAttrs.style as Record<string, unknown> || {})
-          };
-        } else if (propsWithStyleAndAttrs.style) {
-          rootNode.props.style = propsWithStyleAndAttrs.style;
-        }
+      // Deep-merge instance styles into the structure root (per-breakpoint for
+      // responsive styles), so an instance override of a property actually
+      // replaces the structure's value for that property instead of producing a
+      // competing utility class on the same element.
+      if (propsWithStyleAndAttrs.style) {
+        mergeNodeStyles(rootNode, propsWithStyleAndAttrs.style as StyleObject | ResponsiveStyleObject);
       }
 
       // Merge className from component instance (includes responsive utility classes)
       if (propsWithStyleAndAttrs.className) {
-        if (isHtmlNode(rootNode)) {
-          // For HTML root nodes, merge into attributes where the renderer reads them
+        if (isHtmlNode(rootNode) || isLinkNode(rootNode)) {
+          // For HTML and Link root nodes, merge into attributes where the renderer reads them
           if (!rootNode.attributes) rootNode.attributes = {};
           const existingClass = (rootNode.attributes.class || '') as string;
           rootNode.attributes.class = existingClass
@@ -1293,11 +1299,11 @@ async function renderComponent(
       }
 
       // Merge attributes into props
-      Object.assign(rootNode.props, nodeAttributes);
+      Object.assign(rootNode.props as Record<string, unknown>, nodeAttributes);
 
-      // Forward nodeAttributes to rootNode.attributes for HTML root nodes
+      // Forward nodeAttributes to rootNode.attributes for HTML/Link root nodes
       // so attributes from outer components (e.g. data-component) reach the final HTML element
-      if (isHtmlNode(rootNode) && Object.keys(nodeAttributes).length > 0) {
+      if ((isHtmlNode(rootNode) || isLinkNode(rootNode)) && Object.keys(nodeAttributes).length > 0) {
         if (!rootNode.attributes) {
           rootNode.attributes = {};
         }

package/lib/server/utils/jsonLineMapper.test.ts

@@ -70,7 +70,27 @@ describe("jsonLineMapper", () => {
 }`;
 
       const lineMap = buildLineMap(json);
-      expect(lineMap.size).toBe(0);
+      // Only the root entry (empty-string key) is recorded; no children.
+      expect(lineMap.size).toBe(1);
+      expect(lineMap.get("")).toBeDefined();
+    });
+
+    test("records the root's own line range under the empty-string key", () => {
+      const json = `{
+  "root": {
+    "type": "node",
+    "children": [
+      {
+        "type": "node",
+        "tag": "div"
+      }
+    ]
+  }
+}`;
+
+      const lineMap = buildLineMap(json);
+      // Root value starts at line 2 and closes at line 10.
+      expect(lineMap.get("")).toEqual({ startLine: 2, endLine: 10 });
     });
 
     test("should handle JSON without root", () => {
@@ -83,6 +103,38 @@ describe("jsonLineMapper", () => {
       const lineMap = buildLineMap(json);
       expect(lineMap.size).toBe(0);
     });
+
+    test("tracks component format via component.structure", () => {
+      const json = `{
+  "component": {
+    "interface": {
+      "size": { "type": "text" }
+    },
+    "structure": {
+      "type": "node",
+      "tag": "h1",
+      "children": [
+        {
+          "type": "node",
+          "tag": "span"
+        },
+        {
+          "type": "component",
+          "component": "Icon"
+        }
+      ]
+    }
+  }
+}`;
+
+      const lineMap = buildLineMap(json);
+      // Structure spans from its opening `{` (line 6) to its closing `}` (line 19).
+      expect(lineMap.get("")).toEqual({ startLine: 6, endLine: 19 });
+      // First child: the <span>.
+      expect(lineMap.get("0")?.startLine).toBe(10);
+      // Second child: the Icon component instance.
+      expect(lineMap.get("1")?.startLine).toBe(14);
+    });
   });
 
   describe("lineMapToObject", () => {

package/lib/server/utils/jsonLineMapper.ts

@@ -86,6 +86,16 @@ export function buildLineMap(jsonText: string): LineMap {
     return { start: startPos, end: pos };
   }
 
+  function recordTrackedRoot(path: number[]): void {
+    // Parse the root element of the tracked structure and record its own line range
+    // under the empty-string key, so callers can resolve the root selection itself.
+    const { start, end } = parseValue(path, true);
+    lineMap.set('', {
+      startLine: charToLine[start],
+      endLine: charToLine[end - 1] || charToLine[start],
+    });
+  }
+
   function parseObject(path: number[], trackChildren: boolean): void {
     pos++; // skip {
     skipWhitespace();
@@ -98,10 +108,13 @@ export function buildLineMap(jsonText: string): LineMap {
       skipWhitespace();
 
       if (key === 'root' && path.length === 0) {
-        // Track root object - children inside will be tracked
-        parseValue(path, true);
+        // Page format: track from `root`.
+        recordTrackedRoot(path);
+      } else if (key === 'component' && path.length === 0) {
+        // Component format: descend into the component object looking for `structure`.
+        parseComponentWrapper(path);
       } else if (key === 'children' && trackChildren) {
-        // This is a children array - track each child with indices
+        // Children array — track each element with indices
         parseValue(path, true);
       } else {
         // Regular property - don't track individual items
@@ -115,6 +128,33 @@ export function buildLineMap(jsonText: string): LineMap {
     pos++; // skip }
   }
 
+  function parseComponentWrapper(path: number[]): void {
+    // We expect an object value for the `component` key. If it isn't one, just skip it.
+    if (jsonText[pos] !== '{') {
+      parseValue(path, false);
+      return;
+    }
+    pos++; // skip {
+    skipWhitespace();
+    while (pos < jsonText.length && jsonText[pos] !== '}') {
+      skipWhitespace();
+      const key = parseString();
+      skipWhitespace();
+      pos++; // skip :
+      skipWhitespace();
+      if (key === 'structure') {
+        // The component's structure is the root of what we track — same as `root` for pages.
+        recordTrackedRoot(path);
+      } else {
+        parseValue(path, false);
+      }
+      skipWhitespace();
+      if (jsonText[pos] === ',') pos++;
+      skipWhitespace();
+    }
+    pos++; // skip }
+  }
+
   function parseArray(path: number[], trackChildren: boolean): void {
     pos++; // skip [
     skipWhitespace();