sparx

Very minimal state management lib based on react hooks.

Guide

store.js

create a store and a hook by using sparx

// make a store , there could be multi store in on app or just on, your choice
import createSparkHooks from "sparx";
const {useSpark, sparkle, useSubscribeStoreChange_UNSTABLE, useStore} = createSparkHooks();
export { useSpark, sparkle };

state.js

create a state.js where your sparks live, component can import sparks from this module

// import the sparkle method from the store
import {sparkle} from 'store.js'

// use sparkle to make a spark
export const data_1 = sparkle({
  key: 'string key',
  value: {} // any data
})

component_1.js

create a component which consume the spark by using the useSpark hook which from the store

import {useSpark} from 'store.js'
import {data_1} from 'state.js'

const Comp1 = () => {
  // by call the useSpark hook, you can get the data from the spark, and a updater to update the spark
  // the same as useState
  const [data1, setData1] = useSpark(data_1);
  // ....
  // your render logic
}

component_2.js

create a component comsume the same spark as the previous compoent, notice that, each of these two component updating the data by calling setData1 will trigger both component update/rerender

// 
import {useSpark} from 'store.js'
import {data_1} from 'state.js'

const Comp1 = () => {
  const [data1, setData1] = useSpark(data_1);
  // ....
  // your render logic
}

todo

[] complete senarios [] support aync spark [] data serialize, unserilaize [] store initial state [] dynamic spark helper [] memorize [*] documentation