nuǝɯ pǝɥsᴉꞁod mǝu

    minimal-store
    TypeScript icon, indicating that this package has built-in type declarations

    1.2.1 • Public • Published

    minimal-store

    Minimalistic implementation of the reactive store pattern

    • 322 Bytes, according to size-limit
    • No dependencies
    • 100% test coverage
    • ES Module

    Badges

    circle ci

    semantic release

    npm version

    tested with jest

    codecov

    Usage

    There are differend kinds of store you can use:

    • writableStore
    • freezableStore
    • readableStore

    All stores apply weak data i.e. you can use null (update with no value) to clear store value.

    writableStore

    writableStore as called - can be updated without any limit. You can update data all the time as you want to.

    freezableStore

    freezableStore reflects the second parameter while being initialized - it defines how many time you can update store. The default is once (=== 1).

    readableStore

    readableStore stores the initial value and never being updated.
    All subscribers will be executed once with the value store contains.

    Examples

    • Simple example:
    import { writableStore } from 'minimal-store';
    
    const pageSize = writableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    	// subscription will be called with `size === 20`
    	// then with `size === 21`
    });
    
    pageSize.update(oldValue => oldValue + 1);
    • readable store
    import { readableStore } from 'minimal-store';
    
    const pageSize = readableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    });
    
    pageSize.update(oldValue => {
    	// pageSize will never be update as it is a readableStore
    	// return value does not make any sense in this case
    });
    • freezable store:
    import { freezableStore } from 'minimal-store';
    
    const freezeCount = 3;
    const pageSize = freezableStore(20, freezeCount);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    });
    
    pageSize.update(oldValue => {
    	// pageSize will be updated first 3 times and then will be freezed
    	const newValue = 21; // any value you want to return
    	return newValue;
    });
    • Promise-like update:
    import { writableStore } from 'minimal-store';
    
    const pageSize = writableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    	// first time it receives `size === 20`
    	// then `size === 100`
    });
    
    pageSize.update(oldValue => {
    	// update function can be async!
    	return Promise.resolve(100);
    });
    • Handling update errors:
    import { writableStore } from 'minimal-store';
    
    const pageSize = writableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    });
    
    pageSize
    	.update(oldValue => {
    		// update function can be async!
    		return Promise.reject(new Error('Something went wrong...'));
    	})
    	.catch(err => {
    		// err.message === 'Something went wrong...'
    	});
    • Use current value to update store:
    import { writableStore } from 'minimal-store';
    
    const pageSize = writableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    });
    
    pageSize.update(oldValue => {
    	return oldValue + 10;
    });
    • Store rely on weak data i.e. you always can pass null as a new value:
    import { writableStore } from 'minimal-store';
    
    const pageSize = writableStore(20);
    
    pageSize.subscribe(size => {
    	// do something with _size_
    	// first time `size === 20`
    	// next `size === null`
    });
    
    pageSize.update(oldValue => null);

    Install

    npm i minimal-store

    DownloadsWeekly Downloads

    7

    Version

    1.2.1

    License

    MIT

    Unpacked Size

    6.75 kB

    Total Files

    3

    Last publish

    Collaborators

    • n0th1ng_else