# @marianmeres/switch-store

> Tiny DRY [store](https://github.com/marianmeres/store) utility for a 3 state value (`true`, `false` and `undefined`) along with arbitrary data.

Latest version **1.6.2** (published 2024-09-27) · MIT license · 0 weekly downloads

## Install

```sh
npm install @marianmeres/switch-store
pnpm add @marianmeres/switch-store
yarn add @marianmeres/switch-store
bun add @marianmeres/switch-store
```

## Health

**Score 55/100 (C)** — status: stable.

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

Warnings: low downloads.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 1.6.2 |
| Published | 2024-09-27 |
| First published | 2023-12-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 12.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Marian Meres |
| Maintainers | marianmeres |
| Keywords | store |

## Links

- npm: https://www.npmjs.com/package/@marianmeres/switch-store
- Repository: https://github.com/marianmeres/switch-store
- Homepage: https://github.com/marianmeres/switch-store#readme
- Issues: https://github.com/marianmeres/switch-store/issues
- npm.io page: https://npm.io/package/@marianmeres/switch-store

## Dependencies (1)

- [@marianmeres/store](https://npm.io/package/@marianmeres/store.md) ^1.6.3

## Recent versions

- 1.6.2 (latest) — 2024-09-27
- 1.6.1 — 2023-12-29
- 1.6.0 — 2023-12-29
- 1.5.0 — 2023-12-28
- 1.4.0 — 2023-12-28
- 1.3.1 — 2023-12-20
- 1.3.0 — 2023-12-16
- 1.2.1 — 2023-12-15
- 1.2.0 — 2023-12-14

## README

# @marianmeres/switch-store

Tiny DRY [store](https://github.com/marianmeres/store) utility for a 3 state
value (`true`, `false` and `undefined`) along with arbitrary data.

You can distinguish between falsey `false` and `undefined` states if you need to by checking
explicitly the `isUndefined` store prop. The `undefined` state is otherwise always evaluated as
`isOff` switch state.

## Install

```shell
$ npm i @marianmeres/switch-store
```

## Basic example

```javascript
const sidebar = createSwitchStore(false, { component: Foo } /* whatever */);

// "open" and "close" are aliases to "on" and "off"

sidebar.subscribe((value) => {
	// value -> {
	//     isOn: false,
	//     isOff: true,
	//     isUndefined: false,
	//     isOpen: false,
	//     isClosed: true,
	//     data: { component: Foo }
	// }
});

// api
store.subscribe((value) => ...)
store.on(data?); // or open
store.off(data?); // or close
store.unset(); // will set the internal flag to `undefined`
store.toggle();

```

Using Svelte here just as an example of consuming the store. The store itself
is not dependant on Svelte (just compatible).

```sveltehtml
{#if $sidebar.isOpen}
    <Sidebar>
        <svelte:component this={$sidebar.data.component} />
    </Sidebar>
{/if}

<button on:click={sidebar.toggle}>Toggle Foo sidebar</button>

<button on:click={() => sidebar.open({ component: Bar })}>
    Bar sidebar
</button>
```

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