ripple 0.2.184 → 0.2.185

package/src/compiler/phases/3-transform/server/index.js

@@ -16,6 +16,7 @@ import { walk } from 'zimmerframe';
 import ts from 'esrap/languages/ts';
 import path from 'node:path';
 import { print } from 'esrap';
+import is_reference from 'is-reference';
 import {
 	determine_namespace_for_children,
 	escape_html,
@@ -30,17 +31,6 @@ import { is_event_attribute } from '../../../../utils/events.js';
 import { render_stylesheets } from '../stylesheet.js';
 import { createHash } from 'node:crypto';
 
-/**
- * @param {TransformServerContext} context
- */
-function add_ripple_internal_import(context) {
-	if (!context.state.to_ts) {
-		if (!context.state.imports.has(`import * as _$_ from 'ripple/internal/server'`)) {
-			context.state.imports.add(`import * as _$_ from 'ripple/internal/server'`);
-		}
-	}
-}
-
 /**
  * @param {AST.Node[]} children
  * @param {TransformServerContext} context
@@ -110,8 +100,31 @@ const visitors = {
 		}
 	},
 
+	Identifier(node, context) {
+		const parent = /** @type {AST.Node} */ (context.path.at(-1));
+
+		if (is_reference(node, parent) && node.tracked) {
+			const is_right_side_of_assignment =
+				parent.type === 'AssignmentExpression' && parent.right === node;
+			if (
+				(parent.type !== 'AssignmentExpression' && parent.type !== 'UpdateExpression') ||
+				is_right_side_of_assignment
+			) {
+				return b.call('_$_.get', node);
+			}
+		}
+	},
+
 	Component(node, context) {
-		add_ripple_internal_import(context);
+		if (node.params.length > 0) {
+			let props_param = node.params[0];
+
+			if (props_param.type === 'Identifier') {
+				delete props_param.typeAnnotation;
+			} else if (props_param.type === 'ObjectPattern') {
+				delete props_param.typeAnnotation;
+			}
+		}
 
 		const metadata = { await: false };
 		const body_statements = [
@@ -608,23 +621,32 @@ const visitors = {
 		if (!is_inside_component(context)) {
 			return context.next();
 		}
+
 		const cases = [];
+
 		for (const switch_case of node.cases) {
-			const consequent_scope =
-				context.state.scopes.get(switch_case.consequent) || context.state.scope;
-			const consequent = b.block(
-				transform_body(switch_case.consequent, {
-					...context,
-					state: { ...context.state, scope: consequent_scope },
-				}),
-			);
+			const case_body = [];
+
+			if (switch_case.consequent.length !== 0) {
+				const consequent_scope =
+					context.state.scopes.get(switch_case.consequent) || context.state.scope;
+				const consequent = b.block(
+					transform_body(switch_case.consequent, {
+						...context,
+						state: { ...context.state, scope: consequent_scope },
+					}),
+				);
+				case_body.push(...consequent.body);
+			}
+
 			cases.push(
 				b.switch_case(
 					switch_case.test ? /** @type {AST.Expression} */ (context.visit(switch_case.test)) : null,
-					consequent.body,
+					case_body,
 				),
 			);
 		}
+
 		context.state.init?.push(
 			b.switch(/** @type {AST.Expression} */ (context.visit(node.discriminant)), cases),
 		);
@@ -698,17 +720,91 @@ const visitors = {
 	AssignmentExpression(node, context) {
 		const left = node.left;
 
+		if (
+			left.type === 'MemberExpression' &&
+			(left.tracked || (left.property.type === 'Identifier' && left.property.tracked))
+		) {
+			const operator = node.operator;
+			const right = node.right;
+
+			return b.call(
+				'_$_.set_property',
+				/** @type {AST.Expression} */ (context.visit(left.object)),
+				left.computed
+					? /** @type {AST.Expression} */ (context.visit(left.property))
+					: b.literal(/** @type {AST.Identifier} */ (left.property).name),
+				operator === '='
+					? /** @type {AST.Expression} */ (context.visit(right))
+					: b.binary(
+							operator === '+=' ? '+' : operator === '-=' ? '-' : operator === '*=' ? '*' : '/',
+							b.call(
+								'_$_.get_property',
+								/** @type {AST.Expression} */ (context.visit(left.object)),
+								left.computed
+									? /** @type {AST.Expression} */ (context.visit(left.property))
+									: b.literal(/** @type {AST.Identifier} */ (left.property).name),
+								undefined,
+							),
+							/** @type {AST.Expression} */ (context.visit(right)),
+						),
+			);
+		}
+
 		if (left.type === 'Identifier' && left.tracked) {
+			const operator = node.operator;
+			const right = node.right;
+
+			return b.call(
+				'_$_.set',
+				/** @type {AST.Expression} */ (context.visit(left)),
+				operator === '='
+					? /** @type {AST.Expression} */ (context.visit(right))
+					: b.binary(
+							operator === '+=' ? '+' : operator === '-=' ? '-' : operator === '*=' ? '*' : '/',
+							b.call('_$_.get', left),
+							/** @type {AST.Expression} */ (context.visit(right)),
+						),
+			);
+		}
+
+		return context.next();
+	},
+
+	UpdateExpression(node, context) {
+		const argument = node.argument;
+
+		if (
+			argument.type === 'MemberExpression' &&
+			(argument.tracked || (argument.property.type === 'Identifier' && argument.property.tracked))
+		) {
 			return b.call(
-				'set',
+				node.prefix ? '_$_.update_pre_property' : '_$_.update_property',
 				/** @type {AST.Expression} */
-				(context.visit(left, { ...context.state, metadata: { tracking: false } })),
+				(context.visit(argument.object, { ...context.state, metadata: { tracking: false } })),
+				argument.computed
+					? /** @type {AST.Expression} */ (context.visit(argument.property))
+					: b.literal(/** @type {AST.Identifier} */ (argument.property).name),
+				node.operator === '--' ? b.literal(-1) : undefined,
+			);
+		}
+
+		if (argument.type === 'Identifier' && argument.tracked) {
+			return b.call(
+				node.prefix ? '_$_.update_pre' : '_$_.update',
 				/** @type {AST.Expression} */
-				(context.visit(node.right)),
+				(context.visit(argument)),
+				node.operator === '--' ? b.literal(-1) : undefined,
 			);
 		}
 
-		return context.next();
+		if (argument.type === 'TrackedExpression') {
+			return b.call(
+				node.prefix ? '_$_.update_pre' : '_$_.update',
+				/** @type {AST.Expression} */
+				(context.visit(argument.argument)),
+				node.operator === '--' ? b.literal(-1) : undefined,
+			);
+		}
 	},
 
 	ServerIdentifier(node, context) {
@@ -832,6 +928,10 @@ const visitors = {
 		return b.await(/** @type {AST.AwaitExpression} */ (context.visit(node.argument)));
 	},
 
+	TrackedExpression(node, context) {
+		return b.call('_$_.get', /** @type {AST.Expression} */ (context.visit(node.argument)));
+	},
+
 	TrackedObjectExpression(node, context) {
 		// For SSR, we just evaluate the object as-is since there's no reactivity
 		return b.object(
@@ -852,20 +952,14 @@ const visitors = {
 	},
 
 	MemberExpression(node, context) {
-		const parent = context.path.at(-1);
-
 		if (node.tracked || (node.property.type === 'Identifier' && node.property.tracked)) {
 			return b.call(
-				'get',
-				b.member(
-					/** @type {AST.Expression} */
-					(context.visit(node.object)),
-					node.computed
-						? /** @type {AST.Expression} */ (context.visit(node.property))
-						: node.property,
-					node.computed,
-					node.optional,
-				),
+				'_$_.get_property',
+				/** @type {AST.Expression} */ (context.visit(node.object)),
+				node.computed
+					? /** @type {AST.Expression} */ (context.visit(node.property))
+					: b.literal(/** @type {AST.Identifier} */ (node.property).name),
+				node.optional ? b.true : undefined,
 			);
 		}
 
@@ -877,7 +971,7 @@ const visitors = {
 		let expression = /** @type {AST.Expression} */ (visit(node.expression, { ...state, metadata }));
 
 		if (expression.type === 'Identifier' && expression.tracked) {
-			expression = b.call('get', expression);
+			expression = b.call('_$_.get', expression);
 		}
 
 		if (expression.type === 'Literal') {
@@ -975,6 +1069,8 @@ export function transform_server(filename, source, analysis, minify_css) {
 		metadata: {},
 	};
 
+	state.imports.add(`import * as _$_ from 'ripple/internal/server'`);
+
 	const program = walk(analysis.ast, { ...state }, visitors);
 
 	const css = render_stylesheets(state.stylesheets, minify_css);
@@ -993,17 +1089,11 @@ export function transform_server(filename, source, analysis, minify_css) {
 	}
 
 	// Add async property to component functions
-
 	for (const import_node of state.imports) {
 		/** @type {AST.Program} */ (program).body.unshift(b.stmt(b.id(import_node)));
 	}
 
-	// ESRap unfortunately hard codes the type from '@typescript-eslint/types'
-	// Our types from 'estree' are incompatible
-	// So we'll just give it what it wants with an unknown cast.
-	// Functionally, none of the properties that are different between the two types
-	// are used by the printer, so this is safe.
-	const js = print(/** @type {TSESTree.Node} */ (/** @type {unknown} */ (program)), ts(), {
+	const js = print(program, /** @type {Visitors<AST.Node, TransformServerState>} */ (ts()), {
 		sourceMapContent: source,
 		sourceMapSource: path.basename(filename),
 	});

package/src/compiler/types/index.d.ts

@@ -3,6 +3,7 @@ import type * as ESTreeJSX from 'estree-jsx';
 import type { TSESTree } from '@typescript-eslint/types';
 import type { NAMESPACE_URI } from '../../runtime/internal/client/constants.js';
 import type { Parse } from '#parser';
+import type * as ESRap from 'esrap';
 
 export type RpcModules = Map<string, [string, string]>;
 
@@ -61,13 +62,29 @@ declare module 'estree' {
 		metadata: FunctionMetaData;
 	}
 
+	interface MethodDefinition {
+		typeParameters?: TSTypeParameterDeclaration;
+	}
+
+	interface ClassDeclaration {
+		typeParameters?: AST.TSTypeParameterDeclaration;
+		superTypeArguments?: AST.TSTypeParameterInstantiation;
+		implements?: AST.TSClassImplements[];
+	}
+
+	interface ClassExpression {
+		typeParameters?: AST.TSTypeParameterDeclaration;
+		superTypeArguments?: AST.TSTypeParameterInstantiation;
+		implements?: AST.TSClassImplements[];
+	}
+
 	interface Identifier extends TrackedNode {
 		metadata: BaseNode['metadata'] & {
 			tracked_shorthand?: '#Map' | '#Set';
 		};
 	}
 
-	interface MemberExpression extends TrackedNode {}
+	interface MemberExpression extends AST.TrackedNode {}
 
 	interface TrackedNode {
 		tracked?: boolean;
@@ -99,9 +116,9 @@ declare module 'estree' {
 	}
 
 	// Missing estree type
-	interface ParenthesizedExpression extends BaseNode {
+	interface ParenthesizedExpression extends AST.BaseNode {
 		type: 'ParenthesizedExpression';
-		expression: Expression;
+		expression: AST.Expression;
 	}
 
 	interface Comment {
@@ -111,18 +128,18 @@ declare module 'estree' {
 	/**
 	 * Custom Comment interface with location information
 	 */
-	type CommentWithLocation = Comment & NodeWithLocation;
+	type CommentWithLocation = AST.Comment & NodeWithLocation;
 
 	interface TryStatement {
-		pending?: BlockStatement | null;
+		pending?: AST.BlockStatement | null;
 	}
 
 	interface ForOfStatement {
-		index?: Identifier | null;
-		key?: Expression | null;
+		index?: AST.Identifier | null;
+		key?: AST.Expression | null;
 	}
 
-	interface ServerIdentifier extends BaseNode {
+	interface ServerIdentifier extends AST.BaseNode {
 		type: 'ServerIdentifier';
 	}
 
@@ -160,24 +177,24 @@ declare module 'estree' {
 		// to avoid lots of typecasting or checking for undefined
 		metadata: BaseNodeMetaData;
 
-		comments?: AST.Comment[];
+		comments?: Comment[];
 	}
 
 	interface NodeWithLocation {
 		start: number;
 		end: number;
-		loc: SourceLocation;
+		loc: AST.SourceLocation;
 	}
 
 	/**
 	 * Ripple custom interfaces and types section
 	 */
-	interface Component extends BaseNode {
+	interface Component extends AST.BaseNode {
 		type: 'Component';
 		// null is for anonymous components {component: () => {}}
-		id: Identifier | null;
-		params: Pattern[];
-		body: Node[];
+		id: AST.Identifier | null;
+		params: AST.Pattern[];
+		body: AST.Node[];
 		css: CSS.StyleSheet | null;
 		metadata: BaseNodeMetaData & {
 			inherited_css?: boolean;
@@ -185,7 +202,7 @@ declare module 'estree' {
 		default: boolean;
 	}
 
-	interface TsxCompat extends BaseNode {
+	interface TsxCompat extends AST.BaseNode {
 		type: 'TsxCompat';
 		kind: string;
 		attributes: Array<any>;
@@ -194,19 +211,19 @@ declare module 'estree' {
 		unclosed?: boolean;
 	}
 
-	interface Html extends BaseNode {
+	interface Html extends AST.BaseNode {
 		type: 'Html';
 		expression: Expression;
 	}
 
-	interface Element extends BaseNode {
+	interface Element extends AST.BaseNode {
 		type: 'Element';
-		id: Identifier;
+		id: AST.Identifier;
 		attributes: RippleAttribute[];
-		children: Node[];
+		children: AST.Node[];
 		selfClosing?: boolean;
 		unclosed?: boolean;
-		loc: AST.SourceLocation;
+		loc: SourceLocation;
 		metadata: BaseNodeMetaData & {
 			ts_name?: string;
 		};
@@ -226,11 +243,11 @@ declare module 'estree' {
 
 	export interface TextNode extends AST.BaseNode {
 		type: 'Text';
-		expression: Expression;
-		loc?: SourceLocation;
+		expression: AST.Expression;
+		loc?: AST.SourceLocation;
 	}
 
-	interface ServerBlock extends BaseNode {
+	interface ServerBlock extends AST.BaseNode {
 		type: 'ServerBlock';
 		body: BlockStatement;
 		metadata: BaseNodeMetaData & {
@@ -241,62 +258,62 @@ declare module 'estree' {
 	/**
 	 * Tracked Expressions
 	 */
-	interface TrackedArrayExpression extends Omit<ArrayExpression, 'type'> {
+	interface TrackedArrayExpression extends Omit<AST.ArrayExpression, 'type'> {
 		type: 'TrackedArrayExpression';
-		elements: (Expression | SpreadElement | null)[];
+		elements: (AST.Expression | AST.SpreadElement | null)[];
 	}
 
-	interface TrackedExpression extends BaseNode {
-		argument: Expression;
+	interface TrackedExpression extends AST.BaseNode {
+		argument: AST.Expression;
 		type: 'TrackedExpression';
 	}
 
-	interface TrackedObjectExpression extends Omit<ObjectExpression, 'type'> {
+	interface TrackedObjectExpression extends Omit<AST.ObjectExpression, 'type'> {
 		type: 'TrackedObjectExpression';
-		properties: (Property | SpreadElement)[];
+		properties: (AST.Property | AST.SpreadElement)[];
 	}
 
-	interface TrackedMapExpression extends BaseNode {
+	interface TrackedMapExpression extends AST.BaseNode {
 		type: 'TrackedMapExpression';
-		arguments: (Expression | SpreadElement)[];
+		arguments: (AST.Expression | AST.SpreadElement)[];
 	}
 
-	interface TrackedSetExpression extends BaseNode {
+	interface TrackedSetExpression extends AST.BaseNode {
 		type: 'TrackedSetExpression';
-		arguments: (Expression | SpreadElement)[];
+		arguments: (AST.Expression | AST.SpreadElement)[];
 	}
 
 	/**
 	 * Ripple attribute nodes
 	 */
-	interface Attribute extends BaseNode {
+	interface Attribute extends AST.BaseNode {
 		type: 'Attribute';
-		name: Identifier;
-		value: Expression | null;
-		loc?: SourceLocation;
+		name: AST.Identifier;
+		value: AST.Expression | null;
+		loc?: AST.SourceLocation;
 		shorthand?: boolean;
 		metadata: BaseNodeMetaData & {
 			delegated?: boolean;
 		};
 	}
 
-	interface RefAttribute extends BaseNode {
+	interface RefAttribute extends AST.BaseNode {
 		type: 'RefAttribute';
-		argument: Expression;
-		loc?: SourceLocation;
+		argument: AST.Expression;
+		loc?: AST.SourceLocation;
 	}
 
-	interface SpreadAttribute extends BaseNode {
+	interface SpreadAttribute extends AST.BaseNode {
 		type: 'SpreadAttribute';
-		argument: Expression;
-		loc?: SourceLocation;
+		argument: AST.Expression;
+		loc?: AST.SourceLocation;
 	}
 
 	/**
 	 * Ripple's extended Declaration type that includes Component
-	 * Use this instead of AST.Declaration when you need Component support
+	 * Use this instead of Declaration when you need Component support
 	 */
-	export type RippleDeclaration = AST.Declaration | AST.Component | AST.TSDeclareFunction;
+	export type RippleDeclaration = AST.Declaration | Component | AST.TSDeclareFunction;
 
 	/**
 	 * Ripple's extended ExportNamedDeclaration with Component support
@@ -308,8 +325,8 @@ declare module 'estree' {
 	/**
 	 * Ripple's extended Program with Component support
 	 */
-	interface RippleProgram extends Omit<AST.Program, 'body'> {
-		body: (AST.Program['body'][number] | Component)[];
+	interface RippleProgram extends Omit<Program, 'body'> {
+		body: (Program['body'][number] | Component)[];
 	}
 
 	export type RippleAttribute = Attribute | SpreadAttribute | RefAttribute;
@@ -491,7 +508,7 @@ declare module 'estree-jsx' {
 
 	interface JSXEmptyExpression {
 		loc: AST.SourceLocation;
-		innerComments?: Comment[];
+		innerComments?: AST.Comment[];
 	}
 
 	interface JSXOpeningFragment {
@@ -586,20 +603,24 @@ declare module 'estree' {
 		TSVoidKeyword: TSVoidKeyword;
 		TSParenthesizedType: TSParenthesizedType;
 		TSExpressionWithTypeArguments: TSExpressionWithTypeArguments;
+		TSClassImplements: TSClassImplements;
 	}
 
-	// Extend NodeMap to include TypeScript nodes
-	interface NodeMap extends TSNodeMap {}
-
 	// Create our version of TypeNode with modified types to be used in replacements
 	type TypeNode = TSNodeMap[keyof TSNodeMap];
+
+	// Extend NodeMap to include TypeScript nodes
+	interface NodeMap extends TSNodeMap {
+		TypeNode: TypeNode;
+	}
+
 	type EntityName = AST.Identifier | AST.ThisExpression | TSQualifiedName;
 	type Parameter =
-		| ArrayPattern
-		| AssignmentPattern
-		| Identifier
-		| ObjectPattern
-		| RestElement
+		| AST.ArrayPattern
+		| AST.AssignmentPattern
+		| AST.Identifier
+		| AST.ObjectPattern
+		| AST.RestElement
 		| TSParameterProperty;
 	type TypeElement =
 		| TSCallSignatureDeclaration
@@ -608,8 +629,8 @@ declare module 'estree' {
 		| TSMethodSignature
 		| TSPropertySignature;
 	type TSPropertySignature = TSPropertySignatureComputedName | TSPropertySignatureNonComputedName;
-	type PropertyNameComputed = Expression;
-	type PropertyNameNonComputed = Identifier | NumberLiteral | StringLiteral;
+	type PropertyNameComputed = AST.Expression;
+	type PropertyNameNonComputed = AST.Identifier | NumberLiteral | StringLiteral;
 
 	// TypeScript AST node interfaces from @sveltejs/acorn-typescript
 	// Based on TSESTree types but adapted for acorn's output format
@@ -646,7 +667,7 @@ declare module 'estree' {
 		extends Omit<AcornTSNode<TSESTree.TSConstructorType>, 'typeParameters' | 'params'> {
 		typeAnnotation: TSTypeAnnotation | undefined;
 		typeParameters: TSTypeParameterDeclaration | undefined;
-		parameters: Parameter[];
+		parameters: AST.Parameter[];
 	}
 	interface TSConstructSignatureDeclaration
 		extends Omit<
@@ -705,7 +726,7 @@ declare module 'estree' {
 	}
 	interface TSIndexSignature
 		extends Omit<AcornTSNode<TSESTree.TSIndexSignature>, 'parameters' | 'typeAnnotation'> {
-		parameters: Parameter[];
+		parameters: AST.Parameter[];
 		typeAnnotation: TSTypeAnnotation | undefined;
 	}
 	interface TSInferType extends Omit<AcornTSNode<TSESTree.TSInferType>, 'typeParameter'> {
@@ -735,9 +756,13 @@ declare module 'estree' {
 		literal: AST.Literal | AST.TemplateLiteral;
 	}
 	interface TSMappedType
-		extends Omit<AcornTSNode<TSESTree.TSMappedType>, 'typeParameter' | 'typeAnnotation'> {
+		extends Omit<
+			AcornTSNode<TSESTree.TSMappedType>,
+			'typeParameter' | 'typeAnnotation' | 'nameType'
+		> {
 		typeAnnotation: TypeNode | undefined;
 		typeParameter: TSTypeParameter;
+		nameType: TypeNode | null;
 	}
 	interface TSMethodSignature
 		extends Omit<
@@ -870,6 +895,7 @@ declare module 'estree' {
 		type: 'TSExpressionWithTypeArguments';
 	}
 
+	interface TSClassImplements extends AcornTSNode<TSESTree.TSClassImplements> {}
 	interface TSUnknownKeyword extends AcornTSNode<TSESTree.TSUnknownKeyword> {}
 	interface TSVoidKeyword extends AcornTSNode<TSESTree.TSVoidKeyword> {}
 	interface NumberLiteral extends AcornTSNode<TSESTree.NumberLiteral> {}
@@ -891,7 +917,6 @@ declare module 'estree' {
 }
 
 import type { Comment, Position } from 'acorn';
-import type { A, M } from 'vitest/dist/chunks/environment.d.cL3nLXbE.js';
 
 /**
  * Parse error information
@@ -1134,7 +1159,8 @@ export type Visitors<T extends AST.Node | AST.CSS.Node, U> = T['type'] extends '
 	? never
 	: SpecializedVisitors<T, U> & { _?: Visitor<T, U, T> };
 
-export interface Context<T, U> {
+export interface Context<T, U>
+	extends Omit<ESRap.Context, 'path' | 'state' | 'visit' | 'next' | 'stop'> {
 	next: (state?: U) => T | void;
 	path: T[];
 	state: U;

package/src/compiler/types/parse.d.ts

@@ -13,6 +13,9 @@
 import type * as acorn from 'acorn';
 import type * as AST from 'estree';
 import type * as ESTreeJSX from 'estree-jsx';
+import type * as ESRap from 'esrap';
+import type * as SourceMap from '@jridgewell/sourcemap-codec';
+import type * as RippleCompiler from '#compiler';
 
 type ForInit = boolean | 'await';
 
@@ -33,7 +36,34 @@ declare module 'acorn' {
 	}
 }
 
+declare module 'esrap' {
+	export function print<V extends RippleCompiler.Visitors<AST.Node, any>>(
+		ast: AST.Node,
+		visitors: V,
+		options?: ESRap.PrintOptions,
+	): { code: string; map: SourceMap.SourceMapMappings };
+}
+
+declare module 'esrap/languages/tsx' {
+	export default function tsx<V extends RippleCompiler.Visitors<AST.Node, any>>(
+		options: Parse.ESRapTSOptions,
+	): V;
+}
+
+declare module 'zimmerframe' {
+	export function walk(
+		node: AST.Node,
+		state: any,
+		visitors: RippleCompiler.Visitors<AST.Node, any>,
+	): AST.Node;
+}
+
 export namespace Parse {
+	export interface ESRapTSOptions {
+		quotes?: 'double' | 'single';
+		comments?: AST.Comment[];
+	}
+
 	/**
 	 * Destructuring errors object used during expression parsing
 	 * See: https://github.com/acornjs/acorn/blob/main/acorn/src/parseutil.js