delux
v1.5.2
Published
Beautiful, light and simple state manager inspired by Redux
Downloads
3
Maintainers
Readme
Beautiful, light and simple state manager inspired by Redux
import Store, { Collection } from 'delux';
let store = new Store ();
store.tasks = new Collection ({tasks: []});
store.tasks.on('addTask', (tasks, action) => tasks.concat({
name: action.payload,
completed: false
}));
store.subscribe('tasks', (state) => console.log(state.tasks));
store.dispatch({
type: 'addTask',
payload: 'Try Delux'
});
Motivation
- In Flux there's a design flaw: it's hard to manage several stores.
- So came Redux with one store.
- But: Redux lacks a defined API
Features
- Immutable
- Promise Based
- Extendible classes
- Flux Standard Actions
- Ordered middlewares
- No switches or combinations required
API Reference
Store
The Store holds the whole application state and it's mutation logic.
Create a Store
let store = new Store();
Description
Stores are objects whose prototype has methods to mutate there state. The Store's state is hold in Collections assigned to it.
Store instances
Properties
Store.prototype.state
Object with mutations of the collections' states.
Methods
Store.prototype.dispatch()
Dispatches a Flux Standard Action on the state.
store.dispatch({
type: <string | symbol>,
payload: <object>
error: <boolean>,
meta: <any>
});
Returns
A promise which resolves to the the mutated store state.
Store.prototype.subscribe()
Adds an subscriber for mutations in the store's collections
store.subscribe(['collectionName'], (state) => {
});
Parameters
- names | name - array of collection names or a single name to subscribe for state mutation
- subscriber - a function that with a given state mutation receives the name of the changed collection and it's new state. The arguments to the function are as follows:
| Name | Supplied Value | |------------|----------------------------- | | state | Store.prototype.state alias |
Store.prototype.use()
Adds a middlware to the action resolution process
store.use(middleware|type|{type: middleware}, <middleware>);
Parameters
middlware - a function that mutates a given action. If it returns a Promise the store will wait for the promise to complete before passing it to the next middleware and the reducers.
type - action type to apply middleware on.
Store.prototype.queue()
Adds a function to the store's execute queue
store.queue(() => callback());
Store.prototype.state.get()
Get specific collection's state from the store's state
let partialState = store.state.get(collectionNames);
Parameters
Collection
Collections holds a sub-state (similar to Flux Stores) and it's mutation logic
Assign a Collection
store.collectionName = new Collection (init);
Parameters
- init - The initial state of the collection
Collection instances
Properties
Collection.prototype.state
Reflects the collections's state
Collection.prototype.reducers
Reflects the collections's reducers
Collection.prototype.subscribers
Reflects the collections's subscribers
Methods
Collection.prototype.on()
Attach a reducer to received actions (Node style)
store.collectionName.on(['actionType'], (state, action) => {
});
Parameters
- types | type - array of action types or a single type to apply the reducer on
- reducer - a function that with a given action mutates the collection state and returns the new state. The arguments to the function are as follows:
| Name | Supplied Value | |--------|-----------------------| | state | The collection state | | action | The dispatched action |