Components
Explore all 313 components available in the library.
Core
Avatar
Displays a user avatar image with fallback initials. Install Avatar from the VLLNT UI registry with the shadcn CLI.
1 storyBadge
Small status label with variant styles. Install Badge from the VLLNT UI registry with the shadcn CLI.
4 storiesBanner
Full-width announcement bar with variants, dismissal, and an optional action slot. Install Banner from the VLLNT UI registry with the shadcn CLI.
6 storiesButton
Accessible React button with variants, sizes, and full keyboard support — install from the VLLNT UI registry with the shadcn CLI.
9 storiesCheckbox
Toggle control for boolean input. Install Checkbox from the VLLNT UI registry with the shadcn CLI.
1 storyCookie Consent
Dismissible cookie-consent banner with positional variants and accept / reject actions for privacy compliance. Install Cookie Consent from the VLLNT UI registry with the shadcn CLI.
1 storyCopy Button
Click-to-copy utility with confirmation feedback and a useCopyToClipboard hook. Install Copy Button from the VLLNT UI registry with the shadcn CLI.
4 storiesDisplay
Oversized hero/display text driven by the display tokens, with an optional reduced-motion-safe reveal. Install Display from the VLLNT UI registry with the shadcn CLI.
3 storiesEmpty State
Centered placeholder for empty lists, tables, and search results with sm/md/lg sizes. Install Empty State from the VLLNT UI registry with the shadcn CLI.
4 storiesGrid
Responsive CSS grid layout primitive with breakpoint column and gap props. Install Grid from the VLLNT UI registry with the shadcn CLI.
2 storiesHeading
Semantic heading (h1–h6) with theme-overridable font-family, weight, and size design tokens. Install Heading from the VLLNT UI registry with the shadcn CLI.
3 storiesInput
Text input field for forms. Install Input from the VLLNT UI registry with the shadcn CLI.
1 storyKbd
Keyboard key indicator with platform-aware modifier expansion via the shortcut prop. Install Kbd from the VLLNT UI registry with the shadcn CLI.
6 storiesLabel
Accessible form label that associates descriptive text with an input control. Install Label from the VLLNT UI registry with the shadcn CLI.
1 storyLink
Styled anchor with emphasis variants and an external-link affordance. Install Link from the VLLNT UI registry with the shadcn CLI.
4 storiesMeter
Static measurement bar (role=meter) for a known range, with optional segments. Install Meter from the VLLNT UI registry with the shadcn CLI.
3 storiesPanel
Bordered, titled content surface with header, body, and footer slots. Install Panel from the VLLNT UI registry with the shadcn CLI.
2 storiesProse
Long-form content wrapper that styles raw HTML descendants with the token-driven type scale. Install Prose from the VLLNT UI registry with the shadcn CLI.
1 storyQR Code
Renders a QR code from a string value as a theme-aware SVG. Install QR Code from the VLLNT UI registry with the shadcn CLI.
3 storiesRadio Group
Group of radio buttons for single-selection input. Install Radio Group from the VLLNT UI registry with the shadcn CLI.
1 storySeparator
Visual divider between content sections. Install Separator from the VLLNT UI registry with the shadcn CLI.
1 storySkeleton
Placeholder loading animation for content. Install Skeleton from the VLLNT UI registry with the shadcn CLI.
1 storySlider
Range slider input for selecting numeric values. Install Slider from the VLLNT UI registry with the shadcn CLI.
1 storySwitch
Toggle switch control for binary on/off state. Install Switch from the VLLNT UI registry with the shadcn CLI.
1 storyText
Body-text primitive with token-driven sans family and a size/tone/weight scale; polymorphic via `as`. Install Text from the VLLNT UI registry with the shadcn CLI.
2 storiesTextarea
Multi-line text input field. Install Textarea from the VLLNT UI registry with the shadcn CLI.
1 storyToggle
Two-state toggle button. Install Toggle from the VLLNT UI registry with the shadcn CLI.
4 storiesToggle Group
Group of toggle buttons for single or multiple selection. Install Toggle Group from the VLLNT UI registry with the shadcn CLI.
1 storyToolbar
Horizontal control group (role=toolbar) with arrow-key roving focus and separators. Install Toolbar from the VLLNT UI registry with the shadcn CLI.
2 storiesTypography
Semantic text primitives: headings, paragraph, lead, muted, blockquote, inline code, and list. Install Typography from the VLLNT UI registry with the shadcn CLI.
4 storiesForm
Button Group
Visually connected group of buttons that share borders. Install Button Group from the VLLNT UI registry with the shadcn CLI.
2 storiesCalendar
Date picker calendar for selecting dates. Install Calendar from the VLLNT UI registry with the shadcn CLI.
1 storyCategory Filter
Filterable category selection for content lists. Install Category Filter from the VLLNT UI registry with the shadcn CLI.
1 storyCheckbox Group
Group of related checkboxes backed by an array of selected values. Install Checkbox Group from the VLLNT UI registry with the shadcn CLI.
3 storiesColor Picker
Popover color picker with swatches, a hue slider, and a hex input. Install Color Picker from the VLLNT UI registry with the shadcn CLI.
2 storiesCombobox
Searchable select input for choosing from a list of options. Install Combobox from the VLLNT UI registry with the shadcn CLI.
2 storiesDate Field
Native date input styled to match the design system. Install Date Field from the VLLNT UI registry with the shadcn CLI.
2 storiesDate Picker
Single-date picker built with the shared calendar and popover primitives. Install Date Picker from the VLLNT UI registry with the shadcn CLI.
2 storiesDate Range Picker
Popover calendar for selecting a start and end date. Install Date Range Picker from the VLLNT UI registry with the shadcn CLI.
2 storiesField
Layout wrapper pairing a label, control, description, and error message. Install Field from the VLLNT UI registry with the shadcn CLI.
3 storiesFieldset
Groups related fields under a shared legend. Install Fieldset from the VLLNT UI registry with the shadcn CLI.
2 storiesFile Upload
Dropzone-style file picker with previews for selected files. Install File Upload from the VLLNT UI registry with the shadcn CLI.
1 storyFilter Bar
Horizontal bar with filter controls for content lists. Install Filter Bar from the VLLNT UI registry with the shadcn CLI.
1 storyForm
Validation wrapper for composing labels, descriptions, controls, and messages. Install Form from the VLLNT UI registry with the shadcn CLI.
2 storiesInline Input
Inline text input with keyboard commit and cancel support. Install Inline Input from the VLLNT UI registry with the shadcn CLI.
1 storyInput Group
Groups an input with leading or trailing addons. Install Input Group from the VLLNT UI registry with the shadcn CLI.
3 storiesInput OTP
One-time password input with segmented fields. Install Input OTP from the VLLNT UI registry with the shadcn CLI.
1 storyItem
Flexible row layout with leading media, content, and trailing actions. Install Item from the VLLNT UI registry with the shadcn CLI.
2 storiesList Box
Accessible single- or multi-select list of options. Install List Box from the VLLNT UI registry with the shadcn CLI.
2 storiesMulti Select
Popover-based multi-selection input with selected-value badges and optional search. Install Multi Select from the VLLNT UI registry with the shadcn CLI.
3 storiesNative Select
Styled wrapper around the native select element. Install Native Select from the VLLNT UI registry with the shadcn CLI.
2 storiesNewsletter Signup
Email-capture form with idle/sending/sent/error state machine, custom validators, and overridable labels. Install Newsletter Signup from the VLLNT UI registry with the shadcn CLI.
5 storiesNumber Input
Numeric input with increment and decrement controls. Install Number Input from the VLLNT UI registry with the shadcn CLI.
1 storyPassword Input
Password field with a built-in visibility toggle. Install Password Input from the VLLNT UI registry with the shadcn CLI.
1 storyPhone Input
Phone number input with a country dialing-code selector. Install Phone Input from the VLLNT UI registry with the shadcn CLI.
2 storiesRange Calendar
Calendar that selects a start and end date as a range. Install Range Calendar from the VLLNT UI registry with the shadcn CLI.
3 storiesScope Selector
Multi-level scope picker for nested environments, teams, and targets. Install Scope Selector from the VLLNT UI registry with the shadcn CLI.
2 storiesSearch Bar
Text search input with icon and clear functionality. Install Search Bar from the VLLNT UI registry with the shadcn CLI.
1 storySearch Field
Search input with a leading icon and a clear button. Install Search Field from the VLLNT UI registry with the shadcn CLI.
2 storiesSegmented Control
Single-choice segmented selector for switching modes, views, or filters. Install Segmented Control from the VLLNT UI registry with the shadcn CLI.
3 storiesSelect
Dropdown select input for choosing from a list of options. Install Select from the VLLNT UI registry with the shadcn CLI.
1 storyTag Group
Set of tags supporting selection and removal. Install Tag Group from the VLLNT UI registry with the shadcn CLI.
2 storiesTags Input
Keyboard-friendly tag editor for adding and removing string values. Install Tags Input from the VLLNT UI registry with the shadcn CLI.
3 storiesText Field
Labelled text input bundling description and error message. Install Text Field from the VLLNT UI registry with the shadcn CLI.
3 storiesTime Field
Native time input styled to match the design system. Install Time Field from the VLLNT UI registry with the shadcn CLI.
2 storiesTime Picker
Popover time selector built from hour and minute columns. Install Time Picker from the VLLNT UI registry with the shadcn CLI.
2 storiesTimeline Scrubber
Range slider for scrubbing through canvas state playback, with optional milestone ticks. Install Timeline Scrubber from the VLLNT UI registry with the shadcn CLI.
4 storiesOverlay
Alert Dialog
Modal dialog for confirming destructive or important actions. Install Alert Dialog from the VLLNT UI registry with the shadcn CLI.
1 storyAnimated Tooltip
Tooltip that animates in on hover or focus with a scale-and-fade. Install Animated Tooltip from the VLLNT UI registry with the shadcn CLI.
2 storiesCommand
Command palette with search, groups, and keyboard navigation. Install Command from the VLLNT UI registry with the shadcn CLI.
1 storyContext Menu
Right-click context menu with items and submenus. Install Context Menu from the VLLNT UI registry with the shadcn CLI.
1 storyDialog
Modal dialog overlay for focused content and actions. Install Dialog from the VLLNT UI registry with the shadcn CLI.
1 storyDrawer
Slide-out panel anchored to the screen edge. Install Drawer from the VLLNT UI registry with the shadcn CLI.
1 storyDropdown Menu
Accessible dropdown menu with items, checkboxes, radio groups, and submenus. Install Dropdown Menu from the VLLNT UI registry with the shadcn CLI.
1 storyEdge Label
Inline edge label for relationship semantics such as streams, handoffs, or policies. Install Edge Label from the VLLNT UI registry with the shadcn CLI.
1 storyHover Card
Card that appears on hover for previewing content. Install Hover Card from the VLLNT UI registry with the shadcn CLI.
1 storyPopover
Floating content panel anchored to a trigger element. Install Popover from the VLLNT UI registry with the shadcn CLI.
1 storyShare Dialog
Modal dialog for sharing a page across social platforms with a copy-link action and overridable labels. Install Share Dialog from the VLLNT UI registry with the shadcn CLI.
1 storySheet
Slide-over panel from the edge of the screen. Install Sheet from the VLLNT UI registry with the shadcn CLI.
3 storiesToast
Temporary notification messages with action support. Install Toast from the VLLNT UI registry with the shadcn CLI.
3 storiesTooltip
Informational popup displayed on hover or focus. Install Tooltip from the VLLNT UI registry with the shadcn CLI.
1 storyZoom HUD
Zoom controls with current percentage, increment buttons, and reset action for canvas views. Install Zoom HUD from the VLLNT UI registry with the shadcn CLI.
1 storyNavigation
Animated Tabs
Tabs with a sliding indicator that animates to the active item. Install Animated Tabs from the VLLNT UI registry with the shadcn CLI.
2 storiesBottom Bar
Slim chrome strip pinned to the bottom of a canvas shell as a calm host for activity strips, status pills, and ambient indicators. Install Bottom Bar from the VLLNT UI registry with the shadcn CLI.
1 storyBreadcrumb
Navigation breadcrumb trail showing the current page hierarchy. Install Breadcrumb from the VLLNT UI registry with the shadcn CLI.
1 storyDock
macOS-style dock whose icons magnify near the pointer. Install Dock from the VLLNT UI registry with the shadcn CLI.
1 storyFloating Navbar
Floating navigation bar that hides on scroll down and reveals on scroll up. Install Floating Navbar from the VLLNT UI registry with the shadcn CLI.
1 storyHorizontal Scroll Row
Horizontal scroll container with snap scrolling, chevron navigation, and hidden scrollbar. Install Horizontal Scroll Row from the VLLNT UI registry with the shadcn CLI.
2 storiesJarvis Dock
Floating bottom dock with quick-action buttons + a command-palette trigger. Install Jarvis Dock from the VLLNT UI registry with the shadcn CLI.
4 storiesLeft Rail
Compact vertical rail for canvas modes, tool actions, and secondary navigation controls. Install Left Rail from the VLLNT UI registry with the shadcn CLI.
1 storyMenubar
Horizontal menu bar with dropdown menus. Install Menubar from the VLLNT UI registry with the shadcn CLI.
1 storyNavbar SaaS
SaaS-style navigation bar with branding and links. Install Navbar SaaS from the VLLNT UI registry with the shadcn CLI.
1 storyNavigation Menu
Accessible navigation menu with links and sub-navigation. Install Navigation Menu from the VLLNT UI registry with the shadcn CLI.
1 storyPagination
Page navigation controls with previous, next, and page links. Install Pagination from the VLLNT UI registry with the shadcn CLI.
1 storyRight Dock
Context dock for inspectors, summaries, and secondary canvas panels. Install Right Dock from the VLLNT UI registry with the shadcn CLI.
1 storySidebar
Collapsible sidebar navigation layout. Install Sidebar from the VLLNT UI registry with the shadcn CLI.
1 storySidebar Provider
Context provider for managing sidebar open/close state. Install Sidebar Provider from the VLLNT UI registry with the shadcn CLI.
1 storySidebar Toggle
Responsive toggle button for opening and closing the sidebar. Install Sidebar Toggle from the VLLNT UI registry with the shadcn CLI.
1 storyStep Navigation
Navigation controls for stepping through multi-page content. Install Step Navigation from the VLLNT UI registry with the shadcn CLI.
1 storyTabs
Tabbed content panels with keyboard-accessible tab triggers. Install Tabs from the VLLNT UI registry with the shadcn CLI.
1 storyTop Bar
Workspace header bar for titles, leading controls, centered navigation, and trailing actions. Install Top Bar from the VLLNT UI registry with the shadcn CLI.
1 storyView Switcher
URL param-based toggle between named views with pill/tab styling. Install View Switcher from the VLLNT UI registry with the shadcn CLI.
1 storyViewport Bookmarks
Saved-view list for the canvas — pinned spatial locations with optional active state. Install Viewport Bookmarks from the VLLNT UI registry with the shadcn CLI.
4 storiesWorkspace Switcher
Segmented workspace picker for switching between canvas views and operational contexts. Install Workspace Switcher from the VLLNT UI registry with the shadcn CLI.
1 storyWorld Breadcrumbs
Spatial trail showing the canvas's current location in a hierarchy of worlds, groups, and runs. Install World Breadcrumbs from the VLLNT UI registry with the shadcn CLI.
4 storiesData
Activity Heatmap
Contribution-style grid for visualizing operational activity over time. Install Activity Heatmap from the VLLNT UI registry with the shadcn CLI.
3 storiesActivity Log
Paginated activity feed for audit history and analytics changes. Install Activity Log from the VLLNT UI registry with the shadcn CLI.
2 storiesAlert
Displays an alert message to the user. Install Alert from the VLLNT UI registry with the shadcn CLI.
2 storiesArea Chart
Renders an area chart for data visualization. Install Area Chart from the VLLNT UI registry with the shadcn CLI.
Avatar Group
Overlapping avatar stack for participants, assignees, and collaborative contexts. Install Avatar Group from the VLLNT UI registry with the shadcn CLI.
2 storiesBar Chart
Renders a bar chart for data visualization. Install Bar Chart from the VLLNT UI registry with the shadcn CLI.
Bottom Activity Strip
Slim horizontally-scrolling row of recent canvas events for low-noise live activity. Install Bottom Activity Strip from the VLLNT UI registry with the shadcn CLI.
4 storiesCandlestick Chart
OHLC financial chart for session-by-session price action. Install Candlestick Chart from the VLLNT UI registry with the shadcn CLI.
3 storiesComparison
Side-by-side comparison layout for content or features. Install Comparison from the VLLNT UI registry with the shadcn CLI.
2 storiesContribution Graph
GitHub-style heatmap of daily activity over time. Install Contribution Graph from the VLLNT UI registry with the shadcn CLI.
2 storiesCountdown Timer
Countdown and SLA timer for deadlines, escalations, and response windows. Install Countdown Timer from the VLLNT UI registry with the shadcn CLI.
2 storiesData List
Semantic key-value metadata layout for displaying labels with values. Install Data List from the VLLNT UI registry with the shadcn CLI.
2 storiesData Table
Enhanced data table with sorting, filtering, selection, and pagination controls. Install Data Table from the VLLNT UI registry with the shadcn CLI.
1 storyFlow Diagram
Interactive flow diagram with nodes, edges, and controls. Install Flow Diagram from the VLLNT UI registry with the shadcn CLI.
1 storyGantt Chart
Project timeline with task bars, progress overlays, milestones, and a today indicator across day/week/month/quarter scales. Install Gantt Chart from the VLLNT UI registry with the shadcn CLI.
4 storiesGauge Chart
Semicircular gauge for a single value within a range. Install Gauge Chart from the VLLNT UI registry with the shadcn CLI.
3 storiesHeat Overlay
Heatmap-style overlay drawing soft radial blobs for canvas activity samples. Install Heat Overlay from the VLLNT UI registry with the shadcn CLI.
4 storiesLine Chart
Renders a line chart for data visualization. Install Line Chart from the VLLNT UI registry with the shadcn CLI.
Live Feed
Rolling activity stream for surfacing incidents, deploys, and operational signals in real time. Install Live Feed from the VLLNT UI registry with the shadcn CLI.
2 storiesMarket Treemap
Sector-style market heatmap using weighted tiles and signed performance colors. Install Market Treemap from the VLLNT UI registry with the shadcn CLI.
2 storiesMetric Cluster
Compact stack of related metrics pinned to a canvas object's corner. Install Metric Cluster from the VLLNT UI registry with the shadcn CLI.
4 storiesMetric Gauge
Real-time arc and dial display for monitored percentages and utilization. Install Metric Gauge from the VLLNT UI registry with the shadcn CLI.
2 storiesMini Map Panel
Viewport overview panel showing canvas bounds, markers, and the current zoom window. Install Mini Map Panel from the VLLNT UI registry with the shadcn CLI.
1 storyOrder Book
Level II bid/ask depth ladder with cumulative size bars and spread readout. Install Order Book from the VLLNT UI registry with the shadcn CLI.
3 storiesOverview Board
Grid of overview cards for at-a-glance dashboards — a row of headline metrics with consistent spacing and tone. Install Overview Board from the VLLNT UI registry with the shadcn CLI.
1 storyPie Chart
Proportional pie or donut chart for part-to-whole comparisons. Install Pie Chart from the VLLNT UI registry with the shadcn CLI.
3 storiesPresence Stack
Overlapping live-presence avatars with status dots and a sane overflow chip. Install Presence Stack from the VLLNT UI registry with the shadcn CLI.
4 storiesPresence Sync Indicator
Compact pill that surfaces live connection + sync health for a collaborative canvas. Install Presence Sync Indicator from the VLLNT UI registry with the shadcn CLI.
4 storiesProgress Bar
Visual progress indicator with labels and completion state. Install Progress Bar from the VLLNT UI registry with the shadcn CLI.
1 storyProgress Card
Card displaying progress metrics and status. Install Progress Card from the VLLNT UI registry with the shadcn CLI.
1 storyRadar Chart
Spider chart comparing several metrics on shared axes. Install Radar Chart from the VLLNT UI registry with the shadcn CLI.
2 storiesRun Timeline
Multi-lane execution timeline showing run phases over time, with optional cursor. Install Run Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesSankey Chart
Flow diagram showing weighted links between nodes. Install Sankey Chart from the VLLNT UI registry with the shadcn CLI.
1 storySeverity Badge
Operational severity label with tone variants and optional pulse for critical incidents. Install Severity Badge from the VLLNT UI registry with the shadcn CLI.
5 storiesSparkline Grid
KPI grid of labeled value tiles each paired with a compact sparkline trend. Install Sparkline Grid from the VLLNT UI registry with the shadcn CLI.
2 storiesStat Card
Headline KPI card for metrics, trends, and supporting context. Install Stat Card from the VLLNT UI registry with the shadcn CLI.
2 storiesStatus Board
Service health grid for surfacing infrastructure state, queue pressure, and incidents. Install Status Board from the VLLNT UI registry with the shadcn CLI.
3 storiesStatus Indicator
Compact status label with tone, variant, and activity dot options. Install Status Indicator from the VLLNT UI registry with the shadcn CLI.
2 storiesSticky Metric
Pinned metric pill that sticks to a canvas object's corner. Install Sticky Metric from the VLLNT UI registry with the shadcn CLI.
4 storiesTable
Styled data table with header, body, and footer sections. Install Table from the VLLNT UI registry with the shadcn CLI.
1 storyThreshold Ring
Compact ring gauge expressing how close a value is to a threshold. Install Threshold Ring from the VLLNT UI registry with the shadcn CLI.
4 storiesTicker Tape
Marquee-style scrolling symbol tape with price and change badges. Install Ticker Tape from the VLLNT UI registry with the shadcn CLI.
2 storiesUsage Breakdown
Ranked resource consumption list with relative share and trend cues. Install Usage Breakdown from the VLLNT UI registry with the shadcn CLI.
3 storiesWatchlist
Tracked-symbol list with price, change, and advancing/declining summary. Install Watchlist from the VLLNT UI registry with the shadcn CLI.
3 storiesWorld Clock Bar
Multi-timezone display for follow-the-sun teams and operational handoffs. Install World Clock Bar from the VLLNT UI registry with the shadcn CLI.
3 storiesData Display
Animated Beam
Animated gradient beam that connects two elements with a flowing light path. Install Animated Beam from the VLLNT UI registry with the shadcn CLI.
1 storyChoropleth Map
Standalone SVG choropleth — region polygons shaded by data value with tooltip, legend, and accessible data-table fallback. Install Choropleth Map from the VLLNT UI registry with the shadcn CLI.
4 storiesChronological Timeline
Media-rich, scroll-driven chronological timeline with alternating cards, image/video/audio media, and a progress strip. Install Chronological Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesFloating Toolbar
Compact action bar that floats above a selection — primary / ghost / destructive variants. Install Floating Toolbar from the VLLNT UI registry with the shadcn CLI.
3 storiesFollow Mode
Follow-mode chrome — outlines a region with a participant's color and surfaces a stop-following chip. Install Follow Mode from the VLLNT UI registry with the shadcn CLI.
3 storiesGeography Quiz Map
Interactive identify-mode map quiz — click the correct region per prompt with visual feedback, score, and results panel. Install Geography Quiz Map from the VLLNT UI registry with the shadcn CLI.
3 storiesGlass Progress
Glass-styled progress bar with a translucent track and token-colored fill. Install Glass Progress from the VLLNT UI registry with the shadcn CLI.
2 storiesGlobe 3D
Standalone SVG pseudo-3D globe — orthographic projection with auto-rotation, drag interaction, lat/lng markers, and great-circle arcs. Install Globe 3D from the VLLNT UI registry with the shadcn CLI.
3 storiesHandoff Beacon
Attention-routing beacon with pulsing ring and optional source / message card for live canvases. Install Handoff Beacon from the VLLNT UI registry with the shadcn CLI.
4 storiesHeat Map Overlay
Standalone SVG geographic heat map — radial-gradient blobs with configurable radius, blur, gradient, and opacity. Install Heat Map Overlay from the VLLNT UI registry with the shadcn CLI.
5 storiesHistoric Timeline
Specialized timeline for historical events spanning centuries or millennia, with era bands, period bars, and BCE/CE point markers. Install Historic Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesInteractive Timeline
Zoomable, pannable, multi-track timeline with category filter, today marker, and click-to-select events. Install Interactive Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesMap 2D
Lightweight 2D map primitive — SVG canvas with equirectangular projection, markers, popups, GeoJSON polygon layers, zoom controls, and an optional backdrop image. Install Map 2D from the VLLNT UI registry with the shadcn CLI.
4 storiesMap Timeline
Standalone SVG map + time slider — era polygons and year-pinned events appear as the user scrubs the timeline. Install Map Timeline from the VLLNT UI registry with the shadcn CLI.
3 storiesPrimary Source Viewer
Document viewer for historical primary sources with zoom, rotate, region annotations, transcription panel, and metadata footer. Install Primary Source Viewer from the VLLNT UI registry with the shadcn CLI.
3 storiesRoute Map
Standalone SVG map with animated route paths, waypoints, and progress indicator. For trade routes, voyages, migrations, delivery tracking. Install Route Map from the VLLNT UI registry with the shadcn CLI.
5 storiesScroll Progress
Fixed bar that tracks reading progress down the page. Install Scroll Progress from the VLLNT UI registry with the shadcn CLI.
1 storySelection Halo
Local-user selection halo with corner handles + label slot for spatial canvases. Install Selection Halo from the VLLNT UI registry with the shadcn CLI.
3 storiesSnap Guides
Alignment guide overlay — dashed vertical and horizontal lines that surface during a drag. Install Snap Guides from the VLLNT UI registry with the shadcn CLI.
3 storiesStory Map
Standalone SVG scroll-driven narrative map — IntersectionObserver tracks the active chapter and the map shifts to its center + zoom. Install Story Map from the VLLNT UI registry with the shadcn CLI.
3 storiesTree View
Hierarchical tree component for nested data with controlled state, single/multi-select, and keyboard navigation. Install Tree View from the VLLNT UI registry with the shadcn CLI.
4 storiesContent
Accordion
Collapsible content sections supporting single or multiple open items. Install Accordion from the VLLNT UI registry with the shadcn CLI.
1 storyAnimated List
List whose items animate in sequentially with a staggered entrance. Install Animated List from the VLLNT UI registry with the shadcn CLI.
1 storyAnimated Testimonials
Testimonial carousel with animated transitions between quotes. Install Animated Testimonials from the VLLNT UI registry with the shadcn CLI.
2 storiesBento Grid
Responsive bento-style grid layout with feature cards. Install Bento Grid from the VLLNT UI registry with the shadcn CLI.
1 storyBlog Card
Card layout for displaying blog post previews. Install Blog Card from the VLLNT UI registry with the shadcn CLI.
1 storyBlur Reveal
Reveals content with a blur-to-sharp transition when it scrolls into view. Install Blur Reveal from the VLLNT UI registry with the shadcn CLI.
2 storiesCallout
Highlighted content block with variant styles for info, warning, danger, and more. Install Callout from the VLLNT UI registry with the shadcn CLI.
1 storyCard
Container with header, content, and footer sections. Install Card from the VLLNT UI registry with the shadcn CLI.
1 storyCarousel
Scrollable content carousel with navigation controls. Install Carousel from the VLLNT UI registry with the shadcn CLI.
1 storyCode Block
Syntax-highlighted code display with copy support. Install Code Block from the VLLNT UI registry with the shadcn CLI.
1 storyCode Playground
Interactive code editor with live preview. Install Code Playground from the VLLNT UI registry with the shadcn CLI.
2 storiesCollapsible
Expandable and collapsible content section. Install Collapsible from the VLLNT UI registry with the shadcn CLI.
1 storyContent Intro
Introductory section for content pages with title and description. Install Content Intro from the VLLNT UI registry with the shadcn CLI.
2 storiesCredit Badge
Balance status pill for credits, wallet states, and billing health. Install Credit Badge from the VLLNT UI registry with the shadcn CLI.
2 storiesDocument Sibling Nav
Newer/older navigator: links to the previous and next item in an ordered series. Install Document Sibling Nav from the VLLNT UI registry with the shadcn CLI.
6 storiesExpandable Cards
Cards that expand on click to reveal additional content. Install Expandable Cards from the VLLNT UI registry with the shadcn CLI.
1 storyFAQ
Frequently asked questions section with expandable answers. Install FAQ from the VLLNT UI registry with the shadcn CLI.
2 storiesMDX Content
Renders MDX content with component mapping. Install MDX Content from the VLLNT UI registry with the shadcn CLI.
1 storyObject Card
Durable object view for agents, runs, artifacts, and tasks inside the canvas. Install Object Card from the VLLNT UI registry with the shadcn CLI.
1 storyObject Inspector
Right-dock detail header — kind chip, status dot, title/subtitle, with property-section slots. Install Object Inspector from the VLLNT UI registry with the shadcn CLI.
4 storiesPlan Badge
Subscription tier indicator for pricing, billing, and account summaries. Install Plan Badge from the VLLNT UI registry with the shadcn CLI.
3 storiesPolicy Delivery Panel
Right-dock panel listing policies / guardrails active for the route or run. Install Policy Delivery Panel from the VLLNT UI registry with the shadcn CLI.
4 storiesProperty Section
Compact key/value grid for inspector panels — labels, sublabels, optional collapse. Install Property Section from the VLLNT UI registry with the shadcn CLI.
4 storiesRelationship Inspector
Right-dock panel listing inbound + outbound edges of the focused canvas object. Install Relationship Inspector from the VLLNT UI registry with the shadcn CLI.
4 storiesReveal Text
Reveals text with a directional slide-and-fade when it enters the viewport. Install Reveal Text from the VLLNT UI registry with the shadcn CLI.
3 storiesRole Badge
Account role indicator for owners, admins, members, and billing contacts. Install Role Badge from the VLLNT UI registry with the shadcn CLI.
2 storiesRouting Assignment Panel
Right-dock panel listing the agent slots an active route dispatches to. Install Routing Assignment Panel from the VLLNT UI registry with the shadcn CLI.
4 storiesRuntime Overview Panel
Top-of-dock summary tile grid for runtime health when no canvas object is selected. Install Runtime Overview Panel from the VLLNT UI registry with the shadcn CLI.
4 storiesScramble Text
Scrambles characters then resolves them into the final text. Install Scramble Text from the VLLNT UI registry with the shadcn CLI.
2 storiesShare Section
Social sharing buttons and link copy section. Install Share Section from the VLLNT UI registry with the shadcn CLI.
2 storiesShimmer Text
Text with a bright light band that sweeps across it. Install Shimmer Text from the VLLNT UI registry with the shadcn CLI.
2 storiesSlideshow
Step-through slideshow for presenting content sequentially. Install Slideshow from the VLLNT UI registry with the shadcn CLI.
2 storiesSpinning Text
Text laid out in a circle that rotates continuously. Install Spinning Text from the VLLNT UI registry with the shadcn CLI.
2 storiesSubscription Card
Subscription status and management card for plan, renewal, and usage details. Install Subscription Card from the VLLNT UI registry with the shadcn CLI.
2 storiesTerminal
Terminal-style display for command output. Install Terminal from the VLLNT UI registry with the shadcn CLI.
1 storyText Animate
Animates text in by word or character with configurable effects. Install Text Animate from the VLLNT UI registry with the shadcn CLI.
4 storiesText Reveal
Dims and brightens words as the text scrolls through the viewport. Install Text Reveal from the VLLNT UI registry with the shadcn CLI.
1 storyText Shimmer
Text with an animated gradient fill that shimmers. Install Text Shimmer from the VLLNT UI registry with the shadcn CLI.
2 storiesTimeline
Vertical or horizontal timeline of sequential events with completed/active/upcoming statuses and connector lines. Install Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesTLDR Section
Summary section for quick content overview. Install TLDR Section from the VLLNT UI registry with the shadcn CLI.
1 storyTypewriter
Types text out character by character with a blinking cursor. Install Typewriter from the VLLNT UI registry with the shadcn CLI.
3 storiesVideo Embed
Responsive video embed for YouTube and other providers. Install Video Embed from the VLLNT UI registry with the shadcn CLI.
1 storyWallet Card
Credit balance display card for available, pending, and refresh details. Install Wallet Card from the VLLNT UI registry with the shadcn CLI.
2 storiesAI
Agent Activity
Visual display of an AI agent's execution chain — steps, tools, decisions, progress. Install Agent Activity from the VLLNT UI registry with the shadcn CLI.
4 storiesAI Artifact
Rendered output area for AI-generated content with toolbar, copy/edit/download/fullscreen actions, and version chips. Install AI Artifact from the VLLNT UI registry with the shadcn CLI.
4 storiesAI Chat Input
Prompt composer for conversational interfaces with helper text, toolbar actions, and submit states. Install AI Chat Input from the VLLNT UI registry with the shadcn CLI.
2 storiesAI Message Bubble
Chat bubble for assistant, user, tool, and system messages using the current design system surfaces. Install AI Message Bubble from the VLLNT UI registry with the shadcn CLI.
3 storiesAI Sidebar
Slide-out AI assistant panel with provider, header / content / footer slots, and a standalone trigger. Install AI Sidebar from the VLLNT UI registry with the shadcn CLI.
3 storiesAI Source Citation
Compact source reference card for AI answers with a title, origin label, and optional excerpt. Install AI Source Citation from the VLLNT UI registry with the shadcn CLI.
1 storyAI Streaming Text
Readable text block for partial assistant output with an optional live cursor while tokens stream in. Install AI Streaming Text from the VLLNT UI registry with the shadcn CLI.
2 storiesAI Tool Call Display
Structured card for tool invocation traces, statuses, serialized input, and returned output. Install AI Tool Call Display from the VLLNT UI registry with the shadcn CLI.
2 storiesChain of Thought
Ordered, status-aware visualization of a model's chain of thought with per-step state. Install Chain of Thought from the VLLNT UI registry with the shadcn CLI.
3 storiesChat Dock Section
Sidebar section that hosts a compact, scrollable chat thread alongside a spatial workspace — slotted into a dock or rail to keep an AI assistant in view. Install Chat Dock Section from the VLLNT UI registry with the shadcn CLI.
1 storyConversation Thread
Compound component family for AI chat UIs that orchestrates auto-scroll, streaming indicators, empty states, and message rendering. Install Conversation Thread from the VLLNT UI registry with the shadcn CLI.
3 storiesModel Comparison
Side-by-side comparison of AI model responses with optional blind mode, metadata stats, and a vote bar. Install Model Comparison from the VLLNT UI registry with the shadcn CLI.
4 storiesModel Selector
Dropdown selector for choosing AI models. Install Model Selector from the VLLNT UI registry with the shadcn CLI.
1 storyPrompt Input
Auto-growing prompt textarea with a submit affordance and optional toolbar slot. Install Prompt Input from the VLLNT UI registry with the shadcn CLI.
4 storiesPrompt Templates
Searchable prompt template gallery with category filter, variable fill-in form, and onSelect. Install Prompt Templates from the VLLNT UI registry with the shadcn CLI.
4 storiesReasoning
Collapsible AI reasoning trace with streaming support and ordered or free-form steps. Install Reasoning from the VLLNT UI registry with the shadcn CLI.
3 storiesThinking Block
Collapsible block showing AI thinking/reasoning with streaming support. Install Thinking Block from the VLLNT UI registry with the shadcn CLI.
1 storyLearning
Annotation
Inline highlight with an attached contextual note. Install Annotation from the VLLNT UI registry with the shadcn CLI.
2 storiesChecklist
Interactive checklist with progress tracking and toggleable items. Install Checklist from the VLLNT UI registry with the shadcn CLI.
2 storiesCompletion Dialog
Dialog displayed upon completing a task or workflow. Install Completion Dialog from the VLLNT UI registry with the shadcn CLI.
2 storiesCurriculum
Course-layout container for a sequence of lessons or modules with title, progress, optional intro, and a stack of lesson rows. Install Curriculum from the VLLNT UI registry with the shadcn CLI.
2 storiesExercise
Interactive exercise block for learning content. Install Exercise from the VLLNT UI registry with the shadcn CLI.
2 storiesFlashcard
Study card for active recall with prompt and answer states. Install Flashcard from the VLLNT UI registry with the shadcn CLI.
1 storyKey Concept
Highlighted definition block for key terms and a glossary list. Install Key Concept from the VLLNT UI registry with the shadcn CLI.
2 storiesKeyboard Shortcuts Help
Displays available keyboard shortcuts to the user. Install Keyboard Shortcuts Help from the VLLNT UI registry with the shadcn CLI.
2 storiesLearning Objectives
Lists learning goals for educational content. Install Learning Objectives from the VLLNT UI registry with the shadcn CLI.
2 storiesPro Tip
Highlighted tip block with variants for tips, best practices, gotchas, and more. Install Pro Tip from the VLLNT UI registry with the shadcn CLI.
1 storyProfile Section
User profile display section with avatar and details. Install Profile Section from the VLLNT UI registry with the shadcn CLI.
2 storiesProgress Tracker
Curriculum-level learning dashboard for modules, lessons, exercises, streaks, and earned skills. Install Progress Tracker from the VLLNT UI registry with the shadcn CLI.
2 storiesQuiz
Interactive multiple-choice quiz with hints, explanations, and scoring. Install Quiz from the VLLNT UI registry with the shadcn CLI.
2 storiesRating
Inline star rating for lightweight learner feedback. Install Rating from the VLLNT UI registry with the shadcn CLI.
2 storiesSearch Dialog
Full-screen search dialog with keyboard navigation. Install Search Dialog from the VLLNT UI registry with the shadcn CLI.
2 storiesStep By Step
Numbered step guide with optional interactive completion tracking. Install Step By Step from the VLLNT UI registry with the shadcn CLI.
1 storyStepper
Sequenced steps with complete, current, and upcoming states. Install Stepper from the VLLNT UI registry with the shadcn CLI.
2 storiesTour
Guided onboarding flow for introducing content or interface patterns. Install Tour from the VLLNT UI registry with the shadcn CLI.
1 storyTutorial Card
Card for displaying tutorial previews with metadata. Install Tutorial Card from the VLLNT UI registry with the shadcn CLI.
1 storyTutorial Complete
Completion screen displayed when a tutorial is finished. Install Tutorial Complete from the VLLNT UI registry with the shadcn CLI.
2 storiesTutorial Filters
Filter controls for browsing tutorials by category or difficulty. Install Tutorial Filters from the VLLNT UI registry with the shadcn CLI.
1 storyTutorial Intro Content
Introduction section for tutorial pages with overview and prerequisites. Install Tutorial Intro Content from the VLLNT UI registry with the shadcn CLI.
1 storyTutorial MDX
MDX renderer tailored for tutorial content with custom components. Install Tutorial MDX from the VLLNT UI registry with the shadcn CLI.
1 storyEducational
Civilization Card
Civilization overview with hero band, BCE/CE era timeline, key stats, achievements, and notable leaders. Install Civilization Card from the VLLNT UI registry with the shadcn CLI.
5 storiesEra Comparison
Side-by-side comparison of historical eras with domain rows, color-themed columns, highlights, and figure chips. Install Era Comparison from the VLLNT UI registry with the shadcn CLI.
3 storiesHistorical Figure Card
Profile card with portrait, lifespan timeline, fields, works, quote, connections, and an expandable biography section. Install Historical Figure Card from the VLLNT UI registry with the shadcn CLI.
5 storiesKnowledge Check
Inline knowledge check with multiple-choice / true-false / fill-blank questions, per-answer feedback, and a final score summary. Install Knowledge Check from the VLLNT UI registry with the shadcn CLI.
3 storiesParallel Timeline
Multi-track timeline with shared time axis, BCE/CE event markers, and optional era bands for comparative history. Install Parallel Timeline from the VLLNT UI registry with the shadcn CLI.
4 storiesBilling
Auto Reload
Toggle + collapsible threshold/amount form for automatic credit reloading with locale-aware currency. Install Auto Reload from the VLLNT UI registry with the shadcn CLI.
5 storiesPricing Table
Plan comparison with feature checklist, tier highlighting, CTA, and an optional monthly/annual toggle. Install Pricing Table from the VLLNT UI registry with the shadcn CLI.
3 storiesTransaction List
Chronological credit/debit history with locale-aware currency formatting and a pinned subscription row. Install Transaction List from the VLLNT UI registry with the shadcn CLI.
4 storiesUtility
Alert Pulse
Pulsing ring overlay for alerting canvas objects, with severity tones. Install Alert Pulse from the VLLNT UI registry with the shadcn CLI.
4 storiesAnchor Port
Port marker for object inputs, outputs, and bidirectional links on the canvas. Install Anchor Port from the VLLNT UI registry with the shadcn CLI.
1 storyAnimated Grid Pattern
Decorative grid background with squares that fade in and out at random. Install Animated Grid Pattern from the VLLNT UI registry with the shadcn CLI.
2 storiesAnimated Text
Staggered text reveal for headings, pull quotes, and short supporting copy. Install Animated Text from the VLLNT UI registry with the shadcn CLI.
12 storiesAspect Ratio
Constrains content to a specified aspect ratio. Install Aspect Ratio from the VLLNT UI registry with the shadcn CLI.
1 storyBorder Beam
Animated accent beam that travels around the border of a highlighted surface. Install Border Beam from the VLLNT UI registry with the shadcn CLI.
2 storiesCanvas Shell
Layout shell for canvas workspaces with top bar, left rail, right dock, and bottom slot regions. Install Canvas Shell from the VLLNT UI registry with the shadcn CLI.
1 storyCanvas View
Interactive pan-and-zoom viewport for spatial surfaces with keyboard, wheel, and overlay support. Install Canvas View from the VLLNT UI registry with the shadcn CLI.
1 storyCard Flip
Card that flips in 3D between a front and back face. Install Card Flip from the VLLNT UI registry with the shadcn CLI.
2 storiesComment Pin
Anchored discussion pin rendered at canvas coordinates with author + unread badge. Install Comment Pin from the VLLNT UI registry with the shadcn CLI.
4 storiesConnector Edge
Curved edge between canvas objects with optional inline label state. Install Connector Edge from the VLLNT UI registry with the shadcn CLI.
1 storyContext Lens
Vignette overlay that dims the canvas outside a circular focus region. Install Context Lens from the VLLNT UI registry with the shadcn CLI.
4 storiesCursor
Custom cursor follower that trails the pointer. Install Cursor from the VLLNT UI registry with the shadcn CLI.
2 storiesDot Pattern
Decorative dotted background pattern built from token colors. Install Dot Pattern from the VLLNT UI registry with the shadcn CLI.
2 storiesFloating Action Button
Fixed-position action button for primary actions. Install Floating Action Button from the VLLNT UI registry with the shadcn CLI.
1 storyGlass Card
Frosted-glass card surface with backdrop blur and a translucent background. Install Glass Card from the VLLNT UI registry with the shadcn CLI.
1 storyGlass Panel
Frosted-glass surface for floating chrome above a canvas — dock panels, hovering toolbars, and transient overlays — with a translucent background and soft border. Install Glass Panel from the VLLNT UI registry with the shadcn CLI.
1 storyGroup Hull
Durable boundary wrapper for related runtime objects sharing context or ownership. Install Group Hull from the VLLNT UI registry with the shadcn CLI.
1 storyInfinite Plane
Tiled pannable backdrop for the canvas with dot or grid pattern that drifts with the viewport. Install Infinite Plane from the VLLNT UI registry with the shadcn CLI.
4 storiesLang Provider
Context provider for language and internationalization. Install Lang Provider from the VLLNT UI registry with the shadcn CLI.
1 storyLiquid Glass
Glass surface with an animated liquid gradient sheen. Install Liquid Glass from the VLLNT UI registry with the shadcn CLI.
1 storyLive Cursor
Remote user's cursor rendered at canvas coordinates with name + status chip. Install Live Cursor from the VLLNT UI registry with the shadcn CLI.
4 storiesMagnetic
Wrapper that pulls its content toward the pointer for a magnetic effect. Install Magnetic from the VLLNT UI registry with the shadcn CLI.
2 storiesMagnetic Button
Button that drifts toward the pointer for a magnetic hover effect. Install Magnetic Button from the VLLNT UI registry with the shadcn CLI.
2 storiesMarquee
Continuously scrolling content lane for badges, logos, and status chips. Install Marquee from the VLLNT UI registry with the shadcn CLI.
5 storiesMeteors
Decorative meteor shower of streaks falling across the background. Install Meteors from the VLLNT UI registry with the shadcn CLI.
2 storiesMulti Select Lasso
Selection rectangle overlay for canvas multi-select gestures. Install Multi Select Lasso from the VLLNT UI registry with the shadcn CLI.
4 storiesNumber Ticker
Animated number transitions for stats, KPIs, and compact numeric callouts. Install Number Ticker from the VLLNT UI registry with the shadcn CLI.
2 storiesObject Handle
Drag/reposition affordance for spatial objects that need a calm grab target. Install Object Handle from the VLLNT UI registry with the shadcn CLI.
1 storyParticles
Floating particle field that drifts gently in the background. Install Particles from the VLLNT UI registry with the shadcn CLI.
2 storiesPlayback Ghost
Translucent overlay marking where a canvas object was at a previous timestamp during playback. Install Playback Ghost from the VLLNT UI registry with the shadcn CLI.
4 storiesProgressive Blur
Progressive blur overlay that fades focus toward one edge. Install Progressive Blur from the VLLNT UI registry with the shadcn CLI.
2 storiesResizable
Resizable panel layout with draggable handles. Install Resizable from the VLLNT UI registry with the shadcn CLI.
1 storyScroll Area
Custom scrollable area with styled scrollbars. Install Scroll Area from the VLLNT UI registry with the shadcn CLI.
1 storySelection Presence
Dashed-border overlay marking what another user has selected on the canvas. Install Selection Presence from the VLLNT UI registry with the shadcn CLI.
4 storiesShimmer Button
Button with a light sheen that sweeps across its surface. Install Shimmer Button from the VLLNT UI registry with the shadcn CLI.
2 storiesShine Border
Wrapper that draws an animated gradient border around its content. Install Shine Border from the VLLNT UI registry with the shadcn CLI.
2 storiesShiny Button
Button with a glossy gradient sheen that sweeps on a loop. Install Shiny Button from the VLLNT UI registry with the shadcn CLI.
1 storySparkles
Decorative twinkling sparkles scattered behind content. Install Sparkles from the VLLNT UI registry with the shadcn CLI.
2 storiesSpinner
Animated loading spinner indicator. Install Spinner from the VLLNT UI registry with the shadcn CLI.
1 storySpotlight Card
Card with a radial spotlight that follows the pointer. Install Spotlight Card from the VLLNT UI registry with the shadcn CLI.
1 storyState Badge Overlay
State chip pinned to a canvas object's corner — idle, queued, running, complete, failed, stopped. Install State Badge Overlay from the VLLNT UI registry with the shadcn CLI.
4 storiesTable Of Contents
Auto-generated table of contents from page headings. Install Table Of Contents from the VLLNT UI registry with the shadcn CLI.
2 storiesTable Of Contents Panel
Side panel rendering a table of contents for page navigation. Install Table Of Contents Panel from the VLLNT UI registry with the shadcn CLI.
2 storiesTheme Preset Provider
Applies the persisted theme preset on mount and injects a no-flash script so the saved preset is set before paint. Install Theme Preset Provider from the VLLNT UI registry with the shadcn CLI.
1 storyTheme Provider
Context provider for light/dark theme switching. Install Theme Provider from the VLLNT UI registry with the shadcn CLI.
1 storyTheme Switcher
Compact swatch row for switching between built-in theme presets, kept in sync with every other consumer on the page. Install Theme Switcher from the VLLNT UI registry with the shadcn CLI.
1 storyTheme Toggle
Button to toggle between light and dark themes. Install Theme Toggle from the VLLNT UI registry with the shadcn CLI.
1 storyThread Bubble
Expanded discussion bubble for an anchored canvas comment thread. Install Thread Bubble from the VLLNT UI registry with the shadcn CLI.
4 storiesTilt Card
Card that tilts in 3D toward the pointer for a parallax hover. Install Tilt Card from the VLLNT UI registry with the shadcn CLI.
1 storyTruncated Text
Single-line text that truncates with an ellipsis when it exceeds a configurable max width. Install Truncated Text from the VLLNT UI registry with the shadcn CLI.
1 storyDon't see what you need?
Request a new component and we'll open a prefilled GitHub issue with the right labels and template.
Request a component