Ship features faster

Mark features as Work In Progress.
Ship with confidence.

A composable React component library for annotating in-development features. SSR-safe, accessible, and designed for effortless setup.

$ npm install react-wip-ui

4 server-safe components, zero deps

<Ribbon />Corner diagonal ribbon
<Badge />Inline WIP label
<Overlay />Frosted glass blur
<Block />Disable interaction

Up in 30 seconds

No configuration, no setup, just install and import the component.

1
Install the package
npm install react-wip-ui
2
Wrap any component
import { Ribbon } from 'react-wip-ui';
page.tsx
// Mark a feature as WIP in seconds
import { Ribbon } from 'react-wip-ui';
<div style={{ position: 'relative' }}>
<Ribbon text="WIP" position="top-right" />
<NewDashboard />
</div>

Everything you need, nothing you don't

SSR-Safe

Core components render on the server with no hydration mismatch or flicker.

Accessible

Escape handling, dialog semantics, focus trapping, and ARIA labels are included.

Zero Deps

No external runtime dependencies. Inline SVG icons, inline styles, nothing to install.

Zero Config

No stylesheet, no provider, no CSS import. Just import and use.

Open source | MIT License

Ready to ship with confidence?

Install react-wip-ui and start marking features in seconds.

$ npm install react-wip-ui