ripple 0.2.216 → 0.3.0

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

@@ -13,7 +13,25 @@ interface BaseNodeMetaData {
 	scoped?: boolean;
 	path: AST.Node[];
 	has_template?: boolean;
-	source_name?: string | '#Map' | '#Set' | '#server' | '#style';
+	source_name?:
+		| string
+		| '#ripple'
+		| '#ripple.map'
+		| '#ripple.set'
+		| '#ripple.server'
+		| '#ripple.style'
+		| '#ripple.array'
+		| '#ripple.object'
+		| '#ripple.effect'
+		| '#ripple.track'
+		| '#ripple.trackSplit'
+		| '#ripple.untrack'
+		| '#ripple.url'
+		| '#ripple.urlSearchParams'
+		| '#ripple.date'
+		| '#ripple.mediaQuery'
+		| '#ripple.context'
+		| '#ripple.validate';
 	is_capitalized?: boolean;
 	has_await?: boolean;
 	commentContainerId?: number;
@@ -64,8 +82,22 @@ declare module 'estree' {
 		metadata: FunctionMetaData;
 	}
 
+	interface NewExpression {
+		metadata: BaseNodeMetaData & {
+			skipNewMapping?: boolean;
+		};
+	}
+
+	type Accessibility = 'public' | 'protected' | 'private'; // missing in acorn-typescript types
 	interface MethodDefinition {
 		typeParameters?: TSTypeParameterDeclaration;
+		accessibility?: Accessibility;
+	}
+
+	interface PropertyDefinition {
+		accessibility?: Accessibility;
+		readonly?: boolean;
+		optional?: boolean;
 	}
 
 	interface ClassDeclaration {
@@ -85,6 +117,9 @@ declare module 'estree' {
 			// needed for volar tokens to recognize component functions
 			is_component?: boolean;
 		};
+		typeAnnotation?: TSTypeAnnotation | undefined;
+		decorators: TSESTree.Decorator[];
+		optional: boolean;
 	}
 
 	// We mark the whole node as marked when member is @[expression]
@@ -125,10 +160,8 @@ declare module 'estree' {
 	}
 
 	interface ExpressionMap {
-		TrackedArrayExpression: TrackedArrayExpression;
-		TrackedObjectExpression: TrackedObjectExpression;
-		TrackedMapExpression: TrackedMapExpression;
-		TrackedSetExpression: TrackedSetExpression;
+		RippleArrayExpression: RippleArrayExpression;
+		RippleObjectExpression: RippleObjectExpression;
 		TrackedExpression: TrackedExpression;
 		StyleIdentifier: StyleIdentifier;
 		ServerIdentifier: ServerIdentifier;
@@ -221,6 +254,12 @@ declare module 'estree' {
 		loc: AST.SourceLocation;
 	}
 
+	interface NodeWithMaybeComments {
+		innerComments?: AST.Comment[] | undefined;
+		leadingComments?: AST.Comment[] | undefined;
+		trailingComments?: AST.Comment[] | undefined;
+	}
+
 	/**
 	 * Ripple custom interfaces and types section
 	 */
@@ -237,6 +276,7 @@ declare module 'estree' {
 			styleIdentifierPresent?: boolean;
 		};
 		default: boolean;
+		typeParameters?: AST.TSTypeParameterDeclaration;
 	}
 
 	interface TsxCompat extends AST.BaseNode {
@@ -306,7 +346,6 @@ declare module 'estree' {
 		};
 	}
 
-	// ScriptContent is only used by Prettier currently
 	interface ScriptContent extends Omit<AST.Element, 'type'> {
 		type: 'ScriptContent';
 		content: string;
@@ -315,8 +354,8 @@ declare module 'estree' {
 	/**
 	 * Tracked Expressions
 	 */
-	interface TrackedArrayExpression extends Omit<AST.ArrayExpression, 'type'> {
-		type: 'TrackedArrayExpression';
+	interface RippleArrayExpression extends Omit<AST.ArrayExpression, 'type'> {
+		type: 'RippleArrayExpression';
 		elements: (AST.Expression | AST.SpreadElement | null)[];
 	}
 
@@ -325,21 +364,11 @@ declare module 'estree' {
 		type: 'TrackedExpression';
 	}
 
-	interface TrackedObjectExpression extends Omit<AST.ObjectExpression, 'type'> {
-		type: 'TrackedObjectExpression';
+	interface RippleObjectExpression extends Omit<AST.ObjectExpression, 'type'> {
+		type: 'RippleObjectExpression';
 		properties: (AST.Property | AST.SpreadElement)[];
 	}
 
-	interface TrackedMapExpression extends AST.BaseExpression {
-		type: 'TrackedMapExpression';
-		arguments: (AST.Expression | AST.SpreadElement)[];
-	}
-
-	interface TrackedSetExpression extends AST.BaseExpression {
-		type: 'TrackedSetExpression';
-		arguments: (AST.Expression | AST.SpreadElement)[];
-	}
-
 	/**
 	 * Ripple attribute nodes
 	 */
@@ -399,9 +428,10 @@ declare module 'estree' {
 	export type NodeWithChildren = AST.Element | AST.TsxCompat;
 
 	export namespace CSS {
-		export interface BaseNode {
+		export interface BaseNode extends AST.NodeWithMaybeComments {
 			start: number;
 			end: number;
+			loc?: AST.SourceLocation;
 		}
 
 		export interface StyleSheet extends BaseNode {
@@ -575,6 +605,9 @@ declare module 'estree-jsx' {
 
 	interface JSXIdentifier {
 		tracked?: boolean;
+		metadata: BaseNodeMetaData & {
+			is_component?: boolean;
+		};
 	}
 
 	interface JSXEmptyExpression {
@@ -965,7 +998,7 @@ declare module 'estree' {
 	> {
 		constraint: TypeNode | undefined;
 		default: TypeNode | undefined;
-		name: AST.Identifier;
+		name: string; // for some reason acorn-typescript uses string instead of Identifier
 	}
 	interface TSTypeParameterDeclaration extends Omit<
 		AcornTSNode<TSESTree.TSTypeParameterDeclaration>,
@@ -1125,7 +1158,7 @@ export interface Binding {
 	metadata: {
 		is_dynamic_component?: boolean;
 		pattern?: AST.Identifier;
-		is_tracked_object?: boolean;
+		is_ripple_object?: boolean;
 	} | null;
 	/** Kind of binding */
 	kind: BindingKind;
@@ -1151,6 +1184,25 @@ export interface ScopeRoot {
 	unique(preferred_name: string): AST.Identifier;
 }
 
+export interface ScopeConstructorInterface {
+	root: ScopeRoot;
+	parent: ScopeInterface | null;
+	porous: boolean;
+	error_options: {
+		loose: boolean;
+		errors: RippleCompileError[];
+		filename: string;
+		comments?: AST.CommentWithLocation[];
+	};
+}
+
+export type ScopeConstructorParameters = [
+	root: ScopeConstructorInterface['root'],
+	parent: ScopeConstructorInterface['parent'],
+	porous: ScopeConstructorInterface['porous'],
+	error_options: ScopeConstructorInterface['error_options'],
+];
+
 /**
  * Lexical scope for variable bindings
  */

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

@@ -29,6 +29,7 @@ declare module 'acorn' {
 		line: number;
 		column: number;
 		constructor(line: number, column: number);
+		offset(offset: number): Position;
 	}
 	function isNewLine(code: number): boolean;
 
@@ -929,10 +930,8 @@ export namespace Parse {
 			| AST.ServerIdentifier
 			| AST.StyleIdentifier
 			| AST.TrackedExpression
-			| AST.TrackedMapExpression
-			| AST.TrackedSetExpression
-			| AST.TrackedArrayExpression
-			| AST.TrackedObjectExpression
+			| AST.RippleArrayExpression
+			| AST.RippleObjectExpression
 			| AST.Component
 			| AST.Identifier
 			| AST.Literal;
@@ -955,15 +954,11 @@ export namespace Parse {
 		/** Parse parenthesized expression (just the expression) */
 		parseParenExpression(): AST.Expression;
 
-		parseTrackedCollectionExpression(
-			type: 'TrackedMapExpression' | 'TrackedSetExpression',
-		): AST.TrackedMapExpression | AST.TrackedSetExpression;
-
-		parseTrackedArrayExpression(): AST.TrackedArrayExpression;
+		parseRippleArrayExpression(): AST.RippleArrayExpression;
 
 		parseTrackedExpression(): AST.TrackedExpression;
 
-		parseTrackedObjectExpression(): AST.TrackedObjectExpression;
+		parseRippleObjectExpression(): AST.RippleObjectExpression;
 
 		/**
 		 * Parse item in parentheses (can be overridden for flow/ts)
@@ -1131,6 +1126,8 @@ export namespace Parse {
 
 		tsCheckTypeAnnotationForReadOnly(node: AST.TSTypeOperator): void;
 
+		tsParseTypeArguments(): AST.Node;
+
 		/**
 		 * Get property kind from name
 		 * @param prop Property node

package/src/compiler/utils.js

@@ -163,6 +163,21 @@ const DOM_PROPERTIES = [
 	'disableRemotePlayback',
 ];
 
+/** @type {Record<string, string>} */
+const RIPPLE_NAMESPACE_CALL_NAME = {
+	'#ripple.url': 'ripple_url',
+	'#ripple.urlSearchParams': 'ripple_url_search_params',
+	'#ripple.date': 'ripple_date',
+	'#ripple.map': 'ripple_map',
+	'#ripple.set': 'ripple_set',
+	'#ripple.mediaQuery': 'media_query',
+	'#ripple.context': 'context',
+	'#ripple.effect': 'effect',
+	'#ripple.untrack': 'untrack',
+	'#ripple.array': 'ripple_array',
+	'#ripple.object': 'ripple_object',
+};
+
 /**
  * Returns true if name is a DOM property
  * @param {string} name
@@ -915,3 +930,36 @@ export function flatten_switch_consequent(consequent) {
 	}
 	return result;
 }
+
+/**
+ * @param {string | null | undefined} name
+ * @returns {string | null}
+ */
+export function get_ripple_namespace_call_name(name) {
+	return name == null ? null : (RIPPLE_NAMESPACE_CALL_NAME[name] ?? null);
+}
+
+/**
+ * @param {AST.MemberExpression} member
+ * @returns {boolean}
+ */
+export function is_property_part_of_ripple_namespace(member) {
+	/** @type {AST.MemberExpression | null} */
+	let current = member;
+
+	while (current !== null) {
+		const source_name = current.object.metadata?.source_name;
+		if (get_ripple_namespace_call_name(source_name) !== null) {
+			return true;
+		}
+
+		const parent = current.metadata?.path?.at(-1);
+		if (parent?.type !== 'MemberExpression' || parent.object !== current) {
+			break;
+		}
+
+		current = parent;
+	}
+
+	return false;
+}

package/src/runtime/array.js

@@ -6,62 +6,93 @@ import { array_proxy } from './proxy.js';
  * @template T
  * @constructor
  * @param {...T} elements
- * @returns {TrackedArray<T>}
+ * @returns {RippleArray<T>}
  */
-export function TrackedArray(...elements) {
+export function RippleArray(...elements) {
 	if (!new.target) {
-		throw new Error("TrackedArray must be called with 'new'");
+		throw new Error("RippleArray must be called with 'new'");
 	}
 
 	var block = safe_scope();
+	return ripple_array(block, ...elements);
+}
+
+/**
+ * @template T
+ * @param {ArrayLike<T> | Iterable<T>} arrayLike
+ * @param {(v: T, k: number) => any | undefined} [mapFn]
+ * @param {*} [thisArg]
+ * @returns {RippleArray<T>}
+ */
+RippleArray.from = function (arrayLike, mapFn, thisArg) {
+	return ripple_array.from(safe_scope(), arrayLike, mapFn, thisArg);
+};
+
+/**
+ * @template T
+ * @param {...T} items
+ * @returns {RippleArray<T>}
+ */
+RippleArray.of = function (...items) {
+	return ripple_array.of(safe_scope(), ...items);
+};
+
+/**
+ * @template T
+ * @param {ArrayLike<T> | Iterable<T>} arrayLike
+ * @param {(v: T, k: number) => any | undefined} [mapFn]
+ * @param {any} [thisArg]
+ * @returns {Promise<RippleArray<T>>}
+ */
+RippleArray.fromAsync = async function (arrayLike, mapFn, thisArg) {
+	return ripple_array.fromAsync(safe_scope(), arrayLike, mapFn, thisArg);
+};
+
+/**
+ * @template T
+ * @param {Block} block
+ * @param {...T} elements
+ * @returns {RippleArray<T>}
+ */
+export function ripple_array(block, ...elements) {
 	return array_proxy({ elements, block });
 }
 
 /**
  * @template T
+ * @param {Block} block
  * @param {ArrayLike<T> | Iterable<T>} arrayLike
  * @param {(v: T, k: number) => any | undefined} [mapFn]
  * @param {*} [thisArg]
- * @returns {TrackedArray<T>}
+ * @returns {RippleArray<T>}
  */
-TrackedArray.from = function (arrayLike, mapFn, thisArg) {
-	var block = safe_scope();
+ripple_array.from = function (block, arrayLike, mapFn, thisArg) {
 	var elements = mapFn ? Array.from(arrayLike, mapFn, thisArg) : Array.from(arrayLike);
 	return array_proxy({ elements, block, from_static: true });
 };
 
 /**
  * @template T
+ * @param {Block} block
  * @param {...T} items
- * @returns {TrackedArray<T>}
+ * @returns {RippleArray<T>}
  */
-TrackedArray.of = function (...items) {
-	var block = safe_scope();
+ripple_array.of = function (block, ...items) {
 	var elements = Array.of(...items);
 	return array_proxy({ elements, block, from_static: true });
 };
 
 /**
  * @template T
+ * @param {Block} block
  * @param {ArrayLike<T> | Iterable<T>} arrayLike
  * @param {(v: T, k: number) => any | undefined} [mapFn]
  * @param {any} [thisArg]
- * @returns {Promise<TrackedArray<T>>}
+ * @returns {Promise<RippleArray<T>>}
  */
-TrackedArray.fromAsync = async function (arrayLike, mapFn, thisArg) {
-	var block = safe_scope();
+ripple_array.fromAsync = async function (block, arrayLike, mapFn, thisArg) {
 	var elements = mapFn
 		? await Array.fromAsync(arrayLike, mapFn, thisArg)
 		: await Array.fromAsync(arrayLike);
 	return array_proxy({ elements, block, from_static: true });
 };
-
-/**
- * @template T
- * @param {Array<T>} elements
- * @param {Block} block
- * @returns {TrackedArray<T>}
- */
-export function tracked_array(elements, block) {
-	return array_proxy({ elements, block, from_static: true });
-}

package/src/runtime/date.js

@@ -1,18 +1,17 @@
 /** @import { Block, Derived } from '#client' */
-import { safe_scope, tracked, get, derived, set } from './internal/client/runtime.js';
+import { safe_scope, tracked, get, derived, set, with_scope } from './internal/client/runtime.js';
 
 var init = false;
 
-export class TrackedDate extends Date {
+export class RippleDate extends Date {
 	#time;
 	/** @type {Map<keyof Date, Derived>} */
 	#deriveds = new Map();
 	/** @type {Block} */
 	#block;
 
-	/** @param {any[]} params */
+	/** @param {ConstructorParameters<typeof Date>} params */
 	constructor(...params) {
-		// @ts-ignore
 		super(...params);
 
 		var block = (this.#block = safe_scope());
@@ -24,7 +23,7 @@ export class TrackedDate extends Date {
 	#init() {
 		init = true;
 
-		var proto = TrackedDate.prototype;
+		var proto = RippleDate.prototype;
 		var date_proto = Date.prototype;
 
 		var methods = /** @type {Array<keyof Date & string>} */ (
@@ -71,3 +70,14 @@ export class TrackedDate extends Date {
 		}
 	}
 }
+
+/**
+ * @param {Block} block
+ * @param {ConstructorParameters<typeof Date>} params
+ * @returns {RippleDate}
+ */
+export function ripple_date(block, ...params) {
+	return with_scope(block, () => {
+		return new RippleDate(...params);
+	});
+}

package/src/runtime/index-client.js

@@ -110,19 +110,19 @@ export {
 	tick,
 } from './internal/client/runtime.js';
 
-export { TrackedArray } from './array.js';
+export { RippleArray } from './array.js';
 
-export { TrackedObject } from './object.js';
+export { RippleObject } from './object.js';
 
-export { TrackedSet } from './set.js';
+export { RippleSet } from './set.js';
 
-export { TrackedMap } from './map.js';
+export { RippleMap } from './map.js';
 
-export { TrackedDate } from './date.js';
+export { RippleDate } from './date.js';
 
-export { TrackedURL } from './url.js';
+export { RippleURL } from './url.js';
 
-export { TrackedURLSearchParams } from './url-search-params.js';
+export { RippleURLSearchParams } from './url-search-params.js';
 
 export { createSubscriber } from './create-subscriber.js';
 
@@ -155,3 +155,37 @@ export {
 	bindOffsetWidth,
 	bindOffsetHeight,
 } from './internal/client/bindings.js';
+
+import { RippleMap } from './map.js';
+import { RippleSet } from './set.js';
+import { RippleArray } from './array.js';
+import { RippleObject } from './object.js';
+import { Context } from './internal/client/context.js';
+import { RippleURL } from './url.js';
+import { RippleURLSearchParams } from './url-search-params.js';
+import { RippleDate } from './date.js';
+import { MediaQuery } from './media-query.js';
+import {
+	track,
+	track_split as trackSplit,
+	untrack,
+	ref_prop as createRefKey,
+} from './internal/client/runtime.js';
+import { user_effect as effect } from './internal/client/blocks.js';
+
+export const ripple_namespace = {
+	map: RippleMap,
+	set: RippleSet,
+	array: RippleArray,
+	object: RippleObject,
+	context: Context,
+	url: RippleURL,
+	urlSearchParams: RippleURLSearchParams,
+	date: RippleDate,
+	mediaQuery: MediaQuery,
+	createRefKey,
+	track,
+	trackSplit,
+	effect,
+	untrack,
+};

package/src/runtime/index-server.js

@@ -12,13 +12,13 @@ export const on = noop;
 export const tick = noop;
 export const flushSync = noop;
 
-export const TrackedObject = globalThis.Object;
-export const TrackedArray = globalThis.Array;
-export const TrackedDate = globalThis.Date;
-export const TrackedSet = globalThis.Set;
-export const TrackedMap = globalThis.Map;
-export const TrackedURL = globalThis.URL;
-export const TrackedURLSearchParams = globalThis.URLSearchParams;
+export const RippleObject = globalThis.Object;
+export const RippleArray = globalThis.Array;
+export const RippleDate = globalThis.Date;
+export const RippleSet = globalThis.Set;
+export const RippleMap = globalThis.Map;
+export const RippleURL = globalThis.URL;
+export const RippleURLSearchParams = globalThis.URLSearchParams;
 
 /**
  * @param {string} query A media query string

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

@@ -10,7 +10,7 @@
 import { effect, render } from './blocks.js';
 import { on } from './events.js';
 import { get, set } from './runtime.js';
-import { is_array, is_tracked_object } from './utils.js';
+import { is_array, is_ripple_object } from './utils.js';
 
 /**
  * @param {string} name
@@ -47,7 +47,7 @@ function get_bind_get_set(name, maybe_tracked, set_func) {
 			setter: set_func,
 		};
 	} else {
-		if (!is_tracked_object(maybe_tracked)) {
+		if (!is_ripple_object(maybe_tracked)) {
 			throw not_tracked_type_error(name);
 		}
 

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

@@ -369,6 +369,45 @@ export function remove_block_dom(node, end) {
 	}
 }
 
+/**
+ * Moves DOM nodes from a block to a target element (typically a DocumentFragment).
+ * If the block has state (start/end), moves that range.
+ * If not, recursively moves content from child branch blocks.
+ * @param {Block} block - The block to move content from
+ * @param {Element | DocumentFragment} target - Where to move the nodes
+ * @returns {boolean} - True if content was moved
+ */
+export function move_block(block, target) {
+	var f = block.f;
+
+	// Only BRANCH_BLOCKs (excluding TRY_BLOCK) can have DOM state to move
+	if ((f & BRANCH_BLOCK) !== 0 && (f & TRY_BLOCK) === 0) {
+		var s = block.s;
+		if (s !== null && s.start !== null) {
+			var node = s.start;
+			var end = s.end;
+
+			while (node !== null) {
+				var next = node === end ? null : next_sibling(node);
+				target.append(node);
+				node = next;
+			}
+			return true;
+		}
+	}
+
+	// If this block has no DOM, try moving from child branch blocks
+	var moved = false;
+	var child = block.first;
+	while (child !== null) {
+		if (move_block(child, target)) {
+			moved = true;
+		}
+		child = child.next;
+	}
+	return moved;
+}
+
 /**
  * @param {Block} block
  * @param {boolean} [remove_dom]
@@ -401,5 +440,5 @@ export function destroy_block(block, remove_dom = true) {
 		unlink_block(block);
 	}
 
-	block.fn = block.s = block.d = block.p = block.d = block.co = block.t = null;
+	block.fn = block.s = block.d = block.p = block.co = block.t = null;
 }

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

@@ -58,3 +58,11 @@ export class Context {
 		current_context.set(context, value);
 	}
 }
+
+/**
+ * @template T
+ * @param {T} [initial_value]
+ */
+export function context(initial_value) {
+	return new Context(initial_value);
+}

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

@@ -436,7 +436,7 @@ function reconcile_by_key(anchor, block, b, render_fn, is_controlled, is_indexed
 						if (fast_path_removal) {
 							fast_path_removal = false;
 							while (i > a_start) {
-								destroy_block(a[a_start++]);
+								destroy_block(a_blocks[a_start++]);
 							}
 						}
 						sources[j - b_start] = i + 1;
@@ -450,7 +450,7 @@ function reconcile_by_key(anchor, block, b, render_fn, is_controlled, is_indexed
 						if (is_indexed) {
 							update_index(block, j);
 						}
-						update_value(b_block, b_val);
+						update_value(block, b_val);
 						++patched;
 					} else if (!fast_path_removal) {
 						destroy_block(a_blocks[i]);
@@ -694,7 +694,7 @@ function reconcile_by_ref(anchor, block, b, render_fn, is_controlled, is_indexed
 						if (fast_path_removal) {
 							fast_path_removal = false;
 							while (i > a_start) {
-								destroy_block(a[a_start++]);
+								destroy_block(a_blocks[a_start++]);
 							}
 						}
 						sources[j - b_start] = i + 1;