@akash_deep_chitransh/react-mini-state v1.0.3

🔌 react-mini-state

A lightweight and optimized state management library for React, built with simplicity and performance in mind. Supports selectors to prevent unnecessary re-renders and works seamlessly with TypeScript.

🚀 Installation

npm install @akash_deep_chitransh/react-mini-state
# or
yarn add @akash_deep_chitransh/react-mini-state

🧠 Core APIs

This library exposes only two main APIs:

1. createStore(initialState)

Creates the global store.

import { createStore } from "react-mini-state";

const store = createStore({ count: 0 });

2. createUseStore(store)

Returns a custom hook (useStore) that subscribes to the store.

import { createUseStore } from "react-mini-state";

const useStore = createUseStore(store);

⚙️ Usage

✅ Example: Counter

import React from "react";
import { createStore, createUseStore } from "react-mini-state";

const store = createStore({ count: 0 });
const useStore = createUseStore(store);

const increment = () =>
  store.setState((prev) => ({ ...prev, count: prev.count + 1 }));

const Counter = () => {
  const count = useStore((state) => state.count);

  return (
    <div>
      <p>{count}</p>
      <button onClick={increment}>Increment</button>
    </div>
  );
};

🎯 Features

• ✅ Only two APIs — Easy to learn and use
• ⚡ Optimized with selector — Components only re-render when the selected state changes
• 🔄 Store mutation via setState
• 💙 TypeScript support out of the box
• 🎣 Built using React’s useSyncExternalStore

📦 TypeScript Support

You can define your store state type and enjoy full type inference:

type StoreState = { count: number };
const store = createStore<StoreState>({ count: 0 });

const useStore = createUseStore(store);

🤝 Contributing

If you'd like to contribute, feel free to fork the repo and open a pull request.

📄 License

MIT