@tsrx/core 0.0.6 → 0.0.8

package/package.json

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

package/src/index.js

@@ -164,6 +164,13 @@ export {
 	is_capturable_jsx_child as isCapturableJsxChild,
 	capture_jsx_child as captureJsxChild,
 } from './transform/jsx-interleave.js';
+export {
+	is_static_literal as isStaticLiteral,
+	is_hoist_safe_expression as isHoistSafeExpression,
+	is_hoist_safe_jsx_child as isHoistSafeJsxChild,
+	is_hoist_safe_jsx_attribute as isHoistSafeJsxAttribute,
+	is_hoist_safe_jsx_node as isHoistSafeJsxNode,
+} from './transform/jsx-hoist.js';
 
 // Analyze
 export { analyze_css as analyzeCss } from './analyze/css-analyze.js';

package/src/plugin.js

@@ -1431,7 +1431,8 @@ export function TSRXPlugin(config) {
 			/**
 			 * Override jsx_parseElement to intercept expression-level JSX.
 			 * This is called by acorn-jsx's parseExprAtom when it encounters <
-			 * in expression position. Only <tsx> and <tsx:*> are allowed.
+			 * in expression position. Bare fragments are treated as shorthand
+			 * for <tsx>...</tsx>; other tags must still use <tsx> or <tsx:*>.
 			 * @type {Parse.Parser['jsx_parseElement']}
 			 */
 			jsx_parseElement() {
@@ -1444,6 +1445,7 @@ export function TSRXPlugin(config) {
 				// Check if the element being parsed IS a <tsx> or <tsx:*> tag
 				// Current token is jsxTagStart, this.end is position after '<'
 				const tag_name_start = this.end;
+				const is_fragment_tag = this.input.charCodeAt(tag_name_start) === 62;
 				const char_after_tsx = this.input.charCodeAt(tag_name_start + 3);
 				const is_tsx_tag =
 					this.input.startsWith('tsx', tag_name_start) &&
@@ -1456,8 +1458,9 @@ export function TSRXPlugin(config) {
 						char_after_tsx === 13 || // carriage return
 						char_after_tsx === 58); // : (tsx:react)
 
-				if (is_tsx_tag) {
-					// Use Ripple's parseElement to create a Tsx/TsxCompat node
+				if (is_fragment_tag || is_tsx_tag) {
+					// Use Ripple's parseElement to create a Tsx/TsxCompat node.
+					// Bare fragments (<></>) are shorthand for <tsx>...</tsx>.
 					this.next();
 					return /** @type {import('estree-jsx').JSXElement} */ (
 						/** @type {unknown} */ (this.parseElement())
@@ -1524,6 +1527,8 @@ export function TSRXPlugin(config) {
 							`TSX elements cannot be self-closing. '<tsx />' must have a closing tag '</tsx>'.`,
 						);
 					}
+				} else if (is_fragment) {
+					/** @type {AST.Tsx} */ (element).type = 'Tsx';
 				} else {
 					element.type = 'Element';
 				}
@@ -1575,6 +1580,26 @@ export function TSRXPlugin(config) {
 					this.enterScope(0);
 					this.parseTemplateBody(/** @type {AST.Element} */ (element).children);
 					this.exitScope();
+
+					if (element.type === 'Tsx') {
+						this.#path.pop();
+
+						if (!element.unclosed) {
+							const raise_error = () => {
+								this.raise(this.start, `Expected closing tag '</>'`);
+							};
+
+							this.next();
+							if (this.value !== '/') {
+								raise_error();
+							}
+							this.next();
+							if (this.type !== tstt.jsxTagEnd) {
+								raise_error();
+							}
+							this.next();
+						}
+					}
 				} else {
 					if (/** @type {ESTreeJSX.JSXIdentifier} */ (open.name).name === 'script') {
 						let content = '';
@@ -1875,7 +1900,11 @@ export function TSRXPlugin(config) {
 							return;
 						}
 
-						if (this.input.slice(this.pos, this.pos + 4) === '/tsx') {
+						if (!inside_tsx.openingElement.name) {
+							if (this.input.slice(this.pos, this.pos + 2) === '/>') {
+								return;
+							}
+						} else if (this.input.slice(this.pos, this.pos + 4) === '/tsx') {
 							const after = this.input.charCodeAt(this.pos + 4);
 							// Make sure it's </tsx> and not </tsx:...>
 							if (after === 62 /* > */) {
@@ -2046,7 +2075,7 @@ export function TSRXPlugin(config) {
 									? closingElement.name.namespace.name + ':' + closingElement.name.name.name
 									: this.getElementName(closingElement.name);
 						} else if (currentElement.type === 'Tsx') {
-							openingTagName = 'tsx';
+							openingTagName = currentElement.openingElement.name ? 'tsx' : null;
 							closingTagName =
 								closingElement.name?.type === 'JSXNamespacedName'
 									? closingElement.name.namespace.name + ':' + closingElement.name.name.name
@@ -2081,7 +2110,9 @@ export function TSRXPlugin(config) {
 										elem.type === 'TsxCompat'
 											? 'tsx:' + elem.kind
 											: elem.type === 'Tsx'
-												? 'tsx'
+												? elem.openingElement.name
+													? 'tsx'
+													: null
 												: elem.id
 													? this.getElementName(elem.id)
 													: null;

package/src/transform/jsx-hoist.js

@@ -0,0 +1,119 @@
+/** @import * as ESTreeJSX from 'estree-jsx' */
+
+/**
+ * Predicates that decide whether a JSX subtree can be safely hoisted out of a
+ * component body into a module-level `const`. A subtree is hoist-safe only
+ * when evaluating it at module-load time produces the same value as
+ * evaluating it on every render — i.e. it contains no identifier references,
+ * no calls, no spreads, and no other render-time expressions.
+ */
+
+/**
+ * @param {import('estree').Literal} node
+ * @returns {boolean}
+ */
+export function is_static_literal(node) {
+	return (
+		node.value === null ||
+		typeof node.value === 'string' ||
+		typeof node.value === 'number' ||
+		typeof node.value === 'boolean' ||
+		typeof node.value === 'bigint'
+	);
+}
+
+/**
+ * @param {any} node
+ * @returns {boolean}
+ */
+export function is_hoist_safe_expression(node) {
+	if (!node || typeof node !== 'object') return false;
+
+	switch (node.type) {
+		case 'Literal':
+			return is_static_literal(node);
+		case 'TemplateLiteral':
+			return node.expressions.length === 0;
+		case 'UnaryExpression':
+			return node.operator !== 'delete' && is_hoist_safe_expression(node.argument);
+		case 'BinaryExpression':
+		case 'LogicalExpression':
+			return is_hoist_safe_expression(node.left) && is_hoist_safe_expression(node.right);
+		case 'ConditionalExpression':
+			return (
+				is_hoist_safe_expression(node.test) &&
+				is_hoist_safe_expression(node.consequent) &&
+				is_hoist_safe_expression(node.alternate)
+			);
+		case 'SequenceExpression':
+			return node.expressions.every(is_hoist_safe_expression);
+		case 'ParenthesizedExpression':
+			return is_hoist_safe_expression(node.expression);
+		case 'JSXElement':
+			return is_hoist_safe_jsx_node(node);
+		case 'JSXFragment':
+			return node.children.every(is_hoist_safe_jsx_child);
+		default:
+			return false;
+	}
+}
+
+/**
+ * @param {any} node
+ * @returns {boolean}
+ */
+export function is_hoist_safe_jsx_child(node) {
+	if (!node || typeof node !== 'object') return false;
+
+	switch (node.type) {
+		case 'JSXText':
+			return true;
+		case 'JSXElement':
+			return is_hoist_safe_jsx_node(node);
+		case 'JSXFragment':
+			return node.children.every(is_hoist_safe_jsx_child);
+		case 'JSXExpressionContainer':
+			return (
+				node.expression.type !== 'JSXEmptyExpression' && is_hoist_safe_expression(node.expression)
+			);
+		default:
+			return false;
+	}
+}
+
+/**
+ * @param {ESTreeJSX.JSXAttribute | ESTreeJSX.JSXSpreadAttribute} attribute
+ * @returns {boolean}
+ */
+export function is_hoist_safe_jsx_attribute(attribute) {
+	if (attribute.type === 'JSXSpreadAttribute') return false;
+	if (attribute.value == null) return true;
+
+	if (attribute.value.type === 'Literal') {
+		return is_static_literal(attribute.value);
+	}
+
+	if (attribute.value.type === 'JSXExpressionContainer') {
+		return (
+			attribute.value.expression.type !== 'JSXEmptyExpression' &&
+			is_hoist_safe_expression(attribute.value.expression)
+		);
+	}
+
+	return false;
+}
+
+/**
+ * @param {ESTreeJSX.JSXElement | ESTreeJSX.JSXFragment} node
+ * @returns {boolean}
+ */
+export function is_hoist_safe_jsx_node(node) {
+	if (node.type === 'JSXFragment') {
+		return node.children.every(is_hoist_safe_jsx_child);
+	}
+
+	return (
+		node.openingElement.attributes.every(is_hoist_safe_jsx_attribute) &&
+		node.children.every(is_hoist_safe_jsx_child)
+	);
+}

package/src/transform/segments.js

@@ -1618,9 +1618,18 @@ export function convert_source_map_to_mappings(
 				node.type === 'TSTypeParameterDeclaration'
 			) {
 				if (node.loc) {
-					mappings.push(
-						get_mapping_from_node(node, src_to_gen_map, gen_line_offsets, mapping_data_verify_only),
+					// Generic spans can be emitted by downstream transforms with sparse source-map
+					// coverage around the angle-bracket delimiters. Skip missing whole-node mappings
+					// instead of crashing Volar, and rely on child type-node mappings instead.
+					const mapping = maybe_get_mapping_from_node(
+						node,
+						src_to_gen_map,
+						gen_line_offsets,
+						mapping_data_verify_only,
 					);
+					if (!(mapping instanceof Error)) {
+						mappings.push(mapping);
+					}
 				}
 				// Generic type parameters - visit to collect type variable names
 				if (node.params) {

package/types/index.d.ts

@@ -98,6 +98,12 @@ declare module 'estree' {
 		};
 	}
 
+	interface SimpleCallExpression {
+		metadata: BaseNodeMetaData & {
+			hash?: string;
+		};
+	}
+
 	type Accessibility = 'public' | 'protected' | 'private'; // missing in acorn-typescript types
 	interface MethodDefinition {
 		typeParameters?: TSTypeParameterDeclaration;
@@ -1335,6 +1341,11 @@ export interface AnalysisState extends BaseState {
 		styleClasses?: StyleClasses;
 	};
 	mode: CompileOptions['mode'];
+	// keep this as an object as we destructure
+	module: {
+		// Incremented counter for generating unique track/trackAsync hashes
+		track_id: number;
+	};
 }
 
 export interface TransformServerState extends BaseState {

package/types/parse.d.ts

@@ -1652,7 +1652,6 @@ export namespace Parse {
 			startLoc?: AST.Position,
 		): ESTreeJSX.JSXOpeningElement;
 		// it could also be ESTreeJSX.JSXOpeningFragment
-		// but not in our case since we don't use fragments
 
 		/**
 		 * Parse JSX closing element at position