@tinkerlandai/indiana-iam 0.2.0 → 0.4.0

package/src/analyze.mjs

@@ -1,13 +1,25 @@
 import fs from "node:fs/promises";
+import {referencedRasterSources} from "./source-media.mjs";
+import {uiEnvironmentPrimitive} from "./source-environment.mjs";
+import {sourceChart} from "./source-charts.mjs";
 import path from "node:path";
-import { automaticSourceAnchors, anchorAttributes } from "./anchors.mjs";
+import { automaticSourceAnchors, anchorAttributes, sourceScriptKind } from "./anchors.mjs";
 import { sourceFiles } from "./source-files.mjs";
 import { dependency } from "./dependencies.mjs";
 import { assembleRouteTree, readVariables } from "./route-tree.mjs";
+import { sourceEntry } from "./source-entry.mjs";
 import { frameworkRoutes, externalImport } from "./framework-routes.mjs";
-import { routeIndexDigest, refreshRenderHashes } from "./render-index.mjs";
+import { sourceResolution } from "./source-resolution.mjs";
+import { routeIndexDigest, refreshRenderHashes, flattenComposition } from "./render-index.mjs";
 import { storeDocumentNodes } from "./node-hashes.mjs";
 import { staticQuery } from "./static-query.mjs";
+import { attachUiStructure } from './ui-structure.mjs';
+import { componentRegistry } from './component-registry.mjs';
+import { sourceRedirects } from './source-redirects.mjs';
+import {internGraphSources} from './graph-sources.mjs';
+import {collectionStateReads,sourceCollectionFragment} from './source-collections.mjs';
+import {sourceQueryEvidence} from './source-query-evidence.mjs';
+import {lucideSource,lucideGeometry,LUCIDE_SOURCE,LUCIDE_SOURCE_VERSION} from './lucide-source.mjs';
 import {
   publicRoute,
   assertRoutes,
@@ -27,6 +39,27 @@ const { JSDOM } = dependency("jsdom").value;
 const UNKNOWN = Symbol("unknown");
 import { sensitiveName, redactLiteral, privateUrl } from "./privacy.mjs";
 const isUnknown = (value) => value === UNKNOWN;
+const COMPONENT=Symbol('source-component');
+const TRANSLATION=Symbol('source-translation-catalog');
+const UI_SETTER=Symbol('source-ui-setter');
+const UI_PRIMITIVE=Symbol('source-ui-primitive');
+
+function uiReturnExpression(fn) {
+  if(!fn?.body||!ts.isBlock(fn.body))return returnExpression(fn);
+  const returned=statement=>ts.isReturnStatement(statement)?statement.expression:ts.isBlock(statement)&&statement.statements.every(s=>ts.isVariableStatement(s)||ts.isReturnStatement(s))?returned(statement.statements.at(-1)):null;
+  function sequence(statements) {
+    for(let i=0;i<statements.length;i++) {
+      const statement=statements[i];
+      if(ts.isReturnStatement(statement))return statement.expression;
+      if(ts.isIfStatement(statement)) {
+        const yes=returned(statement.thenStatement),no=statement.elseStatement?returned(statement.elseStatement):sequence(statements.slice(i+1));
+        if(yes&&no)return {kind:ts.SyntaxKind.ConditionalExpression,condition:statement.expression,whenTrue:yes,whenFalse:no};
+      }
+    }
+    return returnExpression(fn);
+  }
+  return sequence([...fn.body.statements]);
+}
 // React numeric styles use px except for unitless properties and CSS variables.
 const unitlessStyles = new Set("animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth".split(" "));
 function staticStyle(value, unsupported) {
@@ -140,7 +173,8 @@ function functionFrom(node) {
   if (
     ts.isFunctionDeclaration(node) ||
     ts.isArrowFunction(node) ||
-    ts.isFunctionExpression(node)
+    ts.isFunctionExpression(node) ||
+    ts.isMethodDeclaration(node)
   )
     return node;
   if (ts.isCallExpression(node))
@@ -156,6 +190,7 @@ export async function analyze({
   maxFiles = 5000,
   maxBytes = 100_000_000,
   navigationPaths = [],
+  entry,
   automaticAnchors = false,
 }) {
   root = await fs.realpath(root);
@@ -167,6 +202,8 @@ export async function analyze({
     components = new Map(),
     assets = new Map();
   const cssSources = [];
+  const jsonResources=new Map(),translationResources=new Set();
+  const presentation={conditions:[],tabs:[],navigation:[],regions:[],collections:[],fragments:[],attributes:[],attributeSets:[]},collectionTemplates=new Map();
   const ui = { variables: [], bindings: [], transitions: [], uncovered: [] };
   const uiVariableKeys = new Set();
   let byteCount = 0;
@@ -196,6 +233,7 @@ export async function analyze({
       sha256: sha256(bytes),
       bytes: bytes.length,
     });
+    if(file.endsWith('.json')){try{jsonResources.set(file,JSON.parse(text));}catch{/* Non-resource JSON stays opaque. */}continue;}
     if (file.endsWith(".css")) {
       gap(
         file.endsWith(".module.css")
@@ -207,13 +245,17 @@ export async function analyze({
       if (!file.endsWith(".module.css")) cssSources.push({ file, text });
       continue;
     }
-    if (!/\.[cm]?[jt]sx?$/.test(file)) continue;
+    if (!/\.[cm]?[jt]sx?$/.test(file)) {
+      if (/^(?:src\/)?app\/(?:.*\/)?(?:page|layout)\.mdx$/.test(file) || /^(?:src\/)?pages\/.+\.mdx$/.test(file))
+        gap("ROUTE_MDX_UNSUPPORTED", file, "MDX route/layout source requires a dedicated adapter; its page and layout coverage is incomplete");
+      continue;
+    }
     const source = ts.createSourceFile(
       file,
       text,
       ts.ScriptTarget.Latest,
       true,
-      /\.jsx?$/.test(file) ? ts.ScriptKind.JSX : ts.ScriptKind.TSX,
+      sourceScriptKind(file, ts),
     );
     const module = {
       file,
@@ -250,6 +292,7 @@ export async function analyze({
       }
       if (ts.isFunctionDeclaration(statement) && (statement.name||statement.modifiers?.some(m=>m.kind===ts.SyntaxKind.DefaultKeyword)))
         module.bindings.set(statement.name?.text||'$default', statement);
+      if (ts.isEnumDeclaration(statement)) module.bindings.set(statement.name.text, statement);
       if (ts.isVariableStatement(statement))
         for (const d of statement.declarationList.declarations)
           if (ts.isIdentifier(d.name) && d.initializer)
@@ -333,6 +376,52 @@ export async function analyze({
         .find(Boolean) || null
     );
   }
+  function jsonResource(from,specifier){
+    let file=specifier.startsWith('.')?path.posix.normalize(path.posix.join(path.posix.dirname(from),specifier)):null;
+    if(!file)for(const [pattern,values] of Object.entries(alias)){const prefix=pattern.split('*')[0];if(pattern.includes('*')&&specifier.startsWith(prefix)){file=values[0].replace('*',specifier.slice(prefix.length)).replace(/^\.\//,'');break;}}
+    return file&&!file.startsWith('../')?jsonResources.get(file):undefined;
+  }
+  function contextKey(module,name){
+    const ref=binding(module,name),call=ref&&unwrap(ref.node);
+    const primitive=call&&ts.isCallExpression(call)&&externalImport(ref.module,call.expression.getText(ref.module.source));
+    return primitive?.specifier==='react'&&primitive.name==='createContext'?ref.module.file+'#'+ref.name:null;
+  }
+  function sourceContextCall(node,module,ctx){
+    const imported=externalImport(module,node.expression.getText(module.source));
+    if(imported?.specifier==='react'&&imported.name==='useContext'&&ts.isIdentifier(node.arguments[0]))return ctx.__iamContexts?.get(contextKey(module,node.arguments[0].text))??UNKNOWN;
+    const ref=ts.isIdentifier(node.expression)&&binding(module,node.expression.text),fn=ref&&functionFrom(ref.node);
+    if(!fn?.body||!ts.isBlock(fn.body))return UNKNOWN;
+    const result=unwrap(returnExpression(fn));
+    if(!result||!ts.isIdentifier(result))return UNKNOWN;
+    for(const statement of fn.body.statements)if(ts.isVariableStatement(statement))for(const decl of statement.declarationList.declarations){
+      const call=unwrap(decl.initializer),primitive=call&&ts.isCallExpression(call)&&externalImport(ref.module,call.expression.getText(ref.module.source));
+      if(primitive?.specifier==='react'&&primitive.name==='useContext'&&ts.isIdentifier(decl.name)&&decl.name.text===result.text&&ts.isIdentifier(call.arguments[0]))return ctx.__iamContexts?.get(contextKey(ref.module,call.arguments[0].text))??UNKNOWN;
+      if(primitive?.specifier==='react-i18next'&&primitive.name==='useTranslation'&&ts.isObjectBindingPattern(decl.name)&&decl.name.elements.some(e=>(e.propertyName?.text||e.name.text)==='t'&&e.name.text===result.text)){
+        const catalogs=[...ref.module.imports.values()].filter(i=>i.specifier.endsWith('.json')).map(i=>jsonResource(ref.module.file,i.specifier)).filter(Boolean);
+        if(catalogs.length===1){translationResources.add(catalogs[0]);return {[TRANSLATION]:catalogs[0]};}
+      }
+    }
+    return UNKNOWN;
+  }
+  function basePrimitive(module,tag,seen=new Set()){
+    if(seen.has(module.file+'#'+tag)||seen.size>8)return null;seen.add(module.file+'#'+tag);
+    const [name,part,extra]=tag.split('.'),ref=module.imports.get(name);
+    const imported=externalImport(module,tag);
+    const radixFamilies={'dialog':'Dialog','alert-dialog':'AlertDialog','popover':'Popover','dropdown-menu':'Menu','context-menu':'Menu','tooltip':'Tooltip','hover-card':'Popover','tabs':'Tabs','collapsible':'Collapsible'};
+    const radix=imported?.specifier?.match(/^@radix-ui\/react-([a-z-]+)$/)?.[1];
+    if(radixFamilies[radix]) {
+      const family=radixFamilies[radix],prefix=radix.split('-').map(v=>v[0].toUpperCase()+v.slice(1)).join('');
+      const exported=imported.name===prefix?'Root':imported.name.startsWith(prefix)?imported.name.slice(prefix.length):imported.name;
+      const mapped=family==='Tabs'?({Trigger:'Tab',Content:'Panel'}[exported]??exported):({Content:'Popup',Overlay:'Backdrop',Sub:'SubmenuRoot',SubTrigger:'SubmenuTrigger',SubContent:'Popup'}[exported]??exported);
+      return {family,part:mapped};
+    }
+    if(imported?.specifier==='react-transition-group'&&['Transition','CSSTransition'].includes(imported.name))return {family:'Transition',part:'Root'};
+    const families={'@base-ui/react/tabs':'Tabs','@base-ui/react/popover':'Popover','@base-ui/react/dialog':'Dialog','@base-ui/react/alert-dialog':'AlertDialog','@base-ui/react/menu':'Menu','@base-ui/react/tooltip':'Tooltip'};
+    if(!extra&&part&&ref&&families[ref.specifier]===ref.name)return {family:ref.name,part};
+    if(!part){const target=binding(module,tag),node=target&&unwrap(target.node);if(node&&ts.isPropertyAccessExpression(node))return basePrimitive(target.module,node.getText(target.module.source),seen);}
+    return null;
+  }
+  function tabsPrimitive(module,tag){const primitive=basePrimitive(module,tag);return primitive?.family==='Tabs'&&['Root','List','Tab','Panel','Indicator'].includes(primitive.part)?primitive.part:null;}
   function binding(module, name, seen=new Set()) {
     if(!name||seen.size>=16||seen.has(module.file+'#'+name))return null;seen.add(module.file+'#'+name);
     if (module.bindings.has(name))
@@ -347,11 +436,10 @@ export async function analyze({
         : target.exports.get(imported.name) || imported.name;
     return binding(target,key,seen);
   }
-  const componentDefs = new Map();
-  for (const module of modules.values())
-    for (const [symbol, node] of module.bindings) {
+  const componentDefs = new Map(),componentsByFunction=new WeakMap();
+  function registerComponent(module, symbol, node) {
       const fn = functionFrom(node);
-      if (!fn) continue;
+      if (!fn) return null;
       let hasJsx = false;
       function visit(n) {
         if (
@@ -363,7 +451,7 @@ export async function analyze({
         ts.forEachChild(n, visit);
       }
       visit(fn);
-      if (!hasJsx) continue;
+      if (!hasJsx) return null;
       const key = identity("component", { file: module.file, symbol }),
         ordinals = new Map();
       let ordinal = 0;
@@ -373,7 +461,7 @@ export async function analyze({
         ts.forEachChild(n, number);
       }
       number(fn);
-      const def = { module, symbol, fn, key, ordinals };
+      const def = { module, symbol, fn, key, ordinals };componentsByFunction.set(fn,def);
       let returns = 0;
       function countReturns(item) {
         if (
@@ -403,12 +491,21 @@ export async function analyze({
         source: loc,
         dependencies: [],
       });
-    }
-  for (const def of componentDefs.values()) {
+      return def;
+  }
+  for (const module of modules.values())
+    for (const [symbol, node] of module.bindings) registerComponent(module, symbol, node);
+  const resolution = sourceResolution({ ts, resolveModule, resolveBinding: binding });
+  const componentBinding = (module, name) => {
+    const ref = resolution.component(module, name);
+    if (ref?.wrapped) gap("LAZY_WRAPPER_UNOBSERVED", module.file, name + ": only the statically forwarded successful module is projected; retry/reload behavior is not executed");
+    return ref;
+  };
+  function collectComponentDependencies(def) {
     function collectDependencies(node) {
       if (ts.isJsxElement(node) || ts.isJsxSelfClosingElement(node)) {
         const opening = ts.isJsxElement(node) ? node.openingElement : node,
-          ref = binding(def.module, opening.tagName.getText(def.module.source)),
+          ref = componentBinding(def.module, opening.tagName.getText(def.module.source)),
           target = ref && componentDefs.get(ref.module.file + "#" + ref.name);
         if (
           target &&
@@ -420,6 +517,20 @@ export async function analyze({
     }
     collectDependencies(def.fn);
   }
+  for (const def of componentDefs.values()) collectComponentDependencies(def);
+  const inlineNodes = new WeakMap(), inlineCounts = new Map();
+  function inlineComponent(module, node, route) {
+    if (inlineNodes.has(node)) return inlineNodes.get(node);
+    const group = module.file + "#" + route, occurrence = inlineCounts.get(group) ?? 0;
+    inlineCounts.set(group, occurrence + 1);
+    const symbol = "$route_" + hashObject("iam/inline-route-component/v1", { route, occurrence }).slice(0, 24);
+    module.bindings.set(symbol, node);
+    const def = registerComponent(module, symbol, node);
+    if (def) collectComponentDependencies(def);
+    const target = { file: module.file, symbol };
+    inlineNodes.set(node, target);
+    return target;
+  }
   function sourceLocation(module, node, symbol) {
     const loc = module.source.getLineAndCharacterOfPosition(
       node.getStart(module.source),
@@ -432,6 +543,17 @@ export async function analyze({
       fileHash: module.hash,
     };
   }
+  function sourceComponent(node,module){
+    const imported=ts.isIdentifier(node)&&externalImport(module,node.text);if(imported?.specifier==='@radix-ui/react-slot'&&['Slot','Root'].includes(imported.name))return {[UI_PRIMITIVE]:imported};if(imported?.specifier==='lucide-react'){const icon=lucideSource(imported.name);if(icon)return icon;}
+    const ref=ts.isIdentifier(node)?binding(module,node.text):null;const def=componentsByFunction.get(node)??(ref&&componentDefs.get(ref.module.file+'#'+ref.name));
+    return def?{[COMPONENT]:def}:null;
+  }
+  function environment(node,module,context){
+    const value=uiEnvironmentPrimitive({ts,node,module,binding,imported:externalImport,evaluate:evalExpression});
+    if(value?.kind==='empty-preference'){gap('UI_PREFERENCE_EMPTY_PREVIEW',module.file,'Source-declared SSR fallback for a UI preference; preview starts without cookies, never reads merchant browser state.');return [undefined];}
+    return value;
+  }
+  function query(node,module,context){return staticQuery({ts,node,module,context,binding,unknown:UNKNOWN,redact:redactLiteral,sensitive:sensitiveName,reference:sourceComponent,isReference:v=>Boolean(v?.[COMPONENT]||v?.[LUCIDE_SOURCE]||v?.[UI_PRIMITIVE]),imported:externalImport,project:(n,m,c)=>{const v=environment(n,m,c);return Array.isArray(v)?v:null;}});}
   function evalExpression(
     node,
     module,
@@ -442,6 +564,7 @@ export async function analyze({
     node = unwrap(node);
     if (!node || depth > 30) return UNKNOWN;
     const ev = (n) => evalExpression(n, module, context, stack, depth + 1);
+    const component=!(ts.isIdentifier(node)&&Object.hasOwn(context,node.text))&&sourceComponent(node,module);if(component)return component;
     if (ts.isStringLiteralLike(node) || ts.isNumericLiteral(node))
       return ts.isNumericLiteral(node) ? Number(node.text) : redactLiteral(node.text);
     if (node.kind === ts.SyntaxKind.TrueKeyword) return true;
@@ -449,7 +572,14 @@ export async function analyze({
     if (node.kind === ts.SyntaxKind.NullKeyword) return null;
     if (ts.isIdentifier(node)) {
       if (Object.hasOwn(context, node.text)) return context[node.text];
+      const variableKey=context.__iamVariableKeys?.[context.__iamSetters?.[node.text]];
+      if(variableKey)return {[UI_SETTER]:{variableKey,value:{op:'event',key:'value'},payload:{value:ui.variables.find(v=>v.variableKey===variableKey)?.valueType}}};
       if (node.text === "undefined") return undefined;
+      const image=module.imports.get(node.text);
+      if(image?.name==='default'&&/^\.\.?\/[^?#]+\.(?:png|jpe?g|webp|gif)$/i.test(image.specifier)){
+        const file=path.posix.normalize(path.posix.join(path.posix.dirname(module.file),image.specifier));
+        if(!file.startsWith('../')&&!file.split('/').some(p=>p.startsWith('.'))&&!sensitiveName(file))return '/__iam_source__/'+file;
+      }
       const token = module.file + "#" + node.text;
       if (stack.has(token)) return UNKNOWN;
       const ref = binding(module, node.text);
@@ -460,12 +590,16 @@ export async function analyze({
     if (ts.isArrayLiteralExpression(node)) return node.elements.map(ev);
     if (ts.isObjectLiteralExpression(node)) {
       const obj = {};
+      const fields=new Map();
       for (const prop of node.properties) {
         if (ts.isPropertyAssignment(prop))
           obj[prop.name.getText(module.source).replace(/^['"]|['"]$/g, "")] =
             ev(prop.initializer);
-        else if (ts.isShorthandPropertyAssignment(prop))
+        else if (ts.isShorthandPropertyAssignment(prop)){
           obj[prop.name.text] = ev(prop.name);
+          const variable=context.__iamVariableKeys?.[prop.name.text],inherited=context.__iamPropBindings?.get(prop.name.text);
+          if(variable||inherited)fields.set(prop.name.text,inherited||{op:'var',key:variable});
+        }
         else if (ts.isSpreadAssignment(prop)) {
           const v = ev(prop.expression);
           if (isUnknown(v)) return UNKNOWN;
@@ -473,6 +607,7 @@ export async function analyze({
             Object.assign(obj, v);
         }
       }
+      if(fields.size)objectBindings.set(obj,fields);
       return obj;
     }
     if (
@@ -526,6 +661,12 @@ export async function analyze({
         return isUnknown(a) ? UNKNOWN : (a ?? b);
       if (isUnknown(a) || isUnknown(b)) return UNKNOWN;
       if (op === ts.SyntaxKind.PlusToken) return a + b;
+      if(op === ts.SyntaxKind.MinusToken && typeof a==='number' && typeof b==='number')return a-b;
+      if(['number','string'].includes(typeof a)&&typeof a===typeof b){
+        if(op===ts.SyntaxKind.GreaterThanToken)return a>b;if(op===ts.SyntaxKind.GreaterThanEqualsToken)return a>=b;
+        if(op===ts.SyntaxKind.LessThanToken)return a<b;if(op===ts.SyntaxKind.LessThanEqualsToken)return a<=b;
+      }
+      if(op===ts.SyntaxKind.InKeyword&&typeof a==='string'&&b&&typeof b==='object'&&!['__proto__','constructor','prototype'].includes(a))return Object.hasOwn(b,a);
       if (
         [
           ts.SyntaxKind.EqualsEqualsEqualsToken,
@@ -543,9 +684,21 @@ export async function analyze({
     }
     if (ts.isCallExpression(node)) {
       const callee = node.expression.getText(module.source);
+      const projected=environment(node,module,context);if(Array.isArray(projected))return projected[0];
+      const renderCallback=ev(node.expression)?.iamRenderProp;
+      if(renderCallback)return {iamRenderInvocation:{callback:renderCallback,args:node.arguments.map(ev),caller:context}};
+      const primitive=externalImport(module,callee);
+      if(['react-router','react-router-dom'].includes(primitive?.specifier)&&primitive.name==='useLocation'&&typeof context.__iamRoutePath==='string')return {pathname:context.__iamRoutePath,search:UNKNOWN,hash:UNKNOWN};
+      const translation=ts.isIdentifier(node.expression)&&context[node.expression.text]?.[TRANSLATION];
+      if(translation){const key=ev(node.arguments[0]);if(typeof key!=='string')return UNKNOWN;const value=key.split('.').reduce((value,key)=>value&&Object.hasOwn(Object(value),key)?value[key]:undefined,translation);return typeof value==='string'&&!/\{\{/.test(value)?redactLiteral(value):UNKNOWN;}
+      if(primitive?.specifier==='react'&&primitive.name==='useMemo'&&node.arguments.length===2){
+        const fn=node.arguments[0];if(ts.isArrowFunction(fn)&&!fn.modifiers?.length&&!fn.parameters.length&&!ts.isBlock(fn.body))return ev(fn.body);
+      }
+      const contextValue=sourceContextCall(node,module,context);
+      if(!isUnknown(contextValue))return contextValue;
       if (/(?:^|\.)useState$/.test(callee))
         return {
-          stateInitial: node.arguments.length ? ev(node.arguments[0]) : null,
+          stateInitial: node.arguments.length ? (ts.isArrowFunction(node.arguments[0])&&node.arguments[0].parameters.length===0 ? query({kind:ts.SyntaxKind.CallExpression,expression:node.arguments[0],arguments:[]},module,context) : ev(node.arguments[0])) : null,
         };
       if (callee === "cn" || callee === "clsx") {
         let valid=true;
@@ -580,6 +733,7 @@ export async function analyze({
             ([key, values]) =>
               values[isUnknown((props || {})[key]) ? options.defaultVariants?.[key] : (props || {})[key] ?? options.defaultVariants?.[key]],
           ),
+          ...(options?.compoundVariants??[]).flatMap(row=>Object.entries(row).filter(([key])=>!['class','className'].includes(key)).every(([key,value])=>{const actual=Object.hasOwn(props??{},key)&&props[key]!==undefined?props[key]:options.defaultVariants?.[key];return Array.isArray(value)?value.includes(actual):value===actual;})?[row.class,row.className]:[]),
           props?.class,
           props?.className,
         ]
@@ -590,7 +744,7 @@ export async function analyze({
         const target = ev(node.expression.expression),
           args = node.arguments.map(ev),
           method = node.expression.name.text;
-        if (isUnknown(target) || args.some(isUnknown)) return staticQuery({ ts, node, module, context, binding, unknown: UNKNOWN, redact: redactLiteral, sensitive: sensitiveName });
+        if (isUnknown(target) || args.some(isUnknown)) return query(node,module,context);
         if (
           typeof target === "string" &&
           [
@@ -606,7 +760,7 @@ export async function analyze({
           return target.filter((v) => !isUnknown(v)).join(args[0]);
       }
     }
-    if (ts.isCallExpression(node)) return staticQuery({ ts, node, module, context, binding, unknown: UNKNOWN, redact: redactLiteral, sensitive: sensitiveName });
+    if (ts.isCallExpression(node)) return query(node,module,context);
     return UNKNOWN;
   }
   // Preserve only definitely present class tokens when a template contains an
@@ -662,15 +816,14 @@ export async function analyze({
             const omitted = new Set(param.name.elements.filter(item => !item.dotDotDotToken).map(item => item.propertyName?.getText() || item.name.getText()));
             const rest = Object.fromEntries(Object.entries(props).filter(([key]) => !omitted.has(key)));
             const parent = forwarded.get(props);
-            if (parent) forwarded.set(rest, { bindings: parent.bindings.filter(b => !omitted.has(b.property)), handlers: parent.handlers.filter(h => !omitted.has(h.key)) });
+            if (parent) forwarded.set(rest, { bindings: parent.bindings.filter(b => !omitted.has(b.property)), handlers: parent.handlers.filter(h => !omitted.has(h.key)), attributes:(parent.attributes??[]).filter(a=>!omitted.has(a.key)) });
             ctx[el.name.text] = rest; continue;
           }
           const key = el.propertyName?.getText() || el.name.getText();
           ctx[el.name.getText()] =
-            props[key] ??
-            (el.initializer
-              ? evalExpression(el.initializer, def.module, ctx)
-              : UNKNOWN);
+            Object.hasOwn(props, key) && props[key] !== undefined ? props[key] :
+            (el.initializer ? evalExpression(el.initializer, def.module, ctx) :
+              props.__iamOpaqueProps ? UNKNOWN : undefined);
           const inherited = forwarded.get(props);
           const binding = inherited?.bindings.find(b => b.property === key), handler = inherited?.handlers.find(h => h.key === key);
           if (binding) ctx.__iamPropBindings.set(el.name.getText(), binding.value);
@@ -682,8 +835,22 @@ export async function analyze({
         if (ts.isVariableStatement(s))
           for (const d of s.declarationList.declarations) {
             if (ts.isIdentifier(d.name)) {
-              ctx[d.name.text] = sensitiveName(d.name.text) ? UNKNOWN : evalExpression(d.initializer, def.module, ctx);
+              const projected=environment(d.initializer,def.module,ctx);
+              if(projected?.kind==='viewport'){
+                const width=Number(projected.query.match(/\d+/)[0]);ctx[d.name.text]=projected.query.includes('max-width')?1280<=width:1280>=width;ctx.__iamStates.add(d.name.text);ctx.__iamStateNodes[d.name.text]=d;ctx.__iamViewportQueries??={};ctx.__iamViewportQueries[d.name.text]=projected.query;
+                gap('VIEWPORT_SOURCE_PROJECTION',def.module.file,'Source matchMedia query projected against the preview viewport; subscription effects are not executed.');
+              }else ctx[d.name.text] = sensitiveName(d.name.text) ? UNKNOWN : evalExpression(d.initializer, def.module, ctx);
               ctx.__iamLocals.set(d.name.text, d.initializer);
+            } else if(ts.isObjectBindingPattern(d.name)){
+              const value=evalExpression(d.initializer,def.module,ctx);
+              for(const field of d.name.elements)if(ts.isIdentifier(field.name)&&!field.dotDotDotToken){
+                const key=field.propertyName?.text||field.name.text;
+                ctx[field.name.text]=!isUnknown(value)&&value&&typeof value==='object'&&Object.hasOwn(value,key)?value[key]:field.initializer?evalExpression(field.initializer,def.module,ctx):UNKNOWN;
+                const inherited=value&&typeof value==='object'&&objectBindings.get(value)?.get(key);
+                if(inherited)ctx.__iamPropBindings.set(field.name.text,inherited);
+                const setter=value?.[key]?.[UI_SETTER];
+                if(setter)ctx.__iamPropHandlers.set(field.name.text,setter);
+              }
             } else if (ts.isArrayBindingPattern(d.name)) {
               const call = unwrap(d.initializer), hook = call && ts.isCallExpression(call) && ts.isIdentifier(call.expression) && def.module.imports.get(call.expression.text);
               if (hook?.specifier === "react" && hook.name === "useActionState") {
@@ -707,11 +874,16 @@ export async function analyze({
                 Object.hasOwn(Object(value), "stateInitial") &&
                 d.name.elements[0]
               ) {
-                const key = d.name.elements[0].name?.text;
-                ctx[key] = sensitiveName(key) ? UNKNOWN : value.stateInitial;
+                const stateBinding = d.name.elements[0];
+                if (!ts.isBindingElement(stateBinding) || stateBinding.dotDotDotToken || !ts.isIdentifier(stateBinding.name)) {
+                  gap("STATE_BINDING_UNSUPPORTED", def.module.file, "Omitted, nested or rest state bindings have no named scalar value for UI simulation");
+                  continue;
+                }
+                const key = stateBinding.name.text;
+                ctx[key] = sensitiveName(key) && typeof value.stateInitial !== 'boolean' ? UNKNOWN : value.stateInitial;
                 ctx.__iamStates.add(key);
                 ctx.__iamStateNodes[key] = d;
-                if (d.name.elements[1]?.name)
+                if (d.name.elements[1]?.name && !d.name.elements[1].dotDotDotToken && ts.isIdentifier(d.name.elements[1].name))
                   ctx.__iamSetters[d.name.elements[1].name.text] = key;
               }
             }
@@ -768,7 +940,10 @@ export async function analyze({
     !/^\/(?:[^/?#[\]\\\s]+\/)*[^/?#[\]\\\s]+$/.test(routing.basePath)
   )
     throw new Error("Invalid source basePath");
-  const compositions = frameworkRoutes({ modules, resolveModule, ts, sourceLocation, navigationPaths, gap });
+  const selection = await sourceEntry({ root, modules, resolveModule, ts, entry });
+  if (selection.htmlSource) inventory.push(selection.htmlSource);
+  inventory.sort((a, b) => a.file < b.file ? -1 : a.file > b.file ? 1 : 0);
+  const compositions = frameworkRoutes({ modules, ...selection, resolveModule, ts, sourceLocation, navigationPaths, gap, resolution, inlineComponent });
   const pageFiles = compositions.pageFiles;
   routing.framework = compositions.framework;
   if (compositions.routeSources) routing.routeSources = compositions.routeSources;
@@ -823,19 +998,20 @@ export async function analyze({
     };
     const record = new Map(),
       used = new Set(),
-      branches = [];
+      branches = [],attributeRequests=[];
     let renderedCount = 0;
     function renderComponent(def, props, instance, depth) {
       if (depth === 0 && composition.entryMode === "soft") instance = composition.compositionKey + ":" + instance;
       // Component recursion and JSX nesting are separate budgets. Counting DOM
       // wrappers as component calls silently dropped ordinary nested navigation.
-      if (used.size >= 18 || used.has(def.key + ":" + instance)) {
+      if (used.size >= 24 || used.has(def.key + ":" + instance)) {
         gap("COMPONENT_DEPTH_LIMIT", def.module.file, def.symbol + ": active component call budget exceeded");
         return "";
       }
       used.add(def.key + ":" + instance);
       if (!page.componentKeys.includes(def.key))
         page.componentKeys.push(def.key);
+      props.__iamRoutePath=/[\[\]]/.test(route)?UNKNOWN:route;
       const ctx = componentContext(def, props);
       ctx.__iamOutlet = props.__iamOutlet;
       ctx.__iamScope = identity("state-scope", {
@@ -860,11 +1036,17 @@ export async function analyze({
         }
         if (!uiVariableKeys.has(variableKey)) {
           uiVariableKeys.add(variableKey);
-          ui.variables.push({ variableKey, routeKey: pageKey, scopeKey: ctx.__iamScope, label, valueType: typeof initialValue, initialValue, source: sourceLocation(def.module, ctx.__iamStateNodes[label], def.symbol) });
+          ui.variables.push({ variableKey, routeKey: pageKey, scopeKey: ctx.__iamScope, label:ctx.__iamViewportQueries?.[label]?'@media '+ctx.__iamViewportQueries[label]:label, valueType: typeof initialValue, initialValue, source: sourceLocation(def.module, ctx.__iamStateNodes[label], def.symbol) });
         }
       }
+      // Rebind pure local records after scalar state identities exist. This preserves
+      // useMemo/context field relationships without invoking a hook or callback.
+      for(const [name,expression]of ctx.__iamLocals){
+        if(ctx.__iamStates.has(name)||sensitiveName(name))continue;
+        const value=evalExpression(expression,def.module,ctx);if(!isUnknown(value))ctx[name]=value;
+      }
       const result = renderExpr(
-        returnExpression(def.fn),
+        uiReturnExpression(def.fn),
         def,
         ctx,
         instance,
@@ -899,6 +1081,7 @@ export async function analyze({
       }
       if (ts.isIdentifier(node)) {
         if (Object.hasOwn(aliases, node.text)) return aliases[node.text];
+        if(eventParam&&node.text===eventParam)return {op:'event',key:'value'};
         if (ctx.__iamVariableKeys[node.text]) return { op: "var", key: ctx.__iamVariableKeys[node.text] };
         if (ctx.__iamPropBindings.has(node.text)) return ctx.__iamPropBindings.get(node.text);
         if (ctx.__iamLocals.has(node.text)) return compile(ctx.__iamLocals.get(node.text));
@@ -927,43 +1110,385 @@ export async function analyze({
       const value = evalExpression(node, owner.module, ctx);
       return ["string", "boolean", "number"].includes(typeof value) ? { op: "const", value } : null;
     }
-    function uiHandler(initializer, owner, ctx) {
+    function uiExpressionType(expression, payload = {}) {
+      if (!expression) return undefined;
+      if (expression.op === "const") return typeof expression.value;
+      if (expression.op === "var") return ui.variables.find(variable => variable.variableKey === expression.key)?.valueType;
+      if (expression.op === "event") return payload[expression.key];
+      const type = child => uiExpressionType(child, payload);
+      if (expression.op === "not") return type(expression.arg) ? "boolean" : undefined;
+      if (expression.op === "classes") return expression.parts.every(part => type(part.when) === "boolean") ? "string" : undefined;
+      if (["all", "any"].includes(expression.op)) return expression.args.every(child => type(child) === "boolean") ? "boolean" : undefined;
+      const left = type(expression.left), right = type(expression.right);
+      if (["eq", "ne"].includes(expression.op)) return left && left === right ? "boolean" : undefined;
+      if (["add", "subtract"].includes(expression.op)) return left === "number" && right === "number" ? "number" : undefined;
+      return undefined;
+    }
+    function uiHandler(initializer, owner, ctx, property = '') {
       let fn = initializer && ts.isJsxExpression(initializer) ? unwrap(initializer.expression) : null;
-      if (fn && ts.isIdentifier(fn) && ctx.__iamPropHandlers.has(fn.text)) return ctx.__iamPropHandlers.get(fn.text);
-      if (fn && ts.isIdentifier(fn) && ctx.__iamLocals.has(fn.text)) fn = unwrap(ctx.__iamLocals.get(fn.text));
-      if (fn && ts.isPropertyAccessExpression(fn) && ts.isIdentifier(fn.expression)) {
-        const props = ctx[fn.expression.text], handler = props && typeof props === "object" && forwarded.get(props)?.handlers.find(h => h.key === fn.name.text);
-        if (handler) return handler;
+      const eventValue = (variableKey) => ({ variableKey, value: {op:'event',key:'value'}, payload:{value:ui.variables.find(v=>v.variableKey===variableKey)?.valueType} });
+      if(fn&&ts.isIdentifier(fn)&&ctx.__iamPropHandlers.has(fn.text))return ctx.__iamPropHandlers.get(fn.text);
+      if(fn&&ts.isIdentifier(fn)&&ctx.__iamSetters[fn.text]&&['onValueChange','onOpenChange'].includes(property)) {
+        const key=ctx.__iamVariableKeys[ctx.__iamSetters[fn.text]];return key?eventValue(key):null;
+      }
+      if(fn&&ts.isIdentifier(fn)&&ctx.__iamLocals.has(fn.text))fn=unwrap(ctx.__iamLocals.get(fn.text));
+      if(fn&&ts.isPropertyAccessExpression(fn)&&ts.isIdentifier(fn.expression)) {
+        const props=ctx[fn.expression.text],handler=props&&typeof props==='object'&&forwarded.get(props)?.handlers.find(h=>h.key===fn.name.text);
+        if(handler)return handler;
+      }
+      if(!fn||!ts.isArrowFunction(fn)||fn.modifiers?.some(m=>m.kind===ts.SyntaxKind.AsyncKeyword))return null;
+      let statements=ts.isBlock(fn.body)?[...fn.body.statements]:[fn.body];
+      if(statements.length>16)return null;
+      const writes=[],payload={};
+      const inputs=e=>{if(e.op==='event')payload[e.key]=e.key==='checked'?'boolean':'string';for(const c of [e.arg,e.left,e.right,...(e.args||[]),...(e.parts||[]).map(p=>p.when)])if(c)inputs(c);};
+      const replaceEvent=(value,arg)=>value.op==='event'&&value.key==='value'?arg:Object.fromEntries(Object.entries(value).map(([k,v])=>[k,Array.isArray(v)?v.map(item=>item&&typeof item==='object'?replaceEvent(item,arg):item):v&&typeof v==='object'?replaceEvent(v,arg):v]));
+      for(let body of statements) {
+        if(ts.isExpressionStatement(body)||ts.isReturnStatement(body))body=body.expression;
+        body=unwrap(body);
+        if(body&&ts.isCallExpression(body)&&!body.arguments.length&&ts.isPropertyAccessExpression(body.expression)&&ts.isIdentifier(body.expression.expression)&&body.expression.expression.text===fn.parameters[0]?.name?.text&&['preventDefault','stopPropagation'].includes(body.expression.name.text))continue;
+        if(body&&ts.isBinaryExpression(body)&&body.operatorToken.kind===ts.SyntaxKind.AmpersandAmpersandToken) {
+          const guard=unwrap(body.left);
+          if(!ts.isBinaryExpression(guard)||guard.operatorToken.kind!==ts.SyntaxKind.EqualsEqualsEqualsToken||!ts.isTypeOfExpression(guard.left)||!ts.isIdentifier(guard.left.expression)||guard.left.expression.text!==fn.parameters[0]?.name?.text||!ts.isStringLiteral(guard.right)||!['string','number','boolean'].includes(guard.right.text))return null;
+          body=unwrap(body.right);
+        }
+        if(!body||!ts.isCallExpression(body)||!ts.isIdentifier(body.expression)||body.arguments.length!==1)return null;
+        const inherited=ctx.__iamPropHandlers.get(body.expression.text);
+        if(inherited) {
+          const arg=uiExpression(body.arguments[0],owner,ctx,fn.parameters[0]?.name?.text||null);
+          if(!arg)return null;
+          const forwardedWrites=(inherited.writes||[{variableKey:inherited.variableKey,value:inherited.value}]).map(write=>({...write,value:replaceEvent(write.value,arg)}));
+          for(const write of forwardedWrites)inputs(write.value);
+          if(['onValueChange','onOpenChange'].includes(property))for(const [key,type]of Object.entries(inherited.payload))if(Object.hasOwn(payload,key))payload[key]=type;
+          if(forwardedWrites.some(write=>uiExpressionType(write.value,payload)!==ui.variables.find(v=>v.variableKey===write.variableKey)?.valueType))return null;
+          writes.push(...forwardedWrites);continue;
+        }
+        const label=ctx.__iamSetters[body.expression.text],variableKey=ctx.__iamVariableKeys[label];
+        if(!variableKey||writes.some(w=>w.variableKey===variableKey))return null;
+        const input=unwrap(body.arguments[0]),functional=input&&ts.isArrowFunction(input)&&!ts.isBlock(input.body)&&input.parameters.length===1&&ts.isIdentifier(input.parameters[0].name)?input:null;
+        const aliases=functional?{[functional.parameters[0].name.text]:{op:'var',key:variableKey}}:{};
+        const value=uiExpression(functional?functional.body:input,owner,ctx,fn.parameters[0]?.name?.text||null,aliases);
+        if(!value)return null;
+        inputs(value);const expected=ui.variables.find(v=>v.variableKey===variableKey)?.valueType;
+        if(value.op==='event'&&value.key==='value'&&['onValueChange','onOpenChange'].includes(property))payload.value=expected;
+        if(uiExpressionType(value,payload)!==expected)return null;
+        writes.push({variableKey,value});
+      }
+      if(!writes.length||new Set(writes.map(w=>w.variableKey)).size!==writes.length)return null;
+      return {...writes[0],writes,payload};
+    }
+    function queryBacked(node, owner, ctx) {
+      return sourceQueryEvidence({
+        ts,
+        node,
+        module: owner.module,
+        locals: ctx.__iamLocals,
+        binding,
+        functionFrom,
+        imported: externalImport,
+      });
+    }
+    function remoteResultCondition(node, owner, ctx) {
+      let shape = false;
+      const root =
+        ts.isIdentifier(node) && ctx.__iamLocals.has(node.text)
+          ? ctx.__iamLocals.get(node.text)
+          : node;
+      const inspect = (n) => {
+        if (!n || shape) return;
+        if (
+          ts.isPropertyAccessExpression(n) &&
+          [
+            "isLoading",
+            "isPending",
+            "isError",
+            "error",
+            "data",
+            "length",
+            "size",
+          ].includes(n.name.text)
+        )
+          shape = true;
+        ts.forEachChild(n, inspect);
+      };
+      inspect(root);
+      return shape
+        ? queryBacked(node, owner, ctx)
+          ? "remote"
+          : "unobserved-data"
+        : null;
+    }
+    function updatedCollectionContext(ctx, label, value, owner) {
+      const next = { ...ctx, [label]: value, __iamCollectionTemplate: true };
+      for (const [key, init] of ctx.__iamLocals)
+        if (!ctx.__iamStates.has(key))
+          next[key] = evalExpression(init, owner.module, next);
+      return next;
+    }
+    function finiteCollection(node, owner, ctx, instance, depth) {
+      if (ctx.__iamCollectionTemplate || !ts.isConditionalExpression(node))
+        return null;
+      const maps = [];
+      const scan = (n) => {
+        if (
+          ts.isCallExpression(n) &&
+          ts.isPropertyAccessExpression(n.expression) &&
+          n.expression.name.text === "map"
+        )
+          maps.push(n);
+        if (!ts.isFunctionLike(n)) ts.forEachChild(n, scan);
+      };
+      scan(node);
+      if (maps.length !== 1) return null;
+      const receiver = maps[0].expression.expression,
+        reads = collectionStateReads(ts, receiver, ctx),
+        tabs = presentation.tabs.filter(
+          (t) =>
+            reads.includes(t.variableKey) &&
+            Object.values(ctx.__iamVariableKeys).includes(t.variableKey),
+        );
+      if (tabs.length !== 1 || tabs[0].items.length < 2 || tabs[0].items.length > 8)
+        return null;
+      const tab = tabs[0],
+        label = Object.keys(ctx.__iamVariableKeys).find(
+          (k) => ctx.__iamVariableKeys[k] === tab.variableKey,
+        );
+      const candidates = tab.items.map((item) => {
+        const next = updatedCollectionContext(ctx, label, item.value, owner);
+        return {
+          value: item.value,
+          ctx: next,
+          items: evalExpression(receiver, owner.module, next),
+        };
+      });
+      if (
+        candidates.some((c) => !Array.isArray(c.items) || c.items.length > 128) ||
+        new Set(candidates.map((c) => JSON.stringify(c.items))).size < 2
+      )
+        return null;
+      const source = sourceLocation(owner.module, node, owner.symbol),
+        captured = {};
+      const capture = (n) => {
+        if (
+          ts.isIdentifier(n) &&
+          Object.hasOwn(ctx, n.text) &&
+          !n.text.startsWith("__iam")
+        ) {
+          const value = ctx[n.text];
+          captured[n.text] = isUnknown(value)
+            ? { kind: "unknown" }
+            : value === undefined
+              ? { kind: "undefined" }
+              : value?.[COMPONENT]
+                ? { kind: "component", key: value[COMPONENT].key }
+                : value?.[LUCIDE_SOURCE]
+                  ? { kind: "lucide", name: value[LUCIDE_SOURCE] }
+                  : { kind: "literal", value };
+        }
+        ts.forEachChild(n, capture);
+      };
+      capture(node);
+      let cacheKey;
+      try {
+        cacheKey = identity("collection-template", {
+          source,
+          captured,
+          cases: candidates.map((c) => ({ value: c.value, items: c.items })),
+        });
+      } catch {
+        return null;
+      }
+      let cases = collectionTemplates.get(cacheKey);
+      if (!cases) {
+        cases = [];
+        for (const candidate of candidates) {
+          const sizes = {
+            bindings: ui.bindings.length,
+            transitions: ui.transitions.length,
+            variables: ui.variables.length,
+            conditions: presentation.conditions.length,
+            tabs: presentation.tabs.length,
+            regions: presentation.regions.length,
+          };
+          const html = renderExpr(
+              node,
+              owner,
+              candidate.ctx,
+              cacheKey + "/" + candidate.value,
+              // A shared source fragment owns its bounded subtree budget. App wrapper
+              // depth must not erase leaf text from an otherwise identical collection.
+              0,
+            ),
+            fragment = sourceCollectionFragment(
+              html,
+              source,
+              candidate.items.length,
+              record,
+            );
+          for (const variable of ui.variables.slice(sizes.variables))
+            uiVariableKeys.delete(variable.variableKey);
+          ui.bindings.length = sizes.bindings;
+          ui.transitions.length = sizes.transitions;
+          ui.variables.length = sizes.variables;
+          for (const key of ["conditions", "tabs", "regions"])
+            presentation[key].length = sizes[key];
+          if (
+            !presentation.fragments.some(
+              (f) => f.fragmentKey === fragment.fragmentKey,
+            )
+          )
+            presentation.fragments.push(fragment);
+          cases.push({ value: candidate.value, fragmentKey: fragment.fragmentKey });
+        }
+        collectionTemplates.set(cacheKey, cases);
+      }
+      const collectionKey = identity("ui-collection", {
+          page: pageKey,
+          instance,
+          source,
+        }),
+        nodeId = identity("node", { page: pageKey, collectionKey }),
+        elementKey = identity("element", {
+          component: owner.key,
+          sourceCollection: node.pos,
+        });
+      elements.set(elementKey, {
+        elementKey,
+        componentKey: owner.key,
+        tag: "div",
+        source,
+        identityStrategy: "provisional_ast_ordinal",
+        editableProperties: [],
+        binding: "read_only",
+      });
+      record.set(nodeId, { elementKey, source, synthetic: true });
+      const requires = reads
+        .filter((key) => key !== tab.variableKey)
+        .map((variableKey) => ({
+          variableKey,
+          value: ui.variables.find((v) => v.variableKey === variableKey)
+            ?.initialValue,
+        }));
+      presentation.collections.push({
+        collectionKey,
+        routeKey: pageKey,
+        renderKey: "pending",
+        nodeId,
+        variableKey: tab.variableKey,
+        requires,
+        cases,
+        source,
+      });
+      return (
+        '<div data-iam-node="' +
+        nodeId +
+        '" data-iam-collection="' +
+        collectionKey +
+        '" data-iam-unobserved="true" hidden=""></div>'
+      );
+    }
+    const iconGlyphs=new Set();
+    function renderLucide(icon, node, owner, props, instance, shared=true) {
+      const geometry = lucideGeometry(icon),
+        source = sourceLocation(owner.module, node, owner.symbol);
+      if (!geometry) return "";
+      const element = (tag, attributes, children, part) => {
+        const elementKey = identity("element", {
+            component: owner.key,
+            lucide: node.pos,
+            part,
+            tag,
+          }),
+          nodeId = identity("node", {
+            page: pageKey,
+            elementKey,
+            instance,
+            icon: icon[LUCIDE_SOURCE],
+          });
+        elements.set(elementKey, {
+          elementKey,
+          componentKey: owner.key,
+          tag,
+          source,
+          identityStrategy: "provisional_ast_ordinal",
+          editableProperties: [],
+          binding: "read_only",
+        });
+        record.set(nodeId, { elementKey, source, synthetic: true });
+        return (
+          "<" +
+          tag +
+          ' data-iam-node="' +
+          nodeId +
+          '" ' +
+          Object.entries(attributes)
+            .map(([key, value]) => key + '="' + escape(value) + '"')
+            .join(" ") +
+          ">" +
+          children +
+          "</" +
+          tag +
+          ">"
+        );
+      };
+      const className = typeof props.className === "string" ? props.className : "";
+      className
+        .split(/\s+/)
+        .filter(Boolean)
+        .forEach((c) => allClasses.add(c));
+      const glyphId='iam-glyph-'+sha256(String(icon[LUCIDE_SOURCE])).slice(0,24);
+      let glyph='';if(shared&&!iconGlyphs.has(glyphId)){
+        iconGlyphs.add(glyphId);glyph=element('defs',{},element('g',{id:glyphId},geometry.map(([tag,attrs],index)=>element(tag,attrs,'','glyph-'+glyphId+'-'+index)).join(''),'glyph-'+glyphId),'defs-'+glyphId);
       }
-      if (!fn || !ts.isArrowFunction(fn) || fn.modifiers?.some(m => m.kind === ts.SyntaxKind.AsyncKeyword)) return null;
-      const body = ts.isBlock(fn.body) ? fn.body.statements.length === 1 && ts.isExpressionStatement(fn.body.statements[0]) ? fn.body.statements[0].expression : null : unwrap(fn.body);
-      if (!body || !ts.isCallExpression(body) || !ts.isIdentifier(body.expression) || body.arguments.length !== 1) return null;
-      const label = ctx.__iamSetters[body.expression.text], variableKey = ctx.__iamVariableKeys[label];
-      if (!variableKey) return null;
-      const input = unwrap(body.arguments[0]);
-      const functional = input && ts.isArrowFunction(input) && !ts.isBlock(input.body) && input.parameters.length === 1 && ts.isIdentifier(input.parameters[0].name) ? input : null;
-      const aliases = functional ? { [functional.parameters[0].name.text]: { op: "var", key: variableKey } } : {};
-      const value = uiExpression(functional ? functional.body : input, owner, ctx, fn.parameters[0]?.name?.text || null, aliases);
-      if (!value) return null;
-      const payload = {};
-      function eventInputs(e) { if (e.op === "event") payload[e.key] = e.key === "checked" ? "boolean" : "string"; for (const child of [e.arg, e.left, e.right, ...(e.args || []),...(e.parts||[]).map(part=>part.when)]) if (child) eventInputs(child); }
-      eventInputs(value);
-      return { variableKey, value, payload };
+      return element(
+        "svg",
+        {
+          xmlns: "http://www.w3.org/2000/svg",
+          width: 24,
+          height: 24,
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width":
+            typeof props.strokeWidth === "number" ? props.strokeWidth : 2,
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          "aria-hidden": "true",
+          class: className,
+        },
+        shared?glyph+element('use',{href:'#'+glyphId},'','use'):geometry.map(([tag,attrs],index)=>element(tag,attrs,'',index)).join(''),
+        "root",
+      );
     }
-    function unobservedValue(node, owner, instance) {
+    function unobservedValue(node, owner, instance,remote=false) {
       const source = sourceLocation(owner.module, node, owner.symbol);
       const elementKey = identity("element", { component: owner.key, unobservedValue: node.getStart(owner.module.source) - owner.fn.getStart(owner.module.source) });
       const nodeId = identity("node", { page: pageKey, element: elementKey, instance });
       elements.set(elementKey, { elementKey, componentKey: owner.key, tag: "span", source, identityStrategy: "provisional_ast_ordinal", editableProperties: [], binding: "preview_only" });
       record.set(nodeId, { elementKey, source, synthetic: true });
       // Preserve an unknown child boundary. An empty projection must never prove that replacing text is safe.
-      return '<span data-iam-node="' + nodeId + '" hidden=""></span>';
+      return '<span data-iam-node="' + nodeId + '" data-iam-observation="'+(remote?'remote':'unobserved')+'" hidden=""></span>';
+    }
+    function renderInvocation(invocation,instance,depth){
+      const {callback,args,caller}=invocation,next={...callback.ctx,__iamContexts:caller.__iamContexts??callback.ctx.__iamContexts,__iamOverlays:caller.__iamOverlays??callback.ctx.__iamOverlays};
+      for(const [index,parameter]of callback.fn.parameters.entries()){
+        const value=args[index];
+        if(ts.isIdentifier(parameter.name))next[parameter.name.text]=value;
+        else if(ts.isObjectBindingPattern(parameter.name))for(const field of parameter.name.elements)if(ts.isIdentifier(field.name))next[field.name.text]=!isUnknown(value)&&value&&typeof value==='object'?value[field.propertyName?.text||field.name.text]??UNKNOWN:UNKNOWN;
+      }
+      gap('RENDER_PROP_SOURCE_ONLY',callback.owner.module.file,callback.owner.symbol+': invoked JSX render-prop reconstructed from source; effects and business callbacks are not executed');
+      return renderExpr(uiReturnExpression(callback.fn),callback.owner,next,callback.instance+'/call-'+instance,depth+1);
     }
+    function hasSourceJsx(node){let found=false;const visit=n=>{if(ts.isJsxElement(n)||ts.isJsxSelfClosingElement(n)||ts.isJsxFragment(n)){found=true;return;}if(!ts.isFunctionLike(n))ts.forEachChild(n,visit);};if(node)visit(node);return found;}
     function renderExpr(node, owner, ctx, instance, depth) {
       node = unwrap(node);
       if (!node) return "";
       if (depth > 45) { gap("RENDER_DEPTH_LIMIT", owner.module.file, owner.symbol + ": JSX traversal budget exceeded"); return ""; }
       const m = owner.module;
+      const collection=finiteCollection(node,owner,ctx,instance,depth);if(collection!==null)return collection;
+      if(ts.isIdentifier(node)&&ctx.__iamLocals.has(node.text)&&hasSourceJsx(ctx.__iamLocals.get(node.text))){
+        if(ctx.__iamActiveJsx?.has(node.text))return '';
+        return renderExpr(ctx.__iamLocals.get(node.text),owner,{...ctx,__iamActiveJsx:new Set([...(ctx.__iamActiveJsx??[]),node.text])},instance+'/local-'+node.text,depth+1);
+      }
       if (ts.isJsxFragment(node))
         return node.children
           .map((n, i) =>
@@ -973,6 +1498,13 @@ export async function analyze({
       if (ts.isJsxText(node)) return escape(jsxText(node.text));
       if (ts.isJsxExpression(node))
         return renderExpr(node.expression, owner, ctx, instance, depth + 1);
+      if (ts.isBinaryExpression(node) && [ts.SyntaxKind.QuestionQuestionToken, ts.SyntaxKind.BarBarToken].includes(node.operatorToken.kind)) {
+        const left = evalExpression(node.left, m, ctx);
+        if (!isUnknown(left)) {
+          const fallback = node.operatorToken.kind === ts.SyntaxKind.QuestionQuestionToken ? left == null : !left;
+          return renderExpr(fallback ? node.right : node.left, owner, ctx, instance + '/fallback', depth + 1);
+        }
+      }
       if(ts.isArrowFunction(node)){
         const parent=node.parent?.parent,tag=parent&&ts.isJsxElement(parent)?parent.openingElement.tagName.getText(m.source):'',imported=m.imports.get(tag),body=unwrap(node.body);
         if(imported?.specifier==='react-basics'&&imported.name==='Modal'&&!node.modifiers?.some(v=>v.kind===ts.SyntaxKind.AsyncKeyword)&&node.parameters.length<=3&&node.parameters.every(p=>ts.isIdentifier(p.name))&&(ts.isJsxElement(body)||ts.isJsxFragment(body)||ts.isJsxSelfClosingElement(body))){
@@ -1063,12 +1595,14 @@ export async function analyze({
         gap("UNOBSERVED_CONDITION", m.file, label);
         // Preserve both source alternatives for exact runtime binding. Neither
         // is asserted to be authorized/visible, nor executed in source preview.
+        const dataBranches=[yes,no].map(branch=>branch?evalExpression(branch,m,ctx):null),observation=remoteResultCondition(condition,owner,ctx)??(dataBranches.every(v=>v===null||['string','number'].includes(typeof v))?'unobserved-data':null),conditionRow={conditionKey:identity('ui-condition',{file:m.file,offset:condition.getStart(m.source)}),expression:label,source:sourceLocation(m,condition,owner.symbol),...(observation?{observation}:{})};
+        presentation.conditions.push(conditionRow);
         return [yes, no].map((branch,index)=>{
           if(!branch)return '';
           const elementKey=identity('element',{component:owner.key,state:label,unobserved:index,sourceOffset:condition.getStart(m.source)-owner.fn.getStart(m.source)}),id=identity('node',{page:pageKey,element:elementKey,instance:instance+'/unobserved-'+index}),source=sourceLocation(m,condition,owner.symbol);
           record.set(id,{elementKey,source,synthetic:true});
           elements.set(elementKey,{elementKey,componentKey:owner.key,tag:'div',source,identityStrategy:'provisional_ast_ordinal',editableProperties:[],binding:'preview_only'});
-          return '<div data-iam-node="'+id+'" data-iam-unobserved="true" hidden="">'+renderExpr(branch,owner,ctx,instance+'/unobserved-'+index,depth+1)+'</div>';
+          return '<div data-iam-node="'+id+'" data-iam-unobserved="true" hidden="" data-iam-condition="'+conditionRow.conditionKey+'" data-iam-alternative="'+(index===0)+'">'+renderExpr(branch,owner,ctx,instance+'/unobserved-'+index,depth+1)+'</div>';
         }).join('');
       }
       if (
@@ -1083,22 +1617,28 @@ export async function analyze({
           fn &&
           (ts.isArrowFunction(fn) || ts.isFunctionExpression(fn))
         ) {
-          if (values.length > 50)
+          const limit=ctx.__iamCollectionTemplate?128:50;
+          if (values.length > limit)
             gap(
               "COLLECTION_TRUNCATED",
               m.file,
               "Static collection limited to 50 preview items",
             );
           return values
-            .slice(0, 50)
+            .slice(0, limit)
             .map((value, i) => {
               const next = { ...ctx };
               if (fn.parameters[0] && ts.isIdentifier(fn.parameters[0].name))
                 next[fn.parameters[0].name.text] = value;
               if (fn.parameters[1] && ts.isIdentifier(fn.parameters[1].name))
                 next[fn.parameters[1].name.text] = i;
+              if(fn.parameters[0]&&ts.isObjectBindingPattern(fn.parameters[0].name))for(const field of fn.parameters[0].name.elements){
+                if(!ts.isIdentifier(field.name)||field.dotDotDotToken)continue;
+                const key=field.propertyName?.text||field.name.text;next[field.name.text]=value&&typeof value==='object'&&!isUnknown(value)&&Object.hasOwn(value,key)?value[key]:field.initializer?evalExpression(field.initializer,m,next):undefined;
+              }
+              if(ts.isBlock(fn.body))for(const statement of fn.body.statements)if(ts.isVariableStatement(statement))for(const decl of statement.declarationList.declarations)if(ts.isIdentifier(decl.name))next[decl.name.text]=evalExpression(decl.initializer,m,next);
               return renderExpr(
-                returnExpression(fn),
+                uiReturnExpression(fn),
                 owner,
                 next,
                 instance + "/item-" + i,
@@ -1108,7 +1648,7 @@ export async function analyze({
             .join("");
         }
         gap("DYNAMIC_COLLECTION", m.file, node.expression.getText(m.source));
-        return unobservedValue(node, owner, instance);
+        return unobservedValue(node, owner, instance,queryBacked(node.expression.expression,owner,ctx));
       }
       if (!ts.isJsxElement(node) && !ts.isJsxSelfClosingElement(node)) {
         if (
@@ -1118,6 +1658,9 @@ export async function analyze({
         )
           return ctx[node.text].iamChildren;
         const value = evalExpression(node, m, ctx), expr = uiExpression(node, owner, ctx);
+        if(value?.iamRenderInvocation)return renderInvocation(value.iamRenderInvocation,instance,depth);
+        if(value?.iamRenderChildren)return value.iamRenderChildren(ctx);
+        if(value?.iamChildren!==undefined)return value.iamChildren;
         if (expr && readVariables(expr).length && ["string", "number"].includes(typeof value)) {
           const source = sourceLocation(m, node, owner.symbol), elementKey = identity("element", { component: owner.key, stateTextOffset: node.getStart(m.source) - owner.fn.getStart(m.source) }), id = identity("node", { page: pageKey, element: elementKey, instance });
           record.set(id, { elementKey, source, synthetic: true });
@@ -1134,7 +1677,7 @@ export async function analyze({
           return escape(value);
         if (isUnknown(value)) {
           gap("DYNAMIC_VALUE", m.file, node.getText(m.source).slice(0, 100));
-          return unobservedValue(node, owner, instance);
+          return unobservedValue(node, owner, instance,queryBacked(node,owner,ctx));
         }
         return "";
       }
@@ -1142,12 +1685,13 @@ export async function analyze({
         throw new Error("Rendered node budget exceeded");
       const opening = ts.isJsxElement(node) ? node.openingElement : node,
         tag = opening.tagName.getText(m.source),
-        props = m.anchors.get(opening) ? { "data-indiana-id": m.anchors.get(opening) } : {}, uiHandlers = [], uiBindings = [], forwardedHandlers=[];
+        props = m.anchors.get(opening) ? { "data-indiana-id": m.anchors.get(opening) } : {}, uiHandlers = [], uiBindings = [], forwardedHandlers=[],uiAttributes=[];
       for (const attr of opening.attributes.properties) {
         if (ts.isJsxSpreadAttribute(attr)) {
           const v = evalExpression(attr.expression, m, ctx);
           if (isUnknown(v)) {
             for (const attribute of anchorAttributes) delete props[attribute];
+            props.__iamOpaqueProps = true;
             gap("UNKNOWN_ANCHOR_SPREAD", m.file, "Opaque spread may override element identity");
             continue;
           }
@@ -1157,17 +1701,22 @@ export async function analyze({
             for (const key of Object.keys(v)) {
               for (let i = uiBindings.length - 1; i >= 0; i--) if (uiBindings[i].property === key) uiBindings.splice(i, 1);
               for (let i = uiHandlers.length - 1; i >= 0; i--) if (uiHandlers[i].key === key) uiHandlers.splice(i, 1);
+              for (let i = uiAttributes.length - 1; i >= 0; i--) if (uiAttributes[i].key === key) uiAttributes.splice(i, 1);
             }
-            if (inherited) { uiBindings.push(...inherited.bindings); uiHandlers.push(...inherited.handlers); }
+            if (inherited) { uiBindings.push(...inherited.bindings); uiHandlers.push(...inherited.handlers); uiAttributes.push(...(inherited.attributes??[])); }
           }
           continue;
         }
         const key = attr.name.getText(m.source);
+        for(let i=uiAttributes.length-1;i>=0;i--)if(uiAttributes[i].key===key)uiAttributes.splice(i,1);
+        if(!ctx.__iamCollectionTemplate&&['className','placeholder','aria-label'].includes(key)&&attr.initializer&&ts.isJsxExpression(attr.initializer)){
+          const reads=collectionStateReads(ts,attr.initializer.expression,ctx);if(reads.length)uiAttributes.push({key,owner,ctx,expression:attr.initializer.expression,property:key==='className'?'class':key,reads,source:sourceLocation(m,attr,owner.symbol)});
+        }
         for (let i = uiBindings.length - 1; i >= 0; i--) if (uiBindings[i].property === key) uiBindings.splice(i, 1);
         for (let i = uiHandlers.length - 1; i >= 0; i--) if (uiHandlers[i].key === key) uiHandlers.splice(i, 1);
-        if (["onClick", "onChange", "onInput"].includes(key)) {
+        if (["onClick", "onChange", "onInput", "onValueChange", "onOpenChange"].includes(key)) {
           props[key] = undefined;
-          const supported = uiHandler(attr.initializer, owner, ctx);
+          const supported = ctx.__iamCollectionTemplate?null:uiHandler(attr.initializer, owner, ctx, key);
           if (supported) { props[key] = undefined; uiHandlers.push({ ...supported, key, source: sourceLocation(m, attr, owner.symbol) }); }
           const fn =
             attr.initializer && ts.isJsxExpression(attr.initializer)
@@ -1199,7 +1748,7 @@ export async function analyze({
               key +
                 " at line " +
                 sourceLocation(m, attr, owner.symbol).line +
-                ": callback is not a supported UI simulation; business/data behavior is not executed",
+                ": handler is not simulated; no business execution",
             );
           continue;
         }
@@ -1225,6 +1774,16 @@ export async function analyze({
           const expr = uiExpression(attr.initializer.expression, owner, ctx);
           if (expr && readVariables(expr).length) uiBindings.push({ property: key, value: expr, source: sourceLocation(m, attr, owner.symbol) });
         }
+        if(attr.initializer&&ts.isJsxExpression(attr.initializer)){
+          let fn=unwrap(attr.initializer.expression);const visited=new Set();
+          while(fn&&ts.isIdentifier(fn)&&ctx.__iamLocals.has(fn.text)&&!visited.has(fn.text)){visited.add(fn.text);fn=unwrap(ctx.__iamLocals.get(fn.text));}
+          if(fn&&(ts.isArrowFunction(fn)||ts.isFunctionExpression(fn))){
+          let jsx=false;const inspect=n=>{if(ts.isJsxElement(n)||ts.isJsxSelfClosingElement(n)||ts.isJsxFragment(n))jsx=true;ts.forEachChild(n,inspect);};inspect(fn.body);
+          const safe=!fn.modifiers?.some(v=>v.kind===ts.SyntaxKind.AsyncKeyword)&&(!ts.isBlock(fn.body)||fn.body.statements.every(s=>ts.isVariableStatement(s)||ts.isIfStatement(s)||ts.isReturnStatement(s)));
+          if(jsx&&safe){props[key]={iamRenderProp:{fn,owner,ctx,instance:instance+'/prop-'+key}};continue;}
+          }
+        }
+        if(attr.initializer&&ts.isJsxExpression(attr.initializer)&&hasSourceJsx(attr.initializer.expression)){const value=attr.initializer.expression;props[key]={iamRenderChildren:inherited=>renderExpr(value,owner,{...ctx,__iamContexts:inherited.__iamContexts??ctx.__iamContexts,__iamTabs:inherited.__iamTabs??ctx.__iamTabs,__iamOverlays:inherited.__iamOverlays??ctx.__iamOverlays},instance+'/prop-'+key,depth+1)};continue;}
         props[key] = !attr.initializer
           ? true
           : ts.isStringLiteral(attr.initializer)
@@ -1235,24 +1794,96 @@ export async function analyze({
           gap('DYNAMIC_CLASS_PARTIAL',m.file,'className at line '+sourceLocation(m,attr,owner.symbol).line+': only definitely present class tokens retained; unresolved styling needs runtime observation');
         }
       }
-      const children = ts.isJsxElement(node)
-        ? node.children
-            .map((child, i) =>
-              renderExpr(
-                child,
-                owner,
-                ctx,
-                instance + "/child-" + i,
-                depth + 1,
-              ),
-            )
-            .join("")
-        : props.children?.iamChildren || "";
+      const chart=sourceChart({ts,node:opening,tag,owner,context:ctx,evaluate:evalExpression,imported:externalImport});
+      if(chart){
+        gap(chart.unobserved?'CHART_DATA_UNOBSERVED':'CHART_SOURCE_PROJECTION',m.file,chart.unobserved?'Chart data is dynamic, random or outside bounds; no values are invented.':'Bounded source data rendered as inert SVG; library effects, animation and tooltips are not executed.');
+        const source=sourceLocation(m,node,owner.symbol);
+        const draw=(item,part)=>{
+          if(typeof item==='string')return escape(item);
+          const elementKey=identity('element',{component:owner.key,chart:node.pos,part}),nodeId=identity('node',{page:pageKey,elementKey,instance});
+          elements.set(elementKey,{elementKey,componentKey:owner.key,tag:item.tag,source,identityStrategy:'provisional_ast_ordinal',editableProperties:[],binding:'preview_only'});record.set(nodeId,{elementKey,source,synthetic:true});
+          return '<'+item.tag+' data-iam-node="'+nodeId+'" '+Object.entries(item.attrs).map(([k,v])=>k+'="'+escape(v)+'"').join(' ')+'>'+item.children.map((child,i)=>draw(child,part+'/'+i)).join('')+'</'+item.tag+'>';
+        };
+        return draw({tag:'svg',attrs:{xmlns:'http://www.w3.org/2000/svg',viewBox:'0 0 '+chart.width+' '+chart.height,width:chart.width,height:chart.height,role:'img','aria-label':chart.unobserved?'Chart: data unobserved':'Source chart projection','data-iam-chart':chart.unobserved?'unobserved':'source',style:'display:block;width:100%;height:auto;max-height:'+chart.height+'px'},children:chart.children},'root');
+      }
+      const sourceIcon=evalExpression(opening.tagName,m,ctx);
+      if(sourceIcon?.[LUCIDE_SOURCE])return renderLucide(sourceIcon,node,owner,props,instance,!ctx.__iamCollectionTemplate);
+      const tabPart=tabsPrimitive(m,tag),basePart=basePrimitive(m,tag),overlay=basePart&&basePart.family!=='Tabs'?basePart:null;
+      let overlayGroup=overlay?ctx.__iamOverlays?.get(overlay.family):null;
+      let childCtx=ctx,tabGroup=ctx.__iamTabs;
+      const provider=tag.endsWith('.Provider')?contextKey(m,tag.slice(0,-9)):contextKey(m,tag);
+      if(provider){const contexts=new Map(ctx.__iamContexts);contexts.set(provider,props.value);childCtx={...childCtx,__iamContexts:contexts};}
+      if(overlay&&['Root','SubmenuRoot'].includes(overlay.part)){
+        const openProperty=overlay.family==='Transition'?'in':'open',open=props[openProperty];
+        overlayGroup={open:open===true||open===undefined&&props.defaultOpen===true,variable:uiBindings.find(b=>b.property===openProperty)?.value,controller:uiHandlers.find(h=>h.key==='onOpenChange')};
+        if(overlay.family!=='Transition'&&open===undefined&&!props.__iamOpaqueProps&&(props.defaultOpen===undefined||typeof props.defaultOpen==='boolean')){
+          const scopeKey=identity('primitive-state',{page:pageKey,instance,family:overlay.family}),variableKey=identity('ui-variable',{scope:scopeKey,label:'open'});
+          ui.variables.push({variableKey,routeKey:pageKey,scopeKey,label:overlay.family+'.open',valueType:'boolean',initialValue:overlayGroup.open,source:sourceLocation(m,node,owner.symbol)});
+          overlayGroup.variable={op:'var',key:variableKey};
+          overlayGroup.controller={variableKey,value:{op:'event',key:'value'},payload:{value:'boolean'}};
+        }
+        if(overlay.family==='Transition'){
+          const attr=opening.attributes.properties.find(a=>ts.isJsxAttribute(a)&&a.name.text==='onEnter');
+          const callback=attr?.initializer&&ts.isJsxExpression(attr.initializer)?unwrap(attr.initializer.expression):null;
+          let statement=callback&&ts.isArrowFunction(callback)&&!callback.parameters.length&&ts.isBlock(callback.body)?callback.body.statements[0]:null;
+          if(statement&&ts.isIfStatement(statement))statement=evalExpression(statement.expression,m,ctx)===true?statement.thenStatement:null;
+          if(statement&&ts.isBlock(statement))statement=statement.statements[0];
+          const assignment=statement&&ts.isExpressionStatement(statement)?unwrap(statement.expression):null;
+          const left=assignment&&ts.isBinaryExpression(assignment)&&assignment.operatorToken.kind===ts.SyntaxKind.EqualsToken?assignment.left:null;
+          if(left&&ts.isPropertyAccessExpression(left)&&left.name.text==='display'&&ts.isPropertyAccessExpression(left.expression)&&left.expression.name.text==='style'&&ts.isPropertyAccessExpression(left.expression.expression)&&left.expression.expression.name.text==='current'&&ts.isIdentifier(left.expression.expression.expression)&&(assignment.right.kind===ts.SyntaxKind.NullKeyword||ts.isStringLiteral(assignment.right)&&assignment.right.text==='')){
+            overlayGroup.reveal={ref:left.expression.expression.expression.text,file:m.file,symbol:owner.symbol};
+            gap('TRANSITION_VISIBILITY_SOURCE_ONLY',m.file,'Source onEnter clears the referenced child display style; only that UI assignment is projected, without running callbacks or effects.');
+          }
+        }
+        if(isUnknown(open)){
+          const attribute=opening.attributes.properties.find(a=>ts.isJsxAttribute(a)&&a.name.text===openProperty),expression=attribute?.initializer&&ts.isJsxExpression(attribute.initializer)?attribute.initializer.expression:opening;
+          overlayGroup.condition={conditionKey:identity('ui-condition',{file:m.file,offset:expression.getStart(m.source)}),expression:attribute?redactLiteral(expression.getText(m.source)).slice(0,160):'open (forwarded)',source:sourceLocation(m,expression,owner.symbol)};
+          presentation.conditions.push(overlayGroup.condition);
+        }
+        const overlays=new Map(ctx.__iamOverlays);overlays.set(overlay.family,overlayGroup);childCtx={...childCtx,__iamOverlays:overlays};
+      }
+      if(tabPart==='Root') {
+        const valueBinding=uiBindings.find(b=>b.property==='value')?.value;
+        const controller=uiHandlers.find(h=>h.key==='onValueChange');
+        tabGroup={tabKey:identity('ui-tab',{page:pageKey,scope:ctx.__iamScope,instance}),routeKey:pageKey,renderKey:'pending',nodeId:'pending',variableKey:valueBinding?.op==='var'?valueBinding.key:null,initialValue:typeof props.value==='string'?props.value:typeof props.defaultValue==='string'?props.defaultValue:null,items:[],source:sourceLocation(m,node,owner.symbol),scopeSource:ui.variables.find(v=>v.variableKey===valueBinding?.key)?.source??sourceLocation(m,node,owner.symbol),controller};
+        childCtx={...childCtx,__iamTabs:tabGroup};
+      }
+      const localRef=componentBinding(m,tag),localTarget=ctx[tag]?.[COMPONENT]??(localRef&&componentDefs.get(localRef.module.file+'#'+localRef.name));
+      const dynamicNode=ctx.__iamLocals.get(tag);
+      const registry=!localTarget&&dynamicNode?componentRegistry({ts,node:dynamicNode,module:m,locals:ctx.__iamLocals,binding,functionFrom,value:(n,module)=>evalExpression(n,module,ctx),component:(n,module)=>sourceComponent(n,module)?.[COMPONENT],variable:name=>ctx.__iamVariableKeys[name]??(ctx.__iamPropBindings.get(name)?.op==='var'?ctx.__iamPropBindings.get(name).key:null),location:sourceLocation,unknown:UNKNOWN,imported:externalImport}):null;
+      const renderChildren=(inherited=childCtx)=>ts.isJsxElement(node)?node.children.map((child,i)=>renderExpr(child,owner,{...childCtx,__iamContexts:inherited.__iamContexts??childCtx.__iamContexts,__iamTabs:inherited.__iamTabs??childCtx.__iamTabs,__iamOverlays:inherited.__iamOverlays??childCtx.__iamOverlays},instance+'/child-'+i,depth+1)).join(''):props.children?.iamRenderChildren?props.children.iamRenderChildren(inherited):props.children?.iamChildren||'';
+      const children = localTarget||registry ? '' : renderChildren();
+
+      // Project the documented Controller render callback from source, with no
+      // form initialization, live field values or business callback execution.
+      const formPrimitive = externalImport(m, tag);
+      if (formPrimitive?.specifier === 'react-hook-form') {
+        if (formPrimitive.name === 'FormProvider') return children;
+        if (formPrimitive.name === 'Controller' && props.render?.iamRenderProp)
+          return renderInvocation({ callback: props.render.iamRenderProp,
+            args: [{ field: { name: typeof props.name === 'string' ? props.name : UNKNOWN }, fieldState: UNKNOWN, formState: UNKNOWN }],
+            caller: childCtx }, instance + '/controller', depth + 1);
+      }
+      const slotPrimitive = ctx[tag]?.[UI_PRIMITIVE]??externalImport(m, tag);
+      if (slotPrimitive?.specifier === '@radix-ui/react-slot' && ['Slot', 'Root'].includes(slotPrimitive.name)) {
+        const fragment=JSDOM.fragment(children),only=[...fragment.childNodes].filter(n=>n.nodeType!==3||n.textContent.trim());
+        if(only.length!==1||only[0].nodeType!==1){gap('SLOT_CHILD_UNSUPPORTED',m.file,'Slot requires one concrete element; source-only children retained without prop merging');return children;}
+        const child=only[0];
+        if(typeof props.className==='string'){
+          const names=[props.className,child.getAttribute('class')].filter(Boolean).join(' ');child.setAttribute('class',names);names.split(/\s+/).filter(Boolean).forEach(c=>allClasses.add(c));
+        }
+        for(const [key,value]of Object.entries(props))if(/^(?:title|role|data-(?:slot|state|side|variant|collapsible|active)|aria-[a-z-]+)$/.test(key)&&['string','number','boolean'].includes(typeof value)&&!child.hasAttribute(key))child.setAttribute(key,String(value));
+        if(props.style&&typeof props.style==='object'){const css=staticStyle(props.style,()=>gap('INLINE_STYLE_UNSUPPORTED',m.file,'Unresolved Slot style'));if(css)child.setAttribute('style',css+';'+(child.getAttribute('style')||''));}
+        return [...fragment.childNodes].map(n=>n.nodeType===1?n.outerHTML:n.textContent).join('');
+      }
+
       if (ctx[tag]?.iamChildren !== undefined) return ctx[tag].iamChildren;
+      if (ctx[tag]?.iamRenderChildren) return ctx[tag].iamRenderChildren(ctx);
       const routerPrimitive = externalImport(m, tag);
-      if (["react-router", "react-router-dom"].includes(routerPrimitive?.specifier) && routerPrimitive.name === "Outlet") return ctx.__iamOutlet?.iamChildren ?? "";
+      if (['react-router','react-router-dom'].includes(routerPrimitive?.specifier)&&routerPrimitive.name==='Navigate')return '';
+      if (["react-router", "react-router-dom", "@tanstack/react-router"].includes(routerPrimitive?.specifier) && routerPrimitive.name === "Outlet") return ctx.__iamOutlet?.iamRenderChildren ? ctx.__iamOutlet.iamRenderChildren(ctx) : ctx.__iamOutlet?.iamChildren ?? "";
       if (
-        /^(?:ThemeProvider|Providers?|Analytics|TailwindIndicator|Toaster)$/.test(
+        !localTarget && /^(?:ThemeProvider|Providers?|Analytics|TailwindIndicator|Toaster)$/.test(
           tag,
         )
       )
@@ -1260,12 +1891,26 @@ export async function analyze({
       const intrinsicAlias = typeof ctx[tag] === "string" && allowedTags.has(ctx[tag]);
       const importedPrimitive=m.imports.get(tag),knownExternalPrimitive=importedPrimitive?.specifier==='react-basics'&&['Text','Button','SubmitButton'].includes(importedPrimitive.name);
       let htmlTag = intrinsicAlias ? ctx[tag] : tag;
+      if(provider)return children;
       if (tag === "html" || tag === "body") {
         htmlTag = "div";
         props["data-iam-adapter"] = tag;
       }
       if (/^[A-Z]/.test(tag) && !intrinsicAlias) {
-        if (tag === "Link" || ["react-router", "react-router-dom"].includes(routerPrimitive?.specifier) && ["Link", "NavLink"].includes(routerPrimitive.name)) {
+        if(tabPart){
+          htmlTag=tabPart==='Tab'?'button':'div';
+          if(tabPart==='List')props.role='tablist';
+          if(tabPart==='Tab'){props.role='tab';props.type='button';props['aria-selected']=tabGroup?.initialValue===props.value;}
+          if(tabPart==='Panel'){props.role='tabpanel';props.hidden=tabGroup?.initialValue!==props.value;}
+        }
+        else if(overlay){
+          htmlTag=['Trigger','Close','Item','CheckboxItem','RadioItem','SubmenuTrigger'].includes(overlay.part)&&props.asChild!==true?'button':overlay.part==='Title'?'h2':overlay.part==='Description'?'p':'div';
+          if(htmlTag==='button')props.type='button';
+          if(['Portal','Popup','Backdrop'].includes(overlay.part)||overlay.family==='Transition'){props.hidden=!overlayGroup?.open;if(overlayGroup?.condition){props['data-iam-condition']=overlayGroup.condition.conditionKey;props['data-iam-alternative']='true';props['data-iam-condition-default']='false';props['data-iam-unobserved']='true';}if(overlayGroup?.variable)uiBindings.push({property:'visible',value:overlayGroup.variable,source:sourceLocation(m,node,owner.symbol)});}
+          if(['Root','SubmenuRoot','Portal','Provider'].includes(overlay.part)||props.asChild===true)props.style={display:'contents'};
+          if(overlay.part==='Popup')props.role=overlay.family==='Menu'?'menu':overlay.family==='Tooltip'?'tooltip':'dialog';
+        }
+        else if (tag === "Link" || ["react-router", "react-router-dom", "@tanstack/react-router"].includes(routerPrimitive?.specifier) && ["Link", "NavLink"].includes(routerPrimitive.name)) {
           htmlTag = "a";
           if (typeof props.to === "string") props.href = props.to;
         }
@@ -1284,14 +1929,18 @@ export async function analyze({
             .filter((v) => typeof v === "string")
             .join(" ");
         } else {
-          const ref = binding(m, tag),
-            target = ref && componentDefs.get(ref.module.file + "#" + ref.name);
+          const ref = componentBinding(m, tag),
+            target = ctx[tag]?.[COMPONENT]??(ref && componentDefs.get(ref.module.file + "#" + ref.name));
           if (target) {
             const own = components.get(owner.key);
             if (!own.dependencies.includes(target.key))
               own.dependencies.push(target.key);
-            const childProps = { ...props, children: { iamChildren: children }, __iamOutlet: ctx.__iamOutlet };
-            forwarded.set(childProps, { bindings: uiBindings, handlers: [...uiHandlers,...forwardedHandlers] });
+            const hasChildren=ts.isJsxElement(node)&&node.children.some(n=>!ts.isJsxText(n)||jsxText(n.text).trim());
+            const meaningful=ts.isJsxElement(node)?node.children.filter(n=>!ts.isJsxText(n)||jsxText(n.text).trim()):[];
+            const childCallback=meaningful.length===1&&ts.isJsxExpression(meaningful[0])?unwrap(meaningful[0].expression):null;
+            const callbackBody=childCallback&&(ts.isArrowFunction(childCallback)||ts.isFunctionExpression(childCallback))&&!childCallback.modifiers?.some(v=>v.kind===ts.SyntaxKind.AsyncKeyword)&&(!ts.isBlock(childCallback.body)||childCallback.body.statements.every(s=>ts.isVariableStatement(s)||ts.isIfStatement(s)||ts.isReturnStatement(s)))&&hasSourceJsx(uiReturnExpression(childCallback));
+            const childProps = { ...props, ...(hasChildren?{children:callbackBody?{iamRenderProp:{fn:childCallback,owner,ctx,instance:instance+'/render-child'}}:{iamRenderChildren:renderChildren}}:{}), __iamCollectionTemplate:ctx.__iamCollectionTemplate, __iamOutlet: ctx.__iamOutlet, __iamContexts:ctx.__iamContexts, __iamTabs:ctx.__iamTabs, __iamOverlays:ctx.__iamOverlays };
+            forwarded.set(childProps, { bindings: uiBindings, handlers: [...uiHandlers,...forwardedHandlers], attributes:uiAttributes });
             return renderComponent(
               target,
               childProps,
@@ -1299,6 +1948,23 @@ export async function analyze({
               depth + 1,
             );
           }
+          if(registry){
+            const regionKey=identity('ui-region',{page:pageKey,instance,tag}),regionNode=identity('node',{page:pageKey,instance,regionKey});
+            const source=sourceLocation(m,opening,owner.symbol),elementKey=identity('element',{component:owner.key,regionOffset:opening.getStart(m.source)-owner.fn.getStart(m.source)});
+            elements.set(elementKey,{elementKey,componentKey:owner.key,tag:'div',source,identityStrategy:'provisional_ast_ordinal',editableProperties:[],binding:'preview_only'});record.set(regionNode,{elementKey,source,synthetic:true});
+            const row={regionKey,routeKey:pageKey,renderKey:'pending',nodeId:regionNode,expression:redactLiteral(dynamicNode.getText(m.source)).slice(0,160),variableKey:registry.variableKey,initialValue:ui.variables.find(v=>v.variableKey===registry.variableKey)?.initialValue??null,options:[],source};
+            if(typeof row.initialValue!=='string'||!registry.options.some(o=>o.value===row.initialValue))row.initialValue=null;
+            let html='<div data-iam-node="'+regionNode+'" data-iam-region="'+regionKey+'">';
+            for(const option of registry.options){
+              const id=identity('node',{page:pageKey,regionKey,value:option.value}),optionElement=identity('element',{component:owner.key,regionKey,value:option.value});
+              elements.set(optionElement,{elementKey:optionElement,componentKey:owner.key,tag:'div',source:option.source,identityStrategy:'provisional_ast_ordinal',editableProperties:[],binding:'preview_only'});record.set(id,{elementKey:optionElement,source:option.source,synthetic:true});
+              const catalog=ctx.t?.[TRANSLATION]??(translationResources.size===1?[...translationResources][0]:null),title=catalog?option.label.split('.').reduce((v,key)=>v?.[key],catalog):undefined;
+              row.options.push({value:option.value,label:typeof title==='string'?title:option.label,nodeId:id,componentKey:option.component.key,source:option.source,scope:option.scope});
+              const own=components.get(owner.key);if(!own.dependencies.includes(option.component.key))own.dependencies.push(option.component.key);
+              html+='<div data-iam-node="'+id+'" data-iam-region-value="'+escape(option.value)+'" data-iam-unobserved="true" hidden="">'+renderComponent(option.component,{...props,children:{iamRenderChildren:renderChildren},__iamOutlet:ctx.__iamOutlet,__iamContexts:ctx.__iamContexts,__iamOverlays:ctx.__iamOverlays},instance+'/registry-'+option.value,depth+1)+'</div>';
+            }
+            html+='</div>';presentation.regions.push(row);gap('DYNAMIC_COMPONENT_CANDIDATES',m.file,tag+': finite registry alternatives retained as source-only UI previews; selection and scope are unobserved');return html;
+          }
           htmlTag = /Button|Trigger/.test(tag)
             ? "button"
             : /Input/.test(tag)
@@ -1311,6 +1977,10 @@ export async function analyze({
         }
       }
       if (!allowedTags.has(htmlTag)) return children;
+      const reveal=ctx.__iamOverlays?.get('Transition')?.reveal,ref=opening.attributes.properties.find(a=>ts.isJsxAttribute(a)&&a.name.text==='ref');
+      if(reveal?.file===m.file&&reveal.symbol===owner.symbol&&ref?.initializer&&ts.isJsxExpression(ref.initializer)&&ts.isIdentifier(ref.initializer.expression)&&ref.initializer.expression.text===reveal.ref&&props.style?.display==='none'){
+        const {display,...style}=props.style;props.style=style;
+      }
       const anchor = anchorAttributes
         .map((key) =>
           typeof props[key] === "string" ? key + "=" + props[key] : null,
@@ -1335,6 +2005,7 @@ export async function analyze({
           element: elementKey,
           instance,
         });
+      if(!ctx.__iamCollectionTemplate)for(const request of uiAttributes)attributeRequests.push({nodeId,...request});
       elements.set(elementKey, {
         elementKey,
         componentKey: owner.key,
@@ -1351,12 +2022,38 @@ export async function analyze({
         source,
         synthetic: htmlTag !== tag && tag !== "Link" && tag !== "Image"&&!intrinsicAlias&&!knownExternalPrimitive,
       });
-      for (const handler of uiHandlers) {
+      if(tabPart==='Root'){
+        // Tab initialization below shares the same concrete source container.
+        tabGroup.nodeId=nodeId;
+        const {controller,...row}=tabGroup;
+        if(row.items.length&&row.initialValue!==null&&!row.items.some(item=>item.value===row.initialValue))row.initialValue=null;
+        presentation.tabs.push(row);
+      }
+      if(overlayGroup?.controller&&overlayGroup.variable&&['Dialog','AlertDialog','Menu','Popover','Collapsible'].includes(overlay?.family)&&['Trigger','Close'].includes(overlay.part)&&!uiHandlers.some(h=>h.key==='onClick')){
+        const next=overlay.part==='Close'?{op:'const',value:false}:{op:'not',arg:overlayGroup.variable};
+        const replace=expression=>expression.op==='event'&&expression.key==='value'?next:Object.fromEntries(Object.entries(expression).map(([key,value])=>[key,Array.isArray(value)?value.map(v=>v&&typeof v==='object'?replace(v):v):value&&typeof value==='object'?replace(value):value]));
+        const controller=overlayGroup.controller,writes=(controller.writes||[{variableKey:controller.variableKey,value:controller.value}]).map(w=>({...w,value:replace(w.value)}));
+        uiHandlers.push({...writes[0],writes,key:'onClick',payload:{},source});
+      }
+      if(tabPart==='Tab'&&tabGroup&&typeof props.value==='string'&&props.value.length<=2048){
+        if(!tabGroup.items.some(item=>item.value===props.value))tabGroup.items.push({value:props.value,nodeId});
+        props['data-iam-tab-value']=props.value;props['data-iam-tab-key']=tabGroup.tabKey;
+        const replace=value=>value.op==='event'&&value.key==='value'?{op:'const',value:props.value}:Object.fromEntries(Object.entries(value).map(([k,v])=>[k,Array.isArray(v)?v.map(item=>item&&typeof item==='object'?replace(item):item):v&&typeof v==='object'?replace(v):v]));
+        if(tabGroup.controller){const writes=(tabGroup.controller.writes||[{variableKey:tabGroup.controller.variableKey,value:tabGroup.controller.value}]).map(w=>({...w,value:replace(w.value)}));uiHandlers.push({...writes[0],writes,key:'onClick',payload:{},source});}
+      }
+      if(tabPart==='Panel'&&tabGroup?.variableKey&&typeof props.value==='string')uiBindings.push({property:'visible',value:{op:'eq',left:{op:'var',key:tabGroup.variableKey},right:{op:'const',value:props.value}},source});
+      for (const handler of uiHandlers.filter(h=>!['onValueChange','onOpenChange'].includes(h.key))) {
         const event = handler.key === "onClick" ? "click" : htmlTag === "select" || handler.payload.checked ? "change" : "input";
-        ui.transitions.push({ transitionKey: identity("ui-transition", { page: pageKey, node: nodeId, event }), routeKey: pageKey, fromStateKey: "pending", toStateKey: "pending", trigger: { nodeId, event, payload: handler.payload }, guard: { op: "const", value: true }, stateReads: readVariables(handler.value), stateWrites: [{ variableKey: handler.variableKey, value: handler.value }], simulation: "implemented", evidence: "source_inferred", source: handler.source });
+        const writes=handler.writes||[{variableKey:handler.variableKey,value:handler.value}];
+        ui.transitions.push({ transitionKey: identity("ui-transition", { page: pageKey, node: nodeId, event }), routeKey: pageKey, fromStateKey: "pending", toStateKey: "pending", trigger: { nodeId, event, payload: handler.payload }, guard: { op: "const", value: true }, stateReads: [...new Set(writes.flatMap(w=>readVariables(w.value)))].sort(), stateWrites: writes, simulation: "implemented", evidence: "source_inferred", source: handler.source });
       }
-      for (const binding of uiBindings.filter(b => ["value", "checked", "disabled", "className"].includes(b.property))) {
+      for (const binding of uiBindings.filter(b => !ctx.__iamCollectionTemplate&&["value", "checked", "disabled", "className", "visible"].includes(b.property)&&!(tabPart==='Root'&&b.property==='value'))) {
         if(['value','checked'].includes(binding.property)&&!['input','select','textarea'].includes(htmlTag)){gap('UI_BINDING_TARGET_UNSUPPORTED',m.file,tag+': input property cannot be simulated on a non-input adapter');continue;}
+        const expectedType = ["checked", "disabled", "visible"].includes(binding.property) ? "boolean" : "string";
+        if (uiExpressionType(binding.value) !== expectedType) {
+          gap("UI_BINDING_TYPE_UNSUPPORTED", m.file, tag + "." + binding.property + ": source value cannot be represented by the typed UI simulation");
+          continue;
+        }
         ui.bindings.push({ bindingKey: identity("ui-binding", { node: nodeId, property: binding.property }), routeKey: pageKey, nodeId, elementKey, ...binding });
       }
       const sensitiveInput = htmlTag === "input" && (["password", "hidden"].includes(String(props.type).toLowerCase()) || sensitiveName(String(props.name || props.id || "")));
@@ -1366,7 +2063,7 @@ export async function analyze({
         ui.transitions = ui.transitions.filter(t => t.trigger.nodeId !== nodeId);
         gap("SENSITIVE_INPUT_REDACTED", m.file, "Input value and state bridge omitted");
       }
-      const attrs = { "data-iam-node": nodeId };
+      const attrs = { "data-iam-node": nodeId,...(['input','textarea','select'].includes(htmlTag)&&Object.hasOwn(props,'value')&&isUnknown(props.value)?{'data-iam-input-unobserved':'true'}:{}) };
       for (const [key, value] of Object.entries(props)) {
         if (key === "style") {
           const css = staticStyle(value, () => gap("INLINE_STYLE_UNSUPPORTED", m.file,
@@ -1394,7 +2091,7 @@ export async function analyze({
             clipRule: "clip-rule",
           }[key] || key;
         if (
-          !/^(?:class|id|name|type|placeholder|value|title|alt|href|src|role|for|disabled|hidden|checked|width|height|viewBox|d|fill|stroke|stroke-width|stroke-linecap|stroke-linejoin|fill-rule|clip-rule|cx|cy|r|x|y|x1|x2|y1|y2|points|aria-[a-z-]+|data-indiana-id|data-testid|data-test|data-qa|data-iam-(?:adapter|toggle))$/.test(
+          !/^(?:class|id|name|type|placeholder|value|title|alt|href|src|role|for|disabled|hidden|checked|width|height|viewBox|d|fill|stroke|stroke-width|stroke-linecap|stroke-linejoin|fill-rule|clip-rule|cx|cy|r|x|y|x1|x2|y1|y2|points|aria-[a-z-]+|data-indiana-id|data-indiana-map-(?:area|flow|kind|auth|edge)|data-(?:slot|state|side|variant|collapsible|orientation|active)|data-testid|data-test|data-qa|data-iam-(?:adapter|toggle|tab-value|tab-key|condition|alternative|condition-default|unobserved))$/.test(
             attr,
           )
         )
@@ -1436,26 +2133,50 @@ export async function analyze({
       );
     }
     function renderEntry(file, props, instance, symbol) {
-      const entryModule = modules.get(file), entryRef = entryModule && binding(entryModule, symbol ?? entryModule.defaultName);
+      const entryModule = modules.get(file), entryRef = entryModule && componentBinding(entryModule, symbol ?? entryModule.defaultName);
       const entryDef = entryRef && componentDefs.get(entryRef.module.file + "#" + entryRef.name);
-      if (!entryDef) { gap("PAGE_NO_JSX", file, "Composition entry has no inspectable JSX; null defaults are inert"); return ""; }
+      if (!entryDef) {
+        if (entryRef) {
+          const key = identity("component", { file: entryRef.module.file, symbol: entryRef.name });
+          if (!components.has(key)) components.set(key, { componentKey: key, file: entryRef.module.file, name: entryRef.name, source: sourceLocation(entryRef.module, entryRef.node, entryRef.name), dependencies: [] });
+        }
+        gap("PAGE_NO_JSX", file, "Composition entry has no inspectable JSX; null defaults are inert");
+        return "";
+      }
       return renderComponent(entryDef, props, instance, 0);
     }
-    function renderBranch(branch) {
-      let content = renderEntry(branch.file, {}, branch === composition.composition ? "page" : "slot-page:" + branch.file, branch.symbol);
-      for (const layer of branch.layers) {
-        const props = { children: { iamChildren: content } };
-        if (routing.framework === "react-router") props.__iamOutlet = { iamChildren: content };
-        if (/^(?:src\/)?pages\/_app\.[jt]sx?$/.test(layer.file)) { props.Component = { iamChildren: content }; props.pageProps = {}; }
+    function renderBranch(branch, inherited = {}) {
+      const contentId=identity('node',{page:pageKey,lane:branch.lane,pageContent:true,...(composition.entryMode==='soft'?{composition:composition.compositionKey}:{})}),contentElement=identity('element',{page:pageKey,lane:branch.lane,pageContent:true});
+      const contentSource=sourceLocation(modules.get(branch.file),modules.get(branch.file).source,branch.symbol??'$page-content');
+      elements.set(contentElement,{elementKey:contentElement,componentKey:def.key,tag:'div',source:contentSource,identityStrategy:'page_root',editableProperties:[],binding:'preview_only'});record.set(contentId,{elementKey:contentElement,source:contentSource,synthetic:true});
+      const contextProps=ctx=>({__iamContexts:ctx.__iamContexts,__iamTabs:ctx.__iamTabs,__iamOverlays:ctx.__iamOverlays});
+      function renderLayer(index,ctx){
+        if(index<0){
+          const content=renderEntry(branch.file,contextProps(ctx),branch===composition.composition?'page':'slot-page:'+branch.file,branch.symbol);
+          return '<div data-iam-node="'+contentId+'" data-iam-page-content="true">'+content+'</div>';
+        }
+        const layer=branch.layers[index],child={iamRenderChildren:next=>renderLayer(index-1,next)};
+        const props = ["react-router", "tanstack-router"].includes(routing.framework)
+          ? { ...contextProps(ctx), __iamOutlet: child }
+          : { ...contextProps(ctx), children: child };
+        if (/^(?:src\/)?pages\/_app\.[jt]sx?$/.test(layer.file)) { props.Component = child; props.pageProps = {}; }
         for (const slot of layer.slots) {
-          props[slot.name] = { iamChildren: renderBranch(slot.branch) };
+          props[slot.name] = { iamRenderChildren:next=>renderBranch(slot.branch,next) };
           if (composition.entryMode === "hard") gap("SOFT_NAVIGATION_STATE_UNOBSERVED", layer.file, "Slot " + slot.name + ": hard-load composition alone does not establish retained soft-navigation state");
         }
-        content = renderEntry(layer.file, props, "layout:" + path.posix.dirname(layer.file), layer.symbol);
+        return renderEntry(layer.file, props, "layout:" + path.posix.dirname(layer.file), layer.symbol);
       }
-      return content;
+      return renderLayer(branch.layers.length-1,inherited);
     }
     let html = composition.gaps.length ? "" : renderBranch(composition.composition);
+    for(const request of attributeRequests){
+      const tabs=presentation.tabs.filter(t=>request.reads.includes(t.variableKey));if(tabs.length!==1||tabs[0].items.length>8)continue;
+      const tab=tabs[0],cases=[];
+      for(const item of tab.items){const next={...request.ctx};for(const [label,key]of Object.entries(next.__iamVariableKeys))if(key===tab.variableKey)next[label]=item.value;for(const [label,expr]of next.__iamPropBindings)if(expr.op==='var'&&expr.key===tab.variableKey)next[label]=item.value;for(const [label,init]of next.__iamLocals)if(!next.__iamStates.has(label))next[label]=evalExpression(init,request.owner.module,next);const value=evalExpression(request.expression,request.owner.module,next);if(typeof value!=='string'||value.length>4000){cases.length=0;break;}cases.push({value:item.value,text:value});if(request.property==='class')value.split(/\s+/).filter(Boolean).forEach(c=>allClasses.add(c));}
+      if(cases.length<2||new Set(cases.map(c=>c.text)).size<2)continue;
+      const set={property:request.property,cases,source:request.source},setKey=identity('ui-attribute-set',set);if(!presentation.attributeSets.some(s=>s.setKey===setKey))presentation.attributeSets.push({setKey,...set});
+      const row={routeKey:pageKey,renderKey:'pending',nodeId:request.nodeId,variableKey:tab.variableKey,setKey};presentation.attributes.push({attributeKey:identity('ui-attribute',row),...row});
+    }
     const rootId = identity("node", { page: pageKey, root: true, ...(composition.entryMode === "soft" ? { composition: composition.compositionKey } : {}) }),
       rootElement = identity("element", { page: pageKey, root: true });
     record.set(rootId, {
@@ -1481,6 +2202,27 @@ export async function analyze({
     const dom = new JSDOM(
       "<!doctype html><html><body>" + html + "</body></html>",
     );
+    // JSX children may be forwarded more than once, and HTML repair may clone
+    // an invalid nested anchor. Each concrete occurrence needs a unique node;
+    // ambiguous copies remain preview-only and have no simulated state bridge.
+    const occurrences = new Map();
+    for (const element of dom.window.document.querySelectorAll("[data-iam-node]")) {
+      const id = element.getAttribute("data-iam-node");
+      const matches = occurrences.get(id) ?? [];
+      matches.push(element);
+      occurrences.set(id, matches);
+    }
+    for (const [original, matches] of occurrences) {
+      if (matches.length < 2) continue;
+      const rec = record.get(original);
+      if (!rec) throw Error("Unknown repeated source node");
+      gap("REPEATED_SOURCE_INSTANCE", rec.source.file, "Repeated forwarded children or HTML repair: copies are preview-only without a state bridge");
+      for (const [index, element] of matches.entries()) {
+        const id = identity("node", { page: pageKey, original, occurrence: index });
+        element.setAttribute("data-iam-node", id);
+        record.set(id, { ...rec, synthetic: true });
+      }
+    }
     const nodes = [];
     function collect(node, parentId, index) {
       if (node.nodeType !== 1 && node.nodeType !== 3) return null;
@@ -1552,21 +2294,12 @@ export async function analyze({
       source: page.source,
       documentKey,
     });
-    for (const branch of branches.slice(0, 30)) {
-      const key = identity("state", {
-        page: pageKey,
-        source: branch.source,
-        label: branch.label,
-      });
-      if (!states.some((s) => s.stateKey === key)) {
-        states.push({
-          stateKey: key,
-          pageKey,
-          label: branch.label,
-          evidence: branch.evidence,
-          source: branch.source,
-          documentKey: null,
-        });
+    // Unknown source alternatives live in ui.conditions. Representable local
+    // state candidates remain separate from concrete source documents.
+    for (const branch of branches.filter(b=>b.evidence==='source_inferred').slice(0, 30)) {
+      const key = identity("state", {page:pageKey,source:branch.source,label:branch.label});
+      if(!states.some(state=>state.stateKey===key)){
+        states.push({stateKey:key,pageKey,label:branch.label,evidence:branch.evidence,source:branch.source,documentKey:null});
         page.stateKeys.push(key);
       }
     }
@@ -1595,7 +2328,7 @@ export async function analyze({
     for (const node of doc.nodes) {
       if (
         node.kind !== "element" ||
-        !["a", "button", "form"].includes(node.tag)
+        node.tag !== "a"
       )
         continue;
       const href = node.attributes.href || "",
@@ -1629,9 +2362,18 @@ export async function analyze({
       });
     }
   const packagedAssets = [];
+  inventory.push(...await referencedRasterSources(root,assets.keys()));
   for (const [url] of assets) {
     gap("PUBLIC_ASSET_NOT_PACKAGED", "public", url + ": requires an explicit public-asset build input");
   }
+  // Only statically imported styles belong to the source entry's default presentation.
+  const styleFiles=new Map(cssSources.map(s=>[s.file,s])),activeStyles=new Map();
+  const visitStyle=file=>{const style=styleFiles.get(file);if(!style||activeStyles.has(file))return;activeStyles.set(file,style);for(const match of style.text.matchAll(/@import\s+["']([^"']+)["']/g))if(match[1].startsWith('.'))visitStyle(path.posix.normalize(path.posix.join(path.posix.dirname(file),match[1])));};
+  for(const module of selection.discoveryModules.values())for(const statement of module.source.statements)if(ts.isImportDeclaration(statement)&&statement.moduleSpecifier&&ts.isStringLiteral(statement.moduleSpecifier)){
+    const spec=statement.moduleSpecifier.text;if(spec.endsWith('.css')&&spec.startsWith('.'))visitStyle(path.posix.normalize(path.posix.join(path.posix.dirname(module.file),spec)));
+  }
+  const sourceStyles=[...activeStyles.values()],sourceThemes=sourceStyles.flatMap(s=>[...s.text.matchAll(/@theme(?:\s+inline)?\s*\{([^{}]*)\}/g)].map(m=>m[0])).join('\n');
+  const color=t=>sourceStyles.some(s=>new RegExp('--'+t+':\\s*(?:oklch|oklab|rgb|hsl|lab|lch|color|var)\\(|--'+t+':\\s*#').test(s.text))?'var(--'+t+')':'hsl(var(--'+t+'))';
   let css = "";
   try {
     const tw = dependency("tailwindcss");
@@ -1662,16 +2404,16 @@ export async function analyze({
     ];
     const custom =
       "@theme inline {" +
-      tokens.map((t) => "--color-" + t + ":hsl(var(--" + t + "));").join("") +
+      tokens.map((t) => "--color-" + t + ":" + color(t) + ";").join("") +
       "--font-heading: ui-sans-serif,system-ui;--radius-lg:var(--radius);--radius-md:calc(var(--radius) - 2px);}";
     const compile = await tw.value.compile(
-      theme + "\n" + custom + "\n@tailwind utilities;",
+      theme + "\n" + custom + "\n" + sourceThemes + "\n@tailwind utilities;",
     );
     css = compile.build([...allClasses].sort());
   } catch (error) {
     gap("STYLE_COMPILER", "", error.message);
   }
-  const vars = cssSources
+  const vars = sourceStyles
     .flatMap((s) =>
       [...s.text.matchAll(/(?::root|\.dark)\s*\{([^{}]*)\}/g)].map(
         (m) => m[0],
@@ -1681,7 +2423,7 @@ export async function analyze({
   css +=
     "\n" +
     vars +
-    "\n*{box-sizing:border-box;border-color:hsl(var(--border));border-style:solid;border-width:0}body{margin:0;font-family:ui-sans-serif,system-ui,sans-serif;color:hsl(var(--foreground));background:hsl(var(--background))}h1,h2,h3,p,ul,ol{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a{cursor:pointer}button{background:transparent}svg{display:block}img{max-width:100%;height:auto}.container{width:100%;max-width:1400px;padding-inline:2rem;margin-inline:auto}.iam-icon{display:inline-flex;align-items:center;justify-content:center;width:1.1em;height:1.1em}.iam-page{min-height:100vh}.iam-placeholder{padding:1rem;border:1px dashed #d4d4d4}";
+    "\n*{box-sizing:border-box;border-color:"+color("border")+";border-style:solid;border-width:0}[hidden]{display:none!important}body{margin:0;font-family:ui-sans-serif,system-ui,sans-serif;color:"+color("foreground")+";background:"+color("background")+"}h1,h2,h3,p,ul,ol{margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button,a{cursor:pointer}button{background:transparent}svg{display:block}img{max-width:100%;height:auto}.container{width:100%;max-width:1400px;padding-inline:2rem;margin-inline:auto}.iam-icon{display:inline-flex;align-items:center;justify-content:center;width:1.1em;height:1.1em}.iam-page{min-height:100vh}.iam-placeholder{padding:1rem;border:1px dashed #d4d4d4}";
   const runtime = await fs.readFile(
     new URL("../assets/document-runtime.js", import.meta.url),
     "utf8",
@@ -1697,6 +2439,16 @@ export async function analyze({
     doc.js = runtime;
     sealDocument(doc);
   }
+  // Inventory every source file, but serialize UI definitions reachable from
+  // projected routes (including retained alternatives and shared fragments).
+  const liveElements=new Set([...documents.flatMap(d=>d.nodes.map(n=>n.elementKey)),...presentation.fragments.flatMap(f=>f.sourceElements)]);
+  for(const key of elements.keys())if(!liveElements.has(key))elements.delete(key);
+  const liveComponents=new Set([...pages.flatMap(p=>p.componentKeys),...[...elements.values()].map(e=>e.componentKey)]);
+  const compositionFiles=new Set(renderDefinitions.flatMap(d=>flattenComposition(d.composition).flatMap(entry=>[entry.file,...entry.layers.map(layer=>layer.file)])));
+  for(const component of components.values())if(compositionFiles.has(component.file))liveComponents.add(component.componentKey);
+  const retainComponent=key=>{const c=components.get(key);if(!c)return;for(const dep of c.dependencies)if(!liveComponents.has(dep)){liveComponents.add(dep);retainComponent(dep);}};
+  for(const key of [...liveComponents])retainComponent(key);
+  for(const key of components.keys())if(!liveComponents.has(key))components.delete(key);
   const sourceGraphDigest = hashObject("iam/source-graph/v1", {
     files: inventory,
     components: [...components.values()],
@@ -1706,8 +2458,8 @@ export async function analyze({
     schemaVersion: 2,
     producer: {
       name: "indiana-app-manifest-local",
-      version: "0.17.0",
-      method: "typescript-ast-and-bounded-static-projection",
+      version: "0.24.0",
+      method: "typescript-ast-and-bounded-static-projection;lucide-static-"+LUCIDE_SOURCE_VERSION,
     },
     app: { name, platforms: ["web"] },
     routing,
@@ -1740,7 +2492,29 @@ export async function analyze({
   ui.bindings = ui.bindings.filter(b => concrete.has(b.nodeId));
   ui.transitions = ui.transitions.filter(t => concrete.has(t.trigger.nodeId));
   for (const doc of documents) for (const node of doc.nodes) if (node.kind === "element" && ["button", "form", "input", "select", "textarea"].includes(node.tag) && !ui.transitions.some(t => t.trigger.nodeId === node.nodeId)) ui.uncovered.push({ routeKey: doc.pageKey, nodeId: node.nodeId, event: "source-event", reason: "No supported UI-only handler; business callbacks are not executed", source: node.source });
+  // State with no representable UI read/write has no preview effect.
+  const usedVariables=new Set([...ui.bindings.flatMap(b=>readVariables(b.value)),...ui.transitions.flatMap(t=>[...t.stateReads,...t.stateWrites.map(w=>w.variableKey)]),...[...presentation.tabs,...presentation.regions,...presentation.collections].map(t=>t.variableKey).filter(Boolean),...presentation.collections.flatMap(c=>c.requires.map(r=>r.variableKey))]);
+  ui.variables=ui.variables.filter(v=>usedVariables.has(v.variableKey));
+  // Repeated instances of the same unsupported source control share one source gap.
+  const sourceGaps=new Map();
+  for(const row of ui.uncovered){const key=JSON.stringify([row.routeKey,row.source,row.event,row.reason]);const prior=sourceGaps.get(key);if(prior)prior.nodeId=null;else sourceGaps.set(key,{...row});}
+  ui.uncovered=[...sourceGaps.values()];
   manifest.routeTree = assembleRouteTree(manifest, ui, renderDefinitions, compositions.navigation);
+  presentation.conditions=[...new Map(presentation.conditions.map(c=>[c.conditionKey,c])).values()];
+  presentation.regions=presentation.regions.filter(r=>concrete.has(r.nodeId)&&r.options.every(o=>concrete.has(o.nodeId)));
+  presentation.tabs=presentation.tabs.filter(t=>concrete.has(t.nodeId)&&t.items.length&&t.items.every(i=>concrete.has(i.nodeId)));
+  presentation.attributes=presentation.attributes.filter(a=>concrete.has(a.nodeId));presentation.attributeSets=presentation.attributeSets.filter(s=>presentation.attributes.some(a=>a.setKey===s.setKey));
+  presentation.navigation=sourceRedirects({ts,modules,binding,functionFrom,externalImport,sourceLocation,constant:(node,module)=>{const result=evalExpression(node,module,{});return isUnknown(result)?undefined:result;},pages,components:[...components.values()],documents});
+  manifest.routeTree=attachUiStructure(manifest.routeTree,presentation,documents);
+  // Discarded adapter children have no concrete UI. Keep every document and
+  // shared-fragment mapping, but do not serialize unreachable element records.
+  const referencedElements=new Set([...documents.flatMap(d=>d.nodes.map(n=>n.elementKey)),...presentation.fragments.flatMap(f=>f.sourceElements)]);
+  manifest.elements=manifest.elements.filter(element=>referencedElements.has(element.elementKey));
+  // Each navigation row references its exact existing interaction. The original
+  // interaction ID remains in the authoritative array, instead of being repeated.
+  const interactionIndices=new Map(manifest.interactions.map((row,index)=>[row.interactionKey,index]));
+  for(const row of manifest.routeTree.navigation)row.interactionKey=interactionIndices.get(row.interactionKey);
+  internGraphSources(manifest.routeTree);
   manifest.integrity.routeTreeDigest = routeIndexDigest(manifest.routeTree);
   const concreteNodes = new Map(documents.flatMap(doc => doc.nodes.map(node => [node.nodeId, node])));
   for (const target of manifest.routeTree.targets) {