ripple 0.3.7 → 0.3.9

package/src/compiler/utils.js

@@ -292,25 +292,25 @@ export function is_component_level_function(context) {
  * Returns the matched Ripple tracking call name
  * @param {AST.Expression | AST.Super} callee
  * @param {CommonContext} context
- * @returns {'track' | 'trackSplit' | null}
+ * @returns {'track' | null}
  */
 export function is_ripple_track_call(callee, context) {
 	// Super expressions cannot be Ripple track calls
 	if (callee.type === 'Super') return null;
 
-	if (callee.type === 'Identifier' && (callee.name === 'track' || callee.name === 'trackSplit')) {
-		return is_ripple_import(callee, context) ? callee.name : null;
+	if (callee.type === 'Identifier' && callee.name === 'track') {
+		return is_ripple_import(callee, context) ? 'track' : null;
 	}
 
 	if (
 		callee.type === 'MemberExpression' &&
 		callee.object.type === 'Identifier' &&
 		callee.property.type === 'Identifier' &&
-		(callee.property.name === 'track' || callee.property.name === 'trackSplit') &&
+		callee.property.name === 'track' &&
 		!callee.computed &&
 		is_ripple_import(callee, context)
 	) {
-		return callee.property.name;
+		return 'track';
 	}
 
 	return null;
@@ -606,21 +606,8 @@ export function is_element_dynamic(node) {
  * @returns {boolean}
  */
 function is_id_dynamic(node) {
-	if (node.type === 'Identifier' || node.type === 'Literal') {
-		if (node.tracked) {
-			return true;
-		}
-
-		return false;
-	} else if (node.type === 'MemberExpression') {
-		if (/** @type {AST.Identifier} */ (node.object).tracked === true) {
-			return true;
-		}
-		if (node.property.type === 'MemberExpression') {
-			return is_id_dynamic(node.property);
-		}
-
-		return !!(/** @type {AST.Identifier} */ (node.property).tracked);
+	if (node.type === 'Identifier') {
+		return !!node.tracked;
 	}
 
 	return false;
@@ -686,6 +673,52 @@ function normalize_child(node, normalized, context) {
 	}
 }
 
+/**
+ * Replaces any lazy subpatterns in a parameter pattern with their generated identifiers.
+ * This is used by client and server transforms so nested lazy destructuring can coexist
+ * with otherwise normal object/array params.
+ * @param {AST.Pattern} pattern
+ * @returns {AST.Pattern}
+ */
+export function replace_lazy_param_pattern(pattern) {
+	switch (pattern.type) {
+		case 'AssignmentPattern':
+			return { ...pattern, left: replace_lazy_param_pattern(pattern.left) };
+
+		case 'ObjectPattern':
+			if (pattern.lazy && pattern.metadata?.lazy_id) {
+				return /** @type {AST.Pattern} */ (b.id(pattern.metadata.lazy_id));
+			}
+
+			return {
+				...pattern,
+				properties: pattern.properties.map((property) =>
+					property.type === 'RestElement'
+						? { ...property, argument: replace_lazy_param_pattern(property.argument) }
+						: { ...property, value: replace_lazy_param_pattern(property.value) },
+				),
+			};
+
+		case 'ArrayPattern':
+			if (pattern.lazy && pattern.metadata?.lazy_id) {
+				return /** @type {AST.Pattern} */ (b.id(pattern.metadata.lazy_id));
+			}
+
+			return {
+				...pattern,
+				elements: pattern.elements.map((element) =>
+					element === null ? null : replace_lazy_param_pattern(element),
+				),
+			};
+
+		case 'RestElement':
+			return { ...pattern, argument: replace_lazy_param_pattern(pattern.argument) };
+
+		default:
+			return pattern;
+	}
+}
+
 /**
  * @param {CommonContext} context
  */

package/src/runtime/index-client.js

@@ -102,13 +102,7 @@ export function hydrate(component, options) {
 
 export { Context } from './internal/client/context.js';
 
-export {
-	flush_sync as flushSync,
-	track,
-	track_split as trackSplit,
-	untrack,
-	tick,
-} from './internal/client/runtime.js';
+export { flush_sync as flushSync, track, untrack, tick } from './internal/client/runtime.js';
 
 export { RippleArray } from './array.js';
 
@@ -165,10 +159,5 @@ 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 { track, untrack, ref_prop as createRefKey } from './internal/client/runtime.js';
 import { user_effect as effect } from './internal/client/blocks.js';

package/src/runtime/index-server.js

@@ -1,8 +1,8 @@
-import { get, set, untrack, track, track_split } from './internal/server/index.js';
+import { get, set, untrack, track } from './internal/server/index.js';
 
 export { Context } from './internal/server/context.js';
 
-export { get, set, untrack, track, track_split as trackSplit };
+export { get, set, untrack, track };
 
 function noop() {}
 

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

@@ -186,7 +186,9 @@ function select_option(select, value, mounting = false) {
 
 		// Otherwise, update the selection
 		for (var option of select.options) {
-			option.selected = /** @type {string[]} */ (value).includes(get_option_value(option));
+			option.selected = /** @type {string[]} */ (value).includes(
+				/** @type {string} */ (get_option_value(option)),
+			);
 		}
 
 		return;

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

@@ -3,7 +3,7 @@
 import { branch, destroy_block, render, render_spread } from './blocks.js';
 import { COMPOSITE_BLOCK, DEFAULT_NAMESPACE, NAMESPACE_URI } from './constants.js';
 import { hydrate_next, hydrating } from './hydration.js';
-import { active_block, active_namespace, with_ns } from './runtime.js';
+import { active_block, active_namespace, get, with_ns } from './runtime.js';
 import { top_element_to_ns } from './utils.js';
 
 /**
@@ -29,7 +29,8 @@ export function composite(get_component, node, props) {
 
 	render(
 		() => {
-			var component = get_component();
+			// @ts-ignore — get() handles non-tracked values via is_ripple_object() check
+			var component = get(get_component());
 
 			if (b !== null) {
 				destroy_block(b);

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

@@ -168,7 +168,7 @@ export function handle_event_propagation(event) {
 				null;
 
 			try {
-				var delegated = current_target['__' + event_name];
+				var delegated = /** @type {Record<string, any>} */ (current_target)['__' + event_name];
 
 				if (delegated !== undefined && !(/** @type {any} */ (current_target).disabled)) {
 					if (is_array(delegated)) {

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

@@ -1,4 +1,3 @@
-/** @import { TemplateNode } from '#client' */
 import { render } from './blocks.js';
 import { HEAD_BLOCK } from './constants.js';
 import { COMMENT_NODE } from '../../../constants.js';
@@ -38,8 +37,8 @@ export function head(hash, render_fn) {
 		if (head_anchor === null) {
 			set_hydrating(false);
 		} else {
-			var start = /** @type {TemplateNode} */ (get_next_sibling(head_anchor));
-			head_anchor.remove(); // in case this component is repeated
+			var start = get_next_sibling(head_anchor);
+			/** @type {ChildNode} */ (head_anchor).remove(); // in case this component is repeated
 
 			set_hydrate_node(start);
 		}
@@ -54,7 +53,7 @@ export function head(hash, render_fn) {
 	} finally {
 		if (was_hydrating) {
 			set_hydrating(true);
-			set_hydrate_node(/** @type {TemplateNode} */ (previous_hydrate_node));
+			set_hydrate_node(previous_hydrate_node);
 		}
 	}
 }

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

@@ -52,7 +52,6 @@ export {
 	update_property,
 	update_pre_property,
 	track,
-	track_split,
 	push_component,
 	pop_component,
 	untrack,

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

@@ -426,58 +426,6 @@ export function track(v, get, set, b) {
 	return tracked(v, b, get, set);
 }
 
-/**
- * @param {Record<string|symbol, any>} v
- * @param {(symbol | string)[]} l
- * @param {Block} b
- * @returns {Tracked[]}
- */
-export function track_split(v, l, b) {
-	var is_tracked = is_ripple_object(v);
-
-	if (is_tracked || typeof v !== 'object' || v === null || is_array(v)) {
-		throw new TypeError('Invalid value: expected a non-tracked object');
-	}
-
-	/** @type {Tracked[]} */
-	var out = [];
-	/** @type {Record<string|symbol, any>} */
-	var rest = {};
-	/** @type {Record<PropertyKey, 1>} */
-	var done = {};
-	var props = Reflect.ownKeys(v);
-
-	for (let i = 0, key, t; i < l.length; i++) {
-		key = l[i];
-
-		if (props.includes(key)) {
-			if (is_ripple_object(v[key])) {
-				t = v[key];
-			} else {
-				t = tracked(undefined, b);
-				t = define_property(t, '__v', /** @type {PropertyDescriptor} */ (get_descriptor(v, key)));
-			}
-		} else {
-			t = tracked(undefined, b);
-		}
-
-		out[i] = t;
-		done[key] = 1;
-	}
-
-	for (let i = 0, key; i < props.length; i++) {
-		key = props[i];
-		if (done[key]) {
-			continue;
-		}
-		define_property(rest, key, /** @type {PropertyDescriptor} */ (get_descriptor(v, key)));
-	}
-
-	out.push(tracked(rest, b));
-
-	return out;
-}
-
 /**
  * @param {Tracked | Derived} tracked
  * @returns {Dependency}

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

@@ -1,6 +1,6 @@
 /**
 @import { Component, Dependency, Derived, Tracked } from '#server';
-@import { SSRComponent, renderToStream, render } from 'ripple/server';
+@import { SSRComponent } from 'ripple/server';
 */
 
 import { Readable } from 'stream';
@@ -231,12 +231,12 @@ class Output {
 	}
 }
 
-/** @type {render} */
+/** @type {import('ripple/server').render} */
 export async function render(component) {
 	const output = new Output(null, null);
 	let head = '';
 	let body = '';
-	let css = new Set();
+	let css = /** @type {Set<string>} */ (new Set());
 
 	// Reset dev-mode element tracking state at the start of each render
 	reset_element_state();
@@ -262,7 +262,7 @@ export async function render(component) {
 	return { head, body, css };
 }
 
-/** @type {renderToStream} */
+/** @type {import('ripple/server').renderToStream} */
 export function renderToStream(component) {
 	const stream = new Readable({
 		read() {},
@@ -702,6 +702,24 @@ function tracked(v, get, set) {
 	return /** @type {Tracked} */ (new TrackedValue(v, get || set ? { get, set } : empty_get_set));
 }
 
+/**
+ * @param {Record<string, unknown>} obj
+ * @param {string[]} exclude_keys
+ * @returns {Record<string, unknown>}
+ */
+export function exclude_from_object(obj, exclude_keys) {
+	/** @type {Record<string, unknown>} */
+	var new_obj = {};
+
+	for (const key of Object.keys(obj)) {
+		if (!exclude_keys.includes(key)) {
+			new_obj[key] = obj[key];
+		}
+	}
+
+	return new_obj;
+}
+
 /**
  * @param {any} v
  * @param {(value: any) => any} [get]
@@ -722,57 +740,6 @@ export function track(v, get, set) {
 	return tracked(v, get, set);
 }
 
-/**
- * @param {Record<string|symbol, any>} v
- * @param {(symbol | string)[]} l
- * @returns {Tracked[]}
- */
-export function track_split(v, l) {
-	var is_tracked = is_ripple_object(v);
-
-	if (is_tracked || typeof v !== 'object' || v === null || is_array(v)) {
-		throw new TypeError('Invalid value: expected a non-tracked object');
-	}
-
-	/** @type {Tracked[]} */
-	var out = [];
-	/** @type {Record<string|symbol, any>} */
-	var rest = {};
-	/** @type {Record<PropertyKey, 1>} */
-	var done = {};
-	var props = Reflect.ownKeys(v);
-
-	for (let i = 0, key, t; i < l.length; i++) {
-		key = l[i];
-
-		if (props.includes(key)) {
-			if (is_ripple_object(v[key])) {
-				t = v[key];
-			} else {
-				t = tracked(undefined);
-				t = define_property(t, 'v', /** @type {PropertyDescriptor} */ (get_descriptor(v, key)));
-			}
-		} else {
-			t = tracked(undefined);
-		}
-
-		out[i] = t;
-		done[key] = 1;
-	}
-
-	for (let i = 0, key; i < props.length; i++) {
-		key = props[i];
-		if (done[key]) {
-			continue;
-		}
-		define_property(rest, key, /** @type {PropertyDescriptor} */ (get_descriptor(v, key)));
-	}
-
-	out.push(tracked(rest));
-
-	return out;
-}
-
 /**
  * @param {any} _
  * @param {ConstructorParameters<typeof URL>} params
@@ -865,6 +832,15 @@ export function ripple_object(obj) {
 	return obj;
 }
 
+/**
+ * @template K, V
+ * @param {Iterable<readonly [K, V]>} [iterable]
+ * @returns {Map<K, V>}
+ */
+export function ripple_map(iterable) {
+	return new Map(iterable);
+}
+
 /**
  * Returns the fallback value if the given value is undefined.
  * @template T

package/tests/client/array/array.copy-within.test.ripple

@@ -4,16 +4,16 @@ describe('RippleArray copyWithin', () => {
 	it('handles copyWithin operation with reactivity', () => {
 		component ArrayTest() {
 			let items = new RippleArray(1, 2, 3, 4, 5);
-			let firstItem = track(() => items[0]);
-			let thirdItem = track(() => items[2]);
-			let fourthItem = track(() => items[3]);
+			let &[firstItem] = track(() => items[0]);
+			let &[thirdItem] = track(() => items[2]);
+			let &[fourthItem] = track(() => items[3]);
 
 			<button onClick={() => items.copyWithin(0, 3)}>{'copy end to start'}</button>
 			<button onClick={() => items.copyWithin(2, 0, 2)}>{'copy start to middle'}</button>
 			<pre>{JSON.stringify(items)}</pre>
-			<pre>{@firstItem}</pre>
-			<pre>{@thirdItem}</pre>
-			<pre>{@fourthItem}</pre>
+			<pre>{firstItem}</pre>
+			<pre>{thirdItem}</pre>
+			<pre>{fourthItem}</pre>
 		}
 
 		render(ArrayTest);
@@ -49,13 +49,13 @@ describe('RippleArray copyWithin', () => {
 	it('handles copyWithin with negative indexes and reactivity', () => {
 		component ArrayTest() {
 			let items = new RippleArray(1, 2, 3, 4, 5);
-			let secondItem = track(() => items[1]);
-			let thirdItem = track(() => items[2]);
+			let &[secondItem] = track(() => items[1]);
+			let &[thirdItem] = track(() => items[2]);
 
 			<button onClick={() => items.copyWithin(-4, -2)}>{'copy with negative indexes'}</button>
 			<pre>{JSON.stringify(items)}</pre>
-			<pre>{@secondItem}</pre>
-			<pre>{@thirdItem}</pre>
+			<pre>{secondItem}</pre>
+			<pre>{thirdItem}</pre>
 		}
 
 		render(ArrayTest);
@@ -80,12 +80,12 @@ describe('RippleArray copyWithin', () => {
 	it('handles copyWithin with overlapping ranges', () => {
 		component ArrayTest() {
 			let items = new RippleArray(1, 2, 3, 4, 5);
-			let entries = track(() => Array.from(items.entries()));
+			let &[entries] = track(() => Array.from(items.entries()));
 
 			<button onClick={() => items.copyWithin(2, 1, 4)}>{'copy with overlap'}</button>
 			<pre>{JSON.stringify(items)}</pre>
 
-			for (const [i, value] of @entries) {
+			for (const [i, value] of entries) {
 				<pre>{`items[${i}]: ${value}`}</pre>
 			}
 		}