@tsrx/core 0.0.27 → 0.1.0

package/package.json

@@ -3,7 +3,7 @@
   "description": "Core compiler infrastructure for TSRX syntax",
   "license": "MIT",
   "author": "Dominic Gannaway",
-  "version": "0.0.27",
+  "version": "0.1.0",
   "type": "module",
   "repository": {
     "type": "git",
@@ -27,10 +27,11 @@
     "./types/acorn": {
       "types": "./types/acorn.d.ts"
     },
-    "./runtime/merge-refs": {
-      "types": "./types/runtime/merge-refs.d.ts",
-      "default": "./src/runtime/merge-refs.js"
+    "./runtime/ref": {
+      "types": "./types/runtime/ref.d.ts",
+      "default": "./src/runtime/ref.js"
     },
+    "./runtime/*": "./src/runtime/*.js",
     "./test-harness/source-mappings": "./tests/shared/source-mappings.js",
     "./test-harness/compile": "./tests/shared/compile.js"
   },

package/src/index.js

@@ -141,8 +141,14 @@ export { escape, escape_script as escapeScript } from './utils/escaping.js';
 
 // Transform
 export {
+	add_jsx_setup_declaration as addJsxSetupDeclaration,
 	createJsxTransform,
+	CREATE_REF_PROP_INTERNAL_NAME,
+	extract_jsx_setup_declarations as extractJsxSetupDeclarations,
+	is_ref_prop_expression as isRefPropExpression,
+	MERGE_REFS_INTERNAL_NAME,
 	merge_duplicate_refs as mergeDuplicateRefs,
+	NORMALIZE_SPREAD_PROPS_INTERNAL_NAME,
 	rewrite_loop_continues_to_bare_returns as rewriteLoopContinuesToBareReturns,
 	to_jsx_attribute as toJsxAttribute,
 	validate_at_most_one_ref_attribute as validateAtMostOneRefAttribute,

package/src/plugin.js

@@ -18,7 +18,7 @@ import { error } from './errors.js';
 import { DIAGNOSTIC_CODES } from './diagnostics.js';
 
 const JSX_EXPRESSION_VALUE_ERROR =
-	'JSX elements cannot be used as expressions. Wrap with `<>...</>` or `<tsx>...</tsx>` or use elements as statements within a component.';
+	'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.';
 
 /** @type {WeakMap<Record<string, boolean>, Map<string, number>>} */
 const argument_clash_first_positions = new WeakMap();
@@ -325,7 +325,10 @@ export function TSRXPlugin(config) {
 				}
 
 				const parent = this.#path.at(-1);
-				if (!parent || (parent.type !== 'Component' && parent.type !== 'Element')) {
+				if (
+					!parent ||
+					(parent.type !== 'Component' && parent.type !== 'Element' && parent.type !== 'Tsrx')
+				) {
 					return false;
 				}
 
@@ -1320,7 +1323,7 @@ export function TSRXPlugin(config) {
 					if (!nextChars) {
 						this.raise(
 							ref.start,
-							'"component" is a Ripple keyword and cannot be used as an identifier',
+							'"component" is a TSRX keyword and cannot be used as an identifier',
 						);
 					}
 				}
@@ -1345,6 +1348,21 @@ export function TSRXPlugin(config) {
 				let node = /** @type {ESTreeJSX.JSXExpressionContainer} */ (this.startNode());
 				this.next();
 
+				if (this.type === tt.name && this.value === 'ref') {
+					const ref_node = /** @type {AST.RefExpression} */ (this.startNode());
+					this.next();
+					if (this.type === tt.braceR) {
+						this.raise(
+							this.start,
+							'"ref" is a TSRX keyword and must be used in the form {ref item}',
+						);
+					}
+					ref_node.argument = this.parseMaybeAssign();
+					node.expression = /** @type {any} */ (this.finishNode(ref_node, 'RefExpression'));
+					this.expect(tt.braceR);
+					return this.finishNode(node, 'JSXExpressionContainer');
+				}
+
 				if (this.type === tt.name && this.value === 'html') {
 					node.html = true;
 					this.next();
@@ -1794,7 +1812,8 @@ export function TSRXPlugin(config) {
 								ch === 125 &&
 								(this.#path.length === 0 ||
 									this.#path.at(-1)?.type === 'Component' ||
-									this.#path.at(-1)?.type === 'Element')
+									this.#path.at(-1)?.type === 'Element' ||
+									this.#path.at(-1)?.type === 'Tsrx')
 							) {
 								this.#resetTokenStartToCurrentPosition();
 								return original.readToken.call(this, ch);
@@ -1834,7 +1853,9 @@ 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. Bare fragments are treated as shorthand
-			 * for <tsx>...</tsx>; other tags must still use <tsx> or <tsx:*>.
+			 * for <tsx>...</tsx>. <tsrx>...</tsrx> admits native TSRX
+			 * template syntax as an expression value. Other tags must still use
+			 * <tsx>, <tsrx>, or <tsx:*>.
 			 * @type {Parse.Parser['jsx_parseElement']}
 			 */
 			jsx_parseElement() {
@@ -1844,11 +1865,12 @@ export function TSRXPlugin(config) {
 					return super.jsx_parseElement();
 				}
 
-				// Check if the element being parsed IS a <tsx> or <tsx:*> tag
+				// Check if the element being parsed IS a <tsx>, <tsrx>, 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 char_after_tsrx = this.input.charCodeAt(tag_name_start + 4);
 				const is_tsx_tag =
 					this.input.startsWith('tsx', tag_name_start) &&
 					(tag_name_start + 3 >= this.input.length ||
@@ -1859,9 +1881,18 @@ export function TSRXPlugin(config) {
 						char_after_tsx === 10 || // newline
 						char_after_tsx === 13 || // carriage return
 						char_after_tsx === 58); // : (tsx:react)
-
-				if (is_fragment_tag || is_tsx_tag) {
-					// Use Ripple's parseElement to create a Tsx/TsxCompat node.
+				const is_tsrx_tag =
+					this.input.startsWith('tsrx', tag_name_start) &&
+					(tag_name_start + 4 >= this.input.length ||
+						char_after_tsrx === 62 || // >
+						char_after_tsrx === 47 || // / (self-closing)
+						char_after_tsrx === 32 || // space
+						char_after_tsrx === 9 || // tab
+						char_after_tsrx === 10 || // newline
+						char_after_tsrx === 13); // carriage return
+
+				if (is_fragment_tag || is_tsx_tag || is_tsrx_tag) {
+					// Use Ripple's parseElement to create a Tsx/Tsrx/TsxCompat node.
 					// Bare fragments (<></>) are shorthand for <tsx>...</tsx>.
 					this.next();
 					return /** @type {import('estree-jsx').JSXElement} */ (
@@ -1892,7 +1923,9 @@ export function TSRXPlugin(config) {
 				const start = this.start - 1;
 				const position = new acorn.Position(this.curLine, start - this.lineStart);
 
-				const element = /** @type {AST.Element | AST.Tsx | AST.TsxCompat} */ (this.startNode());
+				const element = /** @type {AST.Element | AST.Tsx | AST.Tsrx | AST.TsxCompat} */ (
+					this.startNode()
+				);
 				element.start = start;
 				/** @type {AST.NodeWithLocation} */ (element).loc.start = position;
 				element.metadata = { path: [] };
@@ -1913,6 +1946,11 @@ export function TSRXPlugin(config) {
 					!is_tsx_compat &&
 					open.name.type === 'JSXIdentifier' &&
 					open.name.name === 'tsx';
+				const is_tsrx =
+					!is_fragment &&
+					!is_tsx_compat &&
+					open.name.type === 'JSXIdentifier' &&
+					open.name.name === 'tsrx';
 
 				if (is_tsx_compat) {
 					const namespace_node = /** @type {ESTreeJSX.JSXNamespacedName} */ (open.name);
@@ -1935,6 +1973,15 @@ export function TSRXPlugin(config) {
 							`TSX elements cannot be self-closing. '<tsx />' must have a closing tag '</tsx>'.`,
 						);
 					}
+				} else if (is_tsrx) {
+					/** @type {AST.Tsrx} */ (element).type = 'Tsrx';
+
+					if (open.selfClosing) {
+						this.raise(
+							open.start,
+							`TSRX elements cannot be self-closing. '<tsrx />' must have a closing tag '</tsrx>'.`,
+						);
+					}
 				} else if (is_fragment) {
 					/** @type {AST.Tsx} */ (element).type = 'Tsx';
 				} else {
@@ -1972,7 +2019,7 @@ export function TSRXPlugin(config) {
 					}
 				}
 
-				if (!is_tsx_compat && !is_tsx && !is_fragment) {
+				if (!is_tsx_compat && !is_tsx && !is_tsrx && !is_fragment) {
 					/** @type {AST.Element} */ (element).id = /** @type {AST.Identifier} */ (
 						convert_from_jsx(/** @type {ESTreeJSX.JSXIdentifier} */ (open.name))
 					);
@@ -2166,6 +2213,7 @@ export function TSRXPlugin(config) {
 							parent?.type === 'Component' ||
 							parent?.type === 'Element' ||
 							parent?.type === 'Tsx' ||
+							parent?.type === 'Tsrx' ||
 							parent?.type === 'TsxCompat';
 
 						if (curContext === tstc.tc_expr && !insideTemplate) {
@@ -2234,7 +2282,21 @@ export function TSRXPlugin(config) {
 								this.#popTsxTokenContextBeforeTemplateExpressionChild();
 								this.next();
 							}
-						} else if (this.#path[this.#path.length - 1] === element) {
+						} else if (element.type === 'Tsrx' && this.#path[this.#path.length - 1] === element) {
+							this.#report_broken_markup_error(
+								this.start,
+								"Unclosed tag '<tsrx>'. Expected '</tsrx>' before end of component.",
+							);
+							element.unclosed = true;
+							/** @type {AST.SourceLocation} */ (element.loc).end = {
+								.../** @type {AST.SourceLocation} */ (element.openingElement.loc).end,
+							};
+							element.end = element.openingElement.end;
+							this.#path.pop();
+						} else if (
+							element.type === 'Element' &&
+							this.#path[this.#path.length - 1] === element
+						) {
 							// Check if this element was properly closed
 							const tagName = this.getElementName(element.id);
 							this.#report_broken_markup_error(
@@ -2242,7 +2304,7 @@ export function TSRXPlugin(config) {
 								`Unclosed tag '<${tagName}>'. Expected '</${tagName}>' before end of component.`,
 							);
 							element.unclosed = true;
-							element.loc.end = {
+							/** @type {AST.SourceLocation} */ (element.loc).end = {
 								.../** @type {AST.SourceLocation} */ (element.openingElement.loc).end,
 							};
 							element.end = element.openingElement.end;
@@ -2257,6 +2319,7 @@ export function TSRXPlugin(config) {
 						parent?.type === 'Component' ||
 						parent?.type === 'Element' ||
 						parent?.type === 'Tsx' ||
+						parent?.type === 'Tsrx' ||
 						parent?.type === 'TsxCompat';
 
 					if (curContext === tstc.tc_expr && !insideTemplate) {
@@ -2264,7 +2327,13 @@ export function TSRXPlugin(config) {
 					}
 				}
 
-				if (element.closingElement && !is_tsx_compat && !is_tsx && element.closingElement.name) {
+				if (
+					element.closingElement &&
+					!is_tsx_compat &&
+					!is_tsx &&
+					!is_tsrx &&
+					element.closingElement.name
+				) {
 					/** @type {unknown} */ (element.closingElement.name) = convert_from_jsx(
 						element.closingElement.name,
 					);
@@ -2465,10 +2534,26 @@ export function TSRXPlugin(config) {
 						this.context.pop();
 					}
 					return;
-				} else if (this.type === tstt.jsxTagStart) {
+				} else if (
+					this.type === tstt.jsxTagStart ||
+					(this.input.charCodeAt(this.start) === 60 /* < */ &&
+						this.input.charCodeAt(this.start + 1) === 47) /* / */
+				) {
 					const startPos = this.start;
 					const startLoc = this.startLoc;
-					this.next();
+					if (this.type === tstt.jsxTagStart) {
+						this.next();
+					} else {
+						// A control-flow block inside <tsrx> can leave the tokenizer
+						// in normal JS mode, so `</tsrx>` may arrive as a relational
+						// `<` token. Re-enter JSX closing-tag parsing manually.
+						this.pos = startPos + 1;
+						this.type = tstt.jsxTagStart;
+						this.start = startPos;
+						this.startLoc = startLoc;
+						this.exprAllowed = false;
+						this.next();
+					}
 					if (this.value === '/' || this.type === tt.slash) {
 						// Consume '/'
 						this.next();
@@ -2485,6 +2570,7 @@ export function TSRXPlugin(config) {
 							!currentElement ||
 							(currentElement.type !== 'Element' &&
 								currentElement.type !== 'Tsx' &&
+								currentElement.type !== 'Tsrx' &&
 								currentElement.type !== 'TsxCompat')
 						) {
 							this.raise(this.start, 'Unexpected closing tag');
@@ -2507,6 +2593,12 @@ export function TSRXPlugin(config) {
 								closingElement.name?.type === 'JSXNamespacedName'
 									? closingElement.name.namespace.name + ':' + closingElement.name.name.name
 									: this.getElementName(closingElement.name);
+						} else if (currentElement.type === 'Tsrx') {
+							openingTagName = 'tsrx';
+							closingTagName =
+								closingElement.name?.type === 'JSXNamespacedName'
+									? closingElement.name.namespace.name + ':' + closingElement.name.name.name
+									: this.getElementName(closingElement.name);
 						} else {
 							// Regular Element node (or fragment)
 							openingTagName = currentElement.id ? this.getElementName(currentElement.id) : null;
@@ -2529,7 +2621,12 @@ export function TSRXPlugin(config) {
 								const elem = this.#path[this.#path.length - 1];
 
 								// Stop at non-Element boundaries (Component, etc.)
-								if (elem.type !== 'Element' && elem.type !== 'Tsx' && elem.type !== 'TsxCompat') {
+								if (
+									elem.type !== 'Element' &&
+									elem.type !== 'Tsx' &&
+									elem.type !== 'Tsrx' &&
+									elem.type !== 'TsxCompat'
+								) {
 									break;
 								}
 
@@ -2540,9 +2637,11 @@ export function TSRXPlugin(config) {
 											? elem.openingElement.name
 												? 'tsx'
 												: null
-											: elem.id
-												? this.getElementName(elem.id)
-												: null;
+											: elem.type === 'Tsrx'
+												? 'tsrx'
+												: elem.id
+													? this.getElementName(elem.id)
+													: null;
 
 								// Found matching opening tag
 								if (elemName === closingTagName) {
@@ -2561,12 +2660,19 @@ export function TSRXPlugin(config) {
 						}
 
 						const elementToClose = this.#path[this.#path.length - 1];
-						if (elementToClose && elementToClose.type === 'Element') {
-							const elementToCloseName = /** @type {AST.Element} */ (elementToClose).id
-								? this.getElementName(/** @type {AST.Element} */ (elementToClose).id)
-								: null;
+						if (
+							elementToClose &&
+							(elementToClose.type === 'Element' || elementToClose.type === 'Tsrx')
+						) {
+							const elementToCloseName =
+								elementToClose.type === 'Tsrx'
+									? 'tsrx'
+									: /** @type {AST.Element} */ (elementToClose).id
+										? this.getElementName(/** @type {AST.Element} */ (elementToClose).id)
+										: null;
 							if (elementToCloseName === closingTagName) {
-								/** @type {AST.Element} */ (elementToClose).closingElement = closingElement;
+								/** @type {AST.Element | AST.Tsrx} */ (elementToClose).closingElement =
+									closingElement;
 							}
 						}
 

package/src/runtime/language-helpers.js

@@ -0,0 +1,57 @@
+/** @type {typeof Object.getOwnPropertyDescriptor} */
+export var get_descriptor = Object.getOwnPropertyDescriptor;
+/** @type {typeof Object.getOwnPropertyDescriptors} */
+export var get_descriptors = Object.getOwnPropertyDescriptors;
+/** @type {typeof Array.from} */
+export var array_from = Array.from;
+/** @type {typeof Array.isArray} */
+export var is_array = Array.isArray;
+/** @type {typeof Object.defineProperty} */
+export var define_property = Object.defineProperty;
+/** @type {typeof Object.getPrototypeOf} */
+export var get_prototype_of = Object.getPrototypeOf;
+/** @type {typeof Object.values} */
+export var object_values = Object.values;
+/** @type {typeof Object.entries} */
+export var object_entries = Object.entries;
+/** @type {typeof Object.keys} */
+export var object_keys = Object.keys;
+/** @type {typeof Object.getOwnPropertySymbols} */
+export var get_own_property_symbols = Object.getOwnPropertySymbols;
+/** @type {typeof structuredClone} */
+export var structured_clone = structuredClone;
+/** @type {typeof Object.prototype} */
+export var object_prototype = Object.prototype;
+/** @type {typeof Array.prototype} */
+export var array_prototype = Array.prototype;
+/** @type {typeof Object.prototype.hasOwnProperty} */
+export var has_own_property = object_prototype.hasOwnProperty;
+
+/**
+ * @param {object} value
+ * @param {PropertyKey} key
+ * @returns {boolean}
+ */
+export function has_prototype_accessor(value, key) {
+	var proto = get_prototype_of(value);
+	while (proto != null) {
+		var descriptor = get_descriptor(proto, key);
+		if (descriptor !== undefined) {
+			return typeof descriptor.get === 'function' || typeof descriptor.set === 'function';
+		}
+		proto = get_prototype_of(proto);
+	}
+	return false;
+}
+
+/**
+ * Slice helper for arrays and array-like values.
+ * @param {ArrayLike<any>} array_like
+ * @param {...number} args
+ * @returns {any[]}
+ */
+export function array_slice(array_like, ...args) {
+	return is_array(array_like)
+		? array_like.slice(...args)
+		: array_prototype.slice.call(array_like, ...args);
+}

package/src/runtime/ref.js

@@ -0,0 +1,250 @@
+import {
+	has_own_property,
+	get_descriptor,
+	has_prototype_accessor,
+} from '@tsrx/core/runtime/language-helpers';
+
+const REF_VALUE = Symbol();
+
+/**
+ * Merge multiple refs (function refs and ref objects) into a single
+ * callback ref. Used by React, Preact, and Vue targets when an element has
+ * more than one `ref` attribute.
+ * This is a public method and also used by the compiler to unite any refs with
+ * any of the supported syntaxes.  It does not process spreads, that is delegated to
+ * `normalize_spread_props`.
+ *
+ * @param {...((node: any) => void | (() => void)) | { current: any } | { value: any } | null | undefined} refs
+ * @returns {(node: any) => (() => void)}
+ */
+export function mergeRefs(...refs) {
+	return (node) => {
+		/** @type {Array<() => void>} */
+		const cleanups = [];
+		for (const ref of refs) {
+			if (ref == null) continue;
+			if (typeof ref === 'function') {
+				const result = ref(node);
+				if (typeof result === 'function') {
+					cleanups.push(result);
+				} else {
+					cleanups.push(() => ref(null));
+				}
+			} else if (is_ref_object(ref, 'current')) {
+				/** @type {{ current: any }} */ (ref).current = node;
+				cleanups.push(() => {
+					/** @type {{ current: any }} */ (ref).current = null;
+				});
+			} else if (is_ref_object(ref, 'value')) {
+				/** @type {{ value: any }} */ (ref).value = node;
+				cleanups.push(() => {
+					/** @type {{ value: any }} */ (ref).value = null;
+				});
+			}
+		}
+		return () => {
+			for (const cleanup of cleanups) cleanup();
+		};
+	};
+}
+
+export { is_ref_prop as isRefProp };
+
+/**
+ * @param {unknown} value
+ * @returns {boolean}
+ */
+function is_ref_prop(value) {
+	return typeof value === 'function' && REF_VALUE in value;
+}
+
+/**
+ * @param {any} ref_value
+ * @param {any} node
+ * @param {(value: any) => void} [set_ref_value]
+ * @returns {void | (() => void)}
+ */
+export function apply_ref_value(ref_value, node, set_ref_value) {
+	if (typeof ref_value === 'function') {
+		return ref_value(node);
+	}
+
+	if (ref_value && typeof ref_value === 'object') {
+		if (is_ref_object(ref_value, 'current')) {
+			ref_value.current = node;
+			return () => {
+				ref_value.current = null;
+			};
+		}
+
+		if (is_ref_object(ref_value, 'value')) {
+			ref_value.value = node;
+			return () => {
+				ref_value.value = null;
+			};
+		}
+	}
+
+	if (set_ref_value !== undefined) {
+		set_ref_value(node);
+	}
+}
+
+/**
+ * @param {() => any} get_ref_value
+ * @param {(value: any) => void} [set_ref_value]
+ * @returns {(node: any) => void | (() => void)}
+ */
+export function create_ref_prop(get_ref_value, set_ref_value) {
+	/**
+	 * @param {any} node
+	 * @returns {void | (() => void)}
+	 */
+	function ref_prop_callback(node) {
+		const ref_value = get_ref_value();
+		const cleanup = apply_ref_value(ref_value, node, set_ref_value);
+		if (typeof cleanup === 'function' || node === null) {
+			return cleanup;
+		}
+		return () => {
+			apply_ref_value(ref_value, null, set_ref_value);
+		};
+	}
+
+	Object.defineProperty(ref_prop_callback, REF_VALUE, {
+		value: 'ref_value',
+		enumerable: false,
+	});
+
+	return ref_prop_callback;
+}
+
+/**
+ * @param {...any} refs
+ * @returns {any}
+ */
+export function merge_ref_props(...refs) {
+	const filtered = refs.filter((ref) => ref != null);
+
+	if (filtered.length === 0) {
+		return undefined;
+	}
+
+	if (filtered.length === 1) {
+		return filtered[0];
+	}
+
+	/**
+	 * @param {any} node
+	 * @returns {void | (() => void)}
+	 */
+	function merged_ref_prop(node) {
+		/** @type {Array<() => void>} */
+		const cleanups = [];
+
+		for (const ref of filtered) {
+			const cleanup = apply_ref_value(ref, node);
+			if (typeof cleanup === 'function') {
+				cleanups.push(cleanup);
+			} else if (typeof ref === 'function' && node !== null) {
+				cleanups.push(() => ref(null));
+			}
+		}
+
+		return () => {
+			for (const cleanup of cleanups) {
+				cleanup();
+			}
+		};
+	}
+
+	return merged_ref_prop;
+}
+
+/**
+ * @param {Record<string | symbol, any> | null | undefined} props
+ * @param {...any} outer_refs
+ * @returns {Record<string | symbol, any> | null | undefined}
+ */
+export function normalize_spread_props(props, ...outer_refs) {
+	if (props == null) {
+		return props;
+	}
+
+	/** @type {any[]} */
+	const refs = [];
+	/** @type {Record<string | symbol, any>} */
+	let next = {};
+	let changed = false;
+	let existing_ref;
+
+	for (const key of Reflect.ownKeys(props)) {
+		const descriptor = get_descriptor(props, key);
+		if (!descriptor?.enumerable) {
+			continue;
+		}
+
+		const value = /** @type {any} */ (props)[key];
+
+		if (key === 'ref') {
+			if (is_ref_prop(value)) {
+				refs.push(value);
+				changed = true;
+			} else {
+				existing_ref = value;
+			}
+			continue;
+		}
+
+		if (is_ref_prop(value)) {
+			refs.push(value);
+			changed = true;
+			continue;
+		}
+
+		next[key] = value;
+	}
+
+	if (!changed && outer_refs.length === 0) {
+		return props;
+	}
+
+	const merged_ref = merge_ref_props(existing_ref, ...refs, ...outer_refs);
+	if (merged_ref !== undefined) {
+		next.ref = merged_ref;
+	}
+
+	return next;
+}
+
+/**
+ * @param {object} value
+ * @param {'current' | 'value'} key
+ * @returns {boolean}
+ */
+function is_ref_object(value, key) {
+	if (is_dom_node(value)) {
+		return false;
+	}
+	if (key === 'value' && '__v_isRef' in value) {
+		return true;
+	}
+	if (has_own_property.call(value, key)) {
+		return true;
+	}
+	return key === 'value' && has_prototype_accessor(value, 'value');
+}
+
+/**
+ * @param {object} value
+ * @returns {boolean}
+ */
+function is_dom_node(value) {
+	return (
+		(typeof Node !== 'undefined' && value instanceof Node) ||
+		('nodeType' in value &&
+			typeof (/** @type {{ nodeType?: unknown }} */ (value).nodeType) === 'number' &&
+			'nodeName' in value &&
+			typeof (/** @type {{ nodeName?: unknown }} */ (value).nodeName) === 'string')
+	);
+}

package/src/scope.js

@@ -127,6 +127,13 @@ export function create_scopes(ast, root, parent, error_options) {
 			next({ scope });
 		},
 
+		Tsrx(node, { state, next }) {
+			const scope = state.scope.child();
+			scopes.set(node, scope);
+
+			next({ scope });
+		},
+
 		TSModuleDeclaration(node, { state, next }) {
 			const is_submodule = node.metadata?.module_keyword === 'module';
 			if (is_submodule && node.id?.type === 'Identifier') {