🔮 @omerdev/state-pod

Tiny reactive state store with selectors, middleware, subscriber signals, and history (<1KB).

⚡ Why state-pod?

• Microscopic Size: Under 1KB minified with zero dependencies.
• Predictable Reactivity: Atomic updates, partial state patches, and clean subscriber callbacks.
• Fine-Grained Selectors: Memoized slices that only trigger when specific selected values change.
• Automatic Batching: Consolidates multiple sequential synchronous updates into a single notification.
• Undo / Redo Plugin: Built-in time-travel history plugin (withHistory).
• Universal: Works in React, Svelte, Vue, Node.js, Bun, Vanilla TS.

📦 Installation

npm install @omerdev/state-pod
# or
pnpm add @omerdev/state-pod
# or
bun add @omerdev/state-pod

💡 Quick Start

1. Basic Store

import { createPod } from "@omerdev/state-pod";

const store = createPod({ count: 0, user: "Alice" });

// Subscribe to state updates
const unsubscribe = store.subscribe((state, prevState) => {
  console.log("State updated:", state);
});

// Update state partially
store.set({ count: 1 });

// Update with function
store.set((prev) => ({ count: prev.count + 1 }));

console.log(store.get()); // { count: 2, user: "Alice" }

2. Fine-Grained Selectors

// Only re-runs when `count` actually changes
const countSlice = store.select((s) => s.count);

countSlice.subscribe((count) => {
  console.log("Count changed:", count);
});

// This will NOT trigger countSlice subscriber!
store.set({ user: "Bob" });

3. Batching Updates

import { batch } from "@omerdev/state-pod";

// Notifies subscribers only ONCE at the end of the batch
batch(() => {
  store.set({ count: 10 });
  store.set({ user: "Charlie" });
  store.set({ count: 20 });
});

4. Time-Travel History (Undo / Redo)

import { createPod, withHistory } from "@omerdev/state-pod";

const store = createPod({ text: "Hello" });
const history = withHistory(store);

store.set({ text: "Hello World" });
store.set({ text: "Hello Antigravity" });

history.undo(); // back to "Hello World"
history.undo(); // back to "Hello"
history.redo(); // forward to "Hello World"

👤 Author

omerdev

📄 License

MIT