State
- 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'
-
📬 createStore: Create a new store: a collection of StoreSignal instances -
📡 Signal: Signal class
📬 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)
📬 StoreSignal
StoreSignal created by createStore.
Inherits from Signal - See its API for listen
/ unlisten
methods
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() ⇒
*
-
.set(newValue, [force]) ⇒
SignalListener
storeSignal.set(newValue, [force]) ⇒ 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
📡 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 ( |
SignalListener
signal.listen(callback, [context]) ⇒ 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 |
SignalListener
signal.listenOnce(callback, [context]) ⇒ 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