ripple 0.2.216 → 0.3.0

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

@@ -17,7 +17,17 @@ export {
 	set_selected,
 } from './render.js';
 
-export { render, render_spread, async, ref, branch, destroy_block, root } from './blocks.js';
+export {
+	render,
+	render_spread,
+	async,
+	ref,
+	branch,
+	destroy_block,
+	move_block,
+	root,
+	user_effect as effect,
+} from './blocks.js';
 
 export { event, render_event, delegate } from './events.js';
 
@@ -41,6 +51,8 @@ export {
 	update_pre,
 	update_property,
 	update_pre_property,
+	track,
+	track_split,
 	push_component,
 	pop_component,
 	untrack,
@@ -68,13 +80,28 @@ export { switch_block as switch } from './switch.js';
 
 export { template, append, text } from './template.js';
 
-export { tracked_array } from '../../array.js';
+export {
+	ripple_array,
+	ripple_array_from,
+	ripple_array_of,
+	ripple_array_from_async,
+} from '../../array.js';
+
+export { ripple_object } from '../../object.js';
+
+export { ripple_map } from '../../map.js';
+
+export { ripple_set } from '../../set.js';
+
+export { ripple_date } from '../../date.js';
+
+export { ripple_url } from '../../url.js';
 
-export { tracked_object } from '../../object.js';
+export { ripple_url_search_params } from '../../url-search-params.js';
 
-export { tracked_map } from '../../map.js';
+export { media_query } from '../../media-query.js';
 
-export { tracked_set } from '../../set.js';
+export { context } from './context.js';
 
 export { head } from './head.js';
 

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

@@ -1,12 +1,12 @@
 /** @import { Block } from '#client' */
 
 import { destroy_block, ref } from './blocks.js';
-import { REF_PROP } from './constants.js';
+import { DESTROYED, REF_PROP } from './constants.js';
 import {
 	get_descriptors,
 	get_own_property_symbols,
 	get_prototype_of,
-	is_tracked_object,
+	is_ripple_object,
 } from './utils.js';
 import { event } from './events.js';
 import { get_attribute_event_name, is_event_attribute } from '../../../utils/events.js';
@@ -252,6 +252,9 @@ export function apply_element_spread(element, fn) {
 	/** @type {Record<string | symbol, (() => void) | undefined>} */
 	var remove_listeners = {};
 
+	/** @type {Record<symbol, any>} */
+	var prev_symbols = {};
+
 	return () => {
 		var next = fn();
 
@@ -262,19 +265,28 @@ export function apply_element_spread(element, fn) {
 			}
 		}
 
+		/** @type {Record<symbol, any>} */
+		var current_symbols = {};
+
 		for (const symbol of get_own_property_symbols(next)) {
 			var ref_fn = next[symbol];
-
-			if (symbol.description === REF_PROP && (!(symbol in prev) || ref_fn !== prev[symbol])) {
-				if (effects[symbol]) {
+			current_symbols[symbol] = ref_fn;
+
+			if (
+				symbol.description === REF_PROP &&
+				(!(symbol in prev_symbols) ||
+					ref_fn !== prev_symbols[symbol] ||
+					(effects[symbol] && (effects[symbol].f & DESTROYED) !== 0))
+			) {
+				if (effects[symbol] && (effects[symbol].f & DESTROYED) === 0) {
 					destroy_block(effects[symbol]);
 				}
 				effects[symbol] = ref(element, () => ref_fn);
 			}
-
-			next[symbol] = ref_fn;
 		}
 
+		prev_symbols = current_symbols;
+
 		for (let key in remove_listeners) {
 			// Remove event listeners that are no longer present
 			if (!(key in next) && remove_listeners[key]) {
@@ -298,7 +310,7 @@ export function apply_element_spread(element, fn) {
 			if (key === 'children') continue;
 
 			let value = next[key];
-			if (is_tracked_object(value)) {
+			if (is_ripple_object(value)) {
 				value = get(value);
 			}
 			current[key] = value;

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

@@ -35,7 +35,7 @@ import {
 	get_descriptor,
 	get_own_property_symbols,
 	is_array,
-	is_tracked_object,
+	is_ripple_object,
 	object_keys,
 } from './utils.js';
 
@@ -363,7 +363,7 @@ export function derived(fn, block, get, set) {
  * @returns {Tracked | Derived}
  */
 export function track(v, get, set, b) {
-	if (is_tracked_object(v)) {
+	if (is_ripple_object(v)) {
 		return v;
 	}
 	if (b === null) {
@@ -383,7 +383,7 @@ export function track(v, get, set, b) {
  * @returns {Tracked[]}
  */
 export function track_split(v, l, b) {
-	var is_tracked = is_tracked_object(v);
+	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');
@@ -401,7 +401,7 @@ export function track_split(v, l, b) {
 		key = l[i];
 
 		if (props.includes(key)) {
-			if (is_tracked_object(v[key])) {
+			if (is_ripple_object(v[key])) {
 				t = v[key];
 			} else {
 				t = tracked(undefined, b);
@@ -702,7 +702,9 @@ function flush_microtasks() {
 		}
 	}
 
+	flush_count++;
 	if (flush_count > 1001) {
+		flush_count = 0;
 		return;
 	}
 	var previous_queued_root_blocks = queued_root_blocks;
@@ -800,7 +802,7 @@ export function get_derived(computed) {
  */
 export function get(tracked) {
 	// reflect back the value if it's not boxed
-	if (!is_tracked_object(tracked)) {
+	if (!is_ripple_object(tracked)) {
 		return tracked;
 	}
 
@@ -844,7 +846,7 @@ export function public_set(tracked, value) {
 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',
+			'Assignments or updates to tracked values are not allowed during computed "#ripple.track(() => ...)" evaluation',
 		);
 	}
 
@@ -1313,7 +1315,7 @@ export async function maybe_tracked(v) {
 	var restore = capture();
 	let value;
 
-	if (is_tracked_object(v)) {
+	if (is_ripple_object(v)) {
 		if ((v.f & DERIVED) !== 0) {
 			value = await async_computed(v.fn, v.b);
 		} else {

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

@@ -1,6 +1,13 @@
 /** @import { Block } from '#client' */
 
-import { branch, create_try_block, destroy_block, is_destroyed, resume_block } from './blocks.js';
+import {
+	branch,
+	create_try_block,
+	destroy_block,
+	is_destroyed,
+	move_block,
+	resume_block,
+} from './blocks.js';
 import { TRY_BLOCK } from './constants.js';
 import {
 	hydrate_next,
@@ -10,7 +17,7 @@ import {
 	set_hydrating,
 	skip_to_hydration_end,
 } from './hydration.js';
-import { get_next_sibling, next_sibling } from './operations.js';
+import { get_next_sibling } from './operations.js';
 import {
 	active_block,
 	active_component,
@@ -39,25 +46,7 @@ export function try_block(node, fn, catch_fn, pending_fn = null) {
 	var pending_count = 0;
 	/** @type {DocumentFragment | null} */
 	var offscreen_fragment = null;
-
-	/**
-	 * @param {Block} block
-	 * @param {DocumentFragment} fragment
-	 * @returns {void}
-	 */
-	function move_block(block, fragment) {
-		var state = block.s;
-		if (state === null) return;
-		var node = state.start;
-		var end = state.end;
-
-		while (node !== null) {
-			var next = node === end ? null : next_sibling(node);
-
-			fragment.append(node);
-			node = next;
-		}
-	}
+	var has_resolved = false;
 
 	function handle_await() {
 		if (pending_count++ === 0) {
@@ -65,7 +54,10 @@ export function try_block(node, fn, catch_fn, pending_fn = null) {
 				if (b !== null && suspended === null) {
 					suspended = b;
 					offscreen_fragment = document.createDocumentFragment();
-					move_block(b, offscreen_fragment);
+					// Only move content if promise has resolved before (re-suspension)
+					if (has_resolved) {
+						move_block(b, offscreen_fragment);
+					}
 
 					b = branch(() => {
 						/** @type {(anchor: Node) => void} */ (pending_fn)(anchor);
@@ -76,6 +68,7 @@ export function try_block(node, fn, catch_fn, pending_fn = null) {
 
 		return () => {
 			if (--pending_count === 0) {
+				has_resolved = true;
 				if (b !== null) {
 					destroy_block(b);
 				}

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

@@ -42,7 +42,7 @@ export function create_anchor() {
  * @param {any} v - The object to check.
  * @returns {boolean}
  */
-export function is_tracked_object(v) {
+export function is_ripple_object(v) {
 	return typeof v === 'object' && v !== null && typeof (/** @type {any} */ (v).f) === 'number';
 }
 

package/src/runtime/internal/server/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/server/index.js

@@ -5,7 +5,7 @@
 
 import { Readable } from 'stream';
 import { DERIVED, UNINITIALIZED, TRACKED } from '../client/constants.js';
-import { is_tracked_object, get_descriptor, define_property, is_array } from '../client/utils.js';
+import { is_ripple_object, get_descriptor, define_property, is_array } from '../client/utils.js';
 import { escape } from '../../../utils/escaping.js';
 import { is_boolean_attribute } from '../../../compiler/utils.js';
 import { clsx } from 'clsx';
@@ -19,6 +19,7 @@ import {
 export { escape };
 export { register_component_css as register_css } from './css-registry.js';
 export { hash } from '../../../utils/hashing.js';
+export { context } from './context.js';
 
 /** @type {null | Component} */
 export let active_component = null;
@@ -427,7 +428,7 @@ export function aborted() {
  * @returns {any}
  */
 export function get(tracked) {
-	if (!is_tracked_object(tracked)) {
+	if (!is_ripple_object(tracked)) {
 		return tracked;
 	}
 
@@ -590,7 +591,7 @@ export function spread_attrs(attrs, css_hash) {
 
 		if (typeof value === 'function') continue;
 
-		if (is_tracked_object(value)) {
+		if (is_ripple_object(value)) {
 			value = get(value);
 		}
 
@@ -628,7 +629,7 @@ function tracked(v, get, set) {
  * @returns {Tracked | Derived}
  */
 export function track(v, get, set) {
-	var is_tracked = is_tracked_object(v);
+	var is_tracked = is_ripple_object(v);
 
 	if (is_tracked) {
 		return v;
@@ -655,7 +656,7 @@ export function track(v, get, set) {
  * @returns {Tracked[]}
  */
 export function track_split(v, l) {
-	var is_tracked = is_tracked_object(v);
+	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');
@@ -673,7 +674,7 @@ export function track_split(v, l) {
 		key = l[i];
 
 		if (props.includes(key)) {
-			if (is_tracked_object(v[key])) {
+			if (is_ripple_object(v[key])) {
 				t = v[key];
 			} else {
 				t = tracked(undefined);
@@ -699,3 +700,95 @@ export function track_split(v, l) {
 
 	return out;
 }
+
+/**
+ * @param {any} _
+ * @param {ConstructorParameters<typeof URL>} params
+ * @returns {URL}
+ */
+export function ripple_url(_, ...params) {
+	return new URL(...params);
+}
+
+/**
+ * @param {any} _
+ * @param {ConstructorParameters<typeof URLSearchParams>} params
+ * @returns {URLSearchParams}
+ */
+export function ripple_url_search_params(_, ...params) {
+	return new URLSearchParams(...params);
+}
+
+/**
+ * @param {ConstructorParameters<typeof Date>} params
+ * @returns {Date}
+ */
+export function ripple_date(...params) {
+	return new Date(...params);
+}
+
+/**
+ * @param {string} query
+ * @param {boolean} [matches]
+ * @returns {boolean}
+ */
+export function media_query(query, matches = false) {
+	void query;
+	return matches;
+}
+
+/**
+ * @param {() => void} _fn
+ * @returns {void}
+ */
+export function effect(_fn) {
+	return;
+}
+
+/**
+ * @template T
+ * @param  {...T} elements
+ * @returns {T[]}
+ */
+export function ripple_array(...elements) {
+	return new Array(...elements);
+}
+
+/**
+ * @template T
+ * @param {ArrayLike<T> | Iterable<T>} arrayLike
+ * @param {(v: T, k: number) => any | undefined} [map_fn]
+ * @param {any} [thisArg]
+ * @returns {T[]}
+ */
+ripple_array.from = function (arrayLike, map_fn, thisArg) {
+	return map_fn ? Array.from(arrayLike, map_fn, thisArg) : Array.from(arrayLike);
+};
+
+/**
+ * @template T
+ * @param  {...T} items
+ * @returns {T[]}
+ */
+ripple_array.of = function (...items) {
+	return Array.of(...items);
+};
+
+/**
+ * @template T
+ * @param {ArrayLike<T> | Iterable<T>} arrayLike
+ * @param {(v: T, k: number) => any | undefined} [map_fn]
+ * @param {any} [thisArg]
+ * @returns {Promise<T[]>}
+ */
+ripple_array.from_async = async function (arrayLike, map_fn, thisArg) {
+	return map_fn ? Array.fromAsync(arrayLike, map_fn, thisArg) : Array.fromAsync(arrayLike);
+};
+
+/**
+ * @param {object} obj
+ * @returns {object}
+ */
+export function ripple_object(obj) {
+	return obj;
+}

package/src/runtime/map.js

@@ -8,9 +8,9 @@ let init = false;
 /**
  * @template K, V
  * @extends {Map<K, V>}
- * @returns {TrackedMap<K, V>}
+ * @returns {RippleMap<K, V>}
  */
-export class TrackedMap extends Map {
+export class RippleMap extends Map {
 	/** @type {Tracked} */
 	#tracked_size;
 	/** @type {Map<K, Tracked>} */
@@ -45,7 +45,7 @@ export class TrackedMap extends Map {
 	 * @returns {void}
 	 */
 	#init() {
-		var proto = TrackedMap.prototype;
+		var proto = RippleMap.prototype;
 		var map_proto = Map.prototype;
 
 		for (const method of introspect_methods) {
@@ -197,9 +197,9 @@ export class TrackedMap extends Map {
 /**
  * @template K, V
  * @param {Block} block
- * @param {...any} args
- * @returns {TrackedMap<K, V>}
+ * @param {Iterable<readonly [K, V]>} [iterable]
+ * @returns {RippleMap<K, V>}
  */
-export function tracked_map(block, ...args) {
-	return with_scope(block, () => new TrackedMap(...args));
+export function ripple_map(block, iterable) {
+	return with_scope(block, () => new RippleMap(iterable));
 }

package/src/runtime/media-query.js

@@ -1,5 +1,5 @@
 import { on } from './internal/client/events.js';
-import { get, safe_scope, set, tracked } from './internal/client/index.js';
+import { get, safe_scope, set, tracked, with_scope } from './internal/client/index.js';
 import { ReactiveValue } from './reactive-value.js';
 
 const parenthesis_regex = /\(.+\)/;
@@ -43,3 +43,12 @@ export function MediaQuery(query, fallback) {
 			),
 	);
 }
+
+/**
+ * @param {import('#client').Block} block
+ * @param {string} query
+ * @param {boolean | undefined} [fallback]
+ */
+export function media_query(block, query, fallback) {
+	return with_scope(block, () => new MediaQuery(query, fallback));
+}

package/src/runtime/object.js

@@ -6,24 +6,24 @@ import { object_proxy } from './proxy.js';
  * @template {object} T
  * @constructor
  * @param {T} obj
- * @returns {TrackedObject<T>}
+ * @returns {RippleObject<T>}
  */
-export function TrackedObject(obj) {
+export function RippleObject(obj) {
 	if (!new.target) {
-		throw new Error("TrackedObject must be called with 'new'");
+		throw new Error("RippleObject must be called with 'new'");
 	}
 
 	var block = safe_scope();
 
-	return object_proxy(obj, block);
+	return ripple_object(block, obj);
 }
 
 /**
  * @template {object} T
  * @param {T} obj
  * @param {Block} block
- * @returns {TrackedObject<T>}
+ * @returns {RippleObject<T>}
  */
-export function tracked_object(obj, block) {
+export function ripple_object(block, obj) {
 	return object_proxy(obj, block);
 }

package/src/runtime/proxy.js

@@ -1,6 +1,6 @@
 /** @import { Block, Tracked } from '#client' */
-/** @import { TrackedArray } from './array.js' */
-/** @import { TrackedObject } from './object.js' */
+/** @import { RippleArray } from './array.js' */
+/** @import { RippleObject } from './object.js' */
 
 import { get, set, tracked } from './internal/client/runtime.js';
 import {
@@ -21,7 +21,7 @@ import {
  * @template T
  * @param {T[] | Record<PropertyKey, any>} value
  * @param {Block} block
- * @returns {TrackedArray<T> | TrackedObject<T>}
+ * @returns {RippleArray<T> | RippleObject<T>}
  */
 export function proxy(value, block) {
 	// if non-proxyable, or is already a proxy, return `value`
@@ -154,7 +154,7 @@ export function proxy(value, block) {
 
 		setPrototypeOf() {
 			throw new Error(
-				`Cannot set prototype of ${is_proxied_array ? '\`TrackedArray\`' : '\`TrackedObject\`'}`,
+				`Cannot set prototype of ${is_proxied_array ? '\`RippleArray\`' : '\`RippleObject\`'}`,
 			);
 		},
 
@@ -277,7 +277,7 @@ export function proxy(value, block) {
  *  from_static?: boolean,
  *  use_array?: boolean
  * }} params
- * @returns {TrackedArray<T>}
+ * @returns {RippleArray<T>}
  */
 export function array_proxy({ elements, block, from_static = false, use_array = false }) {
 	var arr;
@@ -302,7 +302,7 @@ export function array_proxy({ elements, block, from_static = false, use_array =
  * @template {object} T
  * @param {T} obj
  * @param {Block} block
- * @returns {TrackedObject<T>}
+ * @returns {RippleObject<T>}
  */
 export function object_proxy(obj, block) {
 	return proxy(obj, block);

package/src/runtime/set.js

@@ -12,9 +12,9 @@ let init = false;
 /**
  * @template T
  * @extends {Set<T>}
- * @returns {TrackedSet<T>}
+ * @returns {RippleSet<T>}
  */
-export class TrackedSet extends Set {
+export class RippleSet extends Set {
 	/** @type {Tracked} */
 	#tracked_size;
 	/** @type {Map<T, Tracked>} */
@@ -49,7 +49,7 @@ export class TrackedSet extends Set {
 	 * @returns {void}
 	 */
 	#init() {
-		var proto = TrackedSet.prototype;
+		var proto = RippleSet.prototype;
 		var set_proto = Set.prototype;
 
 		for (const method of introspect_methods) {
@@ -75,7 +75,7 @@ export class TrackedSet extends Set {
 			) {
 				this.size;
 
-				if (other instanceof TrackedSet) {
+				if (other instanceof RippleSet) {
 					other.size;
 				}
 
@@ -94,11 +94,11 @@ export class TrackedSet extends Set {
 			) {
 				this.size;
 
-				if (other instanceof TrackedSet) {
+				if (other instanceof RippleSet) {
 					other.size;
 				}
 
-				return new TrackedSet(/** @type {any} */ (set_proto)[method].apply(this, [other, ...v]));
+				return new RippleSet(/** @type {any} */ (set_proto)[method].apply(this, [other, ...v]));
 			};
 		}
 	}
@@ -200,11 +200,11 @@ export class TrackedSet extends Set {
 }
 
 /**
- * @template V
+ * @template T
  * @param {Block} block
- * @param {...any} args
- * @returns {TrackedSet<V>}
+ * @param {Iterable<T>} [iterable]
+ * @returns {RippleSet<T>}
  */
-export function tracked_set(block, ...args) {
-	return with_scope(block, () => new TrackedSet(...args));
+export function ripple_set(block, iterable) {
+	return with_scope(block, () => new RippleSet(iterable));
 }

package/src/runtime/url-search-params.js

@@ -1,9 +1,9 @@
-import { get, increment, safe_scope, tracked } from './internal/client/runtime.js';
+import { get, increment, safe_scope, tracked, with_scope } from './internal/client/runtime.js';
 import { get_current_url } from './url.js';
 
 export const REPLACE = Symbol();
 
-export class TrackedURLSearchParams extends URLSearchParams {
+export class RippleURLSearchParams extends URLSearchParams {
 	#block = safe_scope();
 	#version = tracked(0, this.#block);
 	#url = get_current_url();
@@ -144,3 +144,14 @@ export class TrackedURLSearchParams extends URLSearchParams {
 		return super.size;
 	}
 }
+
+/**
+ * @param {import('#client').Block} block
+ * @param  {ConstructorParameters<typeof URLSearchParams>} params
+ * @returns {RippleURLSearchParams}
+ */
+export function ripple_url_search_params(block, ...params) {
+	return with_scope(block, () => {
+		return new RippleURLSearchParams(...params);
+	});
+}