ripple 0.2.139 → 0.2.141

package/src/compiler/utils.js

@@ -201,7 +201,9 @@ export function get_delegated_event(event_name, handler, state) {
 		if (binding != null) {
 			for (const { path } of binding.references) {
 				const parent = path.at(-1);
-				if (parent === undefined) return unhoisted;
+				if (parent === undefined) {
+					return unhoisted;
+				}
 
 				const grandparent = path.at(-2);
 
@@ -227,7 +229,11 @@ export function get_delegated_event(event_name, handler, state) {
 					) {
 						return unhoisted;
 					}
-				} else if (parent.type !== 'FunctionDeclaration' && parent.type !== 'VariableDeclarator') {
+				} else if (
+					parent.type !== 'FunctionDeclaration' &&
+					parent.type !== 'VariableDeclarator' &&
+					parent.type !== 'Attribute'
+				) {
 					return unhoisted;
 				}
 			}
@@ -262,24 +268,29 @@ export function get_delegated_event(event_name, handler, state) {
 
 	const visited_references = new Set();
 	const scope = target_function.metadata.scope;
-	for (const [reference] of scope.references) {
+	for (const [reference, ref_nodes] of scope.references) {
 		// Bail out if the arguments keyword is used or $host is referenced
 		if (reference === 'arguments') return unhoisted;
 
 		const binding = scope.get(reference);
 		const local_binding = state.scope.get(reference);
 
+		if (local_binding === null || binding == null) {
+			return unhoisted;
+		}
+
 		// If we are referencing a binding that is shadowed in another scope then bail out.
-		if (local_binding !== null && binding !== null && local_binding.node !== binding.node) {
+		if (local_binding.node !== binding.node) {
 			return unhoisted;
 		}
+		const is_tracked = ref_nodes.some(({ node }) => node.tracked);
 
 		if (
 			binding !== null &&
 			// Bail out if the the binding is a rest param
 			(binding.declaration_kind === 'rest_param' || // or any normal not reactive bindings that are mutated.
 				// Bail out if we reference anything from the EachBlock (for now) that mutates in non-runes mode,
-				(binding.kind === 'normal' && binding.updated))
+				(binding.kind === 'normal' && !is_tracked && binding.updated))
 		) {
 			return unhoisted;
 		}
@@ -352,7 +363,7 @@ export function build_hoisted_params(node, context) {
 		}
 	} else {
 		for (const param of node.params) {
-			params.push(/** @type {Pattern} */(context.visit(param)));
+			params.push(/** @type {Pattern} */ (context.visit(param)));
 		}
 	}
 
@@ -554,7 +565,7 @@ export function is_ripple_import(callee, context) {
  * @returns {boolean}
  */
 export function is_declared_function_within_component(node, context) {
-	const component = context.path?.find(/** @param {RippleNode} n */(n) => n.type === 'Component');
+	const component = context.path?.find(/** @param {RippleNode} n */ (n) => n.type === 'Component');
 
 	if (node.type === 'Identifier' && component) {
 		const binding = context.state.scope.get(node.name);
@@ -611,8 +622,8 @@ export function visit_assignment_expression(node, context, build_assignment) {
 				assignment ??
 				b.assignment(
 					'=',
-					/** @type {Pattern} */(context.visit(path.node)),
-					/** @type {Expression} */(context.visit(value)),
+					/** @type {Pattern} */ (context.visit(path.node)),
+					/** @type {Expression} */ (context.visit(value)),
 				)
 			);
 		});
@@ -702,8 +713,8 @@ export function build_assignment(operator, left, right, context) {
 			object,
 			b.assignment(
 				operator,
-				/** @type {Pattern} */(context.visit(left)),
-				/** @type {Expression} */(context.visit(right)),
+				/** @type {Pattern} */ (context.visit(left)),
+				/** @type {Expression} */ (context.visit(right)),
 			),
 		);
 	}

package/src/runtime/date.js

@@ -64,7 +64,7 @@ export class TrackedDate extends Date {
 				proto[method] = function (...args) {
 					// @ts-ignore
 					var result = date_proto[method].apply(this, args);
-					set(this.#time, date_proto.getTime.call(this), this.#block);
+					set(this.#time, date_proto.getTime.call(this));
 					return result;
 				};
 			}

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

@@ -175,7 +175,7 @@ export function bindValue(maybe_tracked) {
 					value = selected_option && get_option_value(selected_option);
 				}
 
-				set(tracked, value, block);
+				set(tracked, value);
 			});
 
 			effect(() => {
@@ -189,7 +189,7 @@ export function bindValue(maybe_tracked) {
 					var selected_option = select.querySelector(':checked');
 					if (selected_option !== null) {
 						value = get_option_value(selected_option);
-						set(tracked, value, block);
+						set(tracked, value);
 					}
 				}
 
@@ -202,7 +202,7 @@ export function bindValue(maybe_tracked) {
 				/** @type {any} */
 				var value = input.value;
 				value = is_numberlike_input(input) ? to_number(value) : value;
-				set(tracked, value, block);
+				set(tracked, value);
 
 				await tick();
 
@@ -254,7 +254,7 @@ export function bindChecked(maybe_tracked) {
 
 	return (input) => {
 		const clear_event = on(input, 'change', () => {
-			set(tracked, input.checked, block);
+			set(tracked, input.checked);
 		});
 
 		return clear_event;
@@ -277,11 +277,11 @@ function bind_element_size(maybe_tracked, type) {
 
 	return (/** @type {HTMLElement} */ element) => {
 		var unsubscribe = resize_observer_border_box.observe(element, () =>
-			set(tracked, element[type], block),
+			set(tracked, element[type]),
 		);
 
 		effect(() => {
-			untrack(() => set(tracked, element[type], block));
+			untrack(() => set(tracked, element[type]));
 			return unsubscribe;
 		});
 	};
@@ -342,7 +342,7 @@ function bind_element_rect(maybe_tracked, type) {
 	return (/** @type {HTMLElement} */ element) => {
 		var unsubscribe = observer.observe(
 			element,
-			/** @param {any} entry */ (entry) => set(tracked, entry[type], block),
+			/** @param {any} entry */ (entry) => set(tracked, entry[type]),
 		);
 
 		effect(() => unsubscribe);
@@ -398,7 +398,7 @@ export function bind_content_editable(maybe_tracked, property) {
 
 	return (element) => {
 		const clear_event = on(element, 'input', () => {
-			set(tracked, element[property], block);
+			set(tracked, element[property]);
 		});
 
 		render(() => {
@@ -408,7 +408,7 @@ export function bind_content_editable(maybe_tracked, property) {
 				if (value == null) {
 					// @ts-ignore
 					var non_null_value = element[property];
-					set(tracked, non_null_value, block);
+					set(tracked, non_null_value);
 				} else {
 					// @ts-ignore
 					element[property] = value + '';

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

@@ -186,7 +186,7 @@ function reconcile_fast_clear(anchor, block, array) {
  * @returns {void}
  */
 function update_index(block, index) {
-	set(block.s.i, index, block);
+	set(block.s.i, index);
 }
 
 /**
@@ -195,7 +195,7 @@ function update_index(block, index) {
  * @returns {void}
  */
 function update_value(block, value) {
-	set(block.s.v, value, block);
+	set(block.s.v, value);
 }
 
 /**

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

@@ -14,7 +14,7 @@ export {
 	set_selected,
 } from './render.js';
 
-export { render, render_spread, async, ref } from './blocks.js';
+export { render, render_spread, async, ref, branch } from './blocks.js';
 
 export { event, delegate } from './events.js';
 
@@ -47,6 +47,8 @@ export {
 	derived,
 	maybe_tracked,
 	tick,
+	proxy_tracked,
+	with_block,
 } from './runtime.js';
 
 export { composite } from './composite.js';

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

@@ -163,29 +163,29 @@ export function set_attributes(element, attributes) {
  * @param {Element} element
  * @param {string} key
  * @param {any} value
-*/
+ */
 function set_attribute_helper(element, key, value) {
-  if (key === 'class') {
-    const is_html = element.namespaceURI === 'http://www.w3.org/1999/xhtml';
-    set_class(/** @type {HTMLElement} */ (element), value, undefined, is_html);
-  } else if (key === '#class') {
-    // Special case for static class when spreading props
-    element.classList.add(value);
-  } else if (typeof key === 'string' && is_event_attribute(key)) {
-    // Handle event handlers in spread props
-    const event_name = get_attribute_event_name(key);
-
-    if (is_delegated(event_name)) {
-      // Use delegation for delegated events
-      /** @type {any} */ (element)['__' + event_name] = value;
-      delegate([event_name]);
-    } else {
-      // Use addEventListener for non-delegated events
-      event(event_name, element, value);
-    }
-  } else {
-    set_attribute(element, key, value);
-  }
+	if (key === 'class') {
+		const is_html = element.namespaceURI === 'http://www.w3.org/1999/xhtml';
+		set_class(/** @type {HTMLElement} */ (element), value, undefined, is_html);
+	} else if (key === '#class') {
+		// Special case for static class when spreading props
+		element.classList.add(value);
+	} else if (typeof key === 'string' && is_event_attribute(key)) {
+		// Handle event handlers in spread props
+		const event_name = get_attribute_event_name(key);
+
+		if (is_delegated(event_name)) {
+			// Use delegation for delegated events
+			/** @type {any} */ (element)['__' + event_name] = value;
+			delegate([event_name]);
+		} else {
+			// Use addEventListener for non-delegated events
+			event(event_name, element, value);
+		}
+	} else {
+		set_attribute(element, key, value);
+	}
 }
 
 /**
@@ -312,7 +312,7 @@ export function apply_element_spread(element, fn) {
 		for (const symbol of get_own_property_symbols(next)) {
 			// Ensure we are not trying to write to a proxied object
 			if (TRACKED_OBJECT in next) {
-				next = {...next};
+				next = { ...next };
 			}
 			var ref_fn = next[symbol];
 

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

@@ -30,7 +30,7 @@ import {
 import { capture, suspend } from './try.js';
 import {
 	define_property,
-	get_descriptors,
+	get_descriptor,
 	get_own_property_symbols,
 	is_array,
 	is_tracked_object,
@@ -135,6 +135,20 @@ export function run_teardown(block) {
 	}
 }
 
+/**
+ * @param {Block} block
+ * @param {() => void} fn
+ */
+export function with_block(block, fn) {
+	var prev_block = active_block;
+	active_block = block;
+	try {
+		return fn();
+	} finally {
+		active_block = prev_block;
+	}
+}
+
 /**
  * @param {Derived} computed
  */
@@ -345,6 +359,9 @@ export function track(v, get, set, b) {
 	if (is_tracked_object(v)) {
 		return v;
 	}
+	if (b === null) {
+		throw new TypeError('track() requires a valid component context');
+	}
 
 	if (typeof v === 'function') {
 		return derived(v, b, get, set);
@@ -369,35 +386,34 @@ export function track_split(v, l, b) {
 	var out = [];
 	/** @type {Record<string|symbol, any>} */
 	var rest = {};
-	/** @type {Record<PropertyKey, any | null>} */
-	var descriptors = get_descriptors(v);
+	/** @type {Record<PropertyKey, 1>} */
+	var done = {};
+	var props = Reflect.ownKeys(v);
 
-	for (let i = 0, key, t, exists = true; i < l.length; i++) {
+	for (let i = 0, key, t; i < l.length; i++) {
 		key = l[i];
 
-		if (is_tracked_object(v[key])) {
-			t = v[key];
+		if (props.includes(key)) {
+			if (is_tracked_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);
-			exists = !!descriptors[key];
-			if (exists) {
-				t = define_property(t, '__v', descriptors[key]);
-			}
 		}
 
 		out[i] = t;
-		if (exists) {
-			descriptors[key] = null;
-		}
+		done[key] = 1;
 	}
 
-	var props = Reflect.ownKeys(descriptors);
 	for (let i = 0, key; i < props.length; i++) {
 		key = props[i];
-		if (descriptors[key] === null) {
+		if (done[key]) {
 			continue;
 		}
-		define_property(rest, key, descriptors[key]);
+		define_property(rest, key, /** @type {PropertyDescriptor} */ (get_descriptor(v, key)));
 	}
 
 	out.push(tracked(rest, b));
@@ -440,7 +456,7 @@ function is_tracking_dirty(tracking) {
 		var tracked = tracking.t;
 
 		if ((tracked.f & DERIVED) !== 0) {
-			update_derived(/** @type {Derived} **/(tracked));
+			update_derived(/** @type {Derived} **/ (tracked));
 		}
 
 		if (tracked.c > tracking.c) {
@@ -500,7 +516,7 @@ export function async_computed(fn, block) {
 		}
 
 		promise.then((v) => {
-			if (parent && is_destroyed(/** @type {Block} */(parent))) {
+			if (parent && is_destroyed(/** @type {Block} */ (parent))) {
 				return;
 			}
 			if (promise === current && t.__v !== v) {
@@ -509,7 +525,7 @@ export function async_computed(fn, block) {
 				if (t.__v === UNINITIALIZED) {
 					t.__v = v;
 				} else {
-					set(t, v, block);
+					set(t, v);
 				}
 			}
 
@@ -774,7 +790,7 @@ export function get(tracked) {
 	}
 
 	return (tracked.f & DERIVED) !== 0
-		? get_derived(/** @type {Derived} */(tracked))
+		? get_derived(/** @type {Derived} */ (tracked))
 		: get_tracked(tracked);
 }
 
@@ -803,15 +819,14 @@ export function get_tracked(tracked) {
  * @param {any} value
  */
 export function public_set(tracked, value) {
-	set(tracked, value, safe_scope());
+	set(tracked, value);
 }
 
 /**
  * @param {Derived | Tracked} tracked
  * @param {any} value
- * @param {Block} block
  */
-export function set(tracked, value, block) {
+export function set(tracked, value) {
 	if (!is_mutating_allowed) {
 		throw new Error(
 			'Assignments or updates to tracked values are not allowed during computed "track(() => ...)" evaluation',
@@ -823,7 +838,7 @@ export function set(tracked, value, block) {
 	if (value !== old_value) {
 		var tracked_block = tracked.b;
 
-		if ((block.f & CONTAINS_TEARDOWN) !== 0) {
+		if ((tracked_block.f & CONTAINS_TEARDOWN) !== 0) {
 			if (teardown) {
 				old_values.set(tracked, value);
 			} else {
@@ -901,34 +916,37 @@ export function flush_sync(fn) {
  */
 export function spread_props(fn, block) {
 	var computed = derived(fn, block);
+	return proxy_tracked(computed);
+}
 
+/**
+ * @param {Tracked | Derived} tracked
+ * @returns {Object}
+ */
+export function proxy_tracked(tracked) {
 	return new Proxy(
 		{},
 		{
-			get(target, property) {
-				const obj = get_derived(computed);
+			get(_, property) {
+				const obj = get(tracked);
 				return obj[property];
 			},
-			has(target, property) {
+			has(_, property) {
 				if (property === TRACKED_OBJECT) {
 					return true;
 				}
-				const obj = get_derived(computed);
+				const obj = get(tracked);
 				return property in obj;
 			},
-			getOwnPropertyDescriptor(target, key) {
-				const obj = get_derived(computed);
+			getOwnPropertyDescriptor(_, key) {
+				const obj = get(tracked);
 
 				if (key in obj) {
-					return {
-						enumerable: true,
-						configurable: true,
-						value: obj[key],
-					};
+					return get_descriptor(obj, key);
 				}
 			},
 			ownKeys() {
-				const obj = get_derived(computed);
+				const obj = get(tracked);
 				return Reflect.ownKeys(obj);
 			},
 		},
@@ -991,85 +1009,78 @@ export function get_property(obj, property, chain = false) {
  * @param {any} obj
  * @param {string | number | symbol} property
  * @param {any} value
- * @param {Block} block
  * @returns {void}
  */
-export function set_property(obj, property, value, block) {
+export function set_property(obj, property, value) {
 	var tracked = obj[property];
-	set(tracked, value, block);
+	set(tracked, value);
 }
 
 /**
  * @param {Tracked} tracked
- * @param {Block} block
  * @param {number} [d]
  * @returns {number}
  */
-export function update(tracked, block, d = 1) {
+export function update(tracked, d = 1) {
 	var value = get(tracked);
 	var result = d === 1 ? value++ : value--;
-	set(tracked, value, block);
+	set(tracked, value);
 	return result;
 }
 
 /**
  * @param {Tracked} tracked
- * @param {Block} block
  * @returns {void}
  */
-export function increment(tracked, block) {
-	set(tracked, tracked.__v + 1, block);
+export function increment(tracked) {
+	set(tracked, tracked.__v + 1);
 }
 
 /**
  * @param {Tracked} tracked
- * @param {Block} block
  * @returns {void}
  */
-export function decrement(tracked, block) {
-	set(tracked, tracked.__v - 1, block);
+export function decrement(tracked) {
+	set(tracked, tracked.__v - 1);
 }
 
 /**
  * @param {Tracked} tracked
- * @param {Block} block
  * @param {number} [d]
  * @returns {number}
  */
-export function update_pre(tracked, block, d = 1) {
+export function update_pre(tracked, d = 1) {
 	var value = get(tracked);
 	var new_value = d === 1 ? ++value : --value;
-	set(tracked, new_value, block);
+	set(tracked, new_value);
 	return new_value;
 }
 
 /**
  * @param {any} obj
  * @param {string | number | symbol} property
- * @param {Block} block
  * @param {number} [d=1]
  * @returns {number}
  */
-export function update_property(obj, property, block, d = 1) {
+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, block);
+	set(tracked, value);
 	return new_value;
 }
 
 /**
  * @param {any} obj
  * @param {string | number | symbol} property
- * @param {Block} block
  * @param {number} [d=1]
  * @returns {number}
  */
-export function update_pre_property(obj, property, block, d = 1) {
+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, block);
+	set(tracked, new_value);
 	return new_value;
 }
 
@@ -1093,7 +1104,7 @@ export function with_scope(block, fn) {
  * @returns {Block | null}
  */
 export function scope() {
-	return active_scope;
+	return active_scope || active_block;
 }
 
 /**
@@ -1206,7 +1217,7 @@ export async function maybe_tracked(v) {
 		} else {
 			value = await async_computed(async () => {
 				return await get_tracked(v);
-			}, /** @type {Block} */(active_block));
+			}, /** @type {Block} */ (active_block));
 		}
 	} else {
 		value = await v;