# svelte-syncable

> Syncable store for SvelteJS

Latest version **1.0.4** (published 2019-06-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install svelte-syncable
pnpm add svelte-syncable
yarn add svelte-syncable
bun add svelte-syncable
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2019-06-26 |
| First published | 2019-06-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 6.6 KB |
| Known vulnerabilities | 0 (+7 in 1 direct dependencies) |
| Install scripts | no |
| Author | Kevin Guillouard |
| Maintainers | chainlist |
| Keywords | svelte, localStorage, syncable, sync, store, svelte-store |

## Links

- npm: https://www.npmjs.com/package/svelte-syncable
- Repository: https://github.com/chainlist/svelte-syncable
- Homepage: https://github.com/chainlist/svelte-syncable#readme
- Issues: https://github.com/chainlist/svelte-syncable/issues
- npm.io page: https://npm.io/package/svelte-syncable

## Dependencies (1)

- [svelte](https://npm.io/package/svelte.md) ^3.6.0

## Alternatives

- [localforage](https://npm.io/package/localforage.md) — 6.2M weekly downloads
- [localforage-observable](https://npm.io/package/localforage-observable.md) — 30.8K weekly downloads
- [@y/y](https://npm.io/package/@y/y.md) — 30.1K weekly downloads
- [@metaobjectsdev/render](https://npm.io/package/@metaobjectsdev/render.md) — 3.5K weekly downloads
- [@ledgerhq/coin-algorand](https://npm.io/package/@ledgerhq/coin-algorand.md) — 1.1K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2019-06-26
- 1.0.2 — 2019-06-25
- 1.0.1 — 2019-06-25
- 1.0.0 — 2019-06-25

## README

# Svelte Store Storage plugin [![Build Status](https://travis-ci.org/chainlist/svelte-syncable.svg?branch=master)](https://travis-ci.org/chainlist/svelte-syncable)

## Install

`npm i -D svelte-syncable`

or

`yarn add -D svelte-syncable`

## How to use


Setting a prefix is optional, the default one is `svelteStore`

Create your syncable store value
```javascript
// store.js
import { syncable, setPrefix } from 'svelte-syncable';

// All the syncable value will be stored as "foorbar-{name}"
setPrefix('foobar');

export const answer = syncable('answer', 42);
export const todos = syncable('todos', [
    { id: 1, text: 'Find the answer of life', done: false }
]);
```

Use your store value as every other svelte store observables
```html
// Component.svelte
<script>
    import { answer, todos } from './store.js';
</script>

<ul>
    {#each $todos as todo, todo.id}
        <li>{todo.text}</li>
    {/each}
</ul>

The count is {$answer}
```

## API

### setPrefix(prefix: string): void

Set the localStorage prefix to {name}
The function has to be called on the top of your store.js file.

### syncable(name: string, value: any, hydrate: boolean = true): SvelteObservable

Create a svelte observable store value and synchronize it with the localStorage.
The value will by hydrated from the localStorage by default, set `hydrate` to false to avoid this behavior.
The `hydrate` parameter is optional and set to true by default.


```javascript
import { syncable } from 'svelte-syncable';
import { writable } from 'svelte/store';

export const count = syncable('count', 0, false);
```

---
_Source: https://npm.io/package/svelte-syncable · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._