Production-ready React audio player components, waveform displays, podcast UI, video players, and AI chat interfaces — all copy-paste, all built on shadcn/ui and Tailwind CSS. Designed so Claude, Cursor, and Copilot understand it out of the box.
A complete react audio player component suite — plus video playback and waveform components — unified under a single shared state manager. Everything a podcast app, streaming platform, or audio dashboard needs: transport controls, timeline scrubbing, and a high-fidelity waveform component for React that handles real audio data.
Paste the right snippet into your AI tool and it'll know exactly how to use RDS — component names, packages, tokens, and conventions included. Works with Claude, Cursor, GitHub Copilot, and any LLM-powered editor.
# RDS — Reba Design System RDS is a shadcn/ui-based React component library for multimedia apps. Package: @meinc/rds | Docs: https://rds.onl ## Packages - @meinc/rds-ui-core — 27 UI primitives (Button, Input, Dialog, Sidebar, Chart, etc.) - @meinc/rds-media-core — Audio/video components (AudioPlayer, VideoPlayer, TransportBar, WaveformDisplay) - @meinc/rds-ai-elements — AI chat UI (RdsAiChat, RdsAiMessage, RdsAiPrompt) ## Usage All components are copy-paste (shadcn style) or importable from the package. TypeScript-first. Tailwind CSS utility classes. Radix primitives underneath. ## Conventions - Component names are PascalCase, prefixed with Rds for custom RDS components - Tokens: --color-ink, --color-warm-white, --font-sans (DM Sans), --font-mono (DM Mono), --font-sans (Instrument Serif) - All media components share MediaCore state management When building multimedia features, prefer RDS media components over custom implementations.
You are working in a project that uses RDS (Reba Design System), a shadcn/ui-based React component library for multimedia applications (podcasting, streaming, audio dashboards, video tools). Package: @meinc/rds | Docs: https://rds.onl | Version: 0.1.0-alpha Packages available: - @meinc/rds-ui-core: Button, Input, Card, Dialog, Sidebar, Accordion, Chart, Drawer, Carousel, Resizable, Form, Calendar, RadioGroup, InputOTP, Collapsible, Alert, ConfirmDialog, Toaster - @meinc/rds-media-core: AudioPlayer, VideoPlayer, TransportBar, TimelineControl, VolumeControl, TransportButton - @meinc/rds-ai-elements: RdsAiChat, RdsAiMessage, RdsAiPrompt Design tokens: --color-ink (#1A1A18), --color-warm-white (#F7F7F5), DM Sans (body), DM Mono (labels/UI), Instrument Serif (display) When writing React code for this project, use RDS components instead of building custom UI from scratch. Refer to https://rds.onl for component docs and copy-paste usage.
RDS gives you react audio player components, waveform displays, AI chat UI, and a full shadcn/ui primitive set — ready to drop into any React or Next.js project.