❤
npm
Sign UpSign In

linex-stores

1.0.1 • Public • Published

linex-stores

Stores for the linex state-management library encapsulating commonly used logic.

Installation

npm i linex linex-stores

Usage

import { create } from 'linex'
import { count, toggle } from 'linex-stores'
 
const store = create({
  state: {
    counter: count(5),
    active: toggle(true)
  }
})
 
store.counter.value === 5
store.counter.increment()
store.counter.value === 6
store.active.value === true
store.active.toggle()
store.active.value === false

Stores

This package includes a few stores essential for everyday web development. There are different ways to import them:

import { set } from 'linex-stores'
const store = create({ state: { input: set(5) } })
 
import { set as setStore } from 'linex-stores'
const store = create({ state: { input: setStore(5) } })
 
import * as stores from 'linex-stores'
const store = create({ state: { input: stores.set(5) } })

Set

const store = set(initial: any)
Interface Type Description
store.value: any State Returns the current value.
store.set(value: any) Update Changes the value.

Toggle

const store = toggle([initial = false]: boolean)
Interface Type Description
store.value: boolean State Returns the state.
store.toggle([value]: boolean): boolean Update Toggles the value, or sets it to the one passed.

Count

const store = count([initial = 0]: number)
Interface Type Description
store.value: number State Returns the current count.
store.increment([value]: number): number Update Increments the count by value or by 1 if no value provided.
store.decrement([value]: number): number Update Decrements the count by value or by 1 if no value provided.

List

const store = list([initial]: any | initial: [] | ...args: any)
Interface Type Description
store.value: [] State Returns the list as an array.
store.add(value: any): [] Update Add a single element to the list.
store.add(value: []): [] Update Adds an array of elements to the list.
store.add(...args: any): [] Update Adds all the args to the list.
store.remove(value: any): [] Update Removes all occurences of value from the list.
store.removeIndex(index: number): [] Update Removes the element at index from the list.

Validate

This store is useful for any kind of form elements, where an invalid value has effects outside the form element itself. For example the submit element of a form being disabled as long some elements contain errors or warnings.

const store = validate(initial: T, valid: T => boolean, [warning]: T => boolean)
Interface Type Description
store.value: any State Returns the current value.
store.valid: boolean State Is the current value valid?
store.error: boolean State Is the current value invalid?
store.warning: boolean State Is the current value causing a warning?
store.set(value: any) Update Sets the current value and updates the validation states.

Sync

Used for values that are asynchronously stores elsewhere (Backend, Localstorage, AsyncStorage). Useful if value and sync-state should be displayed in different places.

const store = sync(initial: any, sync: any => Promise)

sync should be a function returning a Promise resolving as soon as the value has been synchronized.

Interface Type Description
store.value: any State Returns the current value.
store.synced: boolean State True if the value has been successfully synced.
store.error: boolean State Did an error happen during synchronization?
store.set(value: any) Update Changes the current value and starts synchronization.

Load (Suspense)

Asyncronously load a Component (or else) from anywhere and access it anywhere.

const store = load(importFunc: () => Promise)
const store = load(() => import('./src/Component.js'))

The import function will be called to load the component and should return a Promise eventually resolving with the Component.

Interface Type Description
store.Component: any State The Component once loaded.
store.loading: boolean State Is the Component currently being loaded?
store.loaded: boolean State Has the Component been loaded?
store.error: boolean State True if an error loading the Component has happened.
store.load(): void Update Triggers the store to load the Component.

Readme

Keywords

none

Package Sidebar

Install

npm i linex-stores

Repository

github.com/naminho/linex

Homepage

github.com/naminho/linex#readme

Weekly Downloads

0

Version

1.0.1

License

MIT

Unpacked Size

25.7 kB

Total Files

6

Last publish

Collaborators

  • naminho
  • tobua
Try on RunKit
Report malware