@tsrx/core 0.1.24 → 0.1.26

package/src/transform/jsx-hoist.js

@@ -112,6 +112,12 @@ export function is_hoist_safe_jsx_node(node) {
 		return node.children.every(is_hoist_safe_jsx_child);
 	}
 
+	// Lowered dynamic tags reference a component-scoped const and resolve at
+	// runtime — never static, never hoistable.
+	if (/** @type {any} */ (node).metadata?.dynamicElement === true) {
+		return false;
+	}
+
 	return (
 		node.openingElement.attributes.every(is_hoist_safe_jsx_attribute) &&
 		node.children.every(is_hoist_safe_jsx_child)

package/src/transform/jsx-interleave.js

@@ -43,6 +43,10 @@ export function is_interleaved_body(body_nodes, is_jsx_child) {
  */
 export function is_capturable_jsx_child(jsx) {
 	if (!jsx) return false;
+	// Reactive-block containers (dynamic tags) must stay expression children
+	// so the host JSX compiler wraps them in a render block; capturing them
+	// into a const would evaluate them once.
+	if (jsx.metadata?.tsrx_reactive_block === true) return false;
 	const t = jsx.type;
 	return t === 'JSXElement' || t === 'JSXFragment' || t === 'JSXExpressionContainer';
 }

package/src/transform/scoping.js

@@ -75,15 +75,19 @@ export function annotate_with_hash(
 ) {
 	if (!node || typeof node !== 'object') return node;
 	if (
-		node.type === 'FunctionDeclaration' ||
-		node.type === 'FunctionExpression' ||
-		node.type === 'ArrowFunctionExpression'
+		(node.type === 'FunctionDeclaration' ||
+			node.type === 'FunctionExpression' ||
+			node.type === 'ArrowFunctionExpression') &&
+		// Generated dynamic-tag wrappers are render-block closures, not user
+		// component boundaries — the element inside still belongs to this
+		// component's scoped CSS.
+		node.metadata?.tsrx_dynamic_wrapper !== true
 	) {
 		return node;
 	}
 
 	if (node.type === 'JSXElement') {
-		if (!is_composite_jsx_element(node) || node.metadata?.runtime_dynamic_element) {
+		if (!is_composite_jsx_element(node) || node.metadata?.dynamicElement) {
 			add_hash_class_to_jsx_element(node, hash, jsx_class_attr_name);
 		}
 		if (Array.isArray(node.children)) {

package/src/transform/segments.js

@@ -27,6 +27,7 @@
 	generated: string;
 	loc: AST.SourceLocation;
 	metadata: PluginActionOverrides;
+	generatedLoc?: AST.SourceLocation;
 	end_loc?: AST.SourceLocation;
 	sourceLength?: number;
 	mappingData?: Partial<VolarCodeMapping['data']>;
@@ -387,7 +388,8 @@ export function convert_source_map_to_mappings(
 	 * @returns {{ line: number; column: number }}
 	 */
 	function get_generated_position_for_token(token) {
-		const key = `${token.loc.start.line}:${token.loc.start.column}`;
+		const generated_loc = token.generatedLoc ?? token.loc;
+		const key = `${generated_loc.start.line}:${generated_loc.start.column}`;
 		const positions = src_to_gen_map.get(key);
 		if (!positions || positions.length === 0) {
 			throw new Error(`No source map entry for position "${key}"`);
@@ -478,6 +480,32 @@ export function convert_source_map_to_mappings(
 		}
 	}
 
+	/**
+	 * @param {any} generated_node
+	 * @returns {void}
+	 */
+	function add_extra_source_mapping_tokens(generated_node) {
+		if (!generated_node?.loc || !Array.isArray(generated_node.metadata?.extra_source_mappings)) {
+			return;
+		}
+
+		for (const source_node of generated_node.metadata.extra_source_mappings) {
+			if (!source_node?.loc) continue;
+
+			tokens.push({
+				source: source_node.name ?? generated_node.name,
+				generated: generated_node.name,
+				loc: source_node.loc,
+				generatedLoc: generated_node.loc,
+				metadata: {},
+				sourceLength:
+					typeof source_node.start === 'number' && typeof source_node.end === 'number'
+						? source_node.end - source_node.start
+						: undefined,
+			});
+		}
+	}
+
 	// We have to visit everything in generated order to maintain correct indices
 
 	walk(ast, null, {
@@ -521,6 +549,7 @@ export function convert_source_map_to_mappings(
 						token.mappingData = { ...mapping_data, verification: false };
 					}
 					tokens.push(token);
+					add_extra_source_mapping_tokens(node);
 
 					if (Array.isArray(node.metadata?.lazy_param_binding_mappings)) {
 						for (const binding_mapping of node.metadata.lazy_param_binding_mappings) {
@@ -558,6 +587,7 @@ export function convert_source_map_to_mappings(
 						token.mappingData = { ...mapping_data, verification: false };
 					}
 					tokens.push(token);
+					add_extra_source_mapping_tokens(node);
 				}
 				return; // Leaf node, don't traverse further
 			} else if (node.type === 'Literal') {

package/types/index.d.ts

@@ -84,7 +84,7 @@ interface BaseNodeMetaData {
 	parenthesized?: boolean;
 	native_tsrx?: boolean;
 	native_tsrx_template_block?: boolean;
-	runtime_dynamic_element?: boolean;
+	dynamicElement?: boolean;
 	templateMode?: 'script' | 'template';
 	script_only?: boolean;
 	tsrxDirective?: 'if' | 'for' | 'switch' | 'try';
@@ -118,7 +118,6 @@ interface BaseNodeMetaData {
 interface FunctionMetaData extends BaseNodeMetaData {
 	native_tsrx?: boolean;
 	native_tsrx_function?: boolean;
-	hook_split?: boolean;
 	is_method?: boolean;
 	tracked?: boolean;
 	has_lazy_descendants?: boolean;
@@ -183,7 +182,6 @@ declare module 'estree' {
 
 	interface BlockStatement {
 		metadata: BaseNodeMetaData & {
-			hook_split_block?: boolean;
 			native_return_block?: boolean;
 			native_tsrx_template_block?: boolean;
 			allows_native_return?: boolean;
@@ -301,13 +299,14 @@ declare module 'estree' {
 
 	interface Element extends AST.BaseExpression {
 		type: 'Element';
-		id: AST.Identifier | AST.MemberExpression | AST.Literal;
+		id: AST.Expression;
 		attributes: Array<Attribute | SpreadAttribute>;
 		children: AST.Node[];
 		openingElement: ESTreeJSX.JSXOpeningElement;
 		closingElement: ESTreeJSX.JSXClosingElement | null;
 		selfClosing?: boolean;
 		unclosed?: boolean;
+		isDynamic?: boolean;
 		css?: string;
 		metadata: BaseNodeMetaData;
 		start: number;
@@ -729,6 +728,7 @@ declare module 'estree-jsx' {
 	interface JSXExpressionContainer {
 		text?: boolean;
 		style?: boolean;
+		isDynamic?: boolean;
 	}
 
 	interface JSXMemberExpression {

package/types/jsx-platform.d.ts

@@ -39,6 +39,8 @@ export interface JsxTransformContext {
 	needs_normalize_spread_props: boolean;
 	needs_normalize_spread_props_for_ref_attr: boolean;
 	needs_fragment: boolean;
+	needs_dynamic_element: boolean;
+	needs_dynamic_factory: boolean;
 	needs_for_of_iterable: boolean;
 	needs_iteration_value_type: boolean;
 	stylesheets: AST.CSS.StyleSheet[];
@@ -53,8 +55,6 @@ export interface JsxTransformContext {
 	hook_helpers_enabled: boolean;
 	available_bindings: Map<string, AST.Identifier>;
 	lazy_next_id: number;
-	/** Scope map used to resolve runtime Dynamic imports for scoped CSS pruning. */
-	runtime_dynamic_scopes: Map<any, any> | null;
 	inside_element_child?: boolean;
 	/** Full source text for source-aware diagnostics. */
 	source: string;
@@ -102,7 +102,7 @@ export interface JsxTransformOptions {
 	comments?: AST.CommentWithLocation[];
 	/**
 	 * Override whether hook-isolation helper components are emitted directly at
-	 * module scope. React runtime compilation enables this, while editor tooling
+	 * module scope. Some runtime targets enable this, while editor tooling
 	 * can disable it to preserve lexical `typeof` helper prop types.
 	 */
 	moduleScopedHookComponents?: boolean;
@@ -160,15 +160,10 @@ export interface JsxPlatformHooks {
 	/**
 	 * Emit hook-isolation helper components as unique module-scope declarations
 	 * instead of lazily creating and caching them from the parent component body.
-	 * React enables this so generated branches stay compatible with the React
-	 * Compiler's Rules of Hooks validation.
+	 * Targets that use compiler-generated branch helpers enable this so helper
+	 * declarations are shared across renders.
 	 */
 	moduleScopedHookComponents?: boolean;
-	/**
-	 * Split ordinary uppercase function component bodies when an early
-	 * conditional return would make later React/Preact hooks conditional.
-	 */
-	componentBodyHookHelpers?: boolean;
 	/**
 	 * Inject module-level imports after the main walk. Default: import
 	 * `Suspense` from `platform.imports.suspense` and `TsrxErrorBoundary`
@@ -321,11 +316,30 @@ export interface JsxPlatform {
 		 */
 		suspense: string;
 		/**
-		 * Module that exports the target runtime `Dynamic` component. When set,
-		 * the shared JSX transform treats imported `Dynamic` elements with an
-		 * `is` prop as runtime-dynamic for scoped CSS pruning.
+		 * Module the type-only transform imports the `Dynamic` component type
+		 * from when lowering dynamic tags to `<TsrxDynamic is={expr}>`. The
+		 * module only needs type declarations; production output never imports
+		 * it.
 		 */
 		dynamic?: string;
+		/**
+		 * Scoped-binding lowering for dynamic tags (`<{expr}>`) in production
+		 * output; each tag binds a scoped component const referenced like an
+		 * ordinary component. With `name`/`source`, the factory is imported as
+		 * `_tsrx_dynamic` and wraps the tag expression in a reactive thunk:
+		 * `const TsrxDynamic_N = _tsrx_dynamic(() => expr);` (Solid:
+		 * `{ name: 'dynamic', source: '@solidjs/web' }`). With an empty object,
+		 * the const is a plain import-free alias re-evaluated by the host's
+		 * render cycle: `const TsrxDynamic_N = expr;` (React/Preact). With
+		 * `renderBlock: true`, the alias and element move inside an
+		 * expression-child IIFE,
+		 * `{(() => { const TsrxDynamic_N = expr; return <TsrxDynamic_N ...>; })()}`,
+		 * relying on the host JSX compiler's reactive render block for
+		 * expression children (Vue Vapor, which never re-runs setup). In
+		 * type-only output, dynamic tags always lower to
+		 * `<TsrxDynamic is={expr}>` imported from `imports.dynamic`.
+		 */
+		dynamicFactory?: { name?: string; source?: string; renderBlock?: boolean };
 		/**
 		 * Module to import `TsrxErrorBoundary` from when an `@try { ... } @catch (...)`
 		 * block appears. Usually `'@tsrx/<platform>/error-boundary'`.

package/types/parse.d.ts

@@ -1621,11 +1621,13 @@ export namespace Parse {
 			| ReturnType<Parser['jsx_parseIdentifier']>;
 
 		/**
-		 * Parse JSX element name (identifier, member, namespaced)
+		 * Parse JSX element name (identifier, member, namespaced, or a dynamic
+		 * `{expression}` container)
 		 */
 		jsx_parseElementName():
 			| ESTreeJSX.JSXMemberExpression
 			| ReturnType<Parser['jsx_parseNamespacedName']>
+			| ESTreeJSX.JSXExpressionContainer
 			| '';
 
 		/**