Introduction

preact-store is a small lightweight library which provides global state management for preact using hooks. There are three different types of states available:

1. Simple - Any type of value which can only be set/get, no additional logic is applied to value.
2. Composite - A state value (must be an object) which merges the state together.
3. Reduced - A state value which is produced by executing a reducer.

See the sections below additional details on the types, including a description of type typing for typescript.

Simple State

import { useSimpleState } from "preact-store";

const [count, setCount] = useSimpleState("MyCounter", 0);

Reduced State

import {useReducedState } from "preact-store";

const [state, dispatch] = useReducedState("MyState", MyReducer, {});

Composite State

import { useCompositeState } from "preact-store";

const [state, setState] = useCompsiteState("MyState", { loading: true });

Store

The store component provides the context for the rest of the hooks. Whenever a hook is used there must be a store in tree above.

Note: The first store which is declaired, installs "window.PreactState" which will allow you to browse you rcurrent state.

import { Store } from "preact-store";

reader(<Store><App/></Store>, document.body);