Add Next.js example and fix bugs (#17)

Author: codeBelt

.changeset/config.json

@@ -13,10 +13,11 @@
   "baseBranch": "main",
   "updateInternalDependencies": "patch",
   "ignore": [
+    "classy-store-angular-example",
+    "classy-store-nextjs-example",
     "classy-store-react-example",
-    "classy-store-vue-example",
-    "classy-store-svelte-example",
     "classy-store-solid-example",
-    "classy-store-angular-example"
+    "classy-store-svelte-example",
+    "classy-store-vue-example"
   ]
 }

.changeset/dry-islands-wink.md

@@ -0,0 +1,6 @@
+---
+"@codebelt/classy-store": patch
+---
+
+- ensure paused state update is deferred using queueMicrotask in history utils
+- prevent arrow functions bypassing proxy traps, add error isolation for listeners

CLAUDE.md

@@ -92,6 +92,7 @@ Enforced by Biome 2.4.0 (`biome.json` at repo root):
 
 ## Key Technical Facts
 
+- **No arrow function methods:** Arrow function properties (`increment = () => {}`) have `this` lexically bound to the raw instance. `.bind()` is a no-op on arrow functions, so the GET trap cannot rebind `this` to the proxy. Mutations inside arrow functions bypass the SET trap entirely — no notifications, no reactivity. Always use prototype methods (`increment() {}`).
 - **Batching:** mutations are coalesced via `queueMicrotask`. Multiple synchronous writes (including array `push` which triggers multiple SET traps) produce a single subscriber notification.
 - **Internal state:** stored in a `WeakMap<proxy, StoreInternal>` — never on the user's object. Allows GC when a store is dereferenced.
 - **Non-proxyable types:** `Date`, `RegExp`, native `Map`, and native `Set` are treated as opaque values (internal slots can't be intercepted by Proxy). Use `reactiveMap()` and `reactiveSet()` for Map/Set semantics. Replace Date instances entirely to trigger updates.

bun.lock

@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log*
+
+# env files (can opt-in for committing if needed)
+.env*
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

examples/nextjs/.gitignore

@@ -0,0 +1,22 @@
+# @codebelt/classy-store Next.js Example
+
+This is a Next.js example project demonstrating the usage of `@codebelt/classy-store` within a monorepo setup.
+
+## Getting Started
+
+First, run the development server:
+
+```bash
+bun dev
+```
+
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+
+
+- Realtime Colors (realtimecolors.com) — great for light/dark pairs
+- Coolors (coolors.co) — shareable palette URLs
+- Tailwind Color Generator (uicolors.app)
+- Radix Colors (radix-ui.com/colors)
+- Shadcn Themes (ui.shadcn.com/themes)
+- Happy Hues (happyhues.co)
+- Color Hunt (colorhunt.co)

examples/nextjs/README.md

@@ -0,0 +1,9 @@
+import type {NextConfig} from 'next';
+
+const nextConfig: NextConfig = {
+  /* config options here */
+  reactCompiler: true,
+  transpilePackages: ['@codebelt/classy-store'],
+};
+
+export default nextConfig;

examples/nextjs/next.config.ts

@@ -0,0 +1,33 @@
+{
+  "name": "classy-store-nextjs-example",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "bun --bun next dev",
+    "build": "bun --bun next build",
+    "start": "bun --bun next start"
+  },
+  "dependencies": {
+    "@codebelt/classy-store": "workspace:*",
+    "next": "16.1.6",
+    "react": "19.2.3",
+    "react-dom": "19.2.3"
+  },
+  "devDependencies": {
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "babel-plugin-react-compiler": "1.0.0",
+    "tailwindcss": "^4",
+    "typescript": "^5"
+  },
+  "ignoreScripts": [
+    "sharp",
+    "unrs-resolver"
+  ],
+  "trustedDependencies": [
+    "sharp",
+    "unrs-resolver"
+  ]
+}

examples/nextjs/package.json

@@ -0,0 +1,7 @@
+const config = {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};
+
+export default config;