ripple 0.2.140 → 0.2.141

package/src/runtime/set.js

@@ -15,183 +15,183 @@ let init = false;
  * @returns {TrackedSet<T>}
  */
 export class TrackedSet extends Set {
-  /** @type {Tracked} */
-  #tracked_size;
-  /** @type {Map<T, Tracked>} */
-  #tracked_items = new Map();
-  /** @type {Block} */
-  #block;
-
-  /**
-   * @param {Iterable<T>} [iterable]
-   */
-  constructor(iterable) {
-    super();
-
-    var block = this.#block = safe_scope();
-
-    if (iterable) {
-      for (var item of iterable) {
-        super.add(item);
-        this.#tracked_items.set(item, tracked(0, block));
-      }
-    }
-
-    this.#tracked_size = tracked(super.size, block);
-
-    if (!init) {
-      init = true;
-      this.#init();
-    }
-  }
-
-  /**
-   * @returns {void}
-   */
-  #init() {
-    var proto = TrackedSet.prototype;
-    var set_proto = Set.prototype;
-
-    for (const method of introspect_methods) {
-      if (!(method in set_proto)) {
-        continue;
-      }
+	/** @type {Tracked} */
+	#tracked_size;
+	/** @type {Map<T, Tracked>} */
+	#tracked_items = new Map();
+	/** @type {Block} */
+	#block;
+
+	/**
+	 * @param {Iterable<T>} [iterable]
+	 */
+	constructor(iterable) {
+		super();
+
+		var block = this.#block = safe_scope();
+
+		if (iterable) {
+			for (var item of iterable) {
+				super.add(item);
+				this.#tracked_items.set(item, tracked(0, block));
+			}
+		}
+
+		this.#tracked_size = tracked(super.size, block);
+
+		if (!init) {
+			init = true;
+			this.#init();
+		}
+	}
+
+	/**
+	 * @returns {void}
+	 */
+	#init() {
+		var proto = TrackedSet.prototype;
+		var set_proto = Set.prototype;
+
+		for (const method of introspect_methods) {
+			if (!(method in set_proto)) {
+				continue;
+			}
 
       /** @type {any} */ (proto)[method] = function (/** @type {...any} */ ...v) {
-        this.size;
+				this.size;
 
-        return /** @type {any} */ (set_proto)[method].apply(this, v);
-      };
-    }
+				return /** @type {any} */ (set_proto)[method].apply(this, v);
+			};
+		}
 
-    for (const method of compare_other_methods) {
-      if (!(method in set_proto)) {
-        continue;
-      }
+		for (const method of compare_other_methods) {
+			if (!(method in set_proto)) {
+				continue;
+			}
 
       /** @type {any} */ (proto)[method] = function (/** @type {any} */ other, /** @type {...any} */ ...v) {
-        this.size;
+				this.size;
 
-        if (other instanceof TrackedSet) {
-          other.size;
-        }
+				if (other instanceof TrackedSet) {
+					other.size;
+				}
 
-        return /** @type {any} */ (set_proto)[method].apply(this, [other, ...v]);
-      };
-    }
+				return /** @type {any} */ (set_proto)[method].apply(this, [other, ...v]);
+			};
+		}
 
-    for (const method of new_other_methods) {
-      if (!(method in set_proto)) {
-        continue;
-      }
+		for (const method of new_other_methods) {
+			if (!(method in set_proto)) {
+				continue;
+			}
 
       /** @type {any} */ (proto)[method] = function (/** @type {any} */ other, /** @type {...any} */ ...v) {
-        this.size;
-
-        if (other instanceof TrackedSet) {
-          other.size;
-        }
-
-        return new TrackedSet(/** @type {any} */ (set_proto)[method].apply(this, [other, ...v]));
-      };
-    }
-  }
-
-  /**
-   * @param {T} value
-   * @returns {this}
-   */
-  add(value) {
-    var block = this.#block;
-
-    if (!super.has(value)) {
-      super.add(value);
-      this.#tracked_items.set(value, tracked(0, block));
-      set(this.#tracked_size, super.size, block);
-    }
-
-    return this;
-  }
-
-  /**
-   * @param {T} value
-   * @returns {boolean}
-   */
-  delete(value) {
-    var block = this.#block;
-
-    if (!super.delete(value)) {
-      return false;
-    }
-
-    var t = this.#tracked_items.get(value);
-
-    if (t) {
-      increment(t, block);
-    }
-    this.#tracked_items.delete(value);
-    set(this.#tracked_size, super.size, block);
-
-    return true;
-  }
-
-  /**
-   * @param {T} value
-   * @return {boolean}
-  */
-  has(value) {
-
-    var has = super.has(value);
-    var tracked_items = this.#tracked_items;
-    var t = tracked_items.get(value);
-
-    if (t === undefined) {
-      // if no tracked it also means super didn't have it
-      // It's not possible to have a disconnect, we track each value
-      // If the value doesn't exist, track the size in case it's added later
-      // but don't create tracked entries willy-nilly to track all possible values
-      this.size;
-    } else {
-      get(t);
-    }
-
-    return has;
-  }
-
-  /**
-   * @returns {void}
-   */
-  clear() {
-    var block = this.#block;
-
-    if (super.size === 0) {
-      return;
-    }
-
-    for (var [_, t] of this.#tracked_items) {
-      increment(t, block);
-    }
-
-    super.clear();
-    this.#tracked_items.clear();
-    set(this.#tracked_size, 0, block);
-  }
-
-  /**
-   * @returns {number}
-   */
-  get size() {
-    return get(this.#tracked_size);
-  }
-
-  /**
-   * @returns {T[]}
-   */
-  toJSON() {
-    this.size;
-
-    return [...this];
-  }
+				this.size;
+
+				if (other instanceof TrackedSet) {
+					other.size;
+				}
+
+				return new TrackedSet(/** @type {any} */(set_proto)[method].apply(this, [other, ...v]));
+			};
+		}
+	}
+
+	/**
+	 * @param {T} value
+	 * @returns {this}
+	 */
+	add(value) {
+		var block = this.#block;
+
+		if (!super.has(value)) {
+			super.add(value);
+			this.#tracked_items.set(value, tracked(0, block));
+			set(this.#tracked_size, super.size);
+		}
+
+		return this;
+	}
+
+	/**
+	 * @param {T} value
+	 * @returns {boolean}
+	 */
+	delete(value) {
+		var block = this.#block;
+
+		if (!super.delete(value)) {
+			return false;
+		}
+
+		var t = this.#tracked_items.get(value);
+
+		if (t) {
+			increment(t);
+		}
+		this.#tracked_items.delete(value);
+		set(this.#tracked_size, super.size);
+
+		return true;
+	}
+
+	/**
+	 * @param {T} value
+	 * @return {boolean}
+	*/
+	has(value) {
+
+		var has = super.has(value);
+		var tracked_items = this.#tracked_items;
+		var t = tracked_items.get(value);
+
+		if (t === undefined) {
+			// if no tracked it also means super didn't have it
+			// It's not possible to have a disconnect, we track each value
+			// If the value doesn't exist, track the size in case it's added later
+			// but don't create tracked entries willy-nilly to track all possible values
+			this.size;
+		} else {
+			get(t);
+		}
+
+		return has;
+	}
+
+	/**
+	 * @returns {void}
+	 */
+	clear() {
+		var block = this.#block;
+
+		if (super.size === 0) {
+			return;
+		}
+
+		for (var [_, t] of this.#tracked_items) {
+			increment(t);
+		}
+
+		super.clear();
+		this.#tracked_items.clear();
+		set(this.#tracked_size, 0);
+	}
+
+	/**
+	 * @returns {number}
+	 */
+	get size() {
+		return get(this.#tracked_size);
+	}
+
+	/**
+	 * @returns {T[]}
+	 */
+	toJSON() {
+		this.size;
+
+		return [...this];
+	}
 }
 
 /**
@@ -201,5 +201,5 @@ export class TrackedSet extends Set {
  * @returns {TrackedSet<V>}
  */
 export function tracked_set(block, ...args) {
-  return with_scope(block, () => new TrackedSet(...args));
-}
+	return with_scope(block, () => new TrackedSet(...args));
+}

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

@@ -37,7 +37,7 @@ export class TrackedURLSearchParams extends URLSearchParams {
 			super.append(key, value);
 		}
 
-		increment(this.#version, this.#block);
+		increment(this.#version);
 		this.#updating = false;
 	}
 
@@ -49,7 +49,7 @@ export class TrackedURLSearchParams extends URLSearchParams {
 	append(name, value) {
 		super.append(name, value);
 		this.#update_url();
-		increment(this.#version, this.#block);
+		increment(this.#version);
 	}
 
 	/**
@@ -62,7 +62,7 @@ export class TrackedURLSearchParams extends URLSearchParams {
 		super.delete(name, value);
 		if (has_value) {
 			this.#update_url();
-			increment(this.#version, this.#block);
+			increment(this.#version);
 		}
 	}
 
@@ -111,14 +111,14 @@ export class TrackedURLSearchParams extends URLSearchParams {
 		// if you set `foo` to 1, then foo=3 gets deleted whilst `has("foo", "1")` returns true
 		if (previous !== super.getAll(name).join('')) {
 			this.#update_url();
-			increment(this.#version, this.#block);
+			increment(this.#version);
 		}
 	}
 
 	sort() {
 		super.sort();
 		this.#update_url();
-		increment(this.#version, this.#block);
+		increment(this.#version);
 	}
 
 	toString() {

package/src/runtime/url.js

@@ -39,7 +39,7 @@ export class TrackedURL extends URL {
 
 	set hash(value) {
 		super.hash = value;
-		set(this.#hash, super.hash, this.#block);
+		set(this.#hash, super.hash);
 	}
 
 	get host() {
@@ -50,8 +50,8 @@ export class TrackedURL extends URL {
 
 	set host(value) {
 		super.host = value;
-		set(this.#hostname, super.hostname, this.#block);
-		set(this.#port, super.port, this.#block);
+		set(this.#hostname, super.hostname);
+		set(this.#port, super.port);
 	}
 
 	get hostname() {
@@ -60,7 +60,7 @@ export class TrackedURL extends URL {
 
 	set hostname(value) {
 		super.hostname = value;
-		set(this.#hostname, super.hostname, this.#block);
+		set(this.#hostname, super.hostname);
 	}
 
 	get href() {
@@ -77,14 +77,14 @@ export class TrackedURL extends URL {
 
 	set href(value) {
 		super.href = value;
-		set(this.#protocol, super.protocol, this.#block);
-		set(this.#username, super.username, this.#block);
-		set(this.#password, super.password, this.#block);
-		set(this.#hostname, super.hostname, this.#block);
-		set(this.#port, super.port, this.#block);
-		set(this.#pathname, super.pathname, this.#block);
-		set(this.#hash, super.hash, this.#block);
-		set(this.#search, super.search, this.#block);
+		set(this.#protocol, super.protocol);
+		set(this.#username, super.username);
+		set(this.#password, super.password);
+		set(this.#hostname, super.hostname);
+		set(this.#port, super.port);
+		set(this.#pathname, super.pathname);
+		set(this.#hash, super.hash);
+		set(this.#search, super.search);
 		this.#searchParams[REPLACE](super.searchParams);
 	}
 
@@ -94,7 +94,7 @@ export class TrackedURL extends URL {
 
 	set password(value) {
 		super.password = value;
-		set(this.#password, super.password, this.#block);
+		set(this.#password, super.password);
 	}
 
 	get pathname() {
@@ -103,7 +103,7 @@ export class TrackedURL extends URL {
 
 	set pathname(value) {
 		super.pathname = value;
-		set(this.#pathname, super.pathname, this.#block);
+		set(this.#pathname, super.pathname);
 	}
 
 	get port() {
@@ -112,7 +112,7 @@ export class TrackedURL extends URL {
 
 	set port(value) {
 		super.port = value;
-		set(this.#port, super.port, this.#block);
+		set(this.#port, super.port);
 	}
 
 	get protocol() {
@@ -121,7 +121,7 @@ export class TrackedURL extends URL {
 
 	set protocol(value) {
 		super.protocol = value;
-		set(this.#protocol, super.protocol, this.#block);
+		set(this.#protocol, super.protocol);
 	}
 
 	get search() {
@@ -130,7 +130,7 @@ export class TrackedURL extends URL {
 
 	set search(value) {
 		super.search = value;
-		set(this.#search, value, this.#block);
+		set(this.#search, value);
 		this.#searchParams[REPLACE](super.searchParams);
 	}
 
@@ -140,7 +140,7 @@ export class TrackedURL extends URL {
 
 	set username(value) {
 		super.username = value;
-		set(this.#username, super.username, this.#block);
+		set(this.#username, super.username);
 	}
 
 	get origin() {

package/tests/client/composite/composite.props.test.ripple

@@ -1,4 +1,4 @@
-import { track, effect, flushSync } from 'ripple';
+import { track, trackSplit, effect, flushSync, type Props } from 'ripple';
 
 describe('composite > props', () => {
 	it('correctly handles default prop values', () => {
@@ -102,5 +102,47 @@ describe('composite > props', () => {
 		flushSync();
 
 		expect(logs).toEqual([0, 1]);
-	})
+	});
+
+	it('correctly retains prop accessors and reactivity when using rest props', () => {
+		component Button(props: Props) {
+			const [children, rest] = trackSplit(props, ['children']);
+			<button {...@rest}>
+				<@children />
+			</button>
+			<style>
+				.on {
+					color: blue;
+				}
+				.off {
+					color: red;
+				}
+			</style>
+		}
+
+		component Toggle(props) {
+			const [pressed, rest] = trackSplit(props, ['pressed']);
+			const onClick = () => @pressed = !@pressed;
+			<Button {...@rest} class={@pressed ? 'on' : 'off'} {onClick}>{'button 1'}</Button>
+			<Button class={@pressed ? 'on' : 'off'} {onClick}>{'button 2'}</Button>
+		}
+
+		component App() {
+			const pressed = track(true);
+			<Toggle {pressed} />
+		}
+
+		render(App);
+		const button1 = container.querySelectorAll('button')[0];;
+		const button2 = container.querySelectorAll('button')[1];
+
+		expect(button1.className).toContain('on');
+		expect(button2.className).toContain('on');
+
+		button1.click();
+		flushSync();
+
+		expect(button1.className).toContain('off');
+		expect(button2.className).toContain('off');
+	});
 });

package/types/index.d.ts

@@ -76,7 +76,7 @@ declare global {
 		scope(): any;
 		get_tracked(node: any): any;
 		get_derived(node: any): any;
-		set(node: any, value: any, block?: any): any;
+		set(node: any, value: any): any;
 		// Add other runtime functions as needed for TypeScript analysis
 	};
 }