@statorjs/language-server 0.1.6 → 0.1.7

package/dist/server.cjs

@@ -44476,6 +44476,17 @@ var WRAP_PREFIX_LEN = "const __t = (<>".length;
 var INLINE_SCRIPT_RE = /<script\b([^>]*\bis:inline\b[^>]*)>([\s\S]*?)<\/script>/gi;
 var inlineMarker = (i) => `\0statorInlineScript${i}\0`;
 var INLINE_MARKER_RE = /statorInlineScript(\d+)/g;
+function eachItemParamsFor(jsx) {
+  let node = jsx.parent;
+  while (node && import_typescript3.default.isParenthesizedExpression(node)) node = node.parent;
+  if (!node || !import_typescript3.default.isArrowFunction(node)) return null;
+  const call = node.parent;
+  if (!call || !import_typescript3.default.isCallExpression(call) || !import_typescript3.default.isIdentifier(call.expression)) return null;
+  if (call.expression.text !== "each" || call.arguments[1] !== node) return null;
+  const p0 = node.parameters[0];
+  if (!p0 || !import_typescript3.default.isIdentifier(p0.name)) return null;
+  return { item: p0.name.text };
+}
 function lowerTemplate(template, opts = {}) {
   let doctype = "";
   let doctypeLen = 0;
@@ -44503,6 +44514,9 @@ function lowerTemplate(template, opts = {}) {
   );
   const scopeSuffix = opts.scopeAttr ? ` ${opts.scopeAttr}` : "";
   const meta = opts.meta;
+  let eachParams = null;
+  const enableItemBind = !opts.client;
+  const isItemRead = (n) => enableItemBind && eachParams !== null && import_typescript3.default.isCallExpression(n) && import_typescript3.default.isIdentifier(n.expression) && n.expression.text === "read" && n.arguments.length >= 2 && n.arguments[0] !== void 0 && import_typescript3.default.isIdentifier(n.arguments[0]) && n.arguments[0].text === eachParams.item;
   const loc2 = (node) => {
     if (opts.source == null || opts.templateOffset == null) return void 0;
     const orig = opts.templateOffset + doctypeLen + (node.getStart(sf) - WRAP_PREFIX_LEN);
@@ -44518,6 +44532,90 @@ function lowerTemplate(template, opts = {}) {
   };
   find(sf);
   if (!fragment) throw new CompileError("stator: could not parse template body as JSX");
+  const checkNoReadInDefer = (node, insideDefer) => {
+    let nowInsideDefer = insideDefer;
+    if (import_typescript3.default.isCallExpression(node) && import_typescript3.default.isIdentifier(node.expression)) {
+      const callee = node.expression.text;
+      if (callee === "defer") {
+        nowInsideDefer = true;
+      } else if (callee === "read" && insideDefer) {
+        throw new CompileError(
+          `stator: read() cannot appear inside a defer() arm \u2014 a defer slot is one-shot and static, so the value would never update. For a live value, use a machine and place the read in a sibling slot outside the defer.`,
+          loc2(node)
+        );
+      }
+    }
+    import_typescript3.default.forEachChild(node, (child) => checkNoReadInDefer(child, nowInsideDefer));
+  };
+  checkNoReadInDefer(fragment, false);
+  const checkItemReadPlacement = (node, frames) => {
+    if (import_typescript3.default.isCallExpression(node) && import_typescript3.default.isIdentifier(node.expression)) {
+      const callee = node.expression.text;
+      const arg0 = node.arguments[0];
+      if (callee === "read" && node.arguments.length >= 2 && arg0 && import_typescript3.default.isIdentifier(arg0)) {
+        const param = arg0.text;
+        for (let i = frames.length - 1; i >= 0; i--) {
+          const f = frames[i];
+          if (f.kind !== "each" || f.param !== param) continue;
+          const between = frames.slice(i + 1);
+          const branch = between.find((b) => b.kind === "branch");
+          if (branch && branch.kind === "branch") {
+            throw new CompileError(
+              branch.position === "head" ? `stator: read(${param}, \u2026) cannot drive a ${branch.callee}() \u2014 a branch binding needs a machine source to re-diff against. Derive the condition in a machine selector and read that instead.` : `stator: read(${param}, \u2026) cannot appear inside a ${branch.callee}() arm \u2014 an item read is owned by its each() row, and an arm re-renders on its own schedule without the row. Inside the arm, read the field from the machine (read(machine, (m) => m.items.find(\u2026))), or restructure so the arm doesn't split the row (render both states and toggle with a class binding + CSS).`,
+              loc2(node)
+            );
+          }
+          const outer = between.find((b) => b.kind === "each");
+          if (outer) {
+            throw new CompileError(
+              `stator: read(${param}, \u2026) reads an outer each()'s item from inside a nested each() row \u2014 an item read is owned by the row that binds its item, and the inner row would evaluate it against the wrong item. Derive the field onto the inner item, or use a machine read.`,
+              loc2(node)
+            );
+          }
+          const listAttr = between.find((b) => b.kind === "list-attr");
+          if (listAttr && listAttr.kind === "list-attr") {
+            throw new CompileError(
+              `stator: read(${param}, \u2026) is not supported inside a ${listAttr.attr} spec \u2014 the compound directive recomposes per machine, not per row. Give the whole attribute a single item read (style={read(${param}, \u2026)}), or use a machine read inside the spec.`,
+              loc2(node)
+            );
+          }
+          break;
+        }
+      }
+      if (callee === "when" || callee === "match" || callee === "defer") {
+        node.arguments.forEach((arg, idx) => {
+          checkItemReadPlacement(arg, [
+            ...frames,
+            { kind: "branch", callee, position: idx === 0 ? "head" : "arm" }
+          ]);
+        });
+        return;
+      }
+      if (callee === "each") {
+        const renderer = node.arguments[1];
+        for (const arg of node.arguments) {
+          if (arg === renderer && import_typescript3.default.isArrowFunction(arg)) {
+            const p0 = arg.parameters[0];
+            const inner = p0 && import_typescript3.default.isIdentifier(p0.name) ? [...frames, { kind: "each", param: p0.name.text }] : frames;
+            checkItemReadPlacement(arg.body, inner);
+          } else {
+            checkItemReadPlacement(arg, frames);
+          }
+        }
+        return;
+      }
+    }
+    if (import_typescript3.default.isJsxAttribute(node) && import_typescript3.default.isJsxNamespacedName(node.name) && node.name.name.text === "list" && (node.name.namespace.text === "class" || node.name.namespace.text === "style")) {
+      const attr = `${node.name.namespace.text}:list`;
+      import_typescript3.default.forEachChild(
+        node,
+        (c) => checkItemReadPlacement(c, [...frames, { kind: "list-attr", attr }])
+      );
+      return;
+    }
+    import_typescript3.default.forEachChild(node, (c) => checkItemReadPlacement(c, frames));
+  };
+  if (enableItemBind) checkItemReadPlacement(fragment, []);
   const contentOfChildren = (children) => {
     let out = "";
     for (const child of children) out += contentOfChild(child);
@@ -44560,16 +44658,24 @@ function lowerTemplate(template, opts = {}) {
     if (import_typescript3.default.isJsxElement(expr) || import_typescript3.default.isJsxSelfClosingElement(expr) || import_typescript3.default.isJsxFragment(expr)) {
       return `html\`${contentOfChild(expr)}\``;
     }
+    if (isItemRead(expr)) {
+      return `itemBind(${lowerExprText(expr.arguments[1])})`;
+    }
     const exprStart = expr.getStart(sf);
     let text = expr.getText(sf);
     const repls = [];
     const visit = (n) => {
       if (n !== expr && (import_typescript3.default.isJsxElement(n) || import_typescript3.default.isJsxSelfClosingElement(n) || import_typescript3.default.isJsxFragment(n))) {
-        repls.push([
-          n.getStart(sf),
-          n.getEnd(),
-          `html\`${contentOfChild(n)}\``
-        ]);
+        const prevEach = eachParams;
+        const params = enableItemBind ? eachItemParamsFor(n) : null;
+        if (params) eachParams = params;
+        const lowered = `html\`${contentOfChild(n)}\``;
+        eachParams = prevEach;
+        repls.push([n.getStart(sf), n.getEnd(), lowered]);
+        return;
+      }
+      if (n !== expr && isItemRead(n)) {
+        repls.push([n.getStart(sf), n.getEnd(), `itemBind(${n.arguments[1].getText(sf)})`]);
         return;
       }
       import_typescript3.default.forEachChild(n, visit);
@@ -44582,6 +44688,21 @@ function lowerTemplate(template, opts = {}) {
     return text;
   };
   const lowerAttributes = (attrs) => {
+    for (const ns of ["class", "style"]) {
+      const hasStatic = attrs.properties.some(
+        (a) => import_typescript3.default.isJsxAttribute(a) && !import_typescript3.default.isJsxNamespacedName(a.name) && a.name.getText(sf) === ns
+      );
+      const listAttr = attrs.properties.find(
+        (a) => import_typescript3.default.isJsxAttribute(a) && import_typescript3.default.isJsxNamespacedName(a.name) && a.name.namespace.text === ns && a.name.name.text === "list"
+      );
+      if (hasStatic && listAttr) {
+        const example = ns === "class" ? "class:list={['place-tab', { active }]}" : "style:list={['color: red', { ... }]}";
+        throw new CompileError(
+          `stator: an element has both a static \`${ns}\` attribute and \`${ns}:list\` \u2014 they emit two \`${ns}\` attributes and the browser silently keeps only one. Move the static ${ns} into \`${ns}:list\`, which accepts a static string alongside the dynamic parts: ${example}.`,
+          loc2(listAttr)
+        );
+      }
+    }
     const clientMarker = opts.client ? collectClientDirectives(attrs) : void 0;
     let out = "";
     for (const attr of attrs.properties) {
@@ -45007,7 +45128,7 @@ function isSubjectGlobal(sel) {
 }
 
 // ../stator/src/compiler/compile.ts
-var PRIMITIVES_IMPORT = "import { html, read, each, when, match, on, classList, styleList } from '@statorjs/stator/template'";
+var PRIMITIVES_IMPORT = "import { html, read, each, itemBind, when, match, defer, on, classList, styleList } from '@statorjs/stator/template'";
 function compile(source, opts = {}) {
   const { frontmatter, template, styles, scripts, scriptOffsets, templateOffset } = splitStator(source);
   const kind = opts.kind ?? "component";
@@ -45084,11 +45205,11 @@ function compileClient(template, script, ctx) {
   const attrDecl = `{ ${[...cls.staticAttrs].map(([k, v]) => `${k}: ${JSON.stringify(v)}`).join(", ")} }`;
   const rootScope = ctx.scopeAttr ? ` data-s-${ctx.hash}` : "";
   const serverCode = [
-    "import { html, read, each, when, match, on, classList, styleList, createHtmlFragment, clientShellAttrs } from '@statorjs/stator/template'",
+    "import { html, read, each, when, match, defer, on, classList, styleList, createHtmlFragment, clientShellAttrs } from '@statorjs/stator/template'",
     "",
     `export default function (props = {}) {`,
     `  const __inner = ${innerExpr}`,
-    `  const __attrs = clientShellAttrs(props, ${attrDecl})`,
+    `  const __attrs = clientShellAttrs(props, ${attrDecl}, ${JSON.stringify(root2.rootAttrs)})`,
     `  return createHtmlFragment(\`<${root2.tag}\${__attrs}${rootScope}>\` + __inner.html + \`</${root2.tag}>\`)`,
     "}",
     ""
@@ -45109,6 +45230,20 @@ function compileClient(template, script, ctx) {
     clientTag: root2.tag
   };
 }
+function staticRootAttrs(attrs, sf) {
+  const out = {};
+  for (const attr of attrs.properties) {
+    if (!import_typescript4.default.isJsxAttribute(attr) || import_typescript4.default.isJsxNamespacedName(attr.name)) continue;
+    const name = attr.name.getText(sf);
+    const init = attr.initializer;
+    if (init === void 0) {
+      out[name] = true;
+    } else if (import_typescript4.default.isStringLiteral(init)) {
+      out[name] = init.text;
+    }
+  }
+  return out;
+}
 function extractClientRoot(template, file) {
   const wrapped = `const __t = (<>${template}</>);`;
   const sf = import_typescript4.default.createSourceFile("t.tsx", wrapped, import_typescript4.default.ScriptTarget.Latest, true, import_typescript4.default.ScriptKind.TSX);
@@ -45134,13 +45269,13 @@ function extractClientRoot(template, file) {
   if (import_typescript4.default.isJsxSelfClosingElement(rootEl)) {
     const tag2 = rootEl.tagName.getText(sf);
     requireCustomRoot(tag2, file);
-    return { tag: tag2, inner: "" };
+    return { tag: tag2, inner: "", rootAttrs: staticRootAttrs(rootEl.attributes, sf) };
   }
   const el = rootEl;
   const tag = el.openingElement.tagName.getText(sf);
   requireCustomRoot(tag, file);
   const inner = wrapped.slice(el.openingElement.getEnd(), el.closingElement.getStart());
-  return { tag, inner };
+  return { tag, inner, rootAttrs: staticRootAttrs(el.openingElement.attributes, sf) };
 }
 function requireCustomRoot(tag, file) {
   if (!isCustomElementTag(tag)) {
@@ -45329,7 +45464,7 @@ var import_typescript6 = __toESM(require("typescript"), 1);
 
 // ../stator/src/compiler/virtual-code.ts
 var import_typescript7 = __toESM(require("typescript"), 1);
-var TEMPLATE_GLOBALS = ["read", "each", "when", "match", "on", "classList", "styleList"];
+var TEMPLATE_GLOBALS = ["read", "each", "when", "match", "defer", "on", "classList", "styleList"];
 var CLIENT_GLOBALS = [
   "StatorElement",
   "use",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statorjs/language-server",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "description": "Volar-based language server for .stator files.",
   "license": "MIT",
   "type": "module",
@@ -33,7 +33,7 @@
     "volar-service-typescript": "0.0.71",
     "vscode-css-languageservice": "^6.3.0",
     "vscode-uri": "^3.0.8",
-    "@statorjs/stator": "1.3.0"
+    "@statorjs/stator": "1.4.0"
   },
   "peerDependencies": {
     "typescript": "^5.6.0"