Introduction
react-rsc-kit is a typed React utility package built around explicit server and client entrypoints, small control-flow primitives, and browser hooks that stay easy to reason about in modern App Router codebases.
Installation
Install the package, then import from the path that matches your runtime. The package exports table below is the main contract to follow.
npm install react-rsc-kitHooks
14
UI primitives
3
Entry points
4
React support
18+
Package exports
Use the narrowest entrypoint you can so bundlers and React runtime boundaries only pull in what the current module actually needs.
| Import path | Purpose |
|---|---|
react-rsc-kit | Default entry - shared utilities and control-flow primitives. |
react-rsc-kit/server | Server-safe entry for RSC-friendly imports. |
react-rsc-kit/client | Client entry for hooks and browser-only helpers. |
react-rsc-kit/hooks | Hooks-only barrel when you want a narrower client import. |
What this package optimizes for
The package is designed to feel reliable in production codebases: small API surface, explicit import rules, and primitives that fit naturally into React 18+ applications.
Runtime-aware imports
Server-safe exports stay separate from browser-only hooks so App Router projects can keep import boundaries explicit.
Typed public surface
The package ships typed exports, practical docs, and examples that map directly to the published API consumers install.
Focused utility layer
react-rsc-kit is intentionally small: reusable hooks plus a few control-flow primitives, not a full component system.
Runtime rules
These are the import boundaries to keep in mind when using the package in server-rendered and client-rendered React applications.
Use the root package for shared primitives
Import runtime-safe helpers and control-flow components from `react-rsc-kit` when they do not depend on browser APIs.
Use `/client` for hooks and browser APIs
Clipboard, storage, intersection observers, effects, and navigator-based helpers belong in a client component boundary.
Prefer the narrowest entrypoint
Use `/server`, `/client`, or `/hooks` when they describe your runtime more precisely than the default package import.