* rename $derived.call to $derived.by
* more replacements, plus a compiler error
* regenerate types
---------
Co-authored-by: Rich Harris <rich.harris@vercel.com>
'invalid-runes-mode-import':(name)=>`${name} cannot be used in runes mode`,
'invalid-runes-mode-import':(name)=>`${name} cannot be used in runes mode`,
'duplicate-props-rune':()=>`Cannot use $props() more than once`,
'duplicate-props-rune':()=>`Cannot use $props() more than once`,
'invalid-each-assignment':()=>
'invalid-each-assignment':()=>
`Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. 'array[i] = value' instead of 'entry = value')`
`Cannot reassign or bind to each block argument in runes mode. Use the array and index variables instead (e.g. 'array[i] = value' instead of 'entry = value')`,
'invalid-derived-call':()=>`$derived.call(...) has been replaced with $derived.by(...)`
@ -134,14 +134,14 @@ If the value of a reactive variable is being computed it should be replaced with
```
```
...`double` will be calculated first despite the source order. In runes mode, `triple` cannot reference `double` before it has been declared.
...`double` will be calculated first despite the source order. In runes mode, `triple` cannot reference `double` before it has been declared.
## `$derived.call`
## `$derived.by`
Sometimes you need to create complex derivations that don't fit inside a short expression. In these cases, you can use `$derived.call` which accepts a function as its argument.
Sometimes you need to create complex derivations that don't fit inside a short expression. In these cases, you can use `$derived.by` which accepts a function as its argument.
```svelte
```svelte
<script>
<script>
let numbers = $state([1, 2, 3]);
let numbers = $state([1, 2, 3]);
let total = $derived.call(() => {
let total = $derived.by(() => {
let total = 0;
let total = 0;
for (const n of numbers) {
for (const n of numbers) {
total += n;
total += n;
@ -155,7 +155,7 @@ Sometimes you need to create complex derivations that don't fit inside a short e
</button>
</button>
```
```
In essence, `$derived(expression)` is equivalent to `$derived.call(() => expression)`.
In essence, `$derived(expression)` is equivalent to `$derived.by(() => expression)`.
Rich Harris
9 months ago
committed by
GitHub