Reactivity not updating with SvelteMap

[RealmyTheMan]

Describe the bug

I was trying to update a SvelteMap, and even though the change went through in the map itself, it never updated the state anywhere. Please review the reproduction.

It appears that getting an object from the map, editing it, and reinserting the same object into the map doesn't cause it to update the state. Replacing the last line in the setTimeout with items.set('test', { value: "def" }) does update the state.

This strikes me as weird, as in the documentation it says the values inside of the SvelteMap is not made to be reactive, which would make me assume that there's nothing special or different about any object returned out of a SvelteMap.

It's worth noting that I am running SvelteKit's dev server using bun, not node, and @sveltejs/adapter-static (however this was all tested/ran using the dev server).

Reproduction

// map.svelte.ts
import { SvelteMap } from 'svelte/reactivity';

export const items: SvelteMap<string, { value: string }> = new SvelteMap();
items.set('test', { value: 'abc' });

setTimeout(() => {
	const item = items.get('test');
	if (!item) return false;

	item.value = 'def';

	items.set('test', item); // here
}, 1000);

Logs

System Info

System:
    OS: macOS 26.0
    CPU: (11) arm64 Apple M3 Pro
    Memory: 1.44 GB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.13.1 - /usr/local/bin/node
    Yarn: 1.22.22 - /usr/local/bin/yarn
    npm: 10.9.2 - /usr/local/bin/npm
    pnpm: 10.12.4 - ~/Library/pnpm/pnpm
    bun: 1.2.20 - ~/.bun/bin/bun
    Watchman: 2025.05.26.00 - /opt/homebrew/bin/watchman
  Browsers:
    Brave Browser: 139.1.81.136
    Chrome: 139.0.7258.128
    Safari: 26.0
  npmPackages:
    svelte: ^5.0.0 => 5.38.6

Severity

annoyance

[brunnerh]

By setting 'test' to the same item nothing has changed for the map, it is still pointing to the same object, hence no update. There is nothing special about the objects, this is just how reference equality works and the expected behavior.

If you want modifications of objects inside the map to be reactive, you can turn them into $state proxies.

// map.svelte.ts
import { SvelteMap } from 'svelte/reactivity';

export const items = new SvelteMap();
const item = $state({ value: 'abc' });
items.set('test', item);

setTimeout(() => {
	const item = items.get('test');
	if (!item) return false;

	// no need to do anything with the map after this:
	item.value = 'def';
}, 1000);

Playground