4.1.6

Export the StateWithValue type (#10 thanks to @mosch!)

4.1.5

Typescript fix: #8. thanks @dan-lee!

4.1.4

Added .reset() function to go back to initialState

4.1.2

• Bugfix for #5 'useSelector' and 'useValue' and 'use', not triggering in some cases, since subscriber was not re-subscribed.
• Added test to prevent this issue in future

@iljadaderko thanks for feedback and finding this bug!

4.1.1

Bugfix were useSelector was called useSelect in some cases

4.1.0

Added useSelector hook + tests
Added optional callbacks to setState inside hooks

// if you only want to subscribe to part of your state (this example the first product)
const cartProducts = cartProductsState.useSelector((state) => state[0]);

// custom comparison function (only use this if you have heavy child components and the default === comparison is not efficient enough)
const cartProducts = cartProductsState.useSelector(
  (state) => state[0],
  (a, b) => JSON.stringify(a) === JSON.stringify(b)
);

4.0.1

Bugfix for callback setState (77c4766)

4.0.0

We made our library even smaller from 700 bytes to 500 bytes 🏋️‍♀️ ⚡️ 🏋️‍♂️..
Our api changes will also make your application smaller since you need less imports.

Breaking changes

You can remove setRidgeState, getRidgeState, useRidgeState imports in v4.

setRidgeState migration

import {setRidgeState} from 'react-ridge-state'
import {cartProductState} from '../cartProductState'
setRidgeState(cartProductState, [{product:1}])

Will be changed in

import {cartProductState} from '../cartProductState'
cartProductState.set([{product:1}])

getRidgeState migration

import {getRidgeState} from 'react-ridge-state'
import {cartProductState} from '../cartProductState'
const products = getRidgeState(cartProductState)

Will be changed in

import {cartProductState} from '../cartProductState'
const products = cartProductState.get()

useRidgeState migration

import {useRidgeState} from 'react-ridge-state'
import {cartProductState} from '../cartProductState'

function Component(){
    const [products,setProduct] = useRidgeState(cartProductState)
}

Will be changed in

import {cartProductState} from '../cartProductState'

function Component(){
    const [products,setProduct] = cartProductState.use()
}

Features

• You can use callbacks in the global set
• You can use callbacks after state has set

cartProductsState.set(
  (prevState) => [...prevState, { id: 1, name: "NiceProduct" }],
  (newState) => {
    console.log("New state is rendered everywhere");
  }
);

• You can do things after state has been set from somewhere

const authState = newRidgeState<AuthState>(
  getInitialState() || emptyAuthState,
  {
    onSet: (newState) => {
      // save to local storage
      localStorage.setItem(authStorageKey, JSON.stringify(newState))
    },
  }
)

3.1.0

• Make notifications to other components which use same state non-blocking

3.0.0

• Library internals 100% type safe (remove @ts-ignores)
• Easier API with removing the key which needed to be unique

Breaking changes

export const cartProductsState = newRidgeState<CartProduct[]>({
  key: "CartState", // needs to be unique across other global state
  defaultState,
});

To

export const cartProductsState = newRidgeState<CartProduct[]>([
  { id: 1, name: "Product" },
]);