feat: add reactive Set class to svelte/reactivity (#10781)

* feat: add reactive Set class to svelte/reactivity

* add some type safety

* simplify, read entries lazily

* failing unit test

* fix deletions

* minor tweaks

* work around effect ordering bug

* simplify, make entries lazy

* small tweak

* use var, minor tweaks

---------

Co-authored-by: Rich Harris <rich.harris@vercel.com>

Author: trueadm

.changeset/calm-ravens-sneeze.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+feat: add reactive Set class to svelte/reactivity

packages/svelte/src/internal/client/proxy.js

@@ -147,8 +147,7 @@ export function unstate(value) {
  * @param {1 | -1} [d]
  */
 function update_version(signal, d = 1) {
-	const value = untrack(() => get(signal));
-	set(signal, value + d);
+	set(signal, signal.v + d);
 }
 
 /** @type {ProxyHandler<import('./types.js').ProxyStateObject<any>>} */

packages/svelte/src/reactivity/date.js

@@ -0,0 +1,101 @@
+import { source, set } from '../internal/client/reactivity/sources.js';
+import { get } from '../internal/client/runtime.js';
+
+/** @type {Array<keyof Date>} */
+const read = [
+	'getDate',
+	'getDay',
+	'getFullYear',
+	'getHours',
+	'getMilliseconds',
+	'getMinutes',
+	'getMonth',
+	'getSeconds',
+	'getTime',
+	'getTimezoneOffset',
+	'getUTCDate',
+	'getUTCDay',
+	'getUTCFullYear',
+	'getUTCHours',
+	'getUTCMilliseconds',
+	'getUTCMinutes',
+	'getUTCMonth',
+	'getUTCSeconds',
+	// @ts-expect-error this is deprecated
+	'getYear',
+	'toDateString',
+	'toISOString',
+	'toJSON',
+	'toLocaleDateString',
+	'toLocaleString',
+	'toLocaleTimeString',
+	'toString',
+	'toTimeString',
+	'toUTCString'
+];
+
+/** @type {Array<keyof Date>} */
+const write = [
+	'setDate',
+	'setFullYear',
+	'setHours',
+	'setMilliseconds',
+	'setMinutes',
+	'setMonth',
+	'setSeconds',
+	'setTime',
+	'setUTCDate',
+	'setUTCFullYear',
+	'setUTCHours',
+	'setUTCMilliseconds',
+	'setUTCMinutes',
+	'setUTCMonth',
+	'setUTCSeconds',
+	// @ts-expect-error this is deprecated
+	'setYear'
+];
+
+export class ReactiveDate extends Date {
+	#raw_time = source(super.getTime());
+	static #inited = false;
+
+	// We init as part of the first instance so that we can treeshake this class
+	#init() {
+		if (!ReactiveDate.#inited) {
+			ReactiveDate.#inited = true;
+			const proto = ReactiveDate.prototype;
+			const date_proto = Date.prototype;
+
+			for (const method of read) {
+				// @ts-ignore
+				proto[method] = function () {
+					get(this.#raw_time);
+					// @ts-ignore
+					return date_proto[method].call(this);
+				};
+			}
+
+			for (const method of write) {
+				// @ts-ignore
+				proto[method] = function (/** @type {any} */ ...args) {
+					// @ts-ignore
+					const v = date_proto[method].apply(this, args);
+					const time = date_proto.getTime.call(this);
+					if (time !== this.#raw_time.v) {
+						set(this.#raw_time, time);
+					}
+					return v;
+				};
+			}
+		}
+	}
+
+	/**
+	 * @param {any[]} values
+	 */
+	constructor(...values) {
+		// @ts-ignore
+		super(...values);
+		this.#init();
+	}
+}

packages/svelte/src/reactivity/index.js

@@ -1,103 +1,2 @@
-import { source, set } from '../internal/client/reactivity/sources.js';
-import { get } from '../internal/client/runtime.js';
-
-/** @type {Array<keyof Date>} */
-const read = [
-	'getDate',
-	'getDay',
-	'getFullYear',
-	'getHours',
-	'getMilliseconds',
-	'getMinutes',
-	'getMonth',
-	'getSeconds',
-	'getTime',
-	'getTimezoneOffset',
-	'getUTCDate',
-	'getUTCDay',
-	'getUTCFullYear',
-	'getUTCHours',
-	'getUTCMilliseconds',
-	'getUTCMinutes',
-	'getUTCMonth',
-	'getUTCSeconds',
-	// @ts-expect-error this is deprecated
-	'getYear',
-	'toDateString',
-	'toISOString',
-	'toJSON',
-	'toLocaleDateString',
-	'toLocaleString',
-	'toLocaleTimeString',
-	'toString',
-	'toTimeString',
-	'toUTCString'
-];
-
-/** @type {Array<keyof Date>} */
-const write = [
-	'setDate',
-	'setFullYear',
-	'setHours',
-	'setMilliseconds',
-	'setMinutes',
-	'setMonth',
-	'setSeconds',
-	'setTime',
-	'setUTCDate',
-	'setUTCFullYear',
-	'setUTCHours',
-	'setUTCMilliseconds',
-	'setUTCMinutes',
-	'setUTCMonth',
-	'setUTCSeconds',
-	// @ts-expect-error this is deprecated
-	'setYear'
-];
-
-class ReactiveDate extends Date {
-	#raw_time = source(super.getTime());
-	static #inited = false;
-
-	// We init as part of the first instance so that we can treeshake this class
-	#init() {
-		if (!ReactiveDate.#inited) {
-			ReactiveDate.#inited = true;
-			const proto = ReactiveDate.prototype;
-			const date_proto = Date.prototype;
-
-			for (const method of read) {
-				// @ts-ignore
-				proto[method] = function () {
-					get(this.#raw_time);
-					// @ts-ignore
-					return date_proto[method].call(this);
-				};
-			}
-
-			for (const method of write) {
-				// @ts-ignore
-				proto[method] = function (/** @type {any} */ ...args) {
-					// @ts-ignore
-					const v = date_proto[method].apply(this, args);
-					const time = date_proto.getTime.call(this);
-					if (time !== this.#raw_time.v) {
-						set(this.#raw_time, time);
-					}
-					return v;
-				};
-			}
-		}
-	}
-
-	/**
-	 * @param {any[]} values
-	 */
-	constructor(...values) {
-		// @ts-ignore
-		super(...values);
-		this.#init();
-	}
-}
-
-export { ReactiveDate as Date };
+export { ReactiveDate as Date } from './date.js';
+export { ReactiveSet as Set } from './set.js';