@tsrx/core 0.1.16 → 0.1.17

package/README.md

@@ -41,8 +41,9 @@ The TSRX website is the canonical source for language documentation:
 
 - [Getting Started](https://tsrx.dev/getting-started) — install TSRX for React,
   Preact, Solid, Vue, or Ripple and configure editor/AI tooling.
-- [Features](https://tsrx.dev/features) — examples of components, statement
-  templates, control flow, scoped styles, submodules, and lazy destructuring.
+- [Features](https://tsrx.dev/features) — examples of function components,
+  statement templates, control flow, scoped styles, submodules, and lazy
+  destructuring.
 - [Specification](https://tsrx.dev/specification) — the current grammar and
   parser-level semantics.
 
@@ -54,7 +55,7 @@ here and keeps package docs focused on the core parser API.
 - **`parseModule(source, filename, options?)`** — parse a TSRX module into an
   ESTree AST.
 - **Scope analysis** — `createScopes`, `Scope`, `ScopeRoot`, binding tracking
-  (`import`, `prop`, `let`, `const`, `function`, `component`, `for_pattern`, …).
+  (`import`, `prop`, `let`, `const`, `function`, `for_pattern`, …).
 - **AST utilities** — pattern walkers, identifier extraction, builders, location
   helpers, obfuscation helpers.
 - **CSS support** — `parseStyle`, `analyzeCss`, `renderStylesheets`.

package/package.json

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

package/src/analyze/prune.js

@@ -323,26 +323,14 @@ function get_descendant_elements(node, adjacent_only) {
 			}
 		}
 
-		if (/** @type {AST.Component} */ (current_node).body) {
-			for (const child of /** @type {AST.Component} */ (current_node).body) {
-				visit(child, depth + 1);
-			}
-		}
-
 		// For template nodes and interpolation expressions
 		if (
-			(current_node.type === 'TSRXExpression' ||
-				current_node.type === 'Text' ||
-				current_node.type === 'Html') &&
-			/** @type {AST.TSRXExpression | AST.Html | AST.TextNode} */ (current_node).expression &&
-			typeof (
-				/** @type {AST.TSRXExpression | AST.Html | AST.TextNode} */ (current_node).expression
-			) === 'object'
+			(current_node.type === 'TSRXExpression' || current_node.type === 'Text') &&
+			/** @type {AST.TSRXExpression | AST.TextNode} */ (current_node).expression &&
+			typeof (/** @type {AST.TSRXExpression | AST.TextNode} */ (current_node).expression) ===
+				'object'
 		) {
-			visit(
-				/** @type {AST.TSRXExpression | AST.Html | AST.TextNode} */ (current_node).expression,
-				depth + 1,
-			);
+			visit(/** @type {AST.TSRXExpression | AST.TextNode} */ (current_node).expression, depth + 1);
 		}
 	}
 
@@ -399,7 +387,6 @@ function can_render_dynamic_content(element, check_classes = false) {
  */
 function get_possible_element_siblings(node, direction, adjacent_only) {
 	const siblings = new Map();
-	// Parent has to be an Element not a Component
 	const parent = get_element_parent(node);
 
 	if (!parent) {
@@ -428,9 +415,9 @@ function get_possible_element_siblings(node, direction, adjacent_only) {
 	for (let i = start; i !== end; i += step) {
 		const sibling = container[i];
 
-		if (sibling.type === 'Element' || sibling.type === 'Component') {
+		if (sibling.type === 'Element') {
 			siblings.set(sibling, true);
-			// Don't break for dynamic elements (children, Components, dynamic components)
+			// Don't break for dynamic elements (children and dynamic components)
 			// as they can render dynamic content or might render nothing
 			const isDynamic = can_render_dynamic_content(sibling, false);
 			if (adjacent_only && !isDynamic) {
@@ -534,12 +521,6 @@ function apply_combinator(relative_selector, rest_selectors, rule, node, directi
 												break;
 											}
 											if (combinator.name === '+') break; // For adjacent, only check first element
-										} else if (subsequent.type === 'Component') {
-											// Skip components when looking for the target element
-											if (combinator.name === '+') {
-												// For adjacent, continue looking
-												continue;
-											}
 										}
 									}
 								}
@@ -987,6 +968,10 @@ function relative_selector_might_apply_to_node(relative_selector, rule, element,
 			}
 
 			case 'TypeSelector': {
+				if (is_element_dynamic(/** @type {AST.Element} */ (element))) {
+					break;
+				}
+
 				if (
 					element.id.type === 'Identifier' &&
 					element.id.name.toLowerCase() !== name.toLowerCase() &&
@@ -1106,11 +1091,11 @@ export function prune_css(css, element, styleClasses, topScopedClasses) {
 				node.metadata.used = true;
 			}
 
-			// Populate top_scoped_classes for truly standalone class selectors ({style} support).
+			// Populate top_scoped_classes for truly standalone class selectors.
 			// A class is standalone only when the entire effective selector chain (after resolving
 			// nesting and stripping :global) is a single RelativeSelector with a single ClassSelector.
 			// This prevents classes from compound selectors like `.wrapper .nested` or selectors
-			// inside :global() from being treated as valid {style} targets.
+			// inside :global() from being exported through style refs.
 			if (selectors.length === 1) {
 				const sole_selector = selectors[0];
 				if (

package/src/analyze/validation.js

@@ -4,25 +4,22 @@
  */
 
 import { error } from '../errors.js';
+import { DIAGNOSTIC_CODES } from '../diagnostics.js';
 
-export const COMPONENT_RETURN_VALUE_ERROR =
-	'Return statements inside components cannot have a return value.';
-export const COMPONENT_LOOP_RETURN_ERROR =
-	'Return statements are not allowed inside component for...of loops. Use continue instead.';
-export const COMPONENT_LOOP_BREAK_ERROR =
-	'Break statements are not allowed inside component for...of loops.';
-export const COMPONENT_FOR_STATEMENT_ERROR =
-	'For loops are not supported in components. Use for...of instead.';
-export const COMPONENT_FOR_IN_STATEMENT_ERROR =
-	'For...in loops are not supported in components. Use for...of instead.';
-export const COMPONENT_WHILE_STATEMENT_ERROR =
-	'While loops are not supported in components. Move the while loop into a function.';
-export const COMPONENT_DO_WHILE_STATEMENT_ERROR =
-	'Do...while loops are not supported in components. Move the do...while loop into a function.';
-export const CLASS_COMPONENT_AS_NON_ARROW_PROPERTY_ERROR =
-	'Components declared inside a class must be defined as an arrow function class property (e.g. `Foo = component() => { ... }`). Non-arrow component property values are not allowed.';
-export const COMPONENT_MULTIPLE_PARAMS_ERROR =
-	'Components accept a single props parameter. Move additional inputs into the props object instead.';
+export const TSRX_RETURN_STATEMENT_ERROR =
+	'Return statements are not allowed inside TSRX templates. Move the return before the TSRX return value, or use conditional rendering instead.';
+export const TSRX_LOOP_RETURN_ERROR =
+	'Return statements are not allowed inside TSRX template for...of loops. Use continue instead.';
+export const TSRX_LOOP_BREAK_ERROR =
+	'Break statements are not allowed inside TSRX template for...of loops.';
+export const TSRX_FOR_STATEMENT_ERROR =
+	'For loops are not supported in TSRX templates. Use for...of instead.';
+export const TSRX_FOR_IN_STATEMENT_ERROR =
+	'For...in loops are not supported in TSRX templates. Use for...of instead.';
+export const TSRX_WHILE_STATEMENT_ERROR =
+	'While loops are not supported in TSRX templates. Move the while loop into a function.';
+export const TSRX_DO_WHILE_STATEMENT_ERROR =
+	'Do...while loops are not supported in TSRX templates. Move the do...while loop into a function.';
 
 const invalid_nestings = {
 	// <p> cannot contain block-level elements
@@ -184,17 +181,14 @@ export function get_statement_keyword_node(node, keyword) {
  * @param {CompileError[]} [errors]
  * @param {AST.CommentWithLocation[]} [comments]
  */
-export function validate_component_return_statement(node, filename, errors, comments) {
-	if (node.argument === null) {
-		return;
-	}
-
+export function validate_tsrx_return_statement(node, filename, errors, comments) {
 	error(
-		COMPONENT_RETURN_VALUE_ERROR,
+		TSRX_RETURN_STATEMENT_ERROR,
 		filename ?? null,
 		get_return_keyword_node(node),
 		errors,
 		comments,
+		DIAGNOSTIC_CODES.TEMPLATE_RETURN_STATEMENT,
 	);
 }
 
@@ -204,14 +198,8 @@ export function validate_component_return_statement(node, filename, errors, comm
  * @param {CompileError[]} [errors]
  * @param {AST.CommentWithLocation[]} [comments]
  */
-export function validate_component_loop_return_statement(node, filename, errors, comments) {
-	error(
-		COMPONENT_LOOP_RETURN_ERROR,
-		filename ?? null,
-		get_return_keyword_node(node),
-		errors,
-		comments,
-	);
+export function validate_tsrx_loop_return_statement(node, filename, errors, comments) {
+	error(TSRX_LOOP_RETURN_ERROR, filename ?? null, get_return_keyword_node(node), errors, comments);
 }
 
 /**
@@ -220,9 +208,9 @@ export function validate_component_loop_return_statement(node, filename, errors,
  * @param {CompileError[]} [errors]
  * @param {AST.CommentWithLocation[]} [comments]
  */
-export function validate_component_loop_break_statement(node, filename, errors, comments) {
+export function validate_tsrx_loop_break_statement(node, filename, errors, comments) {
 	error(
-		COMPONENT_LOOP_BREAK_ERROR,
+		TSRX_LOOP_BREAK_ERROR,
 		filename ?? null,
 		get_statement_keyword_node(node, 'break'),
 		errors,
@@ -236,76 +224,21 @@ export function validate_component_loop_break_statement(node, filename, errors,
  * @param {CompileError[]} [errors]
  * @param {AST.CommentWithLocation[]} [comments]
  */
-export function validate_component_unsupported_loop_statement(node, filename, errors, comments) {
+export function validate_tsrx_unsupported_loop_statement(node, filename, errors, comments) {
 	let message;
 	if (node.type === 'ForStatement') {
-		message = COMPONENT_FOR_STATEMENT_ERROR;
+		message = TSRX_FOR_STATEMENT_ERROR;
 	} else if (node.type === 'ForInStatement') {
-		message = COMPONENT_FOR_IN_STATEMENT_ERROR;
+		message = TSRX_FOR_IN_STATEMENT_ERROR;
 	} else if (node.type === 'WhileStatement') {
-		message = COMPONENT_WHILE_STATEMENT_ERROR;
+		message = TSRX_WHILE_STATEMENT_ERROR;
 	} else {
-		message = COMPONENT_DO_WHILE_STATEMENT_ERROR;
+		message = TSRX_DO_WHILE_STATEMENT_ERROR;
 	}
 
 	error(message, filename ?? null, node, errors, comments);
 }
 
-/**
- * Validates that a component declares at most a single (props) parameter.
- * Components have one slot for props; additional positional parameters are
- * silently dropped or naively passed through depending on the target, so
- * reject them at analysis time. Reports one error per extra parameter so
- * every offending input gets its own TS diagnostic squiggle. In throwing
- * mode the first call raises and aborts before the loop continues.
- *
- * @param {AST.Component} component
- * @param {string | null | undefined} filename
- * @param {CompileError[]} [errors]
- * @param {AST.CommentWithLocation[]} [comments]
- */
-export function validate_component_params(component, filename, errors, comments) {
-	const params = /** @type {AST.Pattern[] | undefined} */ (component.params);
-	if (!params || params.length <= 1) {
-		return;
-	}
-
-	for (let i = 1; i < params.length; i++) {
-		error(COMPONENT_MULTIPLE_PARAMS_ERROR, filename ?? null, params[i], errors, comments);
-	}
-}
-
-/**
- * Validates that components declared at the top level of a class body use the
- * only allowed form: an arrow function class property (regular or static).
- * Reports an error for non-arrow component property values such as
- * `Foo = component() { ... }`. The method form (`component foo() {}` inside
- * a class body) is rejected at parse time and never reaches this check.
- *
- * @param {AST.ClassBody} class_body
- * @param {string | null | undefined} filename
- * @param {CompileError[]} [errors]
- * @param {AST.CommentWithLocation[]} [comments]
- */
-export function validate_class_component_declarations(class_body, filename, errors, comments) {
-	for (const member of class_body.body) {
-		if (member.type !== 'PropertyDefinition') {
-			continue;
-		}
-
-		const value = /** @type {any} */ (member).value;
-		if (value && value.type === 'Component' && !value.metadata?.arrow) {
-			error(
-				CLASS_COMPONENT_AS_NON_ARROW_PROPERTY_ERROR,
-				filename ?? null,
-				member,
-				errors,
-				comments,
-			);
-		}
-	}
-}
-
 /**
  * @param {AST.Element} element
  * @param {AnalysisContext} context

package/src/diagnostics.js

@@ -1,9 +1,7 @@
 export const DIAGNOSTIC_CODES = {
 	JSX_EXPRESSION_VALUE: 'tsrx-jsx-expression-value',
-	JSX_RETURN_IN_COMPONENT: 'tsrx-jsx-return-in-component',
-	FUNCTION_COMPONENT_SYNTAX: 'tsrx-function-component-syntax',
 	UNCLOSED_TAG: 'tsrx-unclosed-tag',
 	MISMATCHED_CLOSING_TAG: 'tsrx-mismatched-closing-tag',
 	TEMPLATE_EXPRESSION_TRAILING_SEMICOLON: 'tsrx-template-expression-trailing-semicolon',
-	HTML_DIRECTIVE_AS_ATTRIBUTE_VALUE: 'tsrx-html-directive-as-attribute-value',
+	TEMPLATE_RETURN_STATEMENT: 'tsrx-template-return-statement',
 };

package/src/index.js

@@ -86,7 +86,6 @@ export {
 	build_fallback as buildFallback,
 	build_assignment_value as buildAssignmentValue,
 	is_class_node as isClassNode,
-	is_component_node as isComponentNode,
 	is_function_node as isFunctionNode,
 	is_function_or_component_node as isFunctionOrComponentNode,
 	is_inside_component as isInsideComponent,
@@ -142,35 +141,25 @@ export { escape, escape_script as escapeScript } from './utils/escaping.js';
 
 // Transform
 export {
-	add_ref_target_type_to_ref_prop_attributes as addRefTargetTypeToRefPropAttributes,
 	add_jsx_setup_declaration as addJsxSetupDeclaration,
 	clone_switch_helper_invocation as cloneSwitchHelperInvocation,
 	collect_param_bindings as collectParamBindings,
 	collect_statement_bindings as collectStatementBindings,
 	create_hook_safe_helper as createHookSafeHelper,
-	create_host_html_attribute as createHostHtmlAttribute,
-	create_host_html_conflict_error as createHostHtmlConflictError,
 	create_element_ref_target_type as createElementRefTargetType,
 	create_element_ref_target_type_for_name as createElementRefTargetTypeForName,
 	createJsxTransform,
-	CREATE_REF_PROP_INTERNAL_NAME,
 	extract_jsx_setup_declarations as extractJsxSetupDeclarations,
-	get_host_html_conflicting_attribute as getHostHtmlConflictingAttribute,
-	get_invalid_html_child_error_message as getInvalidHtmlChildErrorMessage,
 	is_component_like_element,
-	is_ref_expression_attribute_value as isRefExpressionAttributeValue,
-	is_ref_prop_expression as isRefPropExpression,
 	MERGE_REFS_INTERNAL_NAME,
 	merge_duplicate_refs as mergeDuplicateRefs,
+	NORMALIZE_SPREAD_PROPS_FOR_REF_ATTR_INTERNAL_NAME,
 	NORMALIZE_SPREAD_PROPS_INTERNAL_NAME,
 	plan_switch_lift as planSwitchLift,
-	recover_invalid_html_child as recoverInvalidHtmlChild,
-	rewrite_host_html_children as rewriteHostHtmlChildren,
 	return_value_body_to_expression as returnValueBodyToExpression,
 	rewrite_loop_continues_to_bare_returns as rewriteLoopContinuesToBareReturns,
 	to_jsx_attribute as toJsxAttribute,
 	validate_at_most_one_ref_attribute as validateAtMostOneRefAttribute,
-	component_to_function_declaration as componentToFunctionDeclaration,
 } from './transform/jsx/index.js';
 export {
 	ensure_function_metadata as ensureFunctionMetadata,
@@ -178,6 +167,11 @@ export {
 	tsx_node_to_jsx_expression as tsxNodeToJsxExpression,
 	tsx_with_ts_locations as tsxWithTsLocations,
 } from './transform/jsx/helpers.js';
+export {
+	collect_style_ref_attributes as collectStyleRefAttributes,
+	create_style_class_map as createStyleClassMap,
+	create_style_ref_setup_statements as createStyleRefSetupStatements,
+} from './transform/style-ref.js';
 export {
 	clone_expression_node,
 	clone_identifier,
@@ -224,7 +218,7 @@ export {
 } from './transform/lazy.js';
 export {
 	find_first_top_level_await as findFirstTopLevelAwait,
-	find_first_top_level_await_in_component_body as findFirstTopLevelAwaitInComponentBody,
+	find_first_top_level_await_in_tsrx_function_body as findFirstTopLevelAwaitInTsrxFunctionBody,
 } from './transform/await.js';
 export {
 	is_interleaved_body as isInterleavedBody,
@@ -243,22 +237,18 @@ export {
 export { analyze_css as analyzeCss } from './analyze/css-analyze.js';
 export { prune_css as pruneCss } from './analyze/prune.js';
 export {
-	CLASS_COMPONENT_AS_NON_ARROW_PROPERTY_ERROR,
-	COMPONENT_DO_WHILE_STATEMENT_ERROR,
-	COMPONENT_FOR_IN_STATEMENT_ERROR,
-	COMPONENT_FOR_STATEMENT_ERROR,
-	COMPONENT_LOOP_BREAK_ERROR,
-	COMPONENT_LOOP_RETURN_ERROR,
-	COMPONENT_MULTIPLE_PARAMS_ERROR,
-	COMPONENT_RETURN_VALUE_ERROR,
-	COMPONENT_WHILE_STATEMENT_ERROR,
+	TSRX_DO_WHILE_STATEMENT_ERROR,
+	TSRX_FOR_IN_STATEMENT_ERROR,
+	TSRX_FOR_STATEMENT_ERROR,
+	TSRX_LOOP_BREAK_ERROR,
+	TSRX_LOOP_RETURN_ERROR,
+	TSRX_RETURN_STATEMENT_ERROR,
+	TSRX_WHILE_STATEMENT_ERROR,
 	get_return_keyword_node as getReturnKeywordNode,
 	get_statement_keyword_node as getStatementKeywordNode,
-	validate_class_component_declarations as validateClassComponentDeclarations,
-	validate_component_loop_break_statement as validateComponentLoopBreakStatement,
-	validate_component_loop_return_statement as validateComponentLoopReturnStatement,
-	validate_component_params as validateComponentParams,
-	validate_component_return_statement as validateComponentReturnStatement,
-	validate_component_unsupported_loop_statement as validateComponentUnsupportedLoopStatement,
+	validate_tsrx_loop_break_statement as validateTsrxLoopBreakStatement,
+	validate_tsrx_loop_return_statement as validateTsrxLoopReturnStatement,
+	validate_tsrx_return_statement as validateTsrxReturnStatement,
+	validate_tsrx_unsupported_loop_statement as validateTsrxUnsupportedLoopStatement,
 	validate_nesting as validateNesting,
 } from './analyze/validation.js';

package/src/parse/index.js

@@ -145,6 +145,36 @@ function elementTemplateClosingTagPlugin(Base) {
 		return false;
 	}
 
+	/**
+	 * @param {any} parser
+	 */
+	function isOpeningTagAfterReturnKeyword(parser) {
+		if (parser.input.charCodeAt(parser.start + 1) === 47 /* '/' */) return false;
+
+		let index = parser.start - 1;
+		while (index >= 0) {
+			const ch = parser.input.charCodeAt(index);
+			if (ch === 32 /* ' ' */ || ch === 9 /* '\t' */) {
+				index--;
+				continue;
+			}
+			if (ch === 10 /* '\n' */ || ch === 13 /* '\r' */) return false;
+			break;
+		}
+
+		const end = index + 1;
+		const start = end - 'return'.length;
+		if (start < 0 || parser.input.slice(start, end) !== 'return') return false;
+		const before = start > 0 ? parser.input.charCodeAt(start - 1) : -1;
+		return !(
+			(before >= 48 /* '0' */ && before <= 57) ||
+			(before >= 65 /* 'A' */ && before <= 90) ||
+			(before >= 97 /* 'a' */ && before <= 122) ||
+			before === 36 /* '$' */ ||
+			before === 95 /* '_' */
+		);
+	}
+
 	return class extends Base {
 		/** @param {number} code */
 		// @ts-ignore — extending acorn's Parser with internal hooks
@@ -165,7 +195,13 @@ function elementTemplateClosingTagPlugin(Base) {
 		// @ts-ignore — extending acorn's Parser with internal hooks
 		canInsertSemicolon() {
 			const self = /** @type {any} */ (this);
-			if (self.type === jsxTagStart && inElementTemplateBodyAnywhere(self)) return true;
+			if (
+				self.type === jsxTagStart &&
+				inElementTemplateBodyAnywhere(self) &&
+				!isOpeningTagAfterReturnKeyword(self)
+			) {
+				return true;
+			}
 			// @ts-ignore
 			return super.canInsertSemicolon();
 		}
@@ -592,7 +628,6 @@ export function get_comment_handlers(source, comments, index = 0) {
 								if (
 									parent.type === 'BlockStatement' ||
 									parent.type === 'Program' ||
-									parent.type === 'Component' ||
 									parent.type === 'ClassBody'
 								) {
 									node_array = parent.body;
@@ -783,8 +818,6 @@ export function get_comment_handlers(source, comments, index = 0) {
 									const isStatementContext =
 										parent.type === 'BlockStatement' || parent.type === 'Program';
 
-									// Don't apply for Component - let Prettier handle comment attachment there
-									// Component bodies have different comment handling via metadata.elementLeadingComments
 									if (!isStatementContext) {
 										return;
 									}