StatePilot 🧭

StatePilot is a lightweight, type-safe, and boilerplate-free state management library for React, inspired by Redux, but with zero setup and no dependencies. It allows you to create modular state slices with scoped dispatch and selectors, making large-scale app state management clean and intuitive.

---

✨ Features

• ⚛️ React-friendly API (with hooks)
• 🔁 Redux-like reducer logic without the overhead
• 🧩 Modular, slice-based state definition
• 🧠 Type-safe actions and dispatch
• 🚀 Fast and production-ready

---

📦 Installation

1npm install @ashoklama/statepilot

🚀 Usage

1. Define your store (e.g., store.js)

1import { createAppStore } from '@ashoklama/statepilot';
2
3const counterSlice = {
4  name: 'counter',
5  initialState: { count: 0 },
6  reducers: {
7    setValue: (_, { payload }) => ({ count: payload }),
8  },
9};
10
11const store = createAppStore({
12  counter: counterSlice,
13});
14
15export const useSelector = store.useSelector;
16export const dispatch = {
17  counter: store.slices.counter.dispatch,
18};
19export const actions = {
20  counter: store.slices.counter.actions,
21};

2. In app.jsx

1import React from 'react';
2import { useSelector, actions, dispatch } from "./store";
3
4export function App(props) {
5  const count = useSelector((s) => s.counter.count);
6
7  return (
8    <div className='App'>
9      <h1>Hello React.</h1>
10      <div style={{ marginBottom: 20 }}>
11        <h2>Counter</h2>
12        <button
13          onClick={() => dispatch.counter(actions.counter.setValue(count - 1))}
14        >
15          -
16        </button>
17        <span style={{ margin: "0 10px" }}>{count}</span>
18        <button
19          onClick={() => dispatch.counter(actions.counter.setValue(count + 1))}
20        >
21          +
22        </button>
23      </div>
24    </div>
25  );
26}