A state and action management library for javascript and compatible with any javascript framework or library.
Let's install the package.
npm install xtacy
let's start importing and instantiating xtacy.
import xtacy from "xtacy";
export const myNewState = new xtacy(initialState);
here we are starting our new state and exporting it, we must instance xtacy in a main file like the "App" component in react or the similar in vue, angular or any other framework, if you are using vanilla javascript you can instance xtacy in "index.js" or any other main script
myNewState.state //this property contains the current state.
myNewState.prevState //this property contains the previous state (the initial value of this property is "null").
myNewState.setState(newState) //this method sets a new value to the state.
myNewState.activateState((currentState)=>{setter(currentState)}) //this method run a function (like a useState setter)
//when setState is executed and whose argument is the current state.
myNewState.activatePrevState() //the same as "activateState" but with the previous state.
In the first step we have instantiated our state, now we go to use it.
import { myNewState } from "./App.js";
function handleClick(){
myNewState.setState(newState)
};
<button onClick={handleClick} />
//When the user clicks the button, "activateState()" will be executed wherever it is.
import { myNewState } from "./App.js";
const [state, setState] = useState(myNewState.state);
myNewState.activateState((currentState)=>{setState(currentState)});
// or just like myNewState.activatestate(setState);
function MyComponent(){
{state ? <div> is true </div> : <div> is false </div>}
};