Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


A lightweight utility for managing global state and performing side-effects when it changes.

The underpinning of the Proxy-State is the Proxy Object (hence the name). However, setting this up can be laborsome and time-consuming, so Proxy-State acts as an abstraction layer on top of native APIs to make things easier.

Currently, Proxy-State has no support for Internet Explorer.


Install the package via npm or yarn:

npm install @cjkoepke/proxy-state

In your main entry file, create a store with the following:

import Store from 'proxy-state'

const { state, listen, detach, fetch } = Store({
  count: 0
}, true )

 * Update state directly. Subscribers to changes will get
 * old and new state as parameters.
state.count = 2;

 * Listen to all state changes.
listen((newState, oldState) => {
    // Do something.

 * Listen to state change for a specific property.
listen((newState, oldState) => {
    // Do something.
}, 'count' )

 * You can unsubscribe from listening to a properties changes
 * by detaching a registered listener.

The default import of the package gives you a constructor function, which takes two arguments:

  1. An object representing your default state.
  2. Whether to use debugging mode or not.


defaultState: {}

This is the default object to use as your state.

debug: false

Turn this on to allow helpful console logging.


listen: (fn( newState, oldState), ?key)

Applies a callback for when state changes. Optionally can pass a unique key as a secondary argument to only run the callback when a property that matches the key changes.

detach: (key)

Removes a registered callback by its the key that was used to register it.

fetch: (key,

Fetches an array of registered subscribers by their keys.


  1. Polyfill IE support.
  2. Allow listening to deeper object-tree value updates.