🌐 Live Demo with Code: https://r18gs.vercel.app/
Important Note:
There are no breaking changes when upgrading from version 2.0.* to version 3.*. However, we released a major version because version 2.1.0 introduced new APIs. To improve those APIs, we made some breaking changes, which will only affect you if you are using the new features introduced in version 2.1.0.
While developing libraries utilizing React 18 features with Zustand, I encountered issues with tree-shaking when importing from specific folders. This caused the creation of multiple Zustand stores, resulting in bugs and unnecessary JavaScript code execution.
To address this, I created a lightweight, minimalistic store designed for shared states that optimizes tree-shaking and supports component imports from separate files.
✅ Full TypeScript Support
✅ Unlock the Full Power of React18 Server Components
✅ Compatible with All React18 Build Systems and Frameworks
✅ Comprehensive Documentation with Typedoc
✅ Examples for Next.js, Vite, and Remix
✅ Seamlessly Works with Selectors
Use the useRGS hook just like useState, but with a unique key to make the state accessible across components.
const [state, setState] = useRGS<number>("counter", 1);Or initialize using a function:
const [state, setState] = useRGS<number>("counter", () => 1);🔗 Getting Started: Guide
🚀 Now Supports Selectors for Complex Stores
Explore more at https://r18gs.vercel.app/.
Extend the store's functionality with the create function, withPlugins function, or the useRGSWithPlugins hook. Features like persistence to local storage can be easily integrated.
// store.ts
import { create } from "r18gs/dist/with-plugins";
import { persist } from "r18gs/dist/plugins"; // Use third-party or custom plugins
export const useMyPersistentCounterStore = create<number>("persistent-counter", 0, [persist()]);Use it just like useState without needing an initial value:
const [persistedCount, setPersistedCount] = useMyPersistentCounterStore();🔗 Learn More: Leveraging Plugins
Contributions are welcome! See contributing.md.
🌟 Don't Forget to Star this repository!
This library is licensed under the MPL-2.0 open-source license.
Support our work by sponsoring or enrolling in our courses.
Made with 💖 by Mayank Kumar Chaudhari