fix(editor): type nested attribute expressions

packages/syntax/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wrnexus/syntax",
-  "version": "0.8.17",
+  "version": "0.8.18",
   "type": "module",
   "main": "src/index.ts",
   "exports": {

packages/syntax/src/index.ts

@@ -2,6 +2,8 @@ export { Lexer, LexError, skipLiteralOrComment } from "./tokenizer.ts";
 export { formatWrn } from "./formatter.ts";
 export type { FormatWrnOptions } from "./formatter.ts";
 export { parse, parseHtmlView, ParseError, VOID_ELEMENTS } from "./parser.ts";
+export { extractInterpolations } from "./interpolation.ts";
+export type { InterpolationSegment } from "./interpolation.ts";
 export type {
   ActionBlock,
   ApiBlock,

packages/syntax/src/interpolation.ts

@@ -0,0 +1,39 @@
+export interface InterpolationSegment {
+  expression: string;
+  start: number;
+  end: number;
+}
+
+/** Extract top-level `{...}` expressions while preserving nested object/array literals. */
+export function extractInterpolations(value: string): InterpolationSegment[] {
+  const segments: InterpolationSegment[] = [];
+  let index = 0;
+  while (index < value.length) {
+    if (value[index] !== "{") {
+      index++;
+      continue;
+    }
+    const start = index++;
+    let depth = 1;
+    let quote: string | null = null;
+    while (index < value.length && depth > 0) {
+      const char = value[index]!;
+      if (quote) {
+        if (char === "\\" && index + 1 < value.length) index += 2;
+        else {
+          if (char === quote) quote = null;
+          index++;
+        }
+        continue;
+      }
+      if (char === '"' || char === "'" || char === "`") quote = char;
+      else if (char === "{") depth++;
+      else if (char === "}") depth--;
+      index++;
+    }
+    if (depth === 0) {
+      segments.push({ expression: value.slice(start + 1, index - 1).trim(), start, end: index });
+    }
+  }
+  return segments;
+}

packages/syntax/test/syntax.test.ts

@@ -1,5 +1,5 @@
 import { expect, test } from "bun:test";
-import { diagnose, formatDiagnostic, parse } from "../src/index.ts";
+import { diagnose, extractInterpolations, formatDiagnostic, parse } from "../src/index.ts";
 
 test("parses explicit rendering modes and the never hydration alias", () => {
   const ast = parse(`page Marketing {
@@ -337,3 +337,14 @@ test("a block comment inside props is still refused with its own message", () =>
 `;
   expect(() => parse(source)).toThrow("Block comments are not allowed inside props");
 });
+
+test("extracts nested object and array interpolation as one expression", () => {
+  const value = `prefix {[{ label: 'One', meta: { count: 1 } }, { label: "Two" }]} suffix`;
+  expect(extractInterpolations(value)).toEqual([
+    {
+      expression: `[{ label: 'One', meta: { count: 1 } }, { label: "Two" }]`,
+      start: 7,
+      end: value.length - 7,
+    },
+  ]);
+});