diff --git a/site/content/docs/03-run-time.md b/site/content/docs/03-run-time.md index c2cc59fa7b..b1799994f5 100644 --- a/site/content/docs/03-run-time.md +++ b/site/content/docs/03-run-time.md @@ -244,21 +244,21 @@ const time = readable(new Date(), set => { }); ``` -* `store = derive(a, callback: (a: any) => any)` -* `store = derive(a, callback: (a: any, set: (value: any) => void) => void)` -* `store = derive([a, ...b], callback: ([a: any, ...b: any[]]) => any)` -* `store = derive([a, ...b], callback: ([a: any, ...b: any[]], set: (value: any) => void) => void)` +* `store = derived(a, callback: (a: any) => any)` +* `store = derived(a, callback: (a: any, set: (value: any) => void) => void)` +* `store = derived([a, ...b], callback: ([a: any, ...b: any[]]) => any)` +* `store = derived([a, ...b], callback: ([a: any, ...b: any[]], set: (value: any) => void) => void)` --- Derives a store from one or more other stores. Whenever those dependencies change, the callback runs. -In the simplest version, `derive` takes a single store, and the callback returns a derived value. +In the simplest version, `derived` takes a single store, and the callback returns a derived value. ```js -import { derive } from 'svelte/store'; +import { derived } from 'svelte/store'; -const doubled = derive(a, $a => $a * 2); +const doubled = derived(a, $a => $a * 2); ``` --- @@ -266,9 +266,9 @@ const doubled = derive(a, $a => $a * 2); The callback can set a value asynchronously by accepting a second argument, `set`, and calling it when appropriate. ```js -import { derive } from 'svelte/store'; +import { derived } from 'svelte/store'; -const delayed = derive(a, ($a, set) => { +const delayed = derived(a, ($a, set) => { setTimeout(() => set($a), 1000); }); ``` @@ -278,11 +278,11 @@ const delayed = derive(a, ($a, set) => { In both cases, an array of arguments can be passed as the first argument instead of a single store. ```js -import { derive } from 'svelte/store'; +import { derived } from 'svelte/store'; -const summed = derive([a, b], ([$a, $b]) => $a + $b); +const summed = derived([a, b], ([$a, $b]) => $a + $b); -const delayed = derive([a, b], ([$a, $b], set) => { +const delayed = derived([a, b], ([$a, $b], set) => { setTimeout(() => set($a + $b), 1000); }); ``` diff --git a/site/content/examples/07-stores/03-derived-stores/stores.js b/site/content/examples/07-stores/03-derived-stores/stores.js index 5052cab54d..1da6d4195b 100644 --- a/site/content/examples/07-stores/03-derived-stores/stores.js +++ b/site/content/examples/07-stores/03-derived-stores/stores.js @@ -1,4 +1,4 @@ -import { readable, derive } from 'svelte/store'; +import { readable, derived } from 'svelte/store'; export const time = readable(new Date(), function start(set) { const interval = setInterval(() => { @@ -12,7 +12,7 @@ export const time = readable(new Date(), function start(set) { const start = new Date(); -export const elapsed = derive( +export const elapsed = derived( time, $time => Math.round(($time - start) / 1000) ); \ No newline at end of file diff --git a/site/content/tutorial/08-stores/04-derived-stores/app-a/stores.js b/site/content/tutorial/08-stores/04-derived-stores/app-a/stores.js index d7d8d7b914..f5e7eb28a5 100644 --- a/site/content/tutorial/08-stores/04-derived-stores/app-a/stores.js +++ b/site/content/tutorial/08-stores/04-derived-stores/app-a/stores.js @@ -1,4 +1,4 @@ -import { readable, derive } from 'svelte/store'; +import { readable, derived } from 'svelte/store'; export const time = readable(new Date(), function start(set) { const interval = setInterval(() => { @@ -12,7 +12,7 @@ export const time = readable(new Date(), function start(set) { const start = new Date(); -export const elapsed = derive( +export const elapsed = derived( time, $time => {} ); \ No newline at end of file diff --git a/site/content/tutorial/08-stores/04-derived-stores/app-b/stores.js b/site/content/tutorial/08-stores/04-derived-stores/app-b/stores.js index 5052cab54d..1da6d4195b 100644 --- a/site/content/tutorial/08-stores/04-derived-stores/app-b/stores.js +++ b/site/content/tutorial/08-stores/04-derived-stores/app-b/stores.js @@ -1,4 +1,4 @@ -import { readable, derive } from 'svelte/store'; +import { readable, derived } from 'svelte/store'; export const time = readable(new Date(), function start(set) { const interval = setInterval(() => { @@ -12,7 +12,7 @@ export const time = readable(new Date(), function start(set) { const start = new Date(); -export const elapsed = derive( +export const elapsed = derived( time, $time => Math.round(($time - start) / 1000) ); \ No newline at end of file diff --git a/site/content/tutorial/08-stores/04-derived-stores/text.md b/site/content/tutorial/08-stores/04-derived-stores/text.md index 9ee25b916c..82127944b5 100644 --- a/site/content/tutorial/08-stores/04-derived-stores/text.md +++ b/site/content/tutorial/08-stores/04-derived-stores/text.md @@ -2,10 +2,10 @@ title: Derived stores --- -You can create a store whose value is based on the value of one or more *other* stores with `derive`. Building on our previous example, we can create a store that derives the time the page has been open: +You can create a store whose value is based on the value of one or more *other* stores with `derived`. Building on our previous example, we can create a store that derives the time the page has been open: ```js -export const elapsed = derive( +export const elapsed = derived( time, $time => Math.round(($time - start) / 1000) ); diff --git a/store.mjs b/store.mjs index c4b98e9072..d47b884232 100644 --- a/store.mjs +++ b/store.mjs @@ -39,7 +39,7 @@ export function writable(value, start = noop) { return { set, update, subscribe }; } -export function derive(stores, fn) { +export function derived(stores, fn) { const single = !Array.isArray(stores); if (single) stores = [stores]; diff --git a/test/runtime/samples/store-assignment-updates/main.svelte b/test/runtime/samples/store-assignment-updates/main.svelte index fcce04dd36..804730bd62 100644 --- a/test/runtime/samples/store-assignment-updates/main.svelte +++ b/test/runtime/samples/store-assignment-updates/main.svelte @@ -1,9 +1,9 @@ diff --git a/test/store/index.js b/test/store/index.js index f077b183e1..a70bae68fc 100644 --- a/test/store/index.js +++ b/test/store/index.js @@ -1,5 +1,5 @@ import * as assert from 'assert'; -import { readable, writable, derive, get } from '../../store.js'; +import { readable, writable, derived, get } from '../../store.js'; describe('store', () => { describe('writable', () => { @@ -100,10 +100,10 @@ describe('store', () => { }); }); - describe('derive', () => { + describe('derived', () => { it('maps a single store', () => { const a = writable(1); - const b = derive(a, n => n * 2); + const b = derived(a, n => n * 2); const values = []; @@ -123,7 +123,7 @@ describe('store', () => { it('maps multiple stores', () => { const a = writable(2); const b = writable(3); - const c = derive(([a, b]), ([a, b]) => a * b); + const c = derived(([a, b]), ([a, b]) => a * b); const values = []; @@ -143,7 +143,7 @@ describe('store', () => { it('passes optional set function', () => { const number = writable(0); - const evens = derive(number, (n, set) => { + const evens = derived(number, (n, set) => { if (n % 2 === 0) set(n); }); @@ -169,9 +169,9 @@ describe('store', () => { it('prevents glitches', () => { const lastname = writable('Jekyll'); - const firstname = derive(lastname, n => n === 'Jekyll' ? 'Henry' : 'Edward'); + const firstname = derived(lastname, n => n === 'Jekyll' ? 'Henry' : 'Edward'); - const fullname = derive([firstname, lastname], names => names.join(' ')); + const fullname = derived([firstname, lastname], names => names.join(' ')); const values = [];