State

:books: Documentation | :bar_chart: Benchmarks | :globe_with_meridians: Internet modules

• Create tiny signal-based stores
• Signal class to create your own signals

Requirements

• ES6 Modules support
  • Using a module bundler like Webpack, Rollup or Parcel
  • Native support from browser
  • From NodeJS with something like esm

Module Installation

# using npm
$ npm install --save @internet/state

# or using yarn
$ yarn add @internet/state

API

import { createStore, Signal } from '@internet/state'

• :mailbox_with_mail: createStore: Create a new store: a collection of StoreSignal instances
• :satellite: Signal: Signal class

:mailbox_with_mail: createStore()

Create a new store containing StoreSignal instances

Kind: global function
Returns: Object - Frozen object containing StoreSignal instances

| Param | Type | Description | | --- | --- | --- | | state | Object | Initial state |

Example

import { createStore } from '@internet/state'
const store = createStore({
  value: 0
})

store.value.listen(v => console.log(`value is now ${v}`))
store.value.set(3)

:mailbox_with_mail: StoreSignal

StoreSignal created by createStore. Inherits from Signal - See its API for listen / unlisten methods

:warning: dispatch() method from Signal is removed and replaced by a set() method

Kind: global function
Extends: Signal
Returns: StoreSignal - StoreSignal instance

| Param | Type | Description | | --- | --- | --- | | initialValue | * | Initial value |

API

• StoreSignal(initialValue) ⇒ StoreSignal
  • .set(newValue, [force]) ⇒ SignalListener
  • .get() ⇒ *

storeSignal.set(newValue, [force]) ⇒ SignalListener

Change the stored value. Dispatch to all listeners the new value

Kind: instance method of StoreSignal
Returns: SignalListener - A SignalListener instance containing bindings to the signal.

| Param | Type | Default | Description | | --- | --- | --- | --- | | newValue | * | | New value to store | | [force] | boolean | false | Nothing is distpatched if the value doesn't change. Set force to true to force the dispatch. |

storeSignal.get() ⇒ *

Get current stored value

Kind: instance method of StoreSignal
Returns: * - Current stored value

:satellite: Signal

Kind: global class

API

• Signal
  • new Signal()
  • .dispatch([...arguments])
  • .listen(callback, [context]) ⇒ SignalListener
  • .listenOnce(callback, [context]) ⇒ SignalListener
  • .unlisten(callback, [context])
  • .unlistenAll()

new Signal()

Create a new Signal instance

Returns: Signal - A new signal
Example

import { Signal } from '@internet/state'
const click = new Signal()
document.addEventListener('click', click.dispatch)

class Component {
  constructor () {
    click.listen(this.onClick, this)
  }

  onClick () {
    // `this` is the component instance
    console.log('clicked')
  }

  dispose () {
    click.unlisten(this.onClick, this)
  }
}

signal.dispatch([...arguments])

Dispatches the signal to all listeners.

Kind: instance method of Signal

| Param | Type | Description | | --- | --- | --- | | [...arguments] | * | Arguments passed to each listeners (:warning: 5 maximum) |

signal.listen(callback, [context]) ⇒ SignalListener

Register a new listener

Kind: instance method of Signal
Returns: SignalListener - A SignalListener instance containing bindings to the signal.

| Param | Type | Description | | --- | --- | --- | | callback | function | Callback function | | [context] | * | The context to bind the callback to |

signal.listenOnce(callback, [context]) ⇒ SignalListener

Register a new listener that will be executed only once.

Kind: instance method of Signal
Returns: SignalListener - A SignalListener instance containing bindings to the signal.

| Param | Type | Description | | --- | --- | --- | | callback | function | Callback function | | [context] | * | The context to bind the callback to |

signal.unlisten(callback, [context])

Detach a listener from the signal You can also pass

Kind: instance method of Signal

| Param | Type | Description | | --- | --- | --- | | callback | function | SignalListener | The callback used when listening to the signal OR The SignalListener instance returned when listening the signal | | [context] | * | The context used when listening to the signal (only when the 1st arg is a function) |

Example

import { Signal } from '@internet/state'
const signal = new Signal()

// Using the SignalListener binding (better performances)
const binding = signal.listen(() => {})
signal.unlisten(binding)

// Using function
function listener () {}
signal.listen(listener)
signal.unlisten(listener)

signal.unlistenAll()

Remove all listeners attached to the signal instance

Kind: instance method of Signal