npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

omniscient-state

v0.0.9

Published

The simplest usable global state management

Downloads

6

Readme

omniscient

Build Status

The simplest usable global state management.

Usage

The goal is extremely simple state management. There are only 4 methods to learn!

Constructing a new instance

The constructor allows you to set the initial state of the store, or just leave it empty!

const omniscient = new Omniscient(); // Empty state
const omniscient = new Omniscient({
    todos: [
        {
            id: 1,
            value: 'Get some wicked kicks at the shoe store'
        }
    ]
}); // Initial state

getState

You can either get the entire state, or a specific property of the state.

const initialState = {
    user: {
        id: 1234,
        name: 'Boba Fett'
    },
    lastAction: {
        name: 'Being awesome',
        time: 'May 25, 1983'
    }
};
const omniscient = new Omniscient(initialState);

const allState = omniscient.getState();
console.log(allState === initialState); // true

const user = omniscient.getState('user');
console.log(user === initialState.user); // true

setState

Similar to getState you can either set the entire state, or a specific property of the state.

const initialState = {
    user: {
        id: 1234,
        name: 'Boba Fett'
    },
    lastAction: {
        name: 'Being awesome',
        time: 'May 25, 1983'
    }
};
const omniscient = new Omniscient(initialState);


const currentUser = omniscient.getState('user');
omniscient.setState('user', {
    ...currentUser,
    name: 'The Fett'
});
const { name } = omniscient.getState('user');
console.log(name === 'The Fett'); // true

const newState = {
    completely: 'different'
};
omniscient.setState(newState);
const allState = omniscient.getState();
console.log(allState === newState); // true

registerCallback and unregister

These are the callback management methods. If you want to know when a property changes, you'll call registerCallback. If you stop caring about that property, you'll call unregister.

const initialState = {
    user: {
        id: 1234,
        name: 'Boba Fett'
    },
    lastAction: {
        name: 'Being awesome',
        time: 'May 25, 1983'
    }
};
const omniscient = new Omniscient(initialState);

const callback = (value) => console.log('Called from the callback:', JSON.stringify(value));

// Call this method any time the 'user' property changes
const registrationId = omniscient.registerCallback('user', callback);

const callbackUserOne = omniscient.getState('user');

// This will trigger the call back
omniscient.setState('user', {
    ...callbackUserOne,
    name: 'The Fett'
});

// When you no longer want to be called for a property change
omniscient.unregister('user', registrationId);

console.log('Callback will not be called again.');
const callbackUserTwo = omniscient.getState('user');
omniscient.setState('user', {
    ...callbackUserTwo,
    name: 'The Fett'
});