@tsrx/core 0.1.34 → 0.1.36

package/package.json

@@ -3,7 +3,7 @@
   "description": "Core compiler infrastructure for TSRX syntax",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.1.34",
+  "version": "0.1.36",
   "type": "module",
   "repository": {
     "type": "git",

package/src/plugin.js

@@ -259,6 +259,13 @@ export function TSRXPlugin(config) {
 			// `#filterTemplateScriptContexts`.
 			/** @type {number[]} */
 			#expressionContainerContextBaselines = [];
+			// `#path` length at the start of each open `{ … }` expression container.
+			// Raw template text inside a container belongs only to an element opened
+			// inside it (`{<div>   a</div>}`); at the container's own expression level
+			// (`{cond ? (<Outer>…</Outer>) : null}` after the `)`) the next characters
+			// are JS, and reading them as raw text would swallow tokens like `: null`.
+			/** @type {number[]} */
+			#expressionContainerPathBaselines = [];
 			#consumeContainerBraceAfterScope = false;
 			#scriptJSXElementDepth = 0;
 			#forceScriptJSXElementDepth = 0;
@@ -936,6 +943,26 @@ export function TSRXPlugin(config) {
 				if (!current_template_node || this.#isJSXControlFlowDirectiveAt(this.pos)) {
 					return false;
 				}
+				// Inside an expression container (only reachable with
+				// `allow_inside_expression_container`), raw text belongs to an element
+				// opened inside the container. When the innermost native template element
+				// sits below the container's path baseline we are at the container's own
+				// expression level — e.g. after `(<Outer>…</Outer>)` in
+				// `{cond ? (<Outer>…</Outer>) : null}` — and the following characters are
+				// JS tokens, not template text.
+				if (this.#jsxExpressionContainerDepth > 0 && !this.#openingNativeTemplateNode) {
+					const path_baseline = this.#expressionContainerPathBaselines.at(-1) ?? 0;
+					let inside_container = false;
+					for (let i = this.#path.length - 1; i >= path_baseline; i--) {
+						if (this.#isNativeTemplateNode(this.#path[i])) {
+							inside_container = true;
+							break;
+						}
+					}
+					if (!inside_container) {
+						return false;
+					}
+				}
 				if (this.#isTemplateLineCommentStart(this.pos)) {
 					return false;
 				}
@@ -3377,6 +3404,7 @@ export function TSRXPlugin(config) {
 					// container must not strip anything below this floor (see
 					// `#filterTemplateScriptContexts`).
 					this.#expressionContainerContextBaselines.push(this.context.length);
+					this.#expressionContainerPathBaselines.push(this.#path.length);
 					pushed_context_baseline = true;
 
 					node.expression =
@@ -3398,6 +3426,7 @@ export function TSRXPlugin(config) {
 					this.#jsxExpressionContainerDepth--;
 					if (pushed_context_baseline) {
 						this.#expressionContainerContextBaselines.pop();
+						this.#expressionContainerPathBaselines.pop();
 					}
 				}
 

package/src/scope.js

@@ -63,10 +63,9 @@ export function create_scopes(ast, root, parent, error_options) {
 		const scope = state.scope.child(true);
 		scopes.set(node, scope);
 
-		if (node.type === 'ForOfStatement') {
-			if (node.index) {
-				state.scope.declare(node.index, 'normal', 'let');
-			}
+		// Only a `@for` directive can declare an `index` binding.
+		if (node.type === 'JSXForExpression' && node.index) {
+			state.scope.declare(node.index, 'normal', 'let');
 		}
 
 		next({ scope });
@@ -181,6 +180,21 @@ export function create_scopes(ast, root, parent, error_options) {
 		SwitchStatement: create_block_scope,
 		JSXForExpression: create_block_scope,
 		JSXSwitchExpression: create_block_scope,
+		// Each `@{ … }` code block is its own lexical scope, whether it is a
+		// function body or a template child — its bindings never leak out.
+		JSXCodeBlock(node, context) {
+			const parent = context.path.at(-1);
+			if (
+				parent?.type === 'FunctionDeclaration' ||
+				parent?.type === 'FunctionExpression' ||
+				parent?.type === 'ArrowFunctionExpression'
+			) {
+				// The function already created a scope for its body.
+				context.next();
+			} else {
+				create_block_scope(node, context);
+			}
+		},
 		BlockStatement(node, context) {
 			const parent = context.path.at(-1);
 			if (

package/src/transform/jsx/helpers.js

@@ -243,7 +243,6 @@ export function tsx_with_ts_locations() {
 export function is_template_if_node(node) {
 	return (
 		node?.type === 'JSXIfExpression' ||
-		node?.metadata?.tsrxDirective === 'if' ||
 		(node?.type === 'IfStatement' && node?.statementType === 'IfStatement')
 	);
 }
@@ -255,7 +254,6 @@ export function is_template_if_node(node) {
 export function is_template_for_of_node(node) {
 	return (
 		node?.type === 'JSXForExpression' ||
-		node?.metadata?.tsrxDirective === 'for' ||
 		(node?.type === 'ForOfStatement' && node?.statementType === 'ForOfStatement')
 	);
 }
@@ -267,7 +265,6 @@ export function is_template_for_of_node(node) {
 export function is_template_switch_node(node) {
 	return (
 		node?.type === 'JSXSwitchExpression' ||
-		node?.metadata?.tsrxDirective === 'switch' ||
 		(node?.type === 'SwitchStatement' && node?.statementType === 'SwitchStatement')
 	);
 }
@@ -279,7 +276,6 @@ export function is_template_switch_node(node) {
 export function is_template_try_node(node) {
 	return (
 		node?.type === 'JSXTryExpression' ||
-		node?.metadata?.tsrxDirective === 'try' ||
 		(node?.type === 'TryStatement' && node?.statementType === 'TryStatement')
 	);
 }

package/src/transform/jsx/index.js

@@ -2302,7 +2302,7 @@ function create_style_anchor_name(transform_context) {
 }
 
 /**
- * @param {ESTreeJSX.JSXElement} element
+ * @param {AST.TSRXJSXElement} element
  */
 function disable_style_anchor_verification(element) {
 	if (element.openingElement?.name) {

package/src/utils/builders.js

@@ -368,26 +368,6 @@ export function literal(value, raw, loc_info) {
 	return set_location(node, loc_info);
 }
 
-/**
- * Ripple template `Text` node wrapping a string literal of `value`. Used by the
- * Ripple normalizer when lowering a JSX text child to a template Text node.
- *
- * Remove once Ripple transformers move to the parser's JSX AST
- *
- * @param {string} value
- * @param {AST.NodeWithLocation} [loc_info]
- * @returns {AST.Text}
- */
-export function text(value, loc_info) {
-	const node = /** @type {AST.Text} */ ({
-		type: 'Text',
-		expression: literal(value, JSON.stringify(value), loc_info),
-		metadata: { path: [] },
-	});
-
-	return set_location(node, loc_info);
-}
-
 /**
  * @param {AST.Expression | AST.Super} object
  * @param {string | AST.Expression | AST.PrivateIdentifier} property
@@ -1219,10 +1199,13 @@ export function jsx_element_fresh(
 }
 
 /**
- * @param {ESTreeJSX.JSXElement} node
- * @param {ESTreeJSX.JSXOpeningElement['attributes']} attributes
- * @param {ESTreeJSX.JSXElement['children']} children
- * @returns {ESTreeJSX.JSXElement}
+ * Elements carry the parser's widened TSRX shape (dynamic-tag names, lowered
+ * template children) — see {@link jsx_fragment}. A `JSXStyleElement` shares
+ * the element shape and may be re-emitted as an empty `<style>` element.
+ * @param {AST.TSRXJSXElement | AST.JSXStyleElement} node
+ * @param {ESTreeJSX.TSRXJSXOpeningElement['attributes']} attributes
+ * @param {AST.TSRXJSXElement['children']} children
+ * @returns {AST.TSRXJSXElement}
  */
 export function jsx_element(node, attributes = [], children = []) {
 	return {
@@ -1248,9 +1231,12 @@ export function jsx_element(node, attributes = [], children = []) {
 }
 
 /**
- * @param {ESTreeJSX.JSXFragment['children']} children
+ * Fragments carry the parser's widened TSRX shape: template lowering places
+ * any node in `children` (statement blocks, directives, code-block IIFEs),
+ * not just printable JSX children.
+ * @param {AST.TSRXJSXFragment['children']} children
  * @param {ESTreeJSX.JSXOpeningFragment['attributes']} [attributes]
- * @returns {ESTreeJSX.JSXFragment}
+ * @returns {AST.TSRXJSXFragment}
  */
 export function jsx_fragment(children = [], attributes = []) {
 	return {
@@ -1269,44 +1255,6 @@ export function jsx_fragment(children = [], attributes = []) {
 	};
 }
 
-/**
- * Ripple's internal fragment template node (the normalized form of a
- * `JSXFragment`).
- * @param {AST.Node[]} [children]
- * @param {AST.NodeWithLocation} [loc_info]
- * @returns {AST.TsrxFragment}
- */
-export function tsrx_fragment(children = [], loc_info) {
-	const node = /** @type {AST.TsrxFragment} */ (
-		/** @type {unknown} */ ({
-			type: 'TsrxFragment',
-			children,
-			attributes: [],
-			selfClosing: false,
-			metadata: { path: [] },
-		})
-	);
-
-	return set_location(node, loc_info);
-}
-
-/**
- * Ripple's internal expression template child (the normalized form of a
- * `JSXExpressionContainer` child).
- * @param {AST.Expression} expression
- * @param {AST.NodeWithLocation} [loc_info]
- * @returns {AST.TSRXExpression}
- */
-export function tsrx_expression(expression, loc_info) {
-	const node = /** @type {AST.TSRXExpression} */ ({
-		type: 'TSRXExpression',
-		expression,
-		metadata: { path: [] },
-	});
-
-	return set_location(node, loc_info);
-}
-
 /**
  * @param {AST.Expression | ESTreeJSX.JSXEmptyExpression} expression
  * @param {AST.NodeWithLocation} [loc_info]

package/types/index.d.ts

@@ -88,7 +88,28 @@ interface BaseNodeMetaData {
 	dynamicElement?: boolean;
 	templateMode?: 'script' | 'template';
 	script_only?: boolean;
-	tsrxDirective?: 'if' | 'for' | 'switch' | 'try';
+	/** A synthetic wrapper for a nested `@{ @{ ... } }` code-block render chain. */
+	tsrx_code_block_chain?: boolean;
+	/** A synthesized render-body fragment (see create_native_tsrx_render_function). */
+	tsrx_render_fragment?: boolean;
+	/** A merged text run produced by normalize_children - renders through the text path. */
+	tsrx_text?: boolean;
+	/** Control-flow node renders as the sole child of its parent (controlled anchor). */
+	is_controlled?: boolean;
+	/** Control-flow node is the root of a render body - anchors on `__anchor`. */
+	root_controlled?: boolean;
+	/** Append target set by transform_children when all siblings are static component children. */
+	append_into?: AST.Identifier;
+	/** Generated pattern id substituted for a destructured keyed `@for` left. */
+	tsrx_for_pattern_id?: AST.Identifier;
+	/** Memoized render-body statements (see get_native_tsrx_function_body). */
+	tsrx_render_body?: AST.Node[];
+	/** Memoized resolved render slot of a `@{ … }` code block (see get_code_block_render). */
+	tsrx_render_slot?: { render: AST.Node | null };
+	/** Memoized template-child lowering of a `@{ … }` code block (see get_code_block_template_child). */
+	tsrx_template_child?: { child: AST.Node | null };
+	/** Memoized `<> … </>` wrapper for a value-position directive (see get_directive_value_wrapper). */
+	tsrx_value_wrapper?: AST.TSRXJSXFragment;
 	ts_name?: string;
 	delegated?: any;
 	returned_tsrx_return?: AST.ReturnStatement;
@@ -122,6 +143,10 @@ interface FunctionMetaData extends BaseNodeMetaData {
 	is_method?: boolean;
 	tracked?: boolean;
 	has_lazy_descendants?: boolean;
+	/** The component's extracted `<style>` stylesheet (element-level scoped-class info lives on BaseNodeMetaData's `css`). */
+	component_css?: AST.CSS.StyleSheet | null;
+	/** Top-level scoped classes collected while pruning the component's CSS. */
+	topScopedClasses?: TopScopedClasses;
 	synthetic_children?: boolean;
 	generated_helpers?: any[];
 	generated_statics?: any[];
@@ -248,30 +273,17 @@ declare module 'estree' {
 		tracked?: boolean;
 	}
 
-	interface SimpleLiteral extends AST.LiteralNode {}
-	interface RegExpLiteral extends AST.LiteralNode {}
-	interface BigIntLiteral extends AST.LiteralNode {}
-
 	interface TrackedNode {
 		tracked?: boolean;
 	}
 
-	interface LiteralNode {
-		was_expression?: boolean;
-	}
-
 	// Include TypeScript node types and TSRX-specific nodes in NodeMap
 	interface NodeMap {
-		Element: Element;
-		TsrxFragment: TsrxFragment;
-		Text: Text;
+		JSXSpreadChild: ESTreeJSX.JSXSpreadChild;
 		TSRXJSXElement: TSRXJSXElement;
 		TSRXJSXFragment: TSRXJSXFragment;
 		TSRXJSXOpeningElement: ESTreeJSX.TSRXJSXOpeningElement;
 		TSRXJSXClosingElement: ESTreeJSX.TSRXJSXClosingElement;
-		TSRXExpression: TSRXExpression;
-		Attribute: Attribute;
-		SpreadAttribute: SpreadAttribute;
 		JSXCodeBlock: JSXCodeBlock;
 		JSXStyleElement: JSXStyleElement;
 		JSXIfExpression: JSXIfExpression;
@@ -282,10 +294,8 @@ declare module 'estree' {
 	}
 
 	interface ExpressionMap {
-		Element: Element;
-		TsrxFragment: TsrxFragment;
-		Text: Text;
-		TSRXExpression: TSRXExpression;
+		TSRXJSXElement: TSRXJSXElement;
+		TSRXJSXFragment: TSRXJSXFragment;
 		JSXCodeBlock: JSXCodeBlock;
 		JSXStyleElement: JSXStyleElement;
 		JSXIfExpression: JSXIfExpression;
@@ -299,69 +309,6 @@ declare module 'estree' {
 
 	type TraversableAstNode = AST.Node & Record<string, unknown>;
 
-	// Ripple-normalized template node shapes. The core parser emits JSX-shaped
-	// TSRX nodes; @tsrx/ripple creates these during its normalization pass.
-	interface Attribute extends AST.BaseNode {
-		type: 'Attribute';
-		name: AST.Identifier;
-		value: any;
-		shorthand?: boolean;
-		metadata: BaseNodeMetaData;
-	}
-
-	interface SpreadAttribute extends AST.BaseNode {
-		type: 'SpreadAttribute';
-		argument: AST.Expression;
-		metadata: BaseNodeMetaData;
-	}
-
-	interface Element extends AST.BaseExpression {
-		type: 'Element';
-		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;
-		end: number;
-	}
-
-	interface TsrxFragment extends AST.BaseExpression {
-		type: 'TsrxFragment';
-		children: AST.Node[];
-		openingElement?: ESTreeJSX.JSXOpeningFragment;
-		closingElement?: ESTreeJSX.JSXClosingFragment | null;
-		selfClosing?: boolean;
-		attributes?: Array<Attribute | SpreadAttribute>;
-		metadata: BaseNodeMetaData & {
-			/**
-			 * A synthetic wrapper for a nested code-block render chain
-			 * (`@{ @{ … } }`), so render-slot consumers see a template node;
-			 * template-children lowering unwraps it.
-			 */
-			tsrx_code_block_chain?: boolean;
-		};
-		start: number;
-		end: number;
-	}
-
-	interface Text extends AST.BaseExpression {
-		type: 'Text';
-		expression: AST.Expression;
-		metadata: BaseNodeMetaData;
-	}
-
-	interface TSRXExpression extends AST.BaseExpression {
-		type: 'TSRXExpression';
-		expression: AST.Expression;
-		metadata: BaseNodeMetaData;
-	}
-
 	type TSRXJSXChild =
 		| ESTreeJSX.JSXText
 		| ESTreeJSX.JSXExpressionContainer
@@ -376,7 +323,16 @@ declare module 'estree' {
 			AST.NodeWithMaybeComments {
 		openingElement: ESTreeJSX.TSRXJSXOpeningElement;
 		closingElement: ESTreeJSX.TSRXJSXClosingElement | null;
-		children: TSRXJSXChild[];
+		/** The parser marks dynamic `<{expr}>` tags; lower_dynamic_element clears it on its copy. */
+		isDynamic?: boolean;
+		/** Loose-mode recovery: the element was never closed. */
+		unclosed?: boolean;
+		/**
+		 * The parser emits {@link TSRXJSXChild}; the compile pre-passes lower
+		 * template children in place (retyped directives, code-block IIFEs,
+		 * merged text runs), so any node can appear here by transform time.
+		 */
+		children: AST.Node[];
 		metadata: BaseNodeMetaData & {
 			ts_name?: string;
 		};
@@ -384,7 +340,8 @@ declare module 'estree' {
 
 	interface TSRXJSXFragment
 		extends Omit<ESTreeJSX.JSXFragment, 'children'>, AST.NodeWithMaybeComments {
-		children: TSRXJSXChild[];
+		/** See {@link TSRXJSXElement}'s `children`. */
+		children: AST.Node[];
 	}
 
 	interface JSXCodeBlock extends AST.BaseExpression {
@@ -411,22 +368,39 @@ declare module 'estree' {
 		metadata: BaseNodeMetaData;
 	}
 
-	interface JSXForExpression extends AST.BaseExpression {
+	interface JSXForExpressionBase extends AST.BaseExpression {
 		type: 'JSXForExpression';
-		statementType: 'ForStatement' | 'ForInStatement' | 'ForOfStatement';
-		body: AST.Statement;
-		init?: AST.VariableDeclaration | AST.Expression | null;
-		test?: AST.Expression | null;
-		update?: AST.Expression | null;
-		left?: AST.VariableDeclaration | AST.Pattern;
-		right?: AST.Expression;
-		await?: boolean;
+		/** The parser raises unless the directive body is a `{ … }` block. */
+		body: AST.BlockStatement;
 		index?: AST.Identifier | null;
 		key?: AST.Expression | null;
 		empty?: AST.BlockStatement | null;
 		metadata: BaseNodeMetaData;
 	}
 
+	interface JSXForOfExpression extends JSXForExpressionBase {
+		statementType: 'ForOfStatement';
+		left: AST.VariableDeclaration | AST.Pattern;
+		right: AST.Expression;
+		await?: boolean;
+	}
+
+	interface JSXForInExpression extends JSXForExpressionBase {
+		statementType: 'ForInStatement';
+		left: AST.VariableDeclaration | AST.Pattern;
+		right: AST.Expression;
+	}
+
+	interface JSXForPlainExpression extends JSXForExpressionBase {
+		statementType: 'ForStatement';
+		init?: AST.VariableDeclaration | AST.Expression | null;
+		test?: AST.Expression | null;
+		update?: AST.Expression | null;
+	}
+
+	/** `@for` — discriminated on `statementType` (for-of / for-in / for(;;)). */
+	type JSXForExpression = JSXForOfExpression | JSXForInExpression | JSXForPlainExpression;
+
 	interface JSXSwitchExpression extends AST.BaseExpression {
 		type: 'JSXSwitchExpression';
 		statementType: 'SwitchStatement';
@@ -445,6 +419,13 @@ declare module 'estree' {
 		metadata: BaseNodeMetaData;
 	}
 
+	/** A `@if`/`@for`/`@switch`/`@try` template control-flow directive. */
+	type JSXTemplateDirective =
+		| JSXIfExpression
+		| JSXForExpression
+		| JSXSwitchExpression
+		| JSXTryExpression;
+
 	interface ParenthesizedExpression extends AST.BaseNode {
 		type: 'ParenthesizedExpression';
 		expression: AST.Expression;
@@ -764,11 +745,27 @@ declare module 'estree-jsx' {
 	}
 
 	interface TSRXJSXOpeningElement extends Omit<JSXOpeningElement, 'name'> {
-		name: AST.MemberExpression | JSXIdentifier | JSXNamespacedName | JSXExpressionContainer;
+		/** The parser marks dynamic `<{expr}>` tags; lower_dynamic_element clears it on its copy. */
+		isDynamic?: boolean;
+		// AST.MemberExpression: the parser never produces it, but the to_ts
+		// transform plants the visited member chain (`<Foo.Bar>`) into the name
+		// slot for the TSX printer and its source mappings.
+		name:
+			| JSXMemberExpression
+			| JSXIdentifier
+			| JSXNamespacedName
+			| JSXExpressionContainer
+			| import('estree').MemberExpression;
 	}
 
 	interface TSRXJSXClosingElement extends Omit<JSXClosingElement, 'name'> {
-		name: AST.MemberExpression | JSXIdentifier | JSXNamespacedName | JSXExpressionContainer;
+		// See TSRXJSXOpeningElement's `name`.
+		name:
+			| JSXMemberExpression
+			| JSXIdentifier
+			| JSXNamespacedName
+			| JSXExpressionContainer
+			| import('estree').MemberExpression;
 	}
 
 	interface ExpressionMap {
@@ -1116,8 +1113,10 @@ declare module 'estree' {
 	> {
 		typeAnnotation: TypeNode;
 	}
-	interface TSTypeAssertion extends AcornTSNode<TSESTree.TSTypeAssertion> {
+	interface TSTypeAssertion extends Omit<AcornTSNode<TSESTree.TSTypeAssertion>, 'typeAnnotation'> {
+		// Have to override it to use our Expression for required properties like metadata
 		expression: AST.Expression;
+		typeAnnotation: TypeNode;
 	}
 	interface TSTypeLiteral extends Omit<AcornTSNode<TSESTree.TSTypeLiteral>, 'members'> {
 		members: TypeElement[];
@@ -1452,7 +1451,7 @@ export interface AnalysisState extends BaseState {
 			filename: string;
 		};
 	};
-	elements?: Array<ESTreeJSX.JSXElement | AST.Element>;
+	elements?: Array<AST.TSRXJSXElement | AST.JSXStyleElement>;
 	function_depth?: number;
 	collect?: boolean;
 	metadata: BaseStateMetaData & {
@@ -1531,7 +1530,25 @@ export interface TransformClientState extends BaseState {
 }
 
 /** Override zimmerframe types and provide our own */
-type NodeOf<T extends string, X> = X extends { type: T } ? X : never;
+/**
+ * Where stock `@types/estree-jsx` and the TSRX parser shapes share a `type`
+ * tag, visitors receive the TSRX shape — the parser only ever produces that
+ * one (dynamic tag names, code-block children, `metadata`, `start`/`end`).
+ * Interface merging cannot widen the stock interfaces' property types, so the
+ * TSRXJSX* variants override the plain ones here instead.
+ */
+interface VisitorNodeOverrides {
+	JSXElement: AST.TSRXJSXElement;
+	JSXFragment: AST.TSRXJSXFragment;
+	JSXOpeningElement: ESTreeJSX.TSRXJSXOpeningElement;
+	JSXClosingElement: ESTreeJSX.TSRXJSXClosingElement;
+}
+
+type NodeOf<T extends string, X> = T extends keyof VisitorNodeOverrides
+	? VisitorNodeOverrides[T]
+	: X extends { type: T }
+		? X
+		: never;
 
 type SpecializedVisitors<T extends AST.Node | AST.CSS.Node, U> = {
 	[K in T['type']]?: Visitor<NodeOf<K, T>, U, T>;
@@ -1545,7 +1562,12 @@ export type CatchAllVisitor<T, U, V> = (
 	visit: VisitFn<V>,
 ) => V | void;
 
-export type Visitor<T, U, V> = (node: T, context: Context<V, U>) => V | void;
+/**
+ * A visitor may replace a node with several: zimmerframe stores the returned
+ * array verbatim in the parent's statement list and the printer flattens
+ * nested statement arrays.
+ */
+export type Visitor<T, U, V> = (node: T, context: Context<V, U>) => V | V[] | void;
 
 export type Visitors<T extends AST.Node | AST.CSS.Node, U> = T['type'] extends '_'
 	? never