@archie/devtools 0.0.41 → 0.0.42

package/dist/{chunk-6QB35SLQ.mjs → chunk-O3UMTM4N.mjs}

@@ -78,6 +78,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return "";
   }
+  function isIntrinsicTagName(name) {
+    return t.isJSXIdentifier(name) && /^[a-z]/.test(name.name);
+  }
   function isHostLikeMemberExpressionName(name) {
     if (!t.isJSXMemberExpression(name)) return false;
     const propertyName = name.property.name;
@@ -168,6 +171,18 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return hasAny ? t.objectExpression(props) : null;
   }
+  function describeChildrenText(opening) {
+    const elementPath = opening.parentPath;
+    if (!elementPath || !elementPath.isJSXElement()) return null;
+    const element = elementPath.node;
+    if (!element.closingElement) return null;
+    const children = element.children;
+    if (children.length === 0) return "";
+    if (children.length !== 1) return "__dynamic__";
+    const [only] = children;
+    if (!t.isJSXText(only)) return "__dynamic__";
+    return only.value.trim();
+  }
   function isMetaStripSpreadExpression(arg) {
     if (!t.isCallExpression(arg)) return false;
     if (!t.isArrowFunctionExpression(arg.callee)) return false;
@@ -275,6 +290,14 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return map;
   }
+  function restParamName(pattern) {
+    for (const prop of pattern.properties) {
+      if (!t.isRestElement(prop)) continue;
+      if (t.isIdentifier(prop.argument)) return prop.argument.name;
+      return null;
+    }
+    return null;
+  }
   function resolvePropContext(path2) {
     let fn = path2.getFunctionParent();
     while (fn) {
@@ -283,7 +306,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
         return {
           componentScope: fn.scope,
           propMap: buildPropMap(first),
-          componentName: getFunctionName(fn)
+          componentName: getFunctionName(fn),
+          restParam: restParamName(first),
+          componentPath: fn
         };
       }
       fn = fn.getFunctionParent();
@@ -403,12 +428,62 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     const props = collectPropIdentifiers(expr, scope, ctx);
     return props.length > 0 ? { kind: "formatted", prop: props[0] } : null;
   }
+  function unwrapSanitizedSpread(arg) {
+    if (!t.isCallExpression(arg)) return arg;
+    if (!isMetaStripSpreadExpression(arg)) return arg;
+    if (arg.arguments.length !== 1) return arg;
+    const [payload] = arg.arguments;
+    if (!t.isObjectExpression(payload) || payload.properties.length !== 1) return arg;
+    const [only] = payload.properties;
+    if (!t.isSpreadElement(only)) return arg;
+    return only.argument;
+  }
+  function forwardsOwnerRestChildren(opening, ctx) {
+    if (ctx.restParam === null) return false;
+    const elementPath = opening.parentPath;
+    if (!elementPath || !elementPath.isJSXElement()) return false;
+    if (meaningfulChildren(t, elementPath.node.children).length > 0) return false;
+    let spreadsRest = 0;
+    for (const attr of opening.node.attributes) {
+      if (t.isJSXAttribute(attr)) {
+        if (t.isJSXIdentifier(attr.name, { name: "children" })) return false;
+        continue;
+      }
+      if (!t.isJSXSpreadAttribute(attr)) continue;
+      const payload = unwrapSanitizedSpread(attr.argument);
+      if (!t.isIdentifier(payload, { name: ctx.restParam })) return false;
+      spreadsRest += 1;
+    }
+    if (spreadsRest !== 1) return false;
+    const binding = opening.scope.getBinding(ctx.restParam);
+    if (!binding) return false;
+    if (binding.scope !== ctx.componentScope) return false;
+    return binding.constant;
+  }
+  const restForwarderCounts = /* @__PURE__ */ new WeakMap();
+  function countRestForwarders(ctx) {
+    const cached = restForwarderCounts.get(ctx.componentPath.node);
+    if (cached !== void 0) return cached;
+    let count = 0;
+    ctx.componentPath.traverse({
+      JSXOpeningElement(inner) {
+        if (forwardsOwnerRestChildren(inner, ctx)) count += 1;
+      }
+    });
+    restForwarderCounts.set(ctx.componentPath.node, count);
+    return count;
+  }
   function collectPropBindings(path2, attrs) {
     const ctx = resolvePropContext(path2);
-    if (!ctx || ctx.propMap.size === 0) return { bindings: [], owner: null };
+    if (!ctx || ctx.propMap.size === 0 && ctx.restParam === null) {
+      return { bindings: [], owner: null };
+    }
     if (ctx.componentName === null) return { bindings: [], owner: null };
     const scope = path2.scope;
     const bindings = [];
+    if (forwardsOwnerRestChildren(path2, ctx) && countRestForwarders(ctx) === 1) {
+      bindings.push({ target: "children", prop: "children", kind: "direct" });
+    }
     const elementPath = path2.parentPath;
     if (elementPath && elementPath.isJSXElement()) {
       const children = meaningfulChildren(t, elementPath.node.children);
@@ -510,7 +585,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
           return;
         }
         let rootName = null;
-        if (t.isJSXIdentifier(path2.node.name)) {
+        if (isIntrinsicTagName(path2.node.name)) {
+          rootName = null;
+        } else if (t.isJSXIdentifier(path2.node.name)) {
           rootName = path2.node.name.name;
         } else if (t.isJSXMemberExpression(path2.node.name)) {
           let cur = path2.node.name;
@@ -572,6 +649,15 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
             t.objectProperty(t.identifier("slot"), t.stringLiteral(slot))
           );
         }
+        if (!isHostElement) {
+          const childrenText = describeChildrenText(path2);
+          metaObj.properties.push(
+            t.objectProperty(
+              t.identifier("childrenText"),
+              childrenText === null ? t.nullLiteral() : t.stringLiteral(childrenText)
+            )
+          );
+        }
         if (bindings.length > 0) {
           metaObj.properties.push(
             t.objectProperty(t.identifier("propBindings"), propBindingsToAst(bindings))

package/dist/collection-binding.mjs

@@ -1,6 +1,6 @@
 import {
   meaningfulChildren
-} from "./chunk-6QB35SLQ.mjs";
+} from "./chunk-O3UMTM4N.mjs";
 
 // src/babel-plugin-collection-binding.ts
 import { VISITOR_KEYS } from "@babel/types";

package/dist/index.d.mts

@@ -12,6 +12,7 @@ import { types, PluginObj } from '@babel/core';
  *   nodeId, file, line, col, componentName, staticProps, movable, parentNodeId
  *   + (ARCH-883 F1) slot, propBindings, propOwner
  *   + (ARCH-883-KOI) origin
+ *   + (ARCH-1444) childrenText — non-host elements only
  *
  * At runtime the Fiber bridge reads `memoizedProps.__editorMeta` to resolve
  * element identity without any DOM attributes.
@@ -169,6 +170,17 @@ declare function babelPluginEditorMeta({ types: t }: {
  * `id`/`htmlFor`/`name`/`type`/`role`/`slot`) are downgraded to `formatted` by the
  * PRODUCER, because no usage value could make them a text edit. The consumer does
  * not need to re-derive that list; it only needs the allowlist above.
+ *
+ * ARCH-1443: `{ target: 'children', prop: 'children', kind: 'direct' }` is emitted
+ * for an element that forwards its component's props REST and renders no children
+ * of its own — the shape EVERY ejected shadcn-style primitive has
+ * (`({ className, ...p }) => <h3 className={…} {...p} />`). Nothing about the
+ * allowlist changes: the usage value of `children` is the JSX children written at
+ * the usage site (`<CardTitle>Cómo funciona</CardTitle>`), and the same
+ * usage-value law applies to it — plain text is writable, a nested element or a
+ * computed expression is a gap. The producer refuses whenever more than one
+ * element in the component forwards the rest, since one `children` prop cannot
+ * name which of them an edit is about.
  */
 interface PropBinding {
     /**
@@ -216,6 +228,38 @@ interface EditorMeta {
     componentName: string;
     /** Safely serializable literal prop values. Dynamic expressions are "__dynamic__". */
     staticProps: Record<string, unknown> | null;
+    /**
+     * ARCH-1444 — the SHAPE of this element's JSX children, and their text when
+     * that text is plain. `staticProps` is built from ATTRIBUTES only, so without
+     * this field the `children` prop is the one binding target whose value at the
+     * usage a consumer cannot see — and the usage-value law above ("plain text is
+     * writable, a nested element or a computed expression is a gap") is stated in
+     * terms of exactly that value.
+     *
+     *   `null`          — the element is SELF-CLOSING: no children container at
+     *                     all. NOT the same as `''` (`<X></X>`), which can take a
+     *                     text write; `<X />` cannot without a structural rewrite.
+     *   `''`            — an empty children container.
+     *   `'__dynamic__'` — anything that is not exactly one JSXText child: an
+     *                     expression container, a nested element, a comment, or
+     *                     several children. Same sentinel as `staticProps`.
+     *   any other string— the sole JSXText child, TRIMMED (JSX itself trims
+     *                     leading/trailing whitespace-with-newlines, so the
+     *                     trimmed form is what renders). A newline that SURVIVES
+     *                     the trim is real multi-line content: a consumer that
+     *                     writes by splicing must refuse it, because replacing it
+     *                     with one line deletes source lines and invalidates every
+     *                     anchor below.
+     *
+     * Emitted for NON-HOST elements only — a usage is always a component tag, and
+     * stamping every `<div>` would be weight for an answer nothing asks.
+     *
+     * ABSENT (`undefined`) on a host element and on every bundle built before this
+     * change. Absence is NOT "no children": it means the page cannot answer the
+     * question, and a consumer must gap the edit rather than assume (the same law
+     * `origin`'s docstring states at length).
+     */
+    childrenText?: string | null;
     /**
      * Whether the JSX node is in a reorderable position (2+ siblings).
      *

package/dist/index.d.ts

@@ -12,6 +12,7 @@ import { types, PluginObj } from '@babel/core';
  *   nodeId, file, line, col, componentName, staticProps, movable, parentNodeId
  *   + (ARCH-883 F1) slot, propBindings, propOwner
  *   + (ARCH-883-KOI) origin
+ *   + (ARCH-1444) childrenText — non-host elements only
  *
  * At runtime the Fiber bridge reads `memoizedProps.__editorMeta` to resolve
  * element identity without any DOM attributes.
@@ -169,6 +170,17 @@ declare function babelPluginEditorMeta({ types: t }: {
  * `id`/`htmlFor`/`name`/`type`/`role`/`slot`) are downgraded to `formatted` by the
  * PRODUCER, because no usage value could make them a text edit. The consumer does
  * not need to re-derive that list; it only needs the allowlist above.
+ *
+ * ARCH-1443: `{ target: 'children', prop: 'children', kind: 'direct' }` is emitted
+ * for an element that forwards its component's props REST and renders no children
+ * of its own — the shape EVERY ejected shadcn-style primitive has
+ * (`({ className, ...p }) => <h3 className={…} {...p} />`). Nothing about the
+ * allowlist changes: the usage value of `children` is the JSX children written at
+ * the usage site (`<CardTitle>Cómo funciona</CardTitle>`), and the same
+ * usage-value law applies to it — plain text is writable, a nested element or a
+ * computed expression is a gap. The producer refuses whenever more than one
+ * element in the component forwards the rest, since one `children` prop cannot
+ * name which of them an edit is about.
  */
 interface PropBinding {
     /**
@@ -216,6 +228,38 @@ interface EditorMeta {
     componentName: string;
     /** Safely serializable literal prop values. Dynamic expressions are "__dynamic__". */
     staticProps: Record<string, unknown> | null;
+    /**
+     * ARCH-1444 — the SHAPE of this element's JSX children, and their text when
+     * that text is plain. `staticProps` is built from ATTRIBUTES only, so without
+     * this field the `children` prop is the one binding target whose value at the
+     * usage a consumer cannot see — and the usage-value law above ("plain text is
+     * writable, a nested element or a computed expression is a gap") is stated in
+     * terms of exactly that value.
+     *
+     *   `null`          — the element is SELF-CLOSING: no children container at
+     *                     all. NOT the same as `''` (`<X></X>`), which can take a
+     *                     text write; `<X />` cannot without a structural rewrite.
+     *   `''`            — an empty children container.
+     *   `'__dynamic__'` — anything that is not exactly one JSXText child: an
+     *                     expression container, a nested element, a comment, or
+     *                     several children. Same sentinel as `staticProps`.
+     *   any other string— the sole JSXText child, TRIMMED (JSX itself trims
+     *                     leading/trailing whitespace-with-newlines, so the
+     *                     trimmed form is what renders). A newline that SURVIVES
+     *                     the trim is real multi-line content: a consumer that
+     *                     writes by splicing must refuse it, because replacing it
+     *                     with one line deletes source lines and invalidates every
+     *                     anchor below.
+     *
+     * Emitted for NON-HOST elements only — a usage is always a component tag, and
+     * stamping every `<div>` would be weight for an answer nothing asks.
+     *
+     * ABSENT (`undefined`) on a host element and on every bundle built before this
+     * change. Absence is NOT "no children": it means the page cannot answer the
+     * question, and a consumer must gap the edit rather than assume (the same law
+     * `origin`'s docstring states at length).
+     */
+    childrenText?: string | null;
     /**
      * Whether the JSX node is in a reorderable position (2+ siblings).
      *

package/dist/index.js

@@ -277,6 +277,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return "";
   }
+  function isIntrinsicTagName(name) {
+    return t.isJSXIdentifier(name) && /^[a-z]/.test(name.name);
+  }
   function isHostLikeMemberExpressionName(name) {
     if (!t.isJSXMemberExpression(name)) return false;
     const propertyName = name.property.name;
@@ -367,6 +370,18 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return hasAny ? t.objectExpression(props) : null;
   }
+  function describeChildrenText(opening) {
+    const elementPath = opening.parentPath;
+    if (!elementPath || !elementPath.isJSXElement()) return null;
+    const element = elementPath.node;
+    if (!element.closingElement) return null;
+    const children = element.children;
+    if (children.length === 0) return "";
+    if (children.length !== 1) return "__dynamic__";
+    const [only] = children;
+    if (!t.isJSXText(only)) return "__dynamic__";
+    return only.value.trim();
+  }
   function isMetaStripSpreadExpression(arg) {
     if (!t.isCallExpression(arg)) return false;
     if (!t.isArrowFunctionExpression(arg.callee)) return false;
@@ -474,6 +489,14 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     }
     return map;
   }
+  function restParamName(pattern) {
+    for (const prop of pattern.properties) {
+      if (!t.isRestElement(prop)) continue;
+      if (t.isIdentifier(prop.argument)) return prop.argument.name;
+      return null;
+    }
+    return null;
+  }
   function resolvePropContext(path) {
     let fn = path.getFunctionParent();
     while (fn) {
@@ -482,7 +505,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
         return {
           componentScope: fn.scope,
           propMap: buildPropMap(first),
-          componentName: getFunctionName(fn)
+          componentName: getFunctionName(fn),
+          restParam: restParamName(first),
+          componentPath: fn
         };
       }
       fn = fn.getFunctionParent();
@@ -602,12 +627,62 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
     const props = collectPropIdentifiers(expr, scope, ctx);
     return props.length > 0 ? { kind: "formatted", prop: props[0] } : null;
   }
+  function unwrapSanitizedSpread(arg) {
+    if (!t.isCallExpression(arg)) return arg;
+    if (!isMetaStripSpreadExpression(arg)) return arg;
+    if (arg.arguments.length !== 1) return arg;
+    const [payload] = arg.arguments;
+    if (!t.isObjectExpression(payload) || payload.properties.length !== 1) return arg;
+    const [only] = payload.properties;
+    if (!t.isSpreadElement(only)) return arg;
+    return only.argument;
+  }
+  function forwardsOwnerRestChildren(opening, ctx) {
+    if (ctx.restParam === null) return false;
+    const elementPath = opening.parentPath;
+    if (!elementPath || !elementPath.isJSXElement()) return false;
+    if (meaningfulChildren(t, elementPath.node.children).length > 0) return false;
+    let spreadsRest = 0;
+    for (const attr of opening.node.attributes) {
+      if (t.isJSXAttribute(attr)) {
+        if (t.isJSXIdentifier(attr.name, { name: "children" })) return false;
+        continue;
+      }
+      if (!t.isJSXSpreadAttribute(attr)) continue;
+      const payload = unwrapSanitizedSpread(attr.argument);
+      if (!t.isIdentifier(payload, { name: ctx.restParam })) return false;
+      spreadsRest += 1;
+    }
+    if (spreadsRest !== 1) return false;
+    const binding = opening.scope.getBinding(ctx.restParam);
+    if (!binding) return false;
+    if (binding.scope !== ctx.componentScope) return false;
+    return binding.constant;
+  }
+  const restForwarderCounts = /* @__PURE__ */ new WeakMap();
+  function countRestForwarders(ctx) {
+    const cached = restForwarderCounts.get(ctx.componentPath.node);
+    if (cached !== void 0) return cached;
+    let count = 0;
+    ctx.componentPath.traverse({
+      JSXOpeningElement(inner) {
+        if (forwardsOwnerRestChildren(inner, ctx)) count += 1;
+      }
+    });
+    restForwarderCounts.set(ctx.componentPath.node, count);
+    return count;
+  }
   function collectPropBindings(path, attrs) {
     const ctx = resolvePropContext(path);
-    if (!ctx || ctx.propMap.size === 0) return { bindings: [], owner: null };
+    if (!ctx || ctx.propMap.size === 0 && ctx.restParam === null) {
+      return { bindings: [], owner: null };
+    }
     if (ctx.componentName === null) return { bindings: [], owner: null };
     const scope = path.scope;
     const bindings = [];
+    if (forwardsOwnerRestChildren(path, ctx) && countRestForwarders(ctx) === 1) {
+      bindings.push({ target: "children", prop: "children", kind: "direct" });
+    }
     const elementPath = path.parentPath;
     if (elementPath && elementPath.isJSXElement()) {
       const children = meaningfulChildren(t, elementPath.node.children);
@@ -709,7 +784,9 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
           return;
         }
         let rootName = null;
-        if (t.isJSXIdentifier(path.node.name)) {
+        if (isIntrinsicTagName(path.node.name)) {
+          rootName = null;
+        } else if (t.isJSXIdentifier(path.node.name)) {
           rootName = path.node.name.name;
         } else if (t.isJSXMemberExpression(path.node.name)) {
           let cur = path.node.name;
@@ -771,6 +848,15 @@ function babelPluginEditorMeta({ types: t }, opts = {}) {
             t.objectProperty(t.identifier("slot"), t.stringLiteral(slot))
           );
         }
+        if (!isHostElement) {
+          const childrenText = describeChildrenText(path);
+          metaObj.properties.push(
+            t.objectProperty(
+              t.identifier("childrenText"),
+              childrenText === null ? t.nullLiteral() : t.stringLiteral(childrenText)
+            )
+          );
+        }
         if (bindings.length > 0) {
           metaObj.properties.push(
             t.objectProperty(t.identifier("propBindings"), propBindingsToAst(bindings))

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import {
   __dirname,
   babelPluginEditorMeta
-} from "./chunk-6QB35SLQ.mjs";
+} from "./chunk-O3UMTM4N.mjs";
 
 // src/index.ts
 import { readFileSync } from "fs";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@archie/devtools",
-  "version": "0.0.41",
+  "version": "0.0.42",
   "description": "DevTools for Archie generated applications - Route synchronization and editor communication",
   "repository": {
     "type": "git",