ripple 0.2.183 → 0.2.185

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
@@ -65,6 +95,85 @@ export namespace Parse {
 		BIND_OUTSIDE: 5;
 	}
 
+	/**
+	 * Branch ID for tracking disjunction structure in regular expressions
+	 * Used to determine whether a duplicate capture group name is allowed
+	 * because it is in a separate branch.
+	 */
+	export interface BranchID {
+		/** Parent disjunction branch */
+		parent: BranchID | null;
+		/** Identifies this set of sibling branches */
+		base: BranchID;
+		/** Check if this branch is separated from another branch */
+		separatedFrom(alt: BranchID): boolean;
+		/** Create a sibling branch */
+		sibling(): BranchID;
+	}
+
+	/**
+	 * Regular expression validation state
+	 * Used by the parser to validate regular expression literals
+	 * See: https://github.com/acornjs/acorn/blob/main/acorn/src/regexp.js
+	 */
+	export interface RegExpValidationState {
+		/** Reference to the parser instance */
+		parser: Parser;
+		/** Valid flags for the current ECMAScript version */
+		validFlags: string;
+		/** Unicode properties data for the current ECMAScript version */
+		unicodeProperties: any;
+		/** Source pattern string of the regular expression */
+		source: string;
+		/** Flags string of the regular expression */
+		flags: string;
+		/** Start position of the regular expression in the source */
+		start: number;
+		/** Whether unicode flag (u) is enabled */
+		switchU: boolean;
+		/** Whether unicode sets flag (v) is enabled (ES2024+) */
+		switchV: boolean;
+		/** Whether named capture groups are enabled */
+		switchN: boolean;
+		/** Current position in the pattern */
+		pos: number;
+		/** Last integer value parsed */
+		lastIntValue: number;
+		/** Last string value parsed */
+		lastStringValue: string;
+		/** Whether the last assertion can be quantified */
+		lastAssertionIsQuantifiable: boolean;
+		/** Number of capturing parentheses */
+		numCapturingParens: number;
+		/** Maximum back reference number */
+		maxBackReference: number;
+		/** Map of group names to their information */
+		groupNames: Record<string, BranchID[]>;
+		/** Array of back reference names */
+		backReferenceNames: string[];
+		/** Current branch ID for tracking disjunction structure */
+		branchID: BranchID | null;
+
+		/** Reset state for a new pattern */
+		reset(start: number, pattern: string, flags: string): void;
+		/** Raise a validation error */
+		raise(message: string): void;
+		/** Get code point at position i (handles surrogate pairs if unicode mode) */
+		at(i: number, forceU?: boolean): number;
+		/** Get next index after position i (handles surrogate pairs if unicode mode) */
+		nextIndex(i: number, forceU?: boolean): number;
+		/** Get code point at current position */
+		current(forceU?: boolean): number;
+		/** Get code point at next position */
+		lookahead(forceU?: boolean): number;
+		/** Advance position to next character */
+		advance(forceU?: boolean): void;
+		/** Try to eat a specific character */
+		eat(ch: number, forceU?: boolean): boolean;
+		/** Try to eat a sequence of characters */
+		eatChars(chs: number[], forceU?: boolean): boolean;
+	}
+
 	export interface Options extends Omit<acorn.Options, 'onComment' | 'ecmaVersion'> {
 		rippleOptions: {
 			loose: boolean;
@@ -297,6 +406,15 @@ export namespace Parse {
 		tokContexts: AcornTypeScriptTokContexts;
 	}
 
+	interface Scope {
+		flags: number;
+		var: string[];
+		lexical: string[];
+		functions: string[];
+	}
+
+	type Exports = Record<string, boolean>;
+
 	/**
 	 * Extended Parser instance with internal properties
 	 *
@@ -360,7 +478,7 @@ export namespace Parse {
 		/** Current scope flags stack */
 		scopeStack: Array<{ flags: number; var: string[]; lexical: string[]; functions: string[] }>;
 		/** Regular expression validation state */
-		regexpState?: any;
+		regexpState: RegExpValidationState | null;
 		/** Whether we can use await keyword */
 		canAwait: boolean;
 		/** Position of await keyword (0 if not in async context) */
@@ -376,7 +494,7 @@ export namespace Parse {
 		/** Potential arrow in for-await position */
 		potentialArrowInForAwait: boolean;
 		/** Private name stack for class private fields validation */
-		privateNameStack: Array<{ declared: Record<string, any>; used: Array<AST.Node> }>;
+		privateNameStack: Array<{ declared: Record<string, string>; used: Array<AST.Node> }>;
 		/** Undefined exports for module validation */
 		undefinedExports: Record<string, AST.Node>;
 
@@ -646,16 +764,16 @@ export namespace Parse {
 		declareName(name: string, bindingType: BindingType[keyof BindingType], pos: number): void;
 
 		/** Get current scope */
-		currentScope(): { flags: number; var: string[]; lexical: string[]; functions: string[] };
+		currentScope(): Scope;
 
 		/** Get current variable scope (for var declarations) */
-		currentVarScope(): { flags: number; var: string[]; lexical: string[]; functions: string[] };
+		currentVarScope(): Scope;
 
 		/** Get current "this" scope */
-		currentThisScope(): { flags: number; var: string[]; lexical: string[]; functions: string[] };
+		currentThisScope(): Scope;
 
 		/** Check if treating functions as var in current scope */
-		treatFunctionsAsVarInScope(scope: any): boolean;
+		treatFunctionsAsVarInScope(scope: Scope): boolean;
 
 		// ============================================================
 		// Context Management
@@ -1262,7 +1380,7 @@ export namespace Parse {
 		parseClassSuper(node: AST.Node): void;
 
 		/** Enter class body scope */
-		enterClassBody(): Record<string, any>;
+		enterClassBody(): Record<string, string>;
 
 		/** Exit class body scope */
 		exitClassBody(): void;
@@ -1325,11 +1443,11 @@ export namespace Parse {
 		/** Parse export declaration */
 		parseExport(
 			node: AST.Node,
-			exports?: any,
+			exports?: Exports,
 		): AST.ExportNamedDeclaration | AST.ExportDefaultDeclaration | AST.ExportAllDeclaration;
 
 		/** Parse export specifiers */
-		parseExportSpecifiers(exports?: any): AST.ExportSpecifier[];
+		parseExportSpecifiers(exports?: Exports): AST.ExportSpecifier[];
 
 		/** Parse export default declaration */
 		parseExportDefaultDeclaration(): AST.Declaration | AST.Expression | AST.Component;

package/src/runtime/index-server.js

@@ -2,10 +2,12 @@
 
 import { DERIVED, TRACKED, UNINITIALIZED } from './internal/client/constants.js';
 import { is_tracked_object } from './internal/client/utils.js';
-import { active_component } from './internal/server/index.js';
+import { active_component, get, set, untrack } from './internal/server/index.js';
 
 export { Context } from './internal/server/context.js';
 
+export { get, set, untrack };
+
 export function effect() {
 	// NO-OP
 }
@@ -13,31 +15,6 @@ export function effect() {
 var empty_get_set = { get: undefined, set: undefined };
 
 /**
- * @param {Derived | Tracked} tracked
- * @returns {any}
- */
-export function get(tracked) {
-	if (!is_tracked_object(tracked)) {
-		return tracked;
-	}
-
-	var g = tracked.a.get;
-
-	return g ? g(tracked.v) : tracked.v;
-}
-
-/**
- * @param {Tracked} tracked
- * @param {any} value
- */
-export function set(tracked, value) {
-	var s = tracked.a.set;
-
-	tracked.v = s ? s(value, tracked.v) : value;
-}
-
-/**
- *
  * @param {any} v
  * @param {Function} [get]
  * @param {Function} [set]
@@ -53,7 +30,9 @@ export function track(v, get, set) {
 	if (typeof v === 'function') {
 		return {
 			a: get || set ? { get, set } : empty_get_set,
+			c: 0,
 			co: active_component,
+			d: null,
 			f: TRACKED | DERIVED,
 			fn: v,
 			v: UNINITIALIZED,
@@ -62,6 +41,8 @@ export function track(v, get, set) {
 
 	return {
 		a: get || set ? { get, set } : empty_get_set,
+		c: 0,
+		d: null,
 		f: TRACKED,
 		v,
 	};
@@ -91,5 +72,7 @@ export function MediaQuery(query, matches = false) {
  * @param {any} _
  */
 export function createSubscriber(_) {
-	return () => { /* NO-OP */ };
+	return () => {
+		/* NO-OP */
+	};
 }

package/src/runtime/internal/client/operations.js

@@ -48,7 +48,7 @@ export function first_child(node) {
 export function child_frag(node) {
 	var child = /** @type {Text} */ (first_child(node));
 
-	if (child.nodeType === 8 && child.data === '') {
+	if (child.nodeType === Node.COMMENT_NODE && child.data === '') {
 		return next_sibling(child);
 	}
 	return child;

package/src/runtime/internal/client/runtime.js

@@ -429,7 +429,7 @@ export function track_split(v, l, b) {
 }
 
 /**
- * @param {Tracked} tracked
+ * @param {Tracked | Derived} tracked
  * @returns {Dependency}
  */
 function create_dependency(tracked) {
@@ -512,10 +512,10 @@ export function async_computed(fn, block) {
 
 			var restore = capture();
 			/** @type {(() => void) | undefined} */
-			var unuspend;
+			var unsuspend;
 
 			if (deferred === null) {
-				unuspend = suspend();
+				unsuspend = suspend();
 			} else {
 				for (var i = 0; i < deferred.length; i++) {
 					var tracked = deferred[i];
@@ -538,7 +538,7 @@ export function async_computed(fn, block) {
 				}
 
 				if (deferred === null) {
-					unuspend?.();
+					unsuspend?.();
 				} else if (promise === current) {
 					for (var i = 0; i < deferred.length; i++) {
 						var tracked = deferred[i];
@@ -586,16 +586,16 @@ function capture_deferred(fn) {
 	var value = fn();
 	/** @type {Tracked[] | null} */
 	var deferred = null;
-	var depedency = active_dependency;
+	var dependency = active_dependency;
 
-	while (depedency !== null) {
-		var tracked = depedency.t;
+	while (dependency !== null) {
+		var tracked = dependency.t;
 		if ((tracked.f & DEFERRED) !== 0) {
 			deferred ??= [];
 			deferred.push(tracked);
 			break;
 		}
-		depedency = depedency.n;
+		dependency = dependency.n;
 	}
 
 	return [value, deferred];

package/src/runtime/internal/client/types.d.ts

@@ -19,7 +19,7 @@ export type Dependency = {
 
 export type Tracked<V = any> = {
 	DO_NOT_ACCESS_THIS_OBJECT_DIRECTLY?: true;
-	a: { get?: Function, set?: Function };
+	a: { get?: Function; set?: Function };
 	b: Block;
 	c: number;
 	f: number;
@@ -28,12 +28,12 @@ export type Tracked<V = any> = {
 
 export type Derived = {
 	DO_NOT_ACCESS_THIS_OBJECT_DIRECTLY?: true;
-	a: { get?: Function, set?: Function };
+	a: { get?: Function; set?: Function };
 	b: Block;
 	blocks: null | Block[];
 	c: number;
 	co: null | Component;
-	d: null;
+	d: null | Dependency;
 	f: number;
 	fn: Function;
 	__v: any;
@@ -58,8 +58,8 @@ export type CompatApi = {
 	createRoot: () => void;
 	createComponent: (node: any, children_fn: () => any) => void;
 	jsx: (type: any, props: any) => any;
-}
+};
 
 export type CompatOptions = {
 	[key: string]: CompatApi;
-}
+};

package/src/runtime/internal/server/index.js

@@ -1,18 +1,160 @@
+/**
+@import { Component, Dependency, Derived, Tracked } from '#server';
+@import { render, renderToStream, SSRComponent } from 'ripple/server';
+*/
+
 import { Readable } from 'stream';
-/** @import { Component, Derived } from '#server' */
-/** @import { render, renderToStream, SSRComponent } from 'ripple/server'*/
 import { DERIVED, UNINITIALIZED } from '../client/constants.js';
 import { is_tracked_object } from '../client/utils.js';
 import { escape } from '../../../utils/escaping.js';
 import { is_boolean_attribute } from '../../../compiler/utils.js';
 import { clsx } from 'clsx';
+import { normalize_css_property_name } from '../../../utils/normalize_css_property_name.js';
 
 export { escape };
 export { register_component_css as register_css } from './css-registry.js';
 
-/** @type {Component | null} */
+/** @type {null | Component} */
 export let active_component = null;
 
+/** @type {number} */
+let clock = 0;
+
+/** @type {null | Dependency} */
+let active_dependency = null;
+
+export let tracking = false;
+
+/**
+ * @returns {number}
+ */
+function increment_clock() {
+	return ++clock;
+}
+
+/**
+ * @param {Tracked | Derived} tracked
+ * @returns {Dependency}
+ */
+function create_dependency(tracked) {
+	return {
+		c: tracked.c,
+		t: tracked,
+		n: null,
+	};
+}
+
+/**
+ * @param {Tracked | Derived} tracked
+ */
+function register_dependency(tracked) {
+	var dependency = active_dependency;
+
+	if (dependency === null) {
+		dependency = create_dependency(tracked);
+		active_dependency = dependency;
+	} else {
+		var current = dependency;
+
+		while (current !== null) {
+			if (current.t === tracked) {
+				current.c = tracked.c;
+				return;
+			}
+			var next = current.n;
+			if (next === null) {
+				break;
+			}
+			current = next;
+		}
+
+		dependency = create_dependency(tracked);
+		current.n = dependency;
+	}
+}
+
+/**
+ * @param {Dependency | null} tracking
+ */
+function is_tracking_dirty(tracking) {
+	if (tracking === null) {
+		return false;
+	}
+	while (tracking !== null) {
+		var tracked = tracking.t;
+
+		if ((tracked.f & DERIVED) !== 0) {
+			update_derived(/** @type {Derived} **/ (tracked));
+		}
+
+		if (tracked.c > tracking.c) {
+			return true;
+		}
+		tracking = tracking.n;
+	}
+
+	return false;
+}
+
+/**
+ * @template T
+ * @param {() => T} fn
+ * @returns {T}
+ */
+export function untrack(fn) {
+	var previous_tracking = tracking;
+	var previous_dependency = active_dependency;
+	tracking = false;
+	active_dependency = null;
+	try {
+		return fn();
+	} finally {
+		tracking = previous_tracking;
+		active_dependency = previous_dependency;
+	}
+}
+
+/**
+ * @param {Derived} computed
+ */
+function update_derived(computed) {
+	var value = computed.v;
+
+	if (value === UNINITIALIZED || is_tracking_dirty(computed.d)) {
+		value = run_derived(computed);
+
+		if (value !== computed.v) {
+			computed.v = value;
+			computed.c = increment_clock();
+		}
+	}
+}
+
+/**
+ * @param {Derived} computed
+ */
+function run_derived(computed) {
+	var previous_tracking = tracking;
+	var previous_dependency = active_dependency;
+	var previous_component = active_component;
+
+	try {
+		active_component = computed.co;
+		tracking = true;
+		active_dependency = null;
+
+		var value = computed.fn();
+
+		computed.d = active_dependency;
+
+		return value;
+	} finally {
+		tracking = previous_tracking;
+		active_dependency = previous_dependency;
+		active_component = previous_component;
+	}
+}
+
 /**
  * `<div translate={false}>` should be rendered as `<div translate="no">` and _not_
  * `<div translate="false">`, which is equivalent to `<div translate="yes">`. There
@@ -141,7 +283,7 @@ export function push_component() {
  */
 export function pop_component() {
 	var component = /** @type {Component} */ (active_component);
-	active_component = component;
+	active_component = component.p;
 }
 
 /**
@@ -161,30 +303,119 @@ export function aborted() {
 }
 
 /**
- * @param {Derived} tracked
+ * @param {any} tracked
  * @returns {any}
  */
-function get_derived(tracked) {
-	let v = tracked.v;
+export function get(tracked) {
+	if (!is_tracked_object(tracked)) {
+		return tracked;
+	}
+
+	if ((tracked.f & DERIVED) !== 0) {
+		update_derived(/** @type {Derived} **/ (tracked));
+		if (tracking) {
+			register_dependency(tracked);
+		}
+	} else if (tracking) {
+		register_dependency(tracked);
+	}
+
+	var g = tracked.a.get;
+	return g ? g(tracked.v) : tracked.v;
+}
+
+/**
+ * @param {Derived | Tracked} tracked
+ * @param {any} value
+ */
+export function set(tracked, value) {
+	var old_value = tracked.v;
 
-	if (v === UNINITIALIZED) {
-		v = tracked.fn();
-		tracked.v = v;
+	if (value !== old_value) {
+		var s = tracked.a.set;
+		tracked.v = s ? s(value, tracked.v) : value;
+		tracked.c = increment_clock();
 	}
-	return v;
 }
 
 /**
- * @param {any} tracked
+ * @param {Tracked} tracked
+ * @param {number} [d]
+ * @returns {number}
+ */
+export function update(tracked, d = 1) {
+	var value = get(tracked);
+	var result = d === 1 ? value++ : value--;
+	set(tracked, value);
+	return result;
+}
+
+/**
+ * @param {Tracked} tracked
+ * @param {number} [d]
+ * @returns {number}
+ */
+export function update_pre(tracked, d = 1) {
+	var value = get(tracked);
+	var new_value = d === 1 ? ++value : --value;
+	set(tracked, new_value);
+	return new_value;
+}
+
+/**
+ * @param {any} obj
+ * @param {string | number | symbol} property
+ * @param {any} value
+ * @returns {void}
+ */
+export function set_property(obj, property, value) {
+	var tracked = obj[property];
+	set(tracked, value);
+}
+
+/**
+ * @param {any} obj
+ * @param {string | number | symbol} property
+ * @param {boolean} [chain=false]
  * @returns {any}
  */
-export function get(tracked) {
-	// reflect back the value if it's not boxed
-	if (!is_tracked_object(tracked)) {
+export function get_property(obj, property, chain = false) {
+	if (chain && obj == null) {
+		return undefined;
+	}
+	var tracked = obj[property];
+	if (tracked == null) {
 		return tracked;
 	}
+	return get(tracked);
+}
 
-	return (tracked.f & DERIVED) !== 0 ? get_derived(/** @type {Derived} */ (tracked)) : tracked.v;
+/**
+ * @param {any} obj
+ * @param {string | number | symbol} property
+ * @param {number} [d=1]
+ * @returns {number}
+ */
+export function update_property(obj, property, d = 1) {
+	var tracked = obj[property];
+	var value = get(tracked);
+	var new_value = d === 1 ? value++ : value--;
+	set(tracked, value);
+	return new_value;
+}
+
+/**
+ * @param {any} obj
+ * @param {string | number | symbol} property
+ * @param {number} [d=1]
+ * @returns {number}
+ */
+export function update_pre_property(obj, property, d = 1) {
+	var tracked = obj[property];
+	var value = get(tracked);
+	var new_value = d === 1 ? ++value : --value;
+	set(tracked, new_value);
+	return new_value;
 }
 
 /**
@@ -200,11 +431,31 @@ export function attr(name, value, is_boolean = false) {
 	}
 	if (value == null || (!value && is_boolean)) return '';
 	const normalized = (name in replacements && replacements[name].get(value)) || value;
-	const value_to_escape = name === 'class' ? clsx(normalized) : normalized;
+	let value_to_escape = name === 'class' ? clsx(normalized) : normalized;
+	value_to_escape =
+		name === 'style'
+			? typeof value !== 'string'
+				? get_styles(value)
+				: String(normalized).trim()
+			: value_to_escape;
 	const assignment = is_boolean ? '' : `="${escape(value_to_escape, true)}"`;
 	return ` ${name}${assignment}`;
 }
 
+/**
+ * @param {Record<string, string | number>} styles
+ * @returns {string}
+ */
+function get_styles(styles) {
+	var result = '';
+	for (const key in styles) {
+		const css_prop = normalize_css_property_name(key);
+		const value = String(styles[key]).trim();
+		result += `${css_prop}: ${value}; `;
+	}
+	return result.trim();
+}
+
 /**
  * @param {Record<string, any>} attrs
  * @param {string | undefined} css_hash