diff --git a/packages/svelte/src/motion/spring.js b/packages/svelte/src/motion/spring.js index 0f3bc6fb9f..44be1a501b 100644 --- a/packages/svelte/src/motion/spring.js +++ b/packages/svelte/src/motion/spring.js @@ -5,7 +5,7 @@ import { writable } from '../store/shared/index.js'; import { loop } from '../internal/client/loop.js'; import { raf } from '../internal/client/timing.js'; import { is_date } from './utils.js'; -import { set, source } from '../internal/client/reactivity/sources.js'; +import { set, state } from '../internal/client/reactivity/sources.js'; import { render_effect } from '../internal/client/reactivity/effects.js'; import { tag } from '../internal/client/dev/tracing.js'; import { get } from '../internal/client/runtime.js'; @@ -170,9 +170,9 @@ export function spring(value, opts = {}) { * @since 5.8.0 */ export class Spring { - #stiffness = source(0.15); - #damping = source(0.8); - #precision = source(0.01); + #stiffness = state(0.15); + #damping = state(0.8); + #precision = state(0.01); #current; #target; @@ -194,8 +194,8 @@ export class Spring { * @param {SpringOpts} [options] */ constructor(value, options = {}) { - this.#current = DEV ? tag(source(value), 'Spring.current') : source(value); - this.#target = DEV ? tag(source(value), 'Spring.target') : source(value); + this.#current = DEV ? tag(state(value), 'Spring.current') : state(value); + this.#target = DEV ? tag(state(value), 'Spring.target') : state(value); if (typeof options.stiffness === 'number') this.#stiffness.v = clamp(options.stiffness, 0, 1); if (typeof options.damping === 'number') this.#damping.v = clamp(options.damping, 0, 1); diff --git a/packages/svelte/src/motion/tweened.js b/packages/svelte/src/motion/tweened.js index 09bd06c325..437c22ec3b 100644 --- a/packages/svelte/src/motion/tweened.js +++ b/packages/svelte/src/motion/tweened.js @@ -6,7 +6,7 @@ import { raf } from '../internal/client/timing.js'; import { loop } from '../internal/client/loop.js'; import { linear } from '../easing/index.js'; import { is_date } from './utils.js'; -import { set, source } from '../internal/client/reactivity/sources.js'; +import { set, state } from '../internal/client/reactivity/sources.js'; import { tag } from '../internal/client/dev/tracing.js'; import { get, render_effect } from 'svelte/internal/client'; import { DEV } from 'esm-env'; @@ -191,8 +191,8 @@ export class Tween { * @param {TweenedOptions} options */ constructor(value, options = {}) { - this.#current = source(value); - this.#target = source(value); + this.#current = state(value); + this.#target = state(value); this.#defaults = options; if (DEV) { diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js index cd2fac163f..bb52cdafc2 100644 --- a/packages/svelte/src/reactivity/map.js +++ b/packages/svelte/src/reactivity/map.js @@ -2,7 +2,7 @@ import { DEV } from 'esm-env'; import { set, source, state } from '../internal/client/reactivity/sources.js'; import { label, tag } from '../internal/client/dev/tracing.js'; -import { get } from '../internal/client/runtime.js'; +import { get, push_reaction_value } from '../internal/client/runtime.js'; import { increment } from './utils.js'; /** @@ -83,11 +83,13 @@ export class SvelteMap extends Map { has(key) { var sources = this.#sources; var s = sources.get(key); + var is_new = false; if (s === undefined) { var ret = super.get(key); if (ret !== undefined) { s = source(0); + is_new = true; if (DEV) { tag(s, `SvelteMap get(${label(key)})`); @@ -103,6 +105,12 @@ export class SvelteMap extends Map { } get(s); + if (is_new) { + // if it's a new source we want to push to the reactions values + // AFTER we read it so that the effect depends on it but we don't + // trigger an unsafe mutation (since it was created within the derived) + push_reaction_value(s); + } return true; } @@ -119,11 +127,13 @@ export class SvelteMap extends Map { get(key) { var sources = this.#sources; var s = sources.get(key); + var is_new = false; if (s === undefined) { var ret = super.get(key); if (ret !== undefined) { s = source(0); + is_new = true; if (DEV) { tag(s, `SvelteMap get(${label(key)})`); @@ -139,6 +149,12 @@ export class SvelteMap extends Map { } get(s); + if (is_new) { + // if it's a new source we want to push to the reactions values + // AFTER we read it so that the effect depends on it but we don't + // trigger an unsafe mutation (since it was created within the derived) + push_reaction_value(s); + } return super.get(key); } @@ -154,7 +170,7 @@ export class SvelteMap extends Map { var version = this.#version; if (s === undefined) { - s = source(0); + s = state(0); if (DEV) { tag(s, `SvelteMap get(${label(key)})`); @@ -216,11 +232,12 @@ export class SvelteMap extends Map { get(this.#version); var sources = this.#sources; + var new_sources = new WeakSet(); if (this.#size.v !== sources.size) { for (var key of super.keys()) { if (!sources.has(key)) { var s = source(0); - + new_sources.add(s); if (DEV) { tag(s, `SvelteMap get(${label(key)})`); } @@ -232,6 +249,12 @@ export class SvelteMap extends Map { for ([, s] of this.#sources) { get(s); + if (new_sources.has(s)) { + // if it's a new source we want to push to the reactions values + // AFTER we read it so that the effect depends on it but we don't + // trigger an unsafe mutation (since it was created within the derived) + push_reaction_value(s); + } } } diff --git a/packages/svelte/src/reactivity/set.js b/packages/svelte/src/reactivity/set.js index 8a656c2bc1..7bb5da8705 100644 --- a/packages/svelte/src/reactivity/set.js +++ b/packages/svelte/src/reactivity/set.js @@ -2,7 +2,7 @@ import { DEV } from 'esm-env'; import { source, set, state } from '../internal/client/reactivity/sources.js'; import { label, tag } from '../internal/client/dev/tracing.js'; -import { get } from '../internal/client/runtime.js'; +import { get, push_reaction_value } from '../internal/client/runtime.js'; import { increment } from './utils.js'; var read_methods = ['forEach', 'isDisjointFrom', 'isSubsetOf', 'isSupersetOf']; @@ -107,6 +107,7 @@ export class SvelteSet extends Set { var has = super.has(value); var sources = this.#sources; var s = sources.get(value); + var is_new = false; if (s === undefined) { if (!has) { @@ -117,6 +118,7 @@ export class SvelteSet extends Set { } s = source(true); + is_new = true; if (DEV) { tag(s, `SvelteSet has(${label(value)})`); @@ -126,6 +128,9 @@ export class SvelteSet extends Set { } get(s); + if (is_new) { + push_reaction_value(s); + } return has; }