chore: move reactivity code around (#10696)

* move some code

* split computations.js into deriveds.js and effects.js

* move reactivity types into separate .d.ts file

* move some signal code

---------

Co-authored-by: Rich Harris <[email protected]>

Author: Rich-Harris

packages/svelte/src/internal/client/custom-element.js

@@ -1,6 +1,6 @@
 import { createClassComponent } from '../../legacy/legacy-client.js';
 import { destroy_signal } from './runtime.js';
-import { render_effect } from './reactivity/computations.js';
+import { render_effect } from './reactivity/effects.js';
 import { open, close } from './render.js';
 import { define_property } from './utils.js';
 

packages/svelte/src/internal/client/dom/blocks/await.js

@@ -8,7 +8,7 @@ import {
 	flushSync,
 	push_destroy_fn
 } from '../../runtime.js';
-import { render_effect } from '../../reactivity/computations.js';
+import { render_effect } from '../../reactivity/effects.js';
 import { trigger_transitions } from '../../transitions.js';
 import { AWAIT_BLOCK, UNINITIALIZED } from '../../constants.js';
 

packages/svelte/src/internal/client/dom/blocks/each.js

@@ -16,15 +16,9 @@ import {
 } from '../../hydration.js';
 import { clear_text_content, empty, map_get, map_set } from '../../operations.js';
 import { insert, remove } from '../../reconciler.js';
-import {
-	current_block,
-	destroy_signal,
-	execute_effect,
-	push_destroy_fn,
-	set_signal_value
-} from '../../runtime.js';
-import { render_effect } from '../../reactivity/computations.js';
-import { source, mutable_source } from '../../reactivity/sources.js';
+import { current_block, destroy_signal, execute_effect, push_destroy_fn } from '../../runtime.js';
+import { render_effect } from '../../reactivity/effects.js';
+import { source, mutable_source, set_signal_value } from '../../reactivity/sources.js';
 import { trigger_transitions } from '../../transitions.js';
 import { is_array } from '../../utils.js';
 import { EACH_BLOCK, EACH_ITEM_BLOCK } from '../../constants.js';

packages/svelte/src/internal/client/dom/blocks/if.js

@@ -7,7 +7,7 @@ import {
 } from '../../hydration.js';
 import { remove } from '../../reconciler.js';
 import { current_block, destroy_signal, execute_effect, push_destroy_fn } from '../../runtime.js';
-import { render_effect } from '../../reactivity/computations.js';
+import { render_effect } from '../../reactivity/effects.js';
 import { trigger_transitions } from '../../transitions.js';
 
 /** @returns {import('../../types.js').IfBlock} */

packages/svelte/src/internal/client/dom/blocks/key.js

@@ -2,7 +2,7 @@ import { UNINITIALIZED, KEY_BLOCK } from '../../constants.js';
 import { hydrate_block_anchor } from '../../hydration.js';
 import { remove } from '../../reconciler.js';
 import { current_block, destroy_signal, execute_effect, push_destroy_fn } from '../../runtime.js';
-import { render_effect } from '../../reactivity/computations.js';
+import { render_effect } from '../../reactivity/effects.js';
 import { trigger_transitions } from '../../transitions.js';
 import { safe_not_equal } from '../../reactivity/equality.js';
 

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

@@ -1,14 +1,12 @@
 import { DEV } from 'esm-env';
 import {
 	get,
-	set,
 	updating_derived,
 	batch_inspect,
 	current_component_context,
-	untrack,
-	set_signal_value
+	untrack
 } from './runtime.js';
-import { effect_active } from './reactivity/computations.js';
+import { effect_active } from './reactivity/effects.js';
 import {
 	array_prototype,
 	define_property,
@@ -20,7 +18,7 @@ import {
 	object_prototype
 } from './utils.js';
 import { add_owner, check_ownership, strip_owner } from './dev/ownership.js';
-import { mutable_source, source } from './reactivity/sources.js';
+import { mutable_source, source, set, set_signal_value } from './reactivity/sources.js';
 import { STATE_SYMBOL, UNINITIALIZED } from './constants.js';
 
 /**

packages/svelte/src/internal/client/reactivity/deriveds.js

@@ -0,0 +1,36 @@
+import { CLEAN, DERIVED, UNINITIALIZED, UNOWNED } from '../constants.js';
+import { current_block, current_consumer, current_effect } from '../runtime.js';
+import { create_computation_signal, push_reference } from './effects.js';
+import { default_equals, safe_equal } from './equality.js';
+
+/**
+ * @template V
+ * @param {() => V} fn
+ * @returns {import('../types.js').ComputationSignal<V>}
+ */
+/*#__NO_SIDE_EFFECTS__*/
+export function derived(fn) {
+	const is_unowned = current_effect === null;
+	const flags = is_unowned ? DERIVED | UNOWNED : DERIVED;
+	const signal = /** @type {import('../types.js').ComputationSignal<V>} */ (
+		create_computation_signal(flags | CLEAN, UNINITIALIZED, current_block)
+	);
+	signal.i = fn;
+	signal.e = default_equals;
+	if (current_consumer !== null) {
+		push_reference(current_consumer, signal);
+	}
+	return signal;
+}
+
+/**
+ * @template V
+ * @param {() => V} fn
+ * @returns {import('../types.js').ComputationSignal<V>}
+ */
+/*#__NO_SIDE_EFFECTS__*/
+export function derived_safe_equal(fn) {
+	const signal = derived(fn);
+	signal.e = safe_equal;
+	return signal;
+}

packages/svelte/src/internal/client/reactivity/computations.js renamed to packages/svelte/src/internal/client/reactivity/effects.js

@@ -27,7 +27,7 @@ import {
  * @param {V} value
  * @param {import('../types.js').Block | null} block
  */
-function create_computation_signal(flags, value, block) {
+export function create_computation_signal(flags, value, block) {
 	/** @type {import('../types.js').ComputationSignal<V>} */
 	const signal = {
 		b: block,
@@ -224,35 +224,3 @@ export function render_effect(fn, block = current_block, managed = false, sync =
 	}
 	return internal_create_effect(flags, /** @type {any} */ (fn), sync, block, true);
 }
-
-/**
- * @template V
- * @param {() => V} fn
- * @returns {import('../types.js').ComputationSignal<V>}
- */
-/*#__NO_SIDE_EFFECTS__*/
-export function derived(fn) {
-	const is_unowned = current_effect === null;
-	const flags = is_unowned ? DERIVED | UNOWNED : DERIVED;
-	const signal = /** @type {import('../types.js').ComputationSignal<V>} */ (
-		create_computation_signal(flags | CLEAN, UNINITIALIZED, current_block)
-	);
-	signal.i = fn;
-	signal.e = default_equals;
-	if (current_consumer !== null) {
-		push_reference(current_consumer, signal);
-	}
-	return signal;
-}
-
-/**
- * @template V
- * @param {() => V} fn
- * @returns {import('../types.js').ComputationSignal<V>}
- */
-/*#__NO_SIDE_EFFECTS__*/
-export function derived_safe_equal(fn) {
-	const signal = derived(fn);
-	signal.e = safe_equal;
-	return signal;
-}

packages/svelte/src/internal/client/reactivity/props.js

@@ -0,0 +1,21 @@
+/**
+ * @param {((value?: number) => number)} fn
+ * @param {1 | -1} [d]
+ * @returns {number}
+ */
+export function update_prop(fn, d = 1) {
+	const value = fn();
+	fn(value + d);
+	return value;
+}
+
+/**
+ * @param {((value?: number) => number)} fn
+ * @param {1 | -1} [d]
+ * @returns {number}
+ */
+export function update_pre_prop(fn, d = 1) {
+	const value = fn() + d;
+	fn(value);
+	return value;
+}

packages/svelte/src/internal/client/reactivity/sources.js

@@ -1,7 +1,25 @@
 import { DEV } from 'esm-env';
-import { current_component_context } from '../runtime.js';
+import {
+	current_component_context,
+	current_consumer,
+	current_dependencies,
+	current_effect,
+	current_untracked_writes,
+	current_untracking,
+	flushSync,
+	get,
+	ignore_mutation_validation,
+	is_batching_effect,
+	is_runes,
+	mark_signal_consumers,
+	schedule_effect,
+	set_current_untracked_writes,
+	set_last_inspected_signal,
+	set_signal_status,
+	untrack
+} from '../runtime.js';
 import { default_equals, safe_equal } from './equality.js';
-import { CLEAN, SOURCE } from '../constants.js';
+import { CLEAN, DERIVED, DIRTY, MANAGED, SOURCE } from '../constants.js';
 
 /**
  * @template V
@@ -68,3 +86,109 @@ function create_source_signal(flags, value) {
 		w: 0
 	};
 }
+
+/**
+ * @template V
+ * @param {import('./types.js').Signal<V>} signal
+ * @param {V} value
+ * @returns {V}
+ */
+export function set(signal, value) {
+	set_signal_value(signal, value);
+	return value;
+}
+
+/**
+ * @template V
+ * @param {import('./types.js').Signal<V>} signal
+ * @param {V} value
+ * @returns {void}
+ */
+export function set_sync(signal, value) {
+	flushSync(() => set(signal, value));
+}
+
+/**
+ * @template V
+ * @param {import('./types.js').Signal<V>} source
+ * @param {V} value
+ */
+export function mutate(source, value) {
+	set_signal_value(
+		source,
+		untrack(() => get(source))
+	);
+	return value;
+}
+
+/**
+ * @template V
+ * @param {import('./types.js').Signal<V>} signal
+ * @param {V} value
+ * @returns {void}
+ */
+export function set_signal_value(signal, value) {
+	if (
+		!current_untracking &&
+		!ignore_mutation_validation &&
+		current_consumer !== null &&
+		is_runes(null) &&
+		(current_consumer.f & DERIVED) !== 0
+	) {
+		throw new Error(
+			'ERR_SVELTE_UNSAFE_MUTATION' +
+				(DEV
+					? ": Unsafe mutations during Svelte's render or derived phase are not permitted in runes mode. " +
+						'This can lead to unexpected errors and possibly cause infinite loops.\n\nIf this mutation is not meant ' +
+						'to be reactive do not use the "$state" rune for that declaration.'
+					: '')
+		);
+	}
+	if (
+		(signal.f & SOURCE) !== 0 &&
+		!(/** @type {import('#client').EqualsFunctions} */ (signal.e)(value, signal.v))
+	) {
+		signal.v = value;
+		// Increment write version so that unowned signals can properly track dirtyness
+		signal.w++;
+		// If the current signal is running for the first time, it won't have any
+		// consumers as we only allocate and assign the consumers after the signal
+		// has fully executed. So in the case of ensuring it registers the consumer
+		// properly for itself, we need to ensure the current effect actually gets
+		// scheduled. i.e:
+		//
+		// $effect(() => x++)
+		//
+		// We additionally want to skip this logic for when ignore_mutation_validation is
+		// true, as stores write to source signal on initialization.
+		if (
+			is_runes(null) &&
+			!ignore_mutation_validation &&
+			current_effect !== null &&
+			current_effect.c === null &&
+			(current_effect.f & CLEAN) !== 0 &&
+			(current_effect.f & MANAGED) === 0
+		) {
+			if (current_dependencies !== null && current_dependencies.includes(signal)) {
+				set_signal_status(current_effect, DIRTY);
+				schedule_effect(current_effect, false);
+			} else {
+				if (current_untracked_writes === null) {
+					set_current_untracked_writes([signal]);
+				} else {
+					current_untracked_writes.push(signal);
+				}
+			}
+		}
+		mark_signal_consumers(signal, DIRTY, true);
+
+		// @ts-expect-error
+		if (DEV && signal.inspect) {
+			if (is_batching_effect) {
+				set_last_inspected_signal(/** @type {import('./types.js').SignalDebug} */ (signal));
+			} else {
+				for (const fn of /** @type {import('./types.js').SignalDebug} */ (signal).inspect) fn();
+			}
+		}
+	}
+}