An accessible, animated switch / segmented control component for React. It behaves like a radio group, animates a highlighter between options without framer-motion, and works with primitive or object options.
npm install @omit/react-fancy-switchDocumentation: see the package README at packages/react-fancy-switch (also shown on npm).
Live demo: https://react-fancy-switch.netlify.app (deployed from website/; pull requests get a Netlify deploy preview).
| Path | Description |
|---|---|
packages/react-fancy-switch |
The published @omit/react-fancy-switch library |
website |
Demo site (Vite + React + Tailwind CSS) with end-to-end tests |
Requirements: Node.js 22.12 or newer and pnpm (the version is pinned in package.json and picked up by Corepack).
pnpm install
pnpm dev # start the demo site (builds the library first)
pnpm build # build the library and the demo site
pnpm lint # ESLint
pnpm typecheck # TypeScript
pnpm test # unit tests (Vitest)
pnpm test:e2e # end-to-end tests (Playwright, needs `pnpm exec playwright install chromium` once)
pnpm format # PrettierThis project is open source and available under the MIT License.