Nine Project Managers


    3.0.0 • Public • Published

    Reactive Storage

    Build Status npm Coverage Status

    A module that does the following things —

    1. Exposes an immutable object as a stream.

    2. Stream notifies whenever there is a real change.

    3. Keeps a history of the changes.

    4. irecord is awesome, but only works with immutableJS, reactive-storage on the other hand lets the developer decide the immutable library he wants to integrate with. Infact you can even use it with primitive immutables such as RegEx, String, Date, Number etc. and not depend on any external libraries at all.


    npm install reactive-storage --save


    import {create} from 'reactive-storage'
    import Immutable from 'seamless-immutable'
    * The first param should be an immutable object.
    * Second param is the size limit to the history which is 1 by default.
    const store = create(new Immutable({a: 1, b: 2}), 30)
    * Automatically logs every change in the store.
    * Change detection is done via `===` comparison between the initial and the final store values.
    */ => console.log(x))
    * Changes to the store can be made via the `update` function which takes a `callback` as a param. The `callback` is called with the current value of the store.
    store.set(x => x.set('a', 100)
    * We can also pass direct values to the store.
    * CAUTION: This approach is only good for immutables suchs as - Number, Boolean, String etc. Use a library like ImmutableJS to work with complex data structures.

    Store API

    • set(function|object): Used to update the given stream with a particular value. If the type of the param is function then it will be called with the most recent value as the first param. The return value of the function will be used as the updated value and if it is different to the one before, it will also dispatch it onto the stream.

    • get(): Returns the current value of the store.

    • stream: Exposes the store as a stream. Useful for react-announce-connect

    • undo(): Goes back a previous state.

    • redo(): Goes forward a previous state.

    • canUndo(): Returns true if undo is possible.

    • canRedo(): Returns true if redo is possible.

    • reset(): Resets the history.

    • end(): Ends the exposed stream and clears all history information.


    npm i reactive-storage

    DownloadsWeekly Downloads






    Last publish


    • tusharmathur