Skip to content

Commit

Permalink
Add readonly to stores
Browse files Browse the repository at this point in the history
  • Loading branch information
blaumeise20 committed Jul 12, 2021
1 parent 8f1ae80 commit b95e138
Show file tree
Hide file tree
Showing 3 changed files with 53 additions and 2 deletions.
25 changes: 24 additions & 1 deletion site/content/docs/03-run-time.md
Original file line number Diff line number Diff line change
Expand Up @@ -411,6 +411,29 @@ import { get } from 'svelte/store';
const value = get(store);
```

#### `readonly`

```js
readableStore = readonly(writableStore);
```

---

This simple helper function makes a store readonly. You can still subscribe to the changes from the original one using this new readable store.


```js
import { readonly } from 'svelte/store';

const writableStore = writable(1);
const readableStore = readonly(writableStore);

readableStore.subscribe(console.log);

writableStore.set(2); // console: 2
readableStore.set(2); // ERROR
```


### `svelte/motion`

Expand Down Expand Up @@ -788,7 +811,7 @@ The `crossfade` function creates a pair of [transitions](docs#transition_fn) cal
* `delay` (`number`, default 0) — milliseconds before starting
* `duration` (`number` | `function`, default 800) — milliseconds the transition lasts
* `easing` (`function`, default `cubicOut`) — an [easing function](docs#svelte_easing)
* `fallback` (`function`) — A fallback [transition](docs#transition_fn) to use for send when there is no matching element being received, and for receive when there is no element being sent.
* `fallback` (`function`) — A fallback [transition](docs#transition_fn) to use for send when there is no matching element being received, and for receive when there is no element being sent.

```sv
<script>
Expand Down
11 changes: 11 additions & 0 deletions src/runtime/store/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -211,6 +211,17 @@ export function derived<T>(stores: Stores, fn: Function, initial_value?: T): Rea
});
}

/**
* Takes a store and returns a new one derived from the old one that is readable.
*
* @param store - store to make readonly
*/
export function readonly<T>(store: Readable<T>): Readable<T> {
return {
subscribe: store.subscribe
};
}

/**
* Get the current value from a store by subscribing and immediately unsubscribing.
* @param store readable
Expand Down
19 changes: 18 additions & 1 deletion test/store/index.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import * as assert from 'assert';
import { readable, writable, derived, get } from '../../store';
import { readable, writable, derived, get, readonly } from '../../store';

describe('store', () => {
describe('writable', () => {
Expand Down Expand Up @@ -411,4 +411,21 @@ describe('store', () => {
assert.equal(get(fake_observable), 42);
});
});

describe('readonly', () => {
it('makes a store readonly', () => {
const writableStore = writable(1);
const readableStore = readonly(writableStore);

assert.equal(get(readableStore), get(writableStore));

writableStore.set(2);

assert.equal(get(readableStore), 2);
assert.equal(get(readableStore), get(writableStore));

assert.throws(() => readableStore.set(3));
});

});
});

0 comments on commit b95e138

Please sign in to comment.