@statorjs/language-server 0.1.15 → 0.1.17

package/dist/server.cjs

@@ -44220,7 +44220,7 @@ function locAt(source, offset, file) {
 }
 
 // ../stator/src/compiler/client-emit.ts
-var PRIMITIVES = "import { StatorElement, defineElement, use, machine, bind, effect, dispatch } from '@statorjs/stator/client'";
+var PRIMITIVES = "import { StatorElement, defineElement, use, machine, bind, bindSlot, effect, dispatch } from '@statorjs/stator/client'";
 function emitClientModule(input) {
   const { script, element, directives, members } = input;
   const impl = `__${element.className}Impl`;
@@ -44233,9 +44233,16 @@ function emitClientModule(input) {
   const lines = [];
   let i = 0;
   for (const [marker, group] of byMarker) {
+    if (group[0]?.kind === "slot") {
+      for (const d of group) {
+        const thunk = `() => (${rewriteMembers(d.expr, members)})`;
+        const deps = `[${d.deps.map((dep) => `this.${dep}`).join(", ")}]`;
+        lines.push(`    this.track(bindSlot(this, ${JSON.stringify(marker)}, ${deps}, ${thunk}))`);
+      }
+      continue;
+    }
     const node = `n${i++}`;
-    lines.push(`    const ${node} = this.querySelector('[data-b="${marker}"]')`);
-    lines.push(`    if (${node}) {`);
+    lines.push(`    for (const ${node} of this.querySelectorAll('[data-b="${marker}"]')) {`);
     for (const d of group) lines.push(`      ${wireDirective(node, d, members)}`);
     lines.push("    }");
   }
@@ -44472,10 +44479,27 @@ function scopeHash(input) {
 
 // ../stator/src/compiler/lower.ts
 var import_typescript3 = __toESM(require("typescript"), 1);
+function cleanJsxText(raw) {
+  const lines = raw.split(/\r\n|\n|\r/);
+  let lastNonEmpty = 0;
+  for (let i = 0; i < lines.length; i++) {
+    if (/[^ \t]/.test(lines[i])) lastNonEmpty = i;
+  }
+  let out = "";
+  for (let i = 0; i < lines.length; i++) {
+    let line = lines[i].replace(/\t/g, " ");
+    if (i !== 0) line = line.replace(/^ +/, "");
+    if (i !== lines.length - 1) line = line.replace(/ +$/, "");
+    if (!line) continue;
+    if (i !== lastNonEmpty) line += " ";
+    out += line;
+  }
+  return out;
+}
 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;
+var INLINE_MARKER_RE = /\0statorInlineScript(\d+)\0/g;
 function eachItemParamsFor(jsx) {
   let node = jsx.parent;
   while (node && import_typescript3.default.isParenthesizedExpression(node)) node = node.parent;
@@ -44517,6 +44541,24 @@ function lowerTemplate(template, opts = {}) {
   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 isClientRead = (n) => opts.client !== void 0 && 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]) && opts.client.useFields.has(n.arguments[0].text);
+  const clientReadExpr = (call) => `(${call.arguments[1].getText(sf)})(${call.arguments[0].text})`;
+  const allocSlotMarker = () => {
+    const client = opts.client;
+    if (!client) throw new CompileError("stator: internal \u2014 slot marker outside client mode");
+    return `s${client.directives.filter((d) => d.kind === "slot").length}`;
+  };
+  const assertNoClientRead = (n) => {
+    if (!opts.client) return;
+    if (import_typescript3.default.isJsxElement(n) || import_typescript3.default.isJsxSelfClosingElement(n) || import_typescript3.default.isJsxFragment(n)) return;
+    if (isClientRead(n)) {
+      throw new CompileError(
+        `stator: read(${n.arguments[0].text}, \u2026) on a client machine must be the entire expression \u2014 text position (\`{read(m, s => \u2026)}\`) or attribute position (\`attr={read(m, s => \u2026)}\`). Compose derived values inside the selector.`,
+        loc2(n)
+      );
+    }
+    import_typescript3.default.forEachChild(n, assertNoClientRead);
+  };
   const loc2 = (node) => {
     if (opts.source == null || opts.templateOffset == null) return void 0;
     const orig = opts.templateOffset + doctypeLen + (node.getStart(sf) - WRAP_PREFIX_LEN);
@@ -44622,9 +44664,20 @@ function lowerTemplate(template, opts = {}) {
     return out;
   };
   const contentOfChild = (node) => {
-    if (import_typescript3.default.isJsxText(node)) return escapeText(node.getText(sf));
+    if (import_typescript3.default.isJsxText(node)) return escapeText(cleanJsxText(node.getFullText(sf)));
     if (import_typescript3.default.isJsxExpression(node)) {
       if (!node.expression) return "";
+      if (opts.client && isClientRead(node.expression)) {
+        const marker = allocSlotMarker();
+        const expr = clientReadExpr(node.expression);
+        opts.client.directives.push({
+          marker,
+          kind: "slot",
+          expr,
+          deps: inferDeps(expr, opts.client.useFields)
+        });
+        return `<!--${marker}-->`;
+      }
       return `\${${lowerExprText(node.expression)}}`;
     }
     if (import_typescript3.default.isJsxElement(node)) {
@@ -44658,6 +44711,7 @@ function lowerTemplate(template, opts = {}) {
     if (import_typescript3.default.isJsxElement(expr) || import_typescript3.default.isJsxSelfClosingElement(expr) || import_typescript3.default.isJsxFragment(expr)) {
       return `html\`${contentOfChild(expr)}\``;
     }
+    assertNoClientRead(expr);
     if (isItemRead(expr)) {
       return `itemBind(${lowerExprText(expr.arguments[1])})`;
     }
@@ -44703,56 +44757,79 @@ function lowerTemplate(template, opts = {}) {
         );
       }
     }
-    const clientMarker = opts.client ? collectClientDirectives(attrs) : void 0;
+    const collected = opts.client ? collectClientDirectives(attrs) : void 0;
     let out = "";
     for (const attr of attrs.properties) {
       if (import_typescript3.default.isJsxSpreadAttribute(attr)) {
-        throw new CompileError("stator: spread attributes ({...x}) are not supported", loc2(attr));
-      }
-      if (import_typescript3.default.isJsxAttribute(attr) && !import_typescript3.default.isJsxNamespacedName(attr.name) && attr.name.getText(sf) === "child") {
+        out += ` \${spreadAttrs(${lowerExprText(attr.expression)})}`;
         continue;
       }
-      if (opts.client && import_typescript3.default.isJsxAttribute(attr) && import_typescript3.default.isJsxNamespacedName(attr.name) && (attr.name.namespace.text === "on" || attr.name.namespace.text === "bind")) {
+      if (import_typescript3.default.isJsxAttribute(attr) && !import_typescript3.default.isJsxNamespacedName(attr.name) && attr.name.getText(sf) === "child") {
         continue;
       }
+      if (collected?.consumed.has(attr)) continue;
       const lowered = lowerAttribute(attr);
       if (lowered) out += ` ${lowered}`;
     }
-    if (clientMarker) out += ` data-b="${clientMarker}"`;
+    if (collected?.marker) out += ` data-b="${collected.marker}"`;
     return out;
   };
   const collectClientDirectives = (attrs) => {
+    const consumed = /* @__PURE__ */ new Set();
     const client = opts.client;
-    if (!client) return void 0;
+    if (!client) return { consumed };
     const pending = [];
     for (const attr of attrs.properties) {
-      if (!import_typescript3.default.isJsxAttribute(attr) || !import_typescript3.default.isJsxNamespacedName(attr.name)) continue;
-      const ns = attr.name.namespace.text;
-      const name = attr.name.name.text;
-      if (ns !== "on" && ns !== "bind") continue;
-      const expr = attrExpr(attr);
-      if (!expr) {
-        throw new CompileError(`stator: ${ns}:${name} requires a value ({...})`, loc2(attr));
+      if (!import_typescript3.default.isJsxAttribute(attr)) continue;
+      if (import_typescript3.default.isJsxNamespacedName(attr.name)) {
+        const ns = attr.name.namespace.text;
+        const name = attr.name.name.text;
+        if (ns !== "on" && ns !== "bind") continue;
+        const expr = attrExpr(attr);
+        if (!expr) {
+          throw new CompileError(`stator: ${ns}:${name} requires a value ({...})`, loc2(attr));
+        }
+        if (ns === "on") {
+          pending.push({ marker: "", kind: "on", event: name, expr, deps: [] });
+        } else {
+          pending.push({
+            marker: "",
+            kind: "bind",
+            target: name,
+            expr,
+            deps: inferDeps(expr, client.useFields)
+          });
+        }
+        consumed.add(attr);
+        continue;
       }
-      if (ns === "on") {
-        pending.push({ marker: "", kind: "on", event: name, expr, deps: [] });
-      } else {
+      const init = attr.initializer;
+      if (init && import_typescript3.default.isJsxExpression(init) && init.expression && isClientRead(init.expression)) {
+        const target = attr.name.getText(sf);
+        if (target === "value" || target === "checked") {
+          throw new CompileError(
+            `stator: read() can't live-drive ${target}= from a client machine \u2014 the control owns its draft. Pre-fill with a server-rendered ${target} attribute, populate/reset via ref: at safe moments, and capture input with a typed commit event. See the forms guide.`,
+            loc2(attr)
+          );
+        }
+        const expr = clientReadExpr(init.expression);
         pending.push({
           marker: "",
           kind: "bind",
-          target: name,
+          target,
           expr,
           deps: inferDeps(expr, client.useFields)
         });
+        consumed.add(attr);
       }
     }
-    if (pending.length === 0) return void 0;
-    const marker = `b${new Set(client.directives.map((d) => d.marker)).size}`;
+    if (pending.length === 0) return { consumed };
+    const marker = `b${new Set(client.directives.filter((d) => d.kind !== "slot").map((d) => d.marker)).size}`;
     for (const d of pending) {
       d.marker = marker;
       client.directives.push(d);
     }
-    return marker;
+    return { marker, consumed };
   };
   const lowerChildrenPlaceholder = (attrs) => {
     if (meta) meta.usesChildren = true;
@@ -44827,18 +44904,30 @@ function lowerTemplate(template, opts = {}) {
   };
   const lowerComponent = (tag, attrs, children) => {
     const entries = [];
+    const forwarded = [];
     for (const attr of attrs.properties) {
       if (import_typescript3.default.isJsxSpreadAttribute(attr)) {
-        throw new CompileError(
-          `stator: spread props ({...x}) on <${tag}/> are not supported`,
-          loc2(attr)
-        );
+        entries.push(`...${lowerExprText(attr.expression)}`);
+        continue;
       }
       if (import_typescript3.default.isJsxNamespacedName(attr.name)) {
-        throw new CompileError(
-          `stator: directive "${attr.name.namespace.text}:${attr.name.name.text}" is not valid on component <${tag}/> \u2014 directives apply to HTML elements, not components`,
-          loc2(attr)
-        );
+        const ns = attr.name.namespace.text;
+        const dirName = attr.name.name.text;
+        if (ns !== "on") {
+          throw new CompileError(
+            `stator: forwarding "${ns}:${dirName}" to a component isn't supported yet \u2014 only on:* event directives forward. Apply bind:/ref: on an element directly.`,
+            loc2(attr)
+          );
+        }
+        const value = attrExpr(attr);
+        if (!value) {
+          throw new CompileError(
+            `stator: on:${dirName} on <${tag}/> requires a handler ({...})`,
+            loc2(attr)
+          );
+        }
+        forwarded.push(`${JSON.stringify(`on:${dirName}`)}: ${value}`);
+        continue;
       }
       const name = attr.name.getText(sf);
       if (!attr.initializer) {
@@ -44875,6 +44964,7 @@ function lowerTemplate(template, opts = {}) {
       }
       if (bag.length > 0) entries.push(`children: { ${bag.join(", ")} }`);
     }
+    if (forwarded.length > 0) entries.push(`$directives: { ${forwarded.join(", ")} }`);
     return `${tag}({ ${entries.join(", ")} })`;
   };
   const body = `html\`${doctype}${contentOfChildren(fragment.children)}\``;
@@ -45128,7 +45218,7 @@ function isSubjectGlobal(sel) {
 }
 
 // ../stator/src/compiler/compile.ts
-var PRIMITIVES_IMPORT = "import { html, read, each, itemBind, when, match, defer, on, classList, styleList } from '@statorjs/stator/template'";
+var PRIMITIVES_IMPORT = "import { html, read, each, itemBind, when, match, defer, on, classList, styleList, spreadAttrs } from '@statorjs/stator/template'";
 function compile(source, opts = {}) {
   const { frontmatter, template, styles, scripts, scriptOffsets, templateOffset } = splitStator(source);
   const kind = opts.kind ?? "component";
@@ -45205,7 +45295,7 @@ 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, defer, on, classList, styleList, createHtmlFragment, clientShellAttrs } from '@statorjs/stator/template'",
+    "import { html, read, each, when, match, defer, on, classList, styleList, spreadAttrs, createHtmlFragment, clientShellAttrs } from '@statorjs/stator/template'",
     "",
     `export default function (props = {}) {`,
     `  const __inner = ${innerExpr}`,
@@ -45334,6 +45424,23 @@ function processFrontmatter(fm, kind, source, file) {
         repls.push([n.getStart(sf), n.getEnd(), bound]);
         return;
       }
+      if (import_typescript4.default.isCallExpression(n) && isStatorCall(n, "forwarded")) {
+        if (kind === "route") {
+          throw new CompileError(
+            "stator: Stator.forwarded() is only available in a component \u2014 it reads a directive forwarded from a parent (`<Child on:click={h}/>`), and a route has no parent.",
+            locInFm(n)
+          );
+        }
+        const arg = n.arguments[0];
+        if (!arg) {
+          throw new CompileError(
+            "stator: Stator.forwarded(name) takes a directive name, e.g. Stator.forwarded('on:click')",
+            locInFm(n)
+          );
+        }
+        repls.push([n.getStart(sf), n.getEnd(), `props.$directives?.[${arg.getText(sf)}]`]);
+        return;
+      }
       if (import_typescript4.default.isPropertyAccessExpression(n) && isStatorMember(n, "request")) {
         requireRoute("Stator.request", kind, locInFm(n));
         repls.push([n.getStart(sf), n.getEnd(), "__req"]);
@@ -45495,16 +45602,17 @@ function injectImports(globals, modulePath, userCode) {
   return missing.length > 0 ? `import { ${missing.join(", ")} } from '${modulePath}';
 ` : "";
 }
-var AMBIENT_TYPE_IMPORTS = "import type { AnyMachineDef as __SMachineDef } from '@statorjs/stator/machine';\nimport type { InstanceOf as __SInstanceOf } from '@statorjs/stator/template';\n";
+var AMBIENT_TYPE_IMPORTS = "import type { AnyMachineDef as __SMachineDef } from '@statorjs/stator/machine';\nimport type { InstanceOf as __SInstanceOf } from '@statorjs/stator/template';\nimport type { StatorIntrinsicElements as __SIntrinsics } from '@statorjs/stator/template';\n";
 var STATOR_AMBIENT = `declare const Stator: {
   props<P>(): P;
   reads<const T extends readonly __SMachineDef[]>(defs: T): { -readonly [K in keyof T]: __SInstanceOf<T[K]> };
+  forwarded(name: \`on:\${string}\`): (() => unknown) | undefined;
   request: any;
   response: { status: number; headers: Record<string, string>; cookies: any };
 };
 declare global {
   namespace JSX {
-    interface IntrinsicElements extends Record<string, any> {}
+    interface IntrinsicElements extends __SIntrinsics {}
   }
 }
 `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@statorjs/language-server",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "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.7.1"
+    "@statorjs/stator": "1.9.0"
   },
   "peerDependencies": {
     "typescript": "^5.6.0"