@tsrx/core 0.1.14 → 0.1.16

package/package.json

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

package/src/parse/index.js

@@ -605,6 +605,10 @@ export function get_comment_handlers(source, comments, index = 0) {
 									node_array = parent.elements;
 								} else if (parent.type === 'ObjectExpression') {
 									node_array = parent.properties;
+								} else if (parent.type === 'ObjectPattern') {
+									node_array = parent.properties;
+								} else if (parent.type === 'TSTypeLiteral') {
+									node_array = parent.members;
 								} else if (
 									parent.type === 'FunctionDeclaration' ||
 									parent.type === 'FunctionExpression' ||
@@ -622,11 +626,22 @@ export function get_comment_handlers(source, comments, index = 0) {
 								is_last_in_array = node_array.indexOf(node) === node_array.length - 1;
 							}
 
+							const trailingCommentBoundary =
+								parent &&
+								parent.type === 'ObjectPattern' &&
+								parent.typeAnnotation &&
+								parent.typeAnnotation.start !== undefined
+									? parent.typeAnnotation.start
+									: parent?.end;
+
 							if (is_last_in_array) {
 								if (isParam || isArgument) {
 									while (comments.length) {
 										const potentialComment = comments[0];
-										if (parent && potentialComment.start >= parent.end) {
+										if (
+											trailingCommentBoundary !== undefined &&
+											potentialComment.start >= trailingCommentBoundary
+										) {
 											break;
 										}
 
@@ -653,7 +668,12 @@ export function get_comment_handlers(source, comments, index = 0) {
 									// and they can be separated by newlines
 									while (comments.length) {
 										const comment = comments[0];
-										if (parent && comment.start >= parent.end) break;
+										if (
+											trailingCommentBoundary !== undefined &&
+											comment.start >= trailingCommentBoundary
+										) {
+											break;
+										}
 
 										const maybeInner = getEmptyElementInnerCommentTarget(comment);
 										if (maybeInner) {

package/src/plugin.js

@@ -21,6 +21,10 @@ const JSX_EXPRESSION_VALUE_ERROR =
 	'JSX elements cannot be used as expressions. Wrap JSX with `<>...</>` or `<tsx>...</tsx>`, wrap TSRX templates with `<tsrx>...</tsrx>`, or use elements as statements within a component.';
 const HTML_ATTRIBUTE_VALUE_ERROR =
 	'`{html ...}` is not supported as an attribute value. Use a string literal or expression without `html`.';
+const DYNAMIC_ELEMENT_IN_TSX_ERROR =
+	'Dynamic element syntax (`<@...>`) is only supported in native TSRX templates.';
+const DYNAMIC_ATTRIBUTE_NAME_ERROR =
+	'Dynamic component / element syntax (`@`) is only supported on native TSRX element names, not attribute names.';
 
 const CharCode = Object.freeze({
 	tab: 9,
@@ -408,6 +412,38 @@ export function TSRXPlugin(config) {
 				);
 			}
 
+			/**
+			 * @param {AST.Node[]} children
+			 */
+			#reportDynamicJsxElementsInTsx(children) {
+				for (const child of children) {
+					if (child?.type === 'Tsrx') {
+						continue;
+					}
+					if (child?.type === 'JSXElement') {
+						const name = child.openingElement?.name;
+						if (name?.type === 'JSXIdentifier' && name.name === 'tsrx') {
+							continue;
+						}
+						const is_dynamic_name =
+							(name?.type === 'JSXIdentifier' && name.tracked) ||
+							(name?.type === 'JSXMemberExpression' &&
+								name.object.type === 'JSXIdentifier' &&
+								name.object.tracked);
+						if (is_dynamic_name) {
+							this.#report_recoverable_error_range(
+								/** @type {AST.NodeWithLocation} */ (name).start ?? child.start,
+								/** @type {AST.NodeWithLocation} */ (name).end ?? child.end,
+								DYNAMIC_ELEMENT_IN_TSX_ERROR,
+							);
+						}
+						this.#reportDynamicJsxElementsInTsx(/** @type {AST.Node[]} */ (child.children));
+					} else if (child?.type === 'Tsx' || child?.type === 'TsxCompat') {
+						this.#reportDynamicJsxElementsInTsx(/** @type {AST.Node[]} */ (child.children));
+					}
+				}
+			}
+
 			#parseNativeTemplateExpressionContainer() {
 				const allow_trailing_semicolon = this.#allowExpressionContainerTrailingSemicolon;
 				this.#allowExpressionContainerTrailingSemicolon = true;
@@ -2107,6 +2143,20 @@ export function TSRXPlugin(config) {
 					}
 				}
 				/** @type {ESTreeJSX.JSXAttribute} */ (node).name = this.jsx_parseNamespacedName();
+				if (
+					/** @type {ESTreeJSX.JSXAttribute} */ (node).name.type === 'JSXIdentifier' &&
+					/** @type {ESTreeJSX.JSXIdentifier} */ (/** @type {ESTreeJSX.JSXAttribute} */ (node).name)
+						.tracked
+				) {
+					this.#report_recoverable_error_range(
+						/** @type {AST.NodeWithLocation} */ (node).start,
+						/** @type {AST.NodeWithLocation} */ (/** @type {ESTreeJSX.JSXAttribute} */ (node).name)
+							.end ??
+							node.end ??
+							node.start,
+						DYNAMIC_ATTRIBUTE_NAME_ERROR,
+					);
+				}
 				const value = /** @type {ESTreeJSX.JSXAttribute['value'] | null} */ (
 					this.eat(tt.eq) ? this.jsx_parseAttributeValue() : null
 				);
@@ -2512,6 +2562,13 @@ export function TSRXPlugin(config) {
 					(current_template_node?.type === 'TsxCompat' || current_template_node?.type === 'Tsx') &&
 					!is_tsrx_tag
 				) {
+					if (this.input.charCodeAt(tag_name_start) === CharCode.at) {
+						this.#report_recoverable_error_range(
+							this.start,
+							tag_name_start + 1,
+							DYNAMIC_ELEMENT_IN_TSX_ERROR,
+						);
+					}
 					// Inside tsx/tsx:*, let acorn-jsx handle regular TSX tags normally.
 					// Nested <tsrx> still needs Ripple's native template parser so it
 					// can lower through the same path as <tsrx> in component bodies.
@@ -2603,6 +2660,12 @@ export function TSRXPlugin(config) {
 					!is_tsx_compat &&
 					open.name.type === 'JSXIdentifier' &&
 					open.name.name === 'tsrx';
+				const is_dynamic_name =
+					!is_fragment &&
+					((open.name.type === 'JSXIdentifier' && open.name.tracked) ||
+						(open.name.type === 'JSXMemberExpression' &&
+							open.name.object.type === 'JSXIdentifier' &&
+							open.name.object.tracked));
 
 				if (is_tsx_compat) {
 					const namespace_node = /** @type {ESTreeJSX.JSXNamespacedName} */ (open.name);
@@ -2640,6 +2703,14 @@ export function TSRXPlugin(config) {
 					element.type = 'Element';
 				}
 
+				if ((is_tsx || is_fragment) && is_dynamic_name) {
+					this.#report_recoverable_error_range(
+						open.name.start ?? open.start,
+						open.name.end ?? open.end,
+						DYNAMIC_ELEMENT_IN_TSX_ERROR,
+					);
+				}
+
 				for (const attr of open.attributes) {
 					if (attr.type === 'JSXAttribute') {
 						/** @type {AST.Attribute} */ (/** @type {unknown} */ (attr)).type = 'Attribute';
@@ -2698,6 +2769,7 @@ export function TSRXPlugin(config) {
 					this.#parseNativeTemplateBody(element, /** @type {AST.Element} */ (element).children, {
 						enterScope: true,
 					});
+					this.#reportDynamicJsxElementsInTsx(/** @type {AST.Element} */ (element).children);
 
 					if (/** @type {AST.Tsx} */ (element).type === 'Tsx') {
 						this.#path.pop();
@@ -2875,6 +2947,9 @@ export function TSRXPlugin(config) {
 						this.#parseNativeTemplateBody(element, /** @type {AST.Element} */ (element).children, {
 							enterScope: true,
 						});
+						if (/** @type {AST.Tsx} */ (element).type === 'Tsx') {
+							this.#reportDynamicJsxElementsInTsx(/** @type {AST.Element} */ (element).children);
+						}
 
 						if (/** @type {AST.Tsx} */ (element).type === 'Tsx') {
 							this.#path.pop();

package/src/transform/jsx/helpers.js

@@ -235,6 +235,7 @@ export function tsx_with_ts_locations() {
 		'AwaitExpression',
 		'SwitchStatement',
 		'TaggedTemplateExpression',
+		'ArrowFunctionExpression',
 		// JSX wrapper nodes: esrap writes `<`, `>`, `</`, `{`, `}` without
 		// locations, so the opening/closing element's and expression
 		// container's start and end don't resolve.

package/src/transform/segments.js

@@ -903,6 +903,23 @@ export function convert_source_map_to_mappings(
 				node.type === 'ArrowFunctionExpression'
 			) {
 				const is_method = node.metadata?.is_method;
+
+				if (node.type === 'ArrowFunctionExpression' && node.loc) {
+					const start_key = `${node.loc.start.line}:${node.loc.start.column}`;
+					const end_key = `${node.loc.end.line}:${node.loc.end.column}`;
+
+					if (src_to_gen_map.has(start_key) && src_to_gen_map.has(end_key)) {
+						mappings.push(
+							get_mapping_from_node(
+								node,
+								src_to_gen_map,
+								gen_line_offsets,
+								mapping_data_verify_only,
+							),
+						);
+					}
+				}
+
 				// Add function/component keyword token
 				if (
 					(node.type === 'FunctionDeclaration' || node.type === 'FunctionExpression') &&