Issue about derived reactivity since @5.24

[360matt]

Describe the bug

Using SvelteKit.
All dependencies all up to date.

Usage: I created a filter bar containing several widgets; only one can be open at a time (so that when I click on a widget, the old widget closes; if I click on the same widget, it closes).

Everything worked fine before [email protected], but since this update, the derived widget no longer seems to be responsive.

This is my filterBarUtils.svelte.ts

// the current opened widget name
let currentEditing: string | null = $state(null);

// I call this function for every widget
export function buildWidgetEditingToggle (widget: InternalFilterBarWidget): WidgetEditingToggle {
	const derived = $derived(currentEditing === widget.name);
	// derived = true/false if 'widget' is currently display or not 

	const obj = {
		value: derived,
		toggle (): void {
			currentEditing = (obj.value) ? null : widget.name;
			// effect: update the 'derived' of all widgets
		},
		hide (): void {
			if (obj.value) {
				currentEditing = null;
			}
		}
	};
	return obj;
}

// For each widget
const example = buildWidgetEditingToggle(...)

<!-- show/hide the widget by calling the toggle() !-->
<button onclick={example.toggle}> {name} </button>

<!-- reactive condition to show/hide the widget block !-->
{#if mySnippet && example.value}
	{@render mySnippet()}
{/if}

Since [email protected], when I click the button, it has no effect; edition.value no longer switches between true and false reactively.

I don't get any errors in the console.

When I do $inspect(example.value) and click the button (= call .toggle()), nothing is logged

Reproduction

Explained above (I think)

Logs

Nothing, no error displayed

System Info

System:
    OS: Linux 6.8 Ubuntu 24.04.2 LTS 24.04.2 LTS (Noble Numbat)
    CPU: (12) x64 AMD Ryzen 5 7600 6-Core Processor
    Memory: 15.19 GB / 30.50 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  Binaries:
    Node: 22.14.0 - /usr/bin/node
    Yarn: 1.22.22 - /usr/bin/yarn
    npm: 10.9.2 - /usr/bin/npm
  Browsers:
    Chrome: 132.0.6834.159
    Chromium: 134.0.6998.117
  npmPackages:
    svelte: 5.24.0 => 5.24.0

Severity

blocking an upgrade

[7nik]

        const derived = $derived(currentEditing === widget.name);
	const obj = {
		value: derived,
	};

It never worked this way - it just copies the current value. Or your example oversimplified. The best is to provide REPL that demonstrates the bug.

[Ocean-OS]

Yeah, as @7nik explained, just assigning a property to a $derived doesn't retain reactivity. You would need to wrap the property in a getter like so:

let obj = {
    get value() {
        return derived; 
    }
}

[dummdidumm]

Please provide a REPL reproduction, as others pointed out, that code never worked as expected since the value was frozen in time.