@tsrx/core 0.1.22 → 0.1.25

package/src/transform/jsx/index.js

@@ -7,6 +7,7 @@ import { print } from 'esrap';
 import { error } from '../../errors.js';
 import { analyze_css } from '../../analyze/css-analyze.js';
 import { prune_css } from '../../analyze/prune.js';
+import { create_scopes, ScopeRoot } from '../../scope.js';
 import {
 	in_jsx_child_context,
 	set_node_path_metadata,
@@ -25,7 +26,6 @@ import {
 	is_bare_render_expression,
 	is_component_jsx_name,
 	is_jsx_child,
-	jsx_name_to_expression,
 	set_loc,
 	to_text_expression,
 } from './ast-builders.js';
@@ -49,7 +49,6 @@ import {
 	create_style_ref_setup_statements,
 	get_style_element_stylesheet,
 } from '../style-ref.js';
-import { is_function_or_component_node } from '../../utils/ast.js';
 import {
 	is_interleaved_body as is_interleaved_body_core,
 	is_capturable_jsx_child,
@@ -57,14 +56,10 @@ import {
 } from '../jsx-interleave.js';
 import { is_hoist_safe_jsx_node } from '../jsx-hoist.js';
 
-const HOOK_OUTER_ASSIGNMENT_ERROR =
-	'Hook calls inside conditional or repeated TSRX scopes must keep their results local to the generated hook component.';
-const HOOK_CALLBACK_OUTER_MUTATION_ERROR =
-	'Hook callbacks inside conditional or repeated TSRX scopes must not mutate bindings declared outside the generated hook component.';
 const TEMPLATE_FRAGMENT_ERROR =
 	'JSX fragment syntax is not needed in TSRX templates. TSRX renders in immediate mode, so everything is already a fragment. Use `<>...</>` only in expression position.';
 const TSRX_FOR_RETURN_ERROR =
-	'Return statements are not allowed inside TSRX template for...of loops. Filter the iterable before rendering or use an @for empty fallback for empty lists.';
+	'Return statements are not allowed inside TSRX template for...of loops. Filter the iterable before rendering or use an @empty fallback for empty lists.';
 const TSRX_FOR_BREAK_ERROR =
 	'Break statements are not allowed inside TSRX template for...of loops.';
 const TSRX_FOR_CONTINUE_ERROR =
@@ -89,44 +84,6 @@ function report_jsx_fragment_in_tsrx_error(node, transform_context) {
 	);
 }
 
-/**
- * @param {AST.Node} node
- * @param {string[]} names
- * @param {string} hook_name
- * @param {TransformContext} transform_context
- * @returns {void}
- */
-function report_hook_outer_assignment_error(node, names, hook_name, transform_context) {
-	const target =
-		names.length === 1 ? `\`${names[0]}\`` : names.map((name) => `\`${name}\``).join(', ');
-	error(
-		`${HOOK_OUTER_ASSIGNMENT_ERROR} The ${hook_name} result is assigned to ${target}, which is declared outside that generated component. Declare the hook result inside the TSRX branch, or move the hook into an explicit child component and pass values with props.`,
-		transform_context.filename,
-		node,
-		transform_context.errors,
-		transform_context.comments,
-	);
-}
-
-/**
- * @param {AST.Node} node
- * @param {string[]} names
- * @param {string} hook_name
- * @param {TransformContext} transform_context
- * @returns {void}
- */
-function report_hook_callback_outer_mutation_error(node, names, hook_name, transform_context) {
-	const target =
-		names.length === 1 ? `\`${names[0]}\`` : names.map((name) => `\`${name}\``).join(', ');
-	error(
-		`${HOOK_CALLBACK_OUTER_MUTATION_ERROR} The ${hook_name} callback mutates ${target}. Read outer values through props or dependencies, and move mutable state into an explicit child component when it needs to change over time.`,
-		transform_context.filename,
-		node,
-		transform_context.errors,
-		transform_context.comments,
-	);
-}
-
 /**
  * Local alias for the shared `JsxTransformContext`. Kept as a typedef so the
  * rest of this file's `@param {TransformContext}` annotations don't all have
@@ -223,6 +180,86 @@ function expand_child_code_blocks(node, seen = new Set()) {
 	}
 }
 
+/**
+ * A `@`-prefixed JSX control-flow expression (`@if`/`@for`/`@switch`/`@try`).
+ * These are the only control-flow nodes that can appear in expression position;
+ * the plain statement forms (`IfStatement`, `SwitchStatement`, …) never do.
+ * @param {any} node
+ * @returns {boolean}
+ */
+function is_jsx_control_flow_expression(node) {
+	return (
+		node?.type === 'JSXIfExpression' ||
+		node?.type === 'JSXForExpression' ||
+		node?.type === 'JSXSwitchExpression' ||
+		node?.type === 'JSXTryExpression'
+	);
+}
+
+/**
+ * Wrap a render-output node in a native TSRX fragment so it flows through the
+ * same single-child render path as a `<> … </>` output.
+ * @param {any} node
+ * @returns {any}
+ */
+function wrap_in_native_tsrx_fragment(node) {
+	const fragment = b.jsx_fragment([node]);
+	fragment.metadata = { ...(fragment.metadata || {}), native_tsrx: true };
+	return fragment;
+}
+
+/**
+ * Wrap a bare JSX control-flow directive that sits directly in an expression
+ * position — an expression-bodied arrow (`() => @switch (…) { … }`), a
+ * `return @switch (…) { … }`, an unused expression statement,
+ * assignment to a variable
+ * (`const x = @switch (…) { … }`, `x = @switch (…) { … }`), or a call/`new`
+ * argument (`render(@if (…) { … })`) — in a native TSRX fragment.
+ * @param {any} node
+ * @param {Set<any>} [seen]
+ * @returns {void}
+ */
+function wrap_control_flow_expression_values(node, seen = new Set()) {
+	if (!node || typeof node !== 'object' || seen.has(node)) return;
+	seen.add(node);
+
+	if (Array.isArray(node)) {
+		for (const item of node) wrap_control_flow_expression_values(item, seen);
+		return;
+	}
+
+	if (
+		node.type === 'ArrowFunctionExpression' &&
+		node.body?.type !== 'BlockStatement' &&
+		is_jsx_control_flow_expression(node.body)
+	) {
+		node.body = wrap_in_native_tsrx_fragment(node.body);
+	} else if (node.type === 'ReturnStatement' && is_jsx_control_flow_expression(node.argument)) {
+		node.argument = wrap_in_native_tsrx_fragment(node.argument);
+	} else if (
+		node.type === 'ExpressionStatement' &&
+		is_jsx_control_flow_expression(node.expression)
+	) {
+		node.expression = wrap_in_native_tsrx_fragment(node.expression);
+	} else if (node.type === 'VariableDeclarator' && is_jsx_control_flow_expression(node.init)) {
+		node.init = wrap_in_native_tsrx_fragment(node.init);
+	} else if (node.type === 'AssignmentExpression' && is_jsx_control_flow_expression(node.right)) {
+		node.right = wrap_in_native_tsrx_fragment(node.right);
+	} else if (
+		(node.type === 'CallExpression' || node.type === 'NewExpression') &&
+		Array.isArray(node.arguments)
+	) {
+		node.arguments = node.arguments.map((/** @type {any} */ arg) =>
+			is_jsx_control_flow_expression(arg) ? wrap_in_native_tsrx_fragment(arg) : arg,
+		);
+	}
+
+	for (const key of Object.keys(node)) {
+		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') continue;
+		wrap_control_flow_expression_values(node[key], seen);
+	}
+}
+
 /**
  * Build a `transform()` function for a specific JSX platform (React, Preact,
  * Solid). Given a `JsxPlatform` descriptor, returns a transform that lowers
@@ -273,6 +310,7 @@ export function createJsxTransform(platform) {
 			hook_helpers_enabled: false,
 			available_bindings: new Map(),
 			lazy_next_id: 0,
+			runtime_dynamic_scopes: null,
 			filename: filename ?? null,
 			source,
 			collect,
@@ -285,6 +323,11 @@ export function createJsxTransform(platform) {
 		};
 
 		expand_child_code_blocks(/** @type {any} */ (ast));
+		wrap_control_flow_expression_values(/** @type {any} */ (ast));
+		transform_context.runtime_dynamic_scopes = create_runtime_dynamic_scopes(
+			/** @type {any} */ (ast),
+			transform_context,
+		);
 
 		if (!transform_context.typeOnly) {
 			preallocate_lazy_ids(/** @type {any} */ (ast), transform_context);
@@ -321,10 +364,6 @@ export function createJsxTransform(platform) {
 			},
 
 			JSXElement(node, { next, path, state }) {
-				if (!node.metadata?.native_tsrx && is_dynamic_jsx_element(node)) {
-					return dynamic_element_to_jsx(node, state, in_jsx_child_context(path));
-				}
-
 				if (!node.metadata?.native_tsrx) {
 					return next() ?? node;
 				}
@@ -464,16 +503,26 @@ export function createJsxTransform(platform) {
  *
  * @param {any} component
  * @param {any} css
+ * @param {TransformContext} transform_context
  * @param {boolean} [export_top_scoped_classes]
  * @returns {void}
  */
-function apply_css_definition_metadata(component, css, export_top_scoped_classes = false) {
+function apply_css_definition_metadata(
+	component,
+	css,
+	transform_context,
+	export_top_scoped_classes = false,
+) {
 	analyze_css(css);
 
 	const metadata = component.metadata || (component.metadata = { path: [] });
 	const style_classes = metadata.styleClasses || (metadata.styleClasses = new Map());
 	const top_scoped_classes = metadata.topScopedClasses || new Map();
-	const elements = collect_css_prunable_elements(component.body || component.children || []);
+	const elements = collect_css_prunable_elements(
+		component.body || component.children || [],
+		[],
+		transform_context,
+	);
 
 	const prune = () => {
 		for (const element of elements) {
@@ -498,16 +547,17 @@ function apply_css_definition_metadata(component, css, export_top_scoped_classes
 /**
  * @param {any} value
  * @param {any[]} [elements]
+ * @param {TransformContext | null} [transform_context]
  * @returns {any[]}
  */
-function collect_css_prunable_elements(value, elements = []) {
+function collect_css_prunable_elements(value, elements = [], transform_context = null) {
 	if (!value || typeof value !== 'object') {
 		return elements;
 	}
 
 	if (Array.isArray(value)) {
 		for (const child of value) {
-			collect_css_prunable_elements(child, elements);
+			collect_css_prunable_elements(child, elements, transform_context);
 		}
 		return elements;
 	}
@@ -521,6 +571,7 @@ function collect_css_prunable_elements(value, elements = []) {
 	}
 
 	if (value.type === 'JSXElement' && value.metadata?.native_tsrx) {
+		mark_runtime_dynamic_element(value, transform_context);
 		if (!is_style_element(value)) {
 			elements.push(value);
 		}
@@ -530,12 +581,247 @@ function collect_css_prunable_elements(value, elements = []) {
 		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata' || key === 'css') {
 			continue;
 		}
-		collect_css_prunable_elements(value[key], elements);
+		collect_css_prunable_elements(value[key], elements, transform_context);
 	}
 
 	return elements;
 }
 
+/**
+ * @param {AST.Program} ast
+ * @param {TransformContext} transform_context
+ * @returns {Map<any, any> | null}
+ */
+function create_runtime_dynamic_scopes(ast, transform_context) {
+	const dynamic_source = transform_context.platform.imports.dynamic;
+	if (!dynamic_source) {
+		return null;
+	}
+	if (!has_runtime_dynamic_import(ast, dynamic_source)) {
+		return null;
+	}
+
+	const { scopes } = create_scopes(ast, new ScopeRoot(), null, {
+		collect: true,
+		errors: [],
+		filename: transform_context.filename ?? '',
+		comments: transform_context.comments,
+	});
+
+	return scopes;
+}
+
+/**
+ * @param {any} node
+ * @param {TransformContext | null} transform_context
+ * @returns {void}
+ */
+function mark_runtime_dynamic_element(node, transform_context) {
+	const dynamic_source = transform_context?.platform.imports.dynamic;
+	const scopes = transform_context?.runtime_dynamic_scopes;
+	if (
+		!dynamic_source ||
+		!scopes ||
+		node.metadata?.runtime_dynamic_element === true ||
+		!has_jsx_attribute(node, 'is') ||
+		!is_runtime_dynamic_jsx_name(node.openingElement?.name, scopes.get(node), dynamic_source)
+	) {
+		return;
+	}
+
+	node.metadata.runtime_dynamic_element = true;
+}
+
+/**
+ * @param {AST.Program} ast
+ * @param {string} dynamic_source
+ * @returns {boolean}
+ */
+function has_runtime_dynamic_import(ast, dynamic_source) {
+	return ast.body.some(
+		(/** @type {any} */ node) =>
+			node.type === 'ImportDeclaration' &&
+			node.importKind !== 'type' &&
+			node.source?.type === 'Literal' &&
+			node.source.value === dynamic_source &&
+			node.specifiers.some(
+				(/** @type {any} */ specifier) =>
+					is_runtime_dynamic_import_specifier(specifier, 'component') ||
+					is_runtime_dynamic_import_specifier(specifier, 'namespace'),
+			),
+	);
+}
+
+/**
+ * @param {any} node
+ * @param {string} name
+ * @returns {boolean}
+ */
+function has_jsx_attribute(node, name) {
+	return (node.openingElement?.attributes ?? []).some(
+		(/** @type {any} */ attr) =>
+			attr.type === 'JSXAttribute' &&
+			attr.name?.type === 'JSXIdentifier' &&
+			attr.name.name === name,
+	);
+}
+
+/**
+ * @param {any} name
+ * @param {any} scope
+ * @param {string} dynamic_source
+ * @returns {boolean}
+ */
+function is_runtime_dynamic_jsx_name(name, scope, dynamic_source) {
+	if (!scope || !name) {
+		return false;
+	}
+
+	if (name.type === 'JSXIdentifier') {
+		return is_runtime_dynamic_binding(scope.get(name.name), dynamic_source, 'component', new Set());
+	}
+
+	if (
+		name.type === 'JSXMemberExpression' &&
+		name.object?.type === 'JSXIdentifier' &&
+		name.property?.type === 'JSXIdentifier' &&
+		name.property.name === 'Dynamic'
+	) {
+		return is_runtime_dynamic_binding(
+			scope.get(name.object.name),
+			dynamic_source,
+			'namespace',
+			new Set(),
+		);
+	}
+
+	return false;
+}
+
+/**
+ * @param {any} binding
+ * @param {string} dynamic_source
+ * @param {'component' | 'namespace'} kind
+ * @param {Set<any>} seen
+ * @returns {boolean}
+ */
+function is_runtime_dynamic_binding(binding, dynamic_source, kind, seen) {
+	if (!binding || seen.has(binding)) {
+		return false;
+	}
+	seen.add(binding);
+
+	if (is_runtime_dynamic_import_binding(binding, dynamic_source, kind)) {
+		return true;
+	}
+
+	if (binding.reassigned) {
+		return false;
+	}
+
+	const initial = unwrap_reference_expression(binding.initial);
+	if (!initial) {
+		return false;
+	}
+
+	if (initial.type === 'Identifier') {
+		return is_runtime_dynamic_binding(binding.scope.get(initial.name), dynamic_source, kind, seen);
+	}
+
+	if (
+		kind === 'component' &&
+		initial.type === 'MemberExpression' &&
+		!initial.computed &&
+		initial.object?.type === 'Identifier' &&
+		initial.property?.type === 'Identifier' &&
+		initial.property.name === 'Dynamic'
+	) {
+		return is_runtime_dynamic_binding(
+			binding.scope.get(initial.object.name),
+			dynamic_source,
+			'namespace',
+			new Set(),
+		);
+	}
+
+	return false;
+}
+
+/**
+ * @param {any} binding
+ * @param {string} dynamic_source
+ * @param {'component' | 'namespace'} kind
+ * @returns {boolean}
+ */
+function is_runtime_dynamic_import_binding(binding, dynamic_source, kind) {
+	const declaration = binding?.initial;
+	if (
+		binding?.declaration_kind !== 'import' ||
+		declaration?.type !== 'ImportDeclaration' ||
+		declaration.importKind === 'type' ||
+		declaration.source?.type !== 'Literal' ||
+		declaration.source.value !== dynamic_source
+	) {
+		return false;
+	}
+
+	return declaration.specifiers.some(
+		(/** @type {any} */ specifier) =>
+			specifier.local?.name === binding.node?.name &&
+			is_runtime_dynamic_import_specifier(specifier, kind),
+	);
+}
+
+/**
+ * @param {any} specifier
+ * @param {'component' | 'namespace'} kind
+ * @returns {boolean}
+ */
+function is_runtime_dynamic_import_specifier(specifier, kind) {
+	if (kind === 'namespace') {
+		return specifier.type === 'ImportNamespaceSpecifier';
+	}
+	return (
+		specifier.type === 'ImportSpecifier' &&
+		specifier.importKind !== 'type' &&
+		get_imported_name(specifier) === 'Dynamic'
+	);
+}
+
+/**
+ * @param {any} specifier
+ * @returns {string | null}
+ */
+function get_imported_name(specifier) {
+	const imported = specifier.imported;
+	if (imported?.type === 'Identifier') {
+		return imported.name;
+	}
+	if (imported?.type === 'Literal') {
+		return String(imported.value);
+	}
+	return null;
+}
+
+/**
+ * @param {any} expression
+ * @returns {any}
+ */
+function unwrap_reference_expression(expression) {
+	let node = expression;
+	while (
+		node &&
+		(node.type === 'TSAsExpression' ||
+			node.type === 'TSTypeAssertion' ||
+			node.type === 'TSNonNullExpression' ||
+			node.type === 'ParenthesizedExpression' ||
+			node.type === 'ChainExpression')
+	) {
+		node = node.expression;
+	}
+	return node;
+}
+
 /**
  * @param {any[]} body_nodes
  * @param {TransformContext} transform_context
@@ -598,7 +884,7 @@ function build_render_statements(body_nodes, return_null_when_empty, transform_c
 					(node) =>
 						!is_loop_skip_return_statement(node) &&
 						!is_loop_skip_if_statement(node) &&
-						!is_jsx_child(node),
+						!is_render_child_node(node),
 				);
 
 				if (!continuation_has_setup_statements) {
@@ -640,7 +926,7 @@ function build_render_statements(body_nodes, return_null_when_empty, transform_c
 		}
 
 		if (
-			is_for_of_control_node(child) &&
+			is_template_for_of_node(child) &&
 			!child.await &&
 			should_extract_hook_helpers(transform_context) &&
 			!transform_context.platform.hooks?.isTopLevelSetupCall &&
@@ -668,7 +954,7 @@ function build_render_statements(body_nodes, return_null_when_empty, transform_c
 			}
 		}
 
-		if (is_jsx_child(child)) {
+		if (is_render_child_node(child)) {
 			const jsx = to_jsx_child(child, transform_context);
 			statements.push(...extract_jsx_setup_declarations(jsx));
 			if (interleaved && is_capturable_jsx_child(jsx)) {
@@ -705,189 +991,49 @@ function build_render_statements(body_nodes, return_null_when_empty, transform_c
  * @returns {boolean}
  */
 function is_interleaved_body(body_nodes) {
-	return is_interleaved_body_core(body_nodes, is_jsx_child);
+	return is_interleaved_body_core(body_nodes, is_render_child_node);
 }
 
 /**
- * @param {any} node
+ * @param {any[]} body_nodes
  * @param {TransformContext} transform_context
+ * @param {boolean} include_platform_setup
  * @returns {boolean}
  */
-function needs_hook_split(node, transform_context) {
-	return (
-		transform_context.platform.hooks?.componentBodyHookHelpers === true &&
-		node.body?.type === 'BlockStatement' &&
-		find_hook_split_index(node.body.body || [], transform_context) !== -1
+function body_contains_top_level_hook_call(
+	body_nodes,
+	transform_context,
+	include_platform_setup = false,
+) {
+	return body_nodes.some((node) =>
+		statement_contains_top_level_hook_call(node, transform_context, include_platform_setup),
 	);
 }
 
 /**
  * @param {any} node
  * @param {TransformContext} transform_context
- * @returns {any}
- */
-function create_hook_split_block(node, transform_context) {
-	if (
-		transform_context.platform.hooks?.componentBodyHookHelpers !== true ||
-		!should_extract_hook_helpers(transform_context) ||
-		node.body?.type !== 'BlockStatement'
-	) {
-		return null;
-	}
-
-	const body = node.body.body || [];
-	const split_index = find_hook_split_index(body, transform_context);
-	if (split_index === -1) {
-		return null;
-	}
-
-	const split_statement = body[split_index];
-	const continuation_body = body.slice(split_index + 1);
-	const helper = create_hook_safe_helper(
-		expand_native_tsrx_return_statement_list(continuation_body, transform_context),
-		undefined,
-		get_body_source_node(continuation_body) || split_statement,
-		transform_context,
-	);
-
-	const block = b.block(
-		[
-			...body.slice(0, split_index + 1),
-			...helper.setup_statements,
-			set_loc(b.return(helper.component_element), split_statement),
-		],
-		node.body,
-	);
-	block.metadata = {
-		...(block.metadata || {}),
-		hook_split_block: true,
-	};
-	return block;
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {TransformContext} transform_context
- * @returns {number}
+ * @param {boolean} include_platform_setup
+ * @returns {boolean}
  */
-function find_hook_split_index(body_nodes, transform_context) {
-	for (let i = 0; i < body_nodes.length; i += 1) {
-		if (!is_component_body_conditional_return_statement(body_nodes[i])) {
-			continue;
-		}
-
-		if (body_contains_top_level_hook_call(body_nodes.slice(i + 1), transform_context, true)) {
-			return i;
-		}
-	}
-
-	return -1;
+function statement_contains_top_level_hook_call(node, transform_context, include_platform_setup) {
+	return node_contains_top_level_hook_call(node, false, transform_context, include_platform_setup);
 }
 
 /**
  * @param {any} node
+ * @param {boolean} inside_nested_function
+ * @param {TransformContext} transform_context
+ * @param {boolean} include_platform_setup
  * @returns {boolean}
  */
-function is_component_body_conditional_return_statement(node) {
-	if (!is_if_control_node(node)) {
-		return false;
-	}
-
-	return (
-		statement_contains_component_body_return(node.consequent) ||
-		statement_contains_component_body_return(node.alternate)
-	);
-}
-
-/**
- * @param {any} node
- * @returns {boolean}
- */
-function statement_contains_component_body_return(node) {
-	if (!node || typeof node !== 'object') {
-		return false;
-	}
-
-	if (node.type === 'ReturnStatement') {
-		return true;
-	}
-
-	if (is_function_or_class_boundary(node)) {
-		return false;
-	}
-
-	if (Array.isArray(node)) {
-		return node.some(statement_contains_component_body_return);
-	}
-
-	if (node.type === 'BlockStatement') {
-		return (node.body || []).some(statement_contains_component_body_return);
-	}
-
-	if (is_if_control_node(node)) {
-		return (
-			statement_contains_component_body_return(node.consequent) ||
-			statement_contains_component_body_return(node.alternate)
-		);
-	}
-
-	if (is_switch_control_node(node)) {
-		return (node.cases || []).some((/** @type {any} */ switch_case) =>
-			statement_contains_component_body_return(switch_case.consequent || []),
-		);
-	}
-
-	if (is_try_control_node(node)) {
-		return (
-			statement_contains_component_body_return(node.block) ||
-			statement_contains_component_body_return(node.handler?.body) ||
-			statement_contains_component_body_return(node.finalizer)
-		);
-	}
-
-	return false;
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {TransformContext} transform_context
- * @param {boolean} include_platform_setup
- * @returns {boolean}
- */
-function body_contains_top_level_hook_call(
-	body_nodes,
-	transform_context,
-	include_platform_setup = false,
-) {
-	return body_nodes.some((node) =>
-		statement_contains_top_level_hook_call(node, transform_context, include_platform_setup),
-	);
-}
-
-/**
- * @param {any} node
- * @param {TransformContext} transform_context
- * @param {boolean} include_platform_setup
- * @returns {boolean}
- */
-function statement_contains_top_level_hook_call(node, transform_context, include_platform_setup) {
-	return node_contains_top_level_hook_call(node, false, transform_context, include_platform_setup);
-}
-
-/**
- * @param {any} node
- * @param {boolean} inside_nested_function
- * @param {TransformContext} transform_context
- * @param {boolean} include_platform_setup
- * @returns {boolean}
- */
-function node_contains_top_level_hook_call(
-	node,
-	inside_nested_function,
-	transform_context,
-	include_platform_setup,
-) {
-	if (!node || typeof node !== 'object') {
+function node_contains_top_level_hook_call(
+	node,
+	inside_nested_function,
+	transform_context,
+	include_platform_setup,
+) {
+	if (!node || typeof node !== 'object') {
 		return false;
 	}
 
@@ -1092,7 +1238,7 @@ function create_generated_helper_metadata(helper_state) {
  * @returns {any}
  */
 function strip_function_transform_metadata(metadata) {
-	const { native_tsrx, hook_split, ...next_metadata } = metadata || {};
+	const { native_tsrx, ...next_metadata } = metadata || {};
 	return next_metadata;
 }
 
@@ -1102,19 +1248,11 @@ function strip_function_transform_metadata(metadata) {
  * @returns {any}
  */
 function transform_block_statement(node, { next, visit, state, path }) {
-	if (node.metadata?.hook_split_block || node.metadata?.native_return_block) {
+	if (node.metadata?.native_return_block) {
 		return next() ?? node;
 	}
 
-	const parent = /** @type {any} */ (path.at(-1));
-	if (parent?.metadata?.hook_split && parent.body === node) {
-		const block = create_hook_split_block(parent, state);
-		if (block) {
-			return visit(block, state);
-		}
-	}
-
-	if (get_active_native_tsrx_function(path)) {
+	if (get_active_native_tsrx_function(path)?.metadata?.native_tsrx_body) {
 		const block = create_native_tsrx_statement_list_block(node, state);
 		if (block) {
 			return visit(block, state);
@@ -1130,7 +1268,22 @@ function transform_block_statement(node, { next, visit, state, path }) {
  * @returns {any}
  */
 function transform_return_statement(node, { next, visit, state, path }) {
-	if (get_active_native_tsrx_function(path) && is_native_tsrx_node(node.argument)) {
+	const active_native_tsrx_function = get_active_native_tsrx_function(path);
+	if (active_native_tsrx_function && is_native_tsrx_node(node.argument)) {
+		if (!active_native_tsrx_function.metadata?.native_tsrx_body) {
+			const statements = mark_native_pretransformed_jsx(
+				create_native_tsrx_render_statements(node.argument, state),
+			);
+			if (statements.length === 1) {
+				return visit(statements[0], state);
+			}
+			const block = b.block(statements, node.argument);
+			block.metadata = {
+				...(block.metadata || {}),
+				native_return_block: true,
+			};
+			return visit(block, state);
+		}
 		return visit(create_native_tsrx_render_block(node.argument, state), state);
 	}
 
@@ -1190,10 +1343,17 @@ function transform_function(node, context) {
 	// render output. The parser already marks the render JSX as native_tsrx, so
 	// from here it flows through the existing native-component machinery exactly
 	// like the older fenced `{ return <> … </> }` shape.
+	const has_jsx_code_block_body = node.body?.type === 'JSXCodeBlock';
 	lower_jsx_code_block_function_body(node);
 
-	if (node.metadata?.native_tsrx_function || function_has_native_tsrx_return(node)) {
-		return transform_native_tsrx_function(node, context);
+	if (
+		has_jsx_code_block_body ||
+		node.metadata?.native_tsrx_function ||
+		function_has_native_tsrx_return(node)
+	) {
+		return transform_native_tsrx_function(node, context, {
+			nativeBody: has_jsx_code_block_body || !!node.metadata?.native_tsrx_function,
+		});
 	}
 
 	return transform_function_with_hook_helpers(node, context);
@@ -1230,9 +1390,10 @@ function lower_jsx_code_block_function_body(node) {
 /**
  * @param {any} node
  * @param {{ next: () => any, state: TransformContext }} context
+ * @param {{ nativeBody?: boolean }} [options]
  * @returns {any}
  */
-function transform_native_tsrx_function(node, { next, state }) {
+function transform_native_tsrx_function(node, { next, state }, { nativeBody = false } = {}) {
 	const helper_state =
 		state.helper_state || create_helper_state(get_function_helper_base_name(node));
 	const saved_helper_state = state.helper_state;
@@ -1244,7 +1405,7 @@ function transform_native_tsrx_function(node, { next, state }) {
 	node.metadata = {
 		...(node.metadata || {}),
 		native_tsrx: true,
-		...(needs_hook_split(node, state) ? { hook_split: true } : {}),
+		...(nativeBody ? { native_tsrx_body: true } : {}),
 	};
 	state.available_bindings = merge_binding_maps(
 		saved_bindings,
@@ -1270,6 +1431,7 @@ function transform_native_tsrx_function(node, { next, state }) {
 	inner.metadata = {
 		...strip_function_transform_metadata(inner.metadata),
 		native_tsrx_function: true,
+		...(nativeBody ? { native_tsrx_body: true } : {}),
 		...(!saved_helper_state ? create_generated_helper_metadata(helper_state) || {} : {}),
 	};
 
@@ -1395,13 +1557,12 @@ function find_native_await_in_statement(statement) {
  * @returns {any}
  */
 function transform_function_with_hook_helpers(node, { next, state }) {
+	if (!state.platform.hooks?.moduleScopedHookComponents) {
+		return next() ?? node;
+	}
+
 	const has_hook_bearing_tsrx = function_contains_hook_bearing_tsrx(node, state);
-	const has_hook_split = needs_hook_split(node, state);
-	if (
-		state.helper_state ||
-		!is_uppercase_function_like(node) ||
-		(!has_hook_bearing_tsrx && !has_hook_split)
-	) {
+	if (state.helper_state || !is_uppercase_function_like(node) || !has_hook_bearing_tsrx) {
 		return next() ?? node;
 	}
 
@@ -1412,12 +1573,6 @@ function transform_function_with_hook_helpers(node, { next, state }) {
 
 	state.helper_state = helper_state;
 	state.hook_helpers_enabled = true;
-	if (has_hook_split) {
-		node.metadata = {
-			...(node.metadata || {}),
-			hook_split: true,
-		};
-	}
 	state.available_bindings = collect_function_scope_bindings(node);
 
 	const inner = /** @type {any} */ (next() ?? node);
@@ -1681,7 +1836,7 @@ function prepare_tsrx_fragment_styles(node, transform_context) {
 	if (!css) return null;
 
 	const style_refs = collect_style_ref_attributes(node);
-	apply_css_definition_metadata(node, css, style_refs.length > 0);
+	apply_css_definition_metadata(node, css, transform_context, style_refs.length > 0);
 	transform_context.stylesheets.push(css);
 	const fragment = annotate_tsrx_with_hash(
 		node,
@@ -2271,7 +2426,10 @@ function should_use_module_scoped_hook_components(transform_context) {
  * @returns {boolean}
  */
 function should_extract_hook_helpers(transform_context) {
-	return !!transform_context.hook_helpers_enabled;
+	return !!(
+		transform_context.hook_helpers_enabled &&
+		transform_context.platform.hooks?.moduleScopedHookComponents
+	);
 }
 
 /**
@@ -2833,11 +2991,6 @@ function build_hoisted_for_of_with_hooks(node, transform_context) {
 	for (const param of loop_params) {
 		collect_pattern_bindings(param, transform_context.available_bindings);
 	}
-	validate_hook_safe_body_does_not_assign_hook_results_to_outer_bindings(
-		original_loop_body,
-		transform_context,
-		loop_scoped_names,
-	);
 
 	const all_helper_bindings = get_referenced_helper_bindings(
 		original_loop_body,
@@ -3056,7 +3209,7 @@ function to_jsx_element(
 	raw_children = node.children || [],
 	in_jsx_child = false,
 ) {
-	if (node.type === 'JSXElement' && !node.metadata?.native_tsrx && !is_dynamic_jsx_element(node)) {
+	if (node.type === 'JSXElement' && !node.metadata?.native_tsrx) {
 		return node;
 	}
 
@@ -3066,10 +3219,6 @@ function to_jsx_element(
 		report_jsx_fragment_in_tsrx_error(node, transform_context);
 		return set_loc(b.jsx_fragment(), node);
 	}
-	if (is_dynamic_jsx_element(node)) {
-		return dynamic_element_to_jsx(node, transform_context, in_jsx_child);
-	}
-
 	const name = clone_jsx_name(source_name);
 	const attributes = transform_element_attributes_dispatch(
 		source_opening.attributes || [],
@@ -3146,829 +3295,160 @@ function create_element_children(children, transform_context) {
 		}
 	}
 
-	const saved_inside_element_child = transform_context.inside_element_child;
-	transform_context.inside_element_child = true;
-	try {
-		return [statement_body_to_jsx_child(children, transform_context)];
-	} finally {
-		transform_context.inside_element_child = saved_inside_element_child;
-	}
-}
-
-/**
- * @param {any[]} children
- * @returns {boolean}
- */
-function children_contain_return_semantics(children) {
-	return children.some(child_contains_return_semantics);
-}
-
-/**
- * @param {any} node
- * @returns {boolean}
- */
-function child_contains_return_semantics(node) {
-	if (!node || typeof node !== 'object') {
-		return false;
-	}
-
-	if (node.type === 'ReturnStatement') {
-		return true;
-	}
-
-	if (
-		node.type === 'FunctionDeclaration' ||
-		node.type === 'FunctionExpression' ||
-		node.type === 'ArrowFunctionExpression'
-	) {
-		return false;
-	}
-
-	if (Array.isArray(node)) {
-		return node.some(child_contains_return_semantics);
-	}
-
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		if (child_contains_return_semantics(node[key])) {
-			return true;
-		}
-	}
-
-	return false;
-}
-
-/**
- * @param {any} node
- * @returns {boolean}
- */
-function is_inline_element_child(node) {
-	return node && is_jsx_child(node);
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {TransformContext} transform_context
- * @returns {ESTreeJSX.JSXExpressionContainer}
- */
-function statement_body_to_jsx_child(body_nodes, transform_context) {
-	if (
-		should_extract_hook_helpers(transform_context) &&
-		body_contains_top_level_hook_call(body_nodes, transform_context, true)
-	) {
-		return hook_safe_statement_body_to_jsx_child(body_nodes, transform_context);
-	}
-
-	return to_jsx_expression_container(
-		b.call(b.arrow([], b.block(build_render_statements(body_nodes, true, transform_context)))),
-	);
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {TransformContext} transform_context
- * @returns {ESTreeJSX.JSXExpressionContainer}
- */
-function hook_safe_statement_body_to_jsx_child(body_nodes, transform_context) {
-	const source_node = get_body_source_node(body_nodes);
-	const helper = create_hook_safe_helper(body_nodes, undefined, source_node, transform_context);
-
-	return to_jsx_expression_container(
-		create_hook_safe_helper_iife(helper.setup_statements, helper.component_element),
-		source_node,
-	);
-}
-
-/**
- * @param {TransformContext} transform_context
- * @returns {string}
- */
-function create_local_statement_component_name(transform_context) {
-	transform_context.local_statement_component_index += 1;
-	return `StatementBodyHook${transform_context.local_statement_component_index}`;
-}
-
-/**
- * Wraps a list of body nodes into a component and returns
- * statements that return `<ComponentName prop1={prop1} ... />`.
- * Targets can either emit the helper component at module scope or cache the
- * component identity in module state while initializing it from the parent.
- * Used when a control flow branch contains hook calls that must be moved
- * into their own component boundary to satisfy the Rules of Hooks.
- *
- * @param {any[]} body_nodes
- * @param {any} key_expression - Optional key expression to add to the component element (for for-of loops)
- * @param {TransformContext} transform_context
- * @returns {any[]}
- */
-function hook_safe_render_statements(body_nodes, key_expression, transform_context) {
-	const source_node = get_body_source_node(body_nodes);
-	const helper = create_hook_safe_helper(
-		body_nodes,
-		key_expression,
-		source_node,
-		transform_context,
-	);
-	const statements = [...helper.setup_statements];
-
-	statements.push(b.return(helper.component_element));
-
-	return statements;
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {Map<string, AST.Identifier>} available_bindings
- * @returns {AST.Identifier[]}
- */
-function get_referenced_helper_bindings(body_nodes, available_bindings) {
-	const helper_bindings = [];
-	const local_bindings = new Map();
-
-	for (const node of body_nodes) {
-		collect_statement_bindings(node, local_bindings);
-	}
-
-	for (const [name, binding] of available_bindings) {
-		if (local_bindings.has(name)) continue;
-
-		if (references_scope_bindings(body_nodes, new Map([[name, binding]]))) {
-			helper_bindings.push(binding);
-		}
-	}
-
-	return helper_bindings;
-}
-
-/**
- * @param {any[]} body_nodes
- * @param {TransformContext} transform_context
- * @param {Set<string>} [local_binding_names]
- * @returns {void}
- */
-function validate_hook_safe_body_does_not_assign_hook_results_to_outer_bindings(
-	body_nodes,
-	transform_context,
-	local_binding_names,
-) {
-	if (!is_react_like_hook_platform(transform_context)) {
-		return;
-	}
-	if (!body_contains_top_level_hook_call(body_nodes, transform_context, true)) {
-		return;
-	}
-	if (!transform_context.available_bindings || transform_context.available_bindings.size === 0) {
-		return;
-	}
-
-	const shadowed_names = collect_block_binding_names(body_nodes);
-	for (const name of local_binding_names || []) {
-		shadowed_names.add(name);
-	}
-	validate_hook_outer_assignments_in_node(body_nodes, shadowed_names, transform_context, new Set());
-}
-
-/**
- * @param {TransformContext} transform_context
- * @returns {boolean}
- */
-function is_react_like_hook_platform(transform_context) {
-	return (
-		transform_context.platform.name === 'React' || transform_context.platform.name === 'Preact'
-	);
-}
-
-/**
- * @param {any[]} statements
- * @returns {Set<string>}
- */
-function collect_block_binding_names(statements) {
-	const names = new Set();
-	for (const statement of statements || []) {
-		collect_block_binding_names_from_statement(statement, names);
-	}
-	return names;
-}
-
-/**
- * @param {any} statement
- * @param {Set<string>} names
- * @returns {void}
- */
-function collect_block_binding_names_from_statement(statement, names) {
-	if (!statement || typeof statement !== 'object') {
-		return;
-	}
-
-	if (statement.type === 'VariableDeclaration') {
-		for (const declaration of statement.declarations || []) {
-			collect_pattern_names(declaration.id, names);
-		}
-		return;
-	}
-
-	if (
-		(statement.type === 'FunctionDeclaration' || statement.type === 'ClassDeclaration') &&
-		statement.id?.type === 'Identifier'
-	) {
-		names.add(statement.id.name);
-		return;
-	}
-
-	if (
-		statement.type === 'ForOfStatement' ||
-		statement.type === 'ForInStatement' ||
-		(statement.type === 'JSXForExpression' &&
-			(statement.statementType === 'ForOfStatement' ||
-				statement.statementType === 'ForInStatement'))
-	) {
-		if (statement.left?.type === 'VariableDeclaration' && statement.left.kind === 'var') {
-			for (const declaration of statement.left.declarations || []) {
-				collect_pattern_names(declaration.id, names);
-			}
-		}
-		return;
-	}
-
-	if (
-		statement.type === 'ForStatement' &&
-		statement.init?.type === 'VariableDeclaration' &&
-		statement.init.kind === 'var'
-	) {
-		for (const declaration of statement.init.declarations || []) {
-			collect_pattern_names(declaration.id, names);
-		}
-	}
-}
-
-/**
- * @param {any} pattern
- * @param {Set<string>} names
- * @returns {void}
- */
-function collect_pattern_names(pattern, names) {
-	if (!pattern || typeof pattern !== 'object') {
-		return;
-	}
-
-	if (pattern.type === 'Identifier') {
-		names.add(pattern.name);
-		return;
-	}
-
-	if (pattern.type === 'RestElement') {
-		collect_pattern_names(pattern.argument, names);
-		return;
-	}
-
-	if (pattern.type === 'AssignmentPattern') {
-		collect_pattern_names(pattern.left, names);
-		return;
-	}
-
-	if (pattern.type === 'ArrayPattern') {
-		for (const element of pattern.elements || []) {
-			collect_pattern_names(element, names);
-		}
-		return;
-	}
-
-	if (pattern.type === 'ObjectPattern') {
-		for (const property of pattern.properties || []) {
-			if (property.type === 'RestElement') {
-				collect_pattern_names(property.argument, names);
-			} else {
-				collect_pattern_names(property.value, names);
-			}
-		}
-	}
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} shadowed_names
- * @param {TransformContext} transform_context
- * @param {Set<string>} hook_result_names
- * @returns {void}
- */
-function validate_hook_outer_assignments_in_node(
-	node,
-	shadowed_names,
-	transform_context,
-	hook_result_names,
-) {
-	if (!node || typeof node !== 'object') {
-		return;
-	}
-
-	if (Array.isArray(node)) {
-		for (const child of node) {
-			validate_hook_outer_assignments_in_node(
-				child,
-				shadowed_names,
-				transform_context,
-				hook_result_names,
-			);
-		}
-		return;
-	}
-
-	if (is_function_or_component_node(node)) {
-		return;
-	}
-
-	if (node.type === 'CallExpression' && is_hook_callee(node.callee)) {
-		validate_hook_callback_outer_mutations(node, shadowed_names, transform_context);
-	}
-
-	if (node.type === 'BlockStatement') {
-		const next_shadowed = new Set(shadowed_names);
-		const next_hook_result_names = new Set(hook_result_names);
-		for (const name of collect_block_binding_names(node.body || [])) {
-			next_shadowed.add(name);
-		}
-		for (const child of node.body || []) {
-			validate_hook_outer_assignments_in_node(
-				child,
-				next_shadowed,
-				transform_context,
-				next_hook_result_names,
-			);
-		}
-		return;
-	}
-
-	if (node.type === 'VariableDeclaration') {
-		for (const declaration of node.declarations || []) {
-			if (
-				declaration.init &&
-				expression_contains_hook_derived_value(
-					declaration.init,
-					transform_context,
-					hook_result_names,
-				)
-			) {
-				collect_pattern_names(declaration.id, hook_result_names);
-			}
-			validate_hook_outer_assignments_in_node(
-				declaration.init,
-				shadowed_names,
-				transform_context,
-				hook_result_names,
-			);
-		}
-		return;
-	}
-
-	if (
-		node.type === 'AssignmentExpression' &&
-		expression_contains_hook_derived_value(node.right, transform_context, hook_result_names)
-	) {
-		const outer_names = get_referenced_outer_binding_names(
-			node.left,
-			transform_context.available_bindings,
-			shadowed_names,
-		);
-		if (outer_names.length > 0) {
-			report_hook_outer_assignment_error(
-				node.left,
-				outer_names,
-				find_first_hook_call_name(node.right) || 'hook',
-				transform_context,
-			);
-		}
-		for (const name of get_referenced_local_binding_names(node.left, shadowed_names)) {
-			hook_result_names.add(name);
-		}
-	}
-
-	if (is_for_of_control_node(node)) {
-		if (
-			node.left &&
-			node.left.type !== 'VariableDeclaration' &&
-			expression_contains_hook_derived_value(node.right, transform_context, hook_result_names)
-		) {
-			const outer_names = get_referenced_outer_binding_names(
-				node.left,
-				transform_context.available_bindings,
-				shadowed_names,
-			);
-			if (outer_names.length > 0) {
-				report_hook_outer_assignment_error(
-					node.left,
-					outer_names,
-					find_first_hook_call_name(node.right) || 'hook',
-					transform_context,
-				);
-			}
-			for (const name of get_referenced_local_binding_names(node.left, shadowed_names)) {
-				hook_result_names.add(name);
-			}
-		}
-
-		validate_hook_outer_assignments_in_node(
-			node.right,
-			shadowed_names,
-			transform_context,
-			hook_result_names,
-		);
-
-		// Loop-declared bindings (`for (const x of …)`, `for (let x of …)`) live
-		// only in the body. They are deliberately NOT in the enclosing block's
-		// shadowed set (see collect_block_binding_names_from_statement), so add
-		// them just for the body recursion to keep references to the loop var
-		// from being flagged as outer-binding mutations.
-		const body_shadowed = new Set(shadowed_names);
-		if (node.left && node.left.type === 'VariableDeclaration') {
-			for (const declaration of node.left.declarations || []) {
-				collect_pattern_names(declaration.id, body_shadowed);
-			}
-		}
-		validate_hook_outer_assignments_in_node(
-			node.body,
-			body_shadowed,
-			transform_context,
-			hook_result_names,
-		);
-		return;
-	}
-
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		validate_hook_outer_assignments_in_node(
-			node[key],
-			shadowed_names,
-			transform_context,
-			hook_result_names,
-		);
-	}
-}
-
-/**
- * @param {any} call_node
- * @param {Set<string>} shadowed_names
- * @param {TransformContext} transform_context
- * @returns {void}
- */
-function validate_hook_callback_outer_mutations(call_node, shadowed_names, transform_context) {
-	const hook_name = get_hook_callee_name(call_node.callee);
-	for (const argument of call_node.arguments || []) {
-		if (!is_function_or_component_node(argument)) {
-			continue;
-		}
-		const callback_shadowed_names = create_function_like_shadowed_names(argument, shadowed_names);
-		validate_hook_callback_outer_mutations_in_node(
-			argument.body,
-			callback_shadowed_names,
-			transform_context,
-			hook_name,
-		);
-	}
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} shadowed_names
- * @returns {Set<string>}
- */
-function create_function_like_shadowed_names(node, shadowed_names) {
-	const next_shadowed_names = new Set(shadowed_names);
-	for (const param of node.params || []) {
-		collect_pattern_names(param, next_shadowed_names);
-	}
-	if (node.body?.type === 'BlockStatement') {
-		for (const name of collect_block_binding_names(node.body.body || [])) {
-			next_shadowed_names.add(name);
-		}
-	}
-	return next_shadowed_names;
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} shadowed_names
- * @param {TransformContext} transform_context
- * @param {string} hook_name
- * @returns {void}
- */
-function validate_hook_callback_outer_mutations_in_node(
-	node,
-	shadowed_names,
-	transform_context,
-	hook_name,
-) {
-	if (!node || typeof node !== 'object') {
-		return;
-	}
-
-	if (Array.isArray(node)) {
-		for (const child of node) {
-			validate_hook_callback_outer_mutations_in_node(
-				child,
-				shadowed_names,
-				transform_context,
-				hook_name,
-			);
-		}
-		return;
-	}
-
-	if (is_function_or_component_node(node)) {
-		validate_hook_callback_outer_mutations_in_node(
-			node.body,
-			create_function_like_shadowed_names(node, shadowed_names),
-			transform_context,
-			hook_name,
-		);
-		return;
-	}
-
-	if (node.type === 'BlockStatement') {
-		const next_shadowed_names = new Set(shadowed_names);
-		for (const name of collect_block_binding_names(node.body || [])) {
-			next_shadowed_names.add(name);
-		}
-		for (const child of node.body || []) {
-			validate_hook_callback_outer_mutations_in_node(
-				child,
-				next_shadowed_names,
-				transform_context,
-				hook_name,
-			);
-		}
-		return;
-	}
-
-	if (node.type === 'AssignmentExpression') {
-		const outer_names = get_referenced_outer_binding_names(
-			node.left,
-			transform_context.available_bindings,
-			shadowed_names,
-		);
-		if (outer_names.length > 0) {
-			report_hook_callback_outer_mutation_error(
-				node.left,
-				outer_names,
-				hook_name,
-				transform_context,
-			);
-		}
-	}
-
-	if (node.type === 'UpdateExpression') {
-		const outer_names = get_referenced_outer_binding_names(
-			node.argument,
-			transform_context.available_bindings,
-			shadowed_names,
-		);
-		if (outer_names.length > 0) {
-			report_hook_callback_outer_mutation_error(
-				node.argument,
-				outer_names,
-				hook_name,
-				transform_context,
-			);
-		}
-	}
-
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		if (key === 'left' && node.type === 'AssignmentExpression') {
-			continue;
-		}
-		if (key === 'argument' && node.type === 'UpdateExpression') {
-			continue;
-		}
-		validate_hook_callback_outer_mutations_in_node(
-			node[key],
-			shadowed_names,
-			transform_context,
-			hook_name,
-		);
-	}
-}
-
-/**
- * @param {any} node
- * @param {TransformContext} transform_context
- * @param {Set<string>} hook_result_names
- * @returns {boolean}
- */
-function expression_contains_hook_derived_value(node, transform_context, hook_result_names) {
-	return (
-		node_contains_top_level_hook_call(node, false, transform_context, true) ||
-		references_name_in_set(node, hook_result_names)
-	);
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} names
- * @returns {boolean}
- */
-function references_name_in_set(node, names) {
-	if (!node || typeof node !== 'object' || names.size === 0) {
-		return false;
-	}
-
-	if (node.type === 'Identifier') {
-		return names.has(node.name);
-	}
-
-	if (
-		node.type === 'FunctionDeclaration' ||
-		node.type === 'FunctionExpression' ||
-		node.type === 'ArrowFunctionExpression'
-	) {
-		return false;
-	}
-
-	if (Array.isArray(node)) {
-		return node.some((child) => references_name_in_set(child, names));
-	}
-
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		if (key === 'property' && node.type === 'MemberExpression' && !node.computed) {
-			continue;
-		}
-		if (key === 'key' && node.type === 'Property' && !node.computed && !node.shorthand) {
-			continue;
-		}
-		if (references_name_in_set(node[key], names)) {
-			return true;
-		}
-	}
-
-	return false;
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} shadowed_names
- * @returns {string[]}
- */
-function get_referenced_local_binding_names(node, shadowed_names) {
-	const names = new Set();
-	collect_referenced_local_binding_names(node, shadowed_names, names);
-	return [...names];
-}
-
-/**
- * @param {any} node
- * @param {Set<string>} shadowed_names
- * @param {Set<string>} names
- * @returns {void}
- */
-function collect_referenced_local_binding_names(node, shadowed_names, names) {
-	if (!node || typeof node !== 'object') {
-		return;
-	}
-
-	if (node.type === 'Identifier') {
-		if (shadowed_names.has(node.name)) {
-			names.add(node.name);
-		}
-		return;
-	}
-
-	if (Array.isArray(node)) {
-		for (const child of node) {
-			collect_referenced_local_binding_names(child, shadowed_names, names);
-		}
-		return;
-	}
-
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		if (key === 'property' && node.type === 'MemberExpression' && !node.computed) {
-			continue;
-		}
-		if (key === 'key' && node.type === 'Property' && !node.computed && !node.shorthand) {
-			continue;
-		}
-		collect_referenced_local_binding_names(node[key], shadowed_names, names);
+	const saved_inside_element_child = transform_context.inside_element_child;
+	transform_context.inside_element_child = true;
+	try {
+		return [statement_body_to_jsx_child(children, transform_context)];
+	} finally {
+		transform_context.inside_element_child = saved_inside_element_child;
 	}
 }
 
 /**
- * @param {any} node
- * @param {Map<string, AST.Identifier>} available_bindings
- * @param {Set<string>} shadowed_names
- * @returns {string[]}
+ * @param {any[]} children
+ * @returns {boolean}
  */
-function get_referenced_outer_binding_names(node, available_bindings, shadowed_names) {
-	const names = new Set();
-	collect_referenced_outer_binding_names(node, available_bindings, shadowed_names, names);
-	return [...names];
+function children_contain_return_semantics(children) {
+	return children.some(child_contains_return_semantics);
 }
 
 /**
  * @param {any} node
- * @param {Map<string, AST.Identifier>} available_bindings
- * @param {Set<string>} shadowed_names
- * @param {Set<string>} names
- * @returns {void}
+ * @returns {boolean}
  */
-function collect_referenced_outer_binding_names(node, available_bindings, shadowed_names, names) {
+function child_contains_return_semantics(node) {
 	if (!node || typeof node !== 'object') {
-		return;
+		return false;
 	}
 
-	if (node.type === 'Identifier') {
-		if (available_bindings.has(node.name) && !shadowed_names.has(node.name)) {
-			names.add(node.name);
-		}
-		return;
+	if (node.type === 'ReturnStatement') {
+		return true;
+	}
+
+	if (
+		node.type === 'FunctionDeclaration' ||
+		node.type === 'FunctionExpression' ||
+		node.type === 'ArrowFunctionExpression'
+	) {
+		return false;
 	}
 
 	if (Array.isArray(node)) {
-		for (const child of node) {
-			collect_referenced_outer_binding_names(child, available_bindings, shadowed_names, names);
-		}
-		return;
+		return node.some(child_contains_return_semantics);
 	}
 
 	for (const key of Object.keys(node)) {
 		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
 			continue;
 		}
-		if (key === 'property' && node.type === 'MemberExpression' && !node.computed) {
-			continue;
-		}
-		if (key === 'key' && node.type === 'Property' && !node.computed && !node.shorthand) {
-			continue;
+		if (child_contains_return_semantics(node[key])) {
+			return true;
 		}
-		collect_referenced_outer_binding_names(node[key], available_bindings, shadowed_names, names);
 	}
+
+	return false;
 }
 
 /**
  * @param {any} node
- * @returns {string | null}
+ * @returns {boolean}
  */
-function find_first_hook_call_name(node) {
-	if (!node || typeof node !== 'object') {
-		return null;
-	}
-
-	if (node.type === 'CallExpression' && is_hook_callee(node.callee)) {
-		return get_hook_callee_name(node.callee);
-	}
+function is_inline_element_child(node) {
+	return node && is_render_child_node(node);
+}
 
+/**
+ * @param {any[]} body_nodes
+ * @param {TransformContext} transform_context
+ * @returns {ESTreeJSX.JSXExpressionContainer}
+ */
+function statement_body_to_jsx_child(body_nodes, transform_context) {
 	if (
-		node.type === 'FunctionDeclaration' ||
-		node.type === 'FunctionExpression' ||
-		node.type === 'ArrowFunctionExpression'
+		should_extract_hook_helpers(transform_context) &&
+		body_contains_top_level_hook_call(body_nodes, transform_context, true)
 	) {
-		return null;
+		return hook_safe_statement_body_to_jsx_child(body_nodes, transform_context);
 	}
 
-	if (Array.isArray(node)) {
-		for (const child of node) {
-			const name = find_first_hook_call_name(child);
-			if (name) return name;
-		}
-		return null;
-	}
+	return to_jsx_expression_container(
+		b.call(b.arrow([], b.block(build_render_statements(body_nodes, true, transform_context)))),
+	);
+}
 
-	for (const key of Object.keys(node)) {
-		if (key === 'loc' || key === 'start' || key === 'end' || key === 'metadata') {
-			continue;
-		}
-		const name = find_first_hook_call_name(node[key]);
-		if (name) return name;
-	}
+/**
+ * @param {any[]} body_nodes
+ * @param {TransformContext} transform_context
+ * @returns {ESTreeJSX.JSXExpressionContainer}
+ */
+function hook_safe_statement_body_to_jsx_child(body_nodes, transform_context) {
+	const source_node = get_body_source_node(body_nodes);
+	const helper = create_hook_safe_helper(body_nodes, undefined, source_node, transform_context);
 
-	return null;
+	return to_jsx_expression_container(
+		create_hook_safe_helper_iife(helper.setup_statements, helper.component_element),
+		source_node,
+	);
 }
 
 /**
- * @param {any} callee
+ * @param {TransformContext} transform_context
  * @returns {string}
  */
-function get_hook_callee_name(callee) {
-	if (callee?.type === 'Identifier') {
-		return callee.name;
+function create_local_statement_component_name(transform_context) {
+	transform_context.local_statement_component_index += 1;
+	return `StatementBodyHook${transform_context.local_statement_component_index}`;
+}
+
+/**
+ * Wraps a list of body nodes into a component and returns
+ * statements that return `<ComponentName prop1={prop1} ... />`.
+ * Targets can either emit the helper component at module scope or cache the
+ * component identity in module state while initializing it from the parent.
+ * Used when a control flow branch contains hook calls that must be moved
+ * into their own component boundary to satisfy the Rules of Hooks.
+ *
+ * @param {any[]} body_nodes
+ * @param {any} key_expression - Optional key expression to add to the component element (for for-of loops)
+ * @param {TransformContext} transform_context
+ * @returns {any[]}
+ */
+function hook_safe_render_statements(body_nodes, key_expression, transform_context) {
+	const source_node = get_body_source_node(body_nodes);
+	const helper = create_hook_safe_helper(
+		body_nodes,
+		key_expression,
+		source_node,
+		transform_context,
+	);
+	const statements = [...helper.setup_statements];
+
+	statements.push(b.return(helper.component_element));
+
+	return statements;
+}
+
+/**
+ * @param {any[]} body_nodes
+ * @param {Map<string, AST.Identifier>} available_bindings
+ * @returns {AST.Identifier[]}
+ */
+function get_referenced_helper_bindings(body_nodes, available_bindings) {
+	const helper_bindings = [];
+	const local_bindings = new Map();
+
+	for (const node of body_nodes) {
+		collect_statement_bindings(node, local_bindings);
 	}
-	if (
-		callee?.type === 'MemberExpression' &&
-		!callee.computed &&
-		callee.property?.type === 'Identifier'
-	) {
-		return callee.property.name;
+
+	for (const [name, binding] of available_bindings) {
+		if (local_bindings.has(name)) continue;
+
+		if (references_scope_bindings(body_nodes, new Map([[name, binding]]))) {
+			helper_bindings.push(binding);
+		}
 	}
-	return 'hook';
+
+	return helper_bindings;
 }
 
 /**
@@ -3989,11 +3469,6 @@ export function create_hook_safe_helper(
 	preallocated_helper_id,
 	options = {},
 ) {
-	validate_hook_safe_body_does_not_assign_hook_results_to_outer_bindings(
-		body_nodes,
-		transform_context,
-	);
-
 	const helper_id =
 		preallocated_helper_id ??
 		create_generated_identifier(create_local_statement_component_name(transform_context));
@@ -4314,31 +3789,38 @@ function is_native_tsrx_node(node) {
  * @param {any} node
  * @returns {boolean}
  */
-function is_dynamic_jsx_element(node) {
-	return !!(
-		node?.type === 'JSXElement' &&
-		(node.dynamic === true ||
-			node.openingElement?.dynamic === true ||
-			is_dynamic_jsx_name(node.openingElement?.name))
-	);
-}
-
-/**
- * @param {any} name
- * @returns {boolean}
- */
-function is_dynamic_jsx_name(name) {
-	if (!name || typeof name !== 'object') return false;
-	if (name.dynamic === true) return true;
-	return name.type === 'JSXMemberExpression' && is_dynamic_jsx_name(name.object);
+function is_if_control_node(node) {
+	return node?.type === 'IfStatement' || node?.type === 'JSXIfExpression';
 }
 
 /**
  * @param {any} node
  * @returns {boolean}
  */
-function is_if_control_node(node) {
-	return node?.type === 'IfStatement' || node?.type === 'JSXIfExpression';
+function is_render_child_node(node) {
+	if (!node) return false;
+
+	switch (node.type) {
+		case 'JSXElement':
+		case 'JSXFragment':
+		case 'JSXExpressionContainer':
+		case 'JSXText':
+		case 'JSXIfExpression':
+		case 'JSXForExpression':
+		case 'JSXSwitchExpression':
+		case 'JSXTryExpression':
+			return true;
+		case 'IfStatement':
+			return is_template_if_node(node);
+		case 'ForOfStatement':
+			return is_template_for_of_node(node);
+		case 'SwitchStatement':
+			return is_template_switch_node(node);
+		case 'TryStatement':
+			return is_template_try_node(node);
+		default:
+			return false;
+	}
 }
 
 /**
@@ -4357,17 +3839,6 @@ function is_try_control_node(node) {
 	return node?.type === 'TryStatement' || node?.type === 'JSXTryExpression';
 }
 
-/**
- * @param {any} node
- * @returns {boolean}
- */
-function is_for_of_control_node(node) {
-	return (
-		node?.type === 'ForOfStatement' ||
-		(node?.type === 'JSXForExpression' && node.statementType === 'ForOfStatement')
-	);
-}
-
 /**
  * @param {any} node
  * @param {TransformContext} transform_context
@@ -4380,9 +3851,6 @@ function to_jsx_child(node, transform_context) {
 			if (is_native_tsrx_node(node)) {
 				return to_jsx_element(node, transform_context, node.children || [], true);
 			}
-			if (is_dynamic_jsx_element(node)) {
-				return dynamic_element_to_jsx(node, transform_context, true);
-			}
 			return node;
 		case 'JSXFragment':
 			if (is_native_tsrx_node(node)) {
@@ -4391,6 +3859,9 @@ function to_jsx_child(node, transform_context) {
 			return node;
 		case 'JSXIfExpression':
 		case 'IfStatement':
+			if (node.type === 'IfStatement' && !is_template_if_node(node)) {
+				return node;
+			}
 			if (node.metadata?.generated_loop_skip_if) {
 				return node;
 			}
@@ -4412,17 +3883,26 @@ function to_jsx_child(node, transform_context) {
 				transform_context.platform.hooks?.controlFlow?.forOf ?? for_of_statement_to_jsx_child
 			)(jsx_control_expression_to_statement(node), transform_context);
 		case 'ForOfStatement':
+			if (!is_template_for_of_node(node)) {
+				return node;
+			}
 			return (
 				transform_context.platform.hooks?.controlFlow?.forOf ?? for_of_statement_to_jsx_child
 			)(node, transform_context);
 		case 'JSXSwitchExpression':
 		case 'SwitchStatement':
+			if (node.type === 'SwitchStatement' && !is_template_switch_node(node)) {
+				return node;
+			}
 			return (
 				transform_context.platform.hooks?.controlFlow?.switchStatement ??
 				switch_statement_to_jsx_child
 			)(jsx_control_expression_to_statement(node), transform_context);
 		case 'JSXTryExpression':
 		case 'TryStatement':
+			if (node.type === 'TryStatement' && !is_template_try_node(node)) {
+				return node;
+			}
 			return (
 				transform_context.platform.hooks?.controlFlow?.tryStatement ?? try_statement_to_jsx_child
 			)(jsx_control_expression_to_statement(node), transform_context);
@@ -4910,6 +4390,42 @@ function is_template_if_node(node) {
 	);
 }
 
+/**
+ * @param {any} node
+ * @returns {boolean}
+ */
+function is_template_for_of_node(node) {
+	return (
+		node?.type === 'JSXForExpression' ||
+		node?.metadata?.tsrxDirective === 'for' ||
+		(node?.type === 'ForOfStatement' && node?.statementType === 'ForOfStatement')
+	);
+}
+
+/**
+ * @param {any} node
+ * @returns {boolean}
+ */
+function is_template_switch_node(node) {
+	return (
+		node?.type === 'JSXSwitchExpression' ||
+		node?.metadata?.tsrxDirective === 'switch' ||
+		(node?.type === 'SwitchStatement' && node?.statementType === 'SwitchStatement')
+	);
+}
+
+/**
+ * @param {any} node
+ * @returns {boolean}
+ */
+function is_template_try_node(node) {
+	return (
+		node?.type === 'JSXTryExpression' ||
+		node?.metadata?.tsrxDirective === 'try' ||
+		(node?.type === 'TryStatement' && node?.statementType === 'TryStatement')
+	);
+}
+
 /**
  * @param {any} node
  * @returns {boolean}
@@ -5273,16 +4789,9 @@ function try_statement_to_jsx_child(node, transform_context) {
 		// correctly identifies references to err/reset as non-static
 		const saved_catch_bindings = transform_context.available_bindings;
 		transform_context.available_bindings = new Map(saved_catch_bindings);
-		const catch_scoped_names = new Set();
 		for (const param of catch_params) {
 			collect_pattern_bindings(param, transform_context.available_bindings);
-			collect_pattern_names(param, catch_scoped_names);
 		}
-		validate_hook_safe_body_does_not_assign_hook_results_to_outer_bindings(
-			catch_body_nodes,
-			transform_context,
-			catch_scoped_names,
-		);
 
 		const fallback_fn = b.arrow(
 			catch_params,
@@ -5707,7 +5216,7 @@ function build_switch_with_lift(switch_node, transform_context) {
 					has_terminal = true;
 					break;
 				}
-				if (is_jsx_child(child)) {
+				if (is_render_child_node(child)) {
 					render_nodes.push(to_jsx_child(child, transform_context));
 				} else if (is_bare_render_expression(child)) {
 					render_nodes.push(to_jsx_expression_container(child, child));
@@ -6266,57 +5775,6 @@ function value_has_unmappable_jsx_loc(value) {
 	);
 }
 
-/**
- * @param {any} node
- * @param {TransformContext} transform_context
- * @param {boolean} in_jsx_child
- * @returns {any}
- */
-function dynamic_element_to_jsx(node, transform_context, in_jsx_child) {
-	const source_name = node.openingElement?.name;
-	const dynamic_id = set_loc(create_generated_identifier('DynamicElement'), source_name || node);
-	const alias_declaration = set_loc(
-		b.const(dynamic_id, jsx_name_to_expression(source_name)),
-		source_name || node,
-	);
-	const jsx_element = create_dynamic_jsx_element(dynamic_id, node, transform_context);
-
-	const expression = b.call(
-		b.arrow(
-			[],
-			b.block([
-				alias_declaration,
-				b.return(b.conditional(clone_identifier(dynamic_id), jsx_element, create_null_literal())),
-			]),
-		),
-	);
-
-	return in_jsx_child ? to_jsx_expression_container(expression, node) : set_loc(expression, node);
-}
-
-/**
- * @param {AST.Identifier} dynamic_id
- * @param {any} node
- * @param {TransformContext} transform_context
- * @returns {ESTreeJSX.JSXElement}
- */
-function create_dynamic_jsx_element(dynamic_id, node, transform_context) {
-	const attributes = transform_element_attributes_dispatch(
-		node.openingElement?.attributes || [],
-		transform_context,
-		node,
-	);
-	const selfClosing = !!node.openingElement?.selfClosing;
-	const children = create_element_children(node.children || [], transform_context);
-	const name = identifier_to_jsx_name(clone_identifier(dynamic_id));
-
-	return b.jsx_element_fresh(
-		b.jsx_opening_element(name, attributes, selfClosing),
-		selfClosing ? null : b.jsx_closing_element(clone_jsx_name(name)),
-		children,
-	);
-}
-
 /**
  * @param {any[]} render_nodes
  * @returns {any}