sinwan-compiler 0.2.9 → 0.2.11

package/dist/{chunk-6dnsvgyf.js → chunk-ad9mh6gz.js}

@@ -231,6 +231,8 @@ function trackLocalScopeBindings(path, names, scope) {
       const body = fn.body;
       if (body && containsReactiveRead(body, scope)) {
         scope.bindings.set(name, { kind: "getter" });
+      } else {
+        scope.bindings.set(name, { kind: "function" });
       }
     }
   });
@@ -329,6 +331,9 @@ function visitCallCalleeAndArgs(node, visitExpr) {
     visitExpr(arg, true);
   }
 }
+function isSignalValuePath(path) {
+  return path[0] === "value" || path.length >= 2 && path[1] === "value";
+}
 function getMemberExpressionRootAndPath(node) {
   const path = [];
   let current = node;
@@ -375,8 +380,9 @@ function isReactiveRead(node, scope) {
   if (!rootPath)
     return false;
   const binding = scope.bindings.get(rootPath.root);
-  if (!binding)
-    return false;
+  if (!binding) {
+    return isSignalValuePath(rootPath.path);
+  }
   if (binding.kind === "prop") {
     return true;
   }
@@ -393,10 +399,27 @@ function isReactiveRead(node, scope) {
 }
 function isGetterCall(node, scope) {
   const callee = node.callee;
-  if (!t.isIdentifier(callee))
-    return false;
-  const binding = scope.bindings.get(callee.name);
-  return binding?.kind === "getter";
+  if (t.isIdentifier(callee)) {
+    const binding = scope.bindings.get(callee.name);
+    if (binding?.kind === "getter")
+      return true;
+    if (binding)
+      return false;
+    return node.arguments.length === 0;
+  }
+  if (isMemberLike(callee) && !callee.computed && t.isIdentifier(callee.property)) {
+    if (node.arguments.length !== 0)
+      return false;
+    const rootPath = getMemberExpressionRootAndPath(callee);
+    if (!rootPath)
+      return false;
+    const binding = scope.bindings.get(rootPath.root);
+    if (binding?.kind === "mutable" || binding?.kind === "function" || binding?.kind === "signal" || binding?.kind === "computed" || binding?.kind === "prop" || binding?.kind === "getter" || binding?.kind === "signalObject") {
+      return false;
+    }
+    return true;
+  }
+  return false;
 }
 function isReactiveValue2(node, scope) {
   if (t.isTSNonNullExpression(node)) {
@@ -414,8 +437,9 @@ function isReactiveValue2(node, scope) {
   if (!rootPath)
     return false;
   const binding = scope.bindings.get(rootPath.root);
-  if (!binding)
-    return false;
+  if (!binding) {
+    return isSignalValuePath(rootPath.path);
+  }
   if (binding.kind === "prop" || binding.kind === "mutable") {
     return true;
   }
@@ -440,7 +464,7 @@ function containsReactiveValue2(expr, scope) {
         return;
       }
     }
-    if (t.isCallExpression(node) && isGetterCall(node, scope)) {
+    if (isCallLike(node) && isGetterCall(node, scope)) {
       found = true;
       return;
     }
@@ -489,7 +513,7 @@ function containsReactiveRead(expr, scope) {
         return;
       }
     }
-    if (t.isCallExpression(node) && isGetterCall(node, scope)) {
+    if (isCallLike(node) && isGetterCall(node, scope)) {
       found = true;
       return;
     }
@@ -551,7 +575,7 @@ function getComponentExpressionInfo(exprPath) {
     }
   }
   if (!firstChar || firstChar !== firstChar.toUpperCase() || !/[A-Z]/.test(firstChar)) {
-    return { isComponent: false, componentName: null, attributeName: null };
+    return { isComponent: false, componentName: null, attributeName };
   }
   return { isComponent: true, componentName, attributeName };
 }
@@ -660,6 +684,10 @@ function createBindingDescriptor(expr, exprPath, options) {
   }
   const parent = exprPath.parentPath;
   if (parent && parent.isJSXAttribute && parent.isJSXAttribute()) {
+    const compInfo = getComponentExpressionInfo(exprPath);
+    if (compInfo.isComponent) {
+      return wrapExpression(expr);
+    }
     const attrName = parent.node.name.name;
     if (attrName === "style") {
       return t.callExpression(t.identifier("_$bindStyle"), [
@@ -1110,12 +1138,13 @@ function wrapReactiveExpressions2(ast, options = {}) {
           trackPropBindings(scope, path.node.params[0], allProps);
         }
       }
-      if (scope.bindings.size === 0)
-        return;
       path.traverse({
         JSXExpressionContainer(exprPath) {
           const expr = exprPath.node.expression;
           const compInfo = getComponentExpressionInfo(exprPath);
+          if (compInfo.attributeName?.startsWith("on")) {
+            return;
+          }
           if (compInfo.isComponent && compInfo.attributeName !== null) {
             const knownProp = !!compInfo.componentName && isReactiveComponentProp(compInfo.componentName, compInfo.attributeName, componentNames, reactiveProps, importedReactiveProps);
             if (!knownProp && (!shouldWrap(expr, scope) || isReactiveContainerPassThrough(expr, scope))) {

package/dist/cli.js

@@ -3,7 +3,7 @@
 import {
   runAnalyzeCli2,
   runCliIfMain2
-} from "./chunk-6dnsvgyf.js";
+} from "./chunk-ad9mh6gz.js";
 export {
   runAnalyzeCli2 as runAnalyzeCli,
   runCliIfMain2 as runCliIfMain

package/dist/index.js

@@ -17,7 +17,7 @@ import {
   propagateReactiveProps2,
   wrapReactiveExpressions2,
   runAnalyzeCli2
-} from "./chunk-6dnsvgyf.js";
+} from "./chunk-ad9mh6gz.js";
 
 // src/transform.ts
 import { parse } from "@babel/parser";

package/dist/reactive-wrap.d.ts

@@ -9,6 +9,11 @@
  *   - `createMutable` / `createStore` from `sinwan/store`
  *   - `signal` / `computed` from `sinwan/reactivity`
  *   - `useState` from `sinwan/react`
+ *   - `.value` reads of signals returned from other modules (`useTheme`,
+ *     `inject`, custom hooks) even when those identifiers were not created
+ *     by a local `signal()` call
+ *   - zero-arity getter calls returned from hooks (`counter()`, `api.count()`)
+ *     the same way local `useState` getters (`count()`) are wrapped
  *
  * Example:
  *   <p>{state.name}</p>        → <p>{() => state.name}</p>
@@ -40,6 +45,10 @@ export interface ComputedBinding {
 export interface GetterBinding {
     kind: "getter";
 }
+/** Local helper that is not a useState-style getter. `{greet()}` stays eager. */
+export interface FunctionBinding {
+    kind: "function";
+}
 /**
  * Binding for a variable holding the object returned by `useFetch()` /
  * `createFetch()(...)`. Every property on that object is a `Signal` or
@@ -54,7 +63,7 @@ export interface SignalObjectBinding {
 export interface PropBinding {
     kind: "prop";
 }
-export type Binding = MutableBinding | SignalBinding | ComputedBinding | GetterBinding | SignalObjectBinding | PropBinding;
+export type Binding = MutableBinding | SignalBinding | ComputedBinding | GetterBinding | FunctionBinding | SignalObjectBinding | PropBinding;
 export interface ReactiveScope {
     bindings: Map<string, Binding>;
 }

package/docs/README.md

@@ -7,7 +7,7 @@ If you are building a Sinwan app, start with [Plugins](plugins.md). If you are c
 ## Pipeline
 
 1. **Auto-`cc`** — exported functions that look like components (`App`, `Card`, …) are wrapped with `cc(...)` so the rest of the pipeline sees the same components the runtime will.
-2. **Reactive wrap** — JSX expressions that read signals, stores, `useState`, or `useFetch` become `() => …` (or explicit binding helpers when that mode is on).
+2. **Reactive wrap** — JSX expressions that read signals, stores, `useState`, `useFetch`, `.value` on signals returned from other modules (`useTheme`, `inject`), or zero-arity getters returned from hooks (`counter()`) become `() => …` (or explicit binding helpers when that mode is on).
 3. **Template hoist** — static native-element trees become `_$createTemplate(...)` calls with slots for dynamic bits (`child`, `attr`, `event`, `ref`).
 4. **Analyze (optional)** — a project-wide pass marks which *exported* component props are actually reactive, so static strings are not wrapped.
 

package/docs/transform.md

@@ -70,8 +70,10 @@ Reads the compiler wraps:
 - Store / mutable fields: `state.name`, destructured `const { name } = state`
 - Signals and computeds: `count.value`, including `count.value?.n` and `count.value!.n`
 - `useState` getters: `count()`
+- Zero-arity getters **returned from another hook**: `{count()}`, `{counter()}`, `{api.count()}`. Local helpers (`greet()`), calls with arguments (`format("x")`), and event attributes (`onclick={make()}`) stay eager.
 - `useFetch` signal values: `f.data.value` (not the shell `f` or `f.data`)
 - Calls to a **local** function whose body reads one of the above
+- `.value` reads of signals that came from **another module** (`useTheme()`, `inject()`, custom hooks) even when the identifier was not created by a local `signal()` call: `{theme.value}`, `{api.theme.value}`. Nested JSX inside `.map` still wraps the inner slots (`variant={theme.value === value ? …}`) rather than remounting the list.
 - Reads **inside call callbacks** that run while the JSX expression is evaluated: `.map` / `.filter` / `Array.from` callbacks, IIFEs, and default parameters of those callbacks. `<For each={keys.map((k) => groups[query.value])}>` becomes `each={() => keys.map(...)}`. Nested JSX inside those callbacks is a separate wrap site (`items.map((i) => <span>{count.value}</span>)` wraps the inner text, not the whole map).
 
 Not wrapped:
@@ -90,7 +92,7 @@ Not wrapped:
 **User components** (`<Label>`, `<Child title={…} />`):
 
 - **Children:** wrap reactive reads the same way as DOM text (`{count.value}`, `{checked.value ? "On" : "Off"}`) so `cc()` parents do not snapshot the value. Use a getter (`() => …`), never `_$bindText`, because the child may render nodes as well as strings. Render-prop functions (`{(v) => …}`) stay untouched.
-- **Props:** wrap a prop if it is known-reactive for that component (built-in registry, local call graph, analyzer metadata). For *unknown* imported components, still wrap **derived reads** (`htmlFor={id.value}`, `disabled={off.value}`) and leave **container pass-through** alone (`checked={checked}`, `user={user}`) so the child receives the signal or store proxy.
+- **Props:** wrap a prop if it is known-reactive for that component (built-in registry, local call graph, analyzer metadata). For *unknown* imported components, still wrap **derived reads** (`htmlFor={id.value}`, `disabled={off.value}`) and leave **container pass-through** alone (`checked={checked}`, `user={user}`) so the child receives the signal or store proxy. With `explicitBindings`, component props stay **getters** (`each={() => …}`), never `_$bindAttr` — `For` / `Show` / `Label` call `resolve(prop)`, which does not unwrap bind descriptors.
 
 **Built-in control-flow** components wrap specific props, and they wrap reactive expression children (those children render directly):
 
@@ -141,6 +143,6 @@ transformJSX(code, "src/App.tsx", {
 
 - **`analyze` / `analyzeMetadata`** — cross-file reactive props. Invalid JSON is ignored (transform still succeeds).
 - **`resolveImport`** — maps `./Child` to an absolute file so imported components can use analyzer metadata. Without it, imported call sites are not wrapped at the parent.
-- **`explicitBindings`** — wrap with `_$bindText` / `_$bindAttr` / `_$bindStyle` / `_$bindClass` from `sinwan/renderer` instead of a bare `() => …`.
+- **`explicitBindings`** — wrap **native** text/attrs with `_$bindText` / `_$bindAttr` / `_$bindStyle` / `_$bindClass`. Component props and component children stay `() => …` so `resolve(prop)` still sees a getter.
 
 Returns `{ code, map }` with a source map.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sinwan-compiler",
-  "version": "0.2.9",
+  "version": "0.2.11",
   "description": "Shared compiler core for Sinwan plugins",
   "type": "module",
   "main": "./dist/index.js",