# sustand

> State-management solution for Svelte using simplified flux principles.

Latest version **0.0.2** (published 2022-07-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install sustand
pnpm add sustand
yarn add sustand
bun add sustand
```

## Health

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

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2022-07-05 |
| First published | 2022-07-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 7.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | wobsoriano |

## Links

- npm: https://www.npmjs.com/package/sustand
- Repository: https://github.com/wobsoriano/sustand
- Homepage: https://github.com/wobsoriano/sustand#readme
- Issues: https://github.com/wobsoriano/sustand/issues
- npm.io page: https://npm.io/package/sustand

## Dependencies (1)

- [zustand](https://npm.io/package/zustand.md) 4.0.0-rc.1

## Recent versions

- 0.0.2 (latest) — 2022-07-05
- 0.0.1 — 2022-07-05

## README

# sustand

[![npm (tag)](https://img.shields.io/npm/v/sustand?style=flat&colorA=000000&colorB=000000)](https://www.npmjs.com/package/sustand) ![npm bundle size](https://img.shields.io/bundlephobia/minzip/sustand?style=flat&colorA=000000&colorB=000000) ![NPM](https://img.shields.io/npm/l/sustand?style=flat&colorA=000000&colorB=000000)

State-management solution for Svelte using simplified flux principles. Powered by [zustand](https://github.com/pmndrs/zustand). Implements the [store contract](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/Svelte_stores#using_the_store_contract_to_persist_our_to-dos).

## Installation

```sh
npm install sustand
```

## Usage

### First create a store

```ts
import create from 'sustand'

const useStore = create(set => ({
  bears: 0,
  increase: () => set(state => ({ bears: state.bears + 1 })),
}))
```

### Then bind your components, and that's it!

```svelte
<script>
  import { useStore } from '$lib/store'
  const bears = useStore((state) => state.bears)
</script>

<h1>{$bears} around here ...</h1>
```

```svelte
<script>
  import { useStore } from '$lib/store'
  const increase = useStore((state) => state.increase)
</script>

<button on:click="() => $increase()">one up</button>
```

## License

MIT

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