saturation/uisaturation/ui
DocsComponentsBlocksPages
GitHub

Sections

IntroductionComponentsInstallationMCPTheming

Components

ComponentsAccordionAI Chat InputAlertAnimated GroupAnimated NumberAvatarBadgeBeamBlur FadeBorder TrailBreadcrumbButtonButton GroupCalendar PickerCardChartCheckboxCollapsibleComboboxCommandComparison SliderContext MenuCredit CardData TableDate PickerDialogDropdown MenuEmoji PickerEmptyFieldFiltersFull CalendarGlow EffectInputInput GroupInput OTPItemKanbanKbdMenubarNavigation MenuNovel EditorPaginationParallaxProgressProgressive BlurRadio GroupRippleSelectSeparatorSheetSkeletonSliderSonnerSpinnerSpotlightSwitchTableTabsText EffectText ShimmerTextareaToggleToggle GroupTreeTypography
Docs/Components/Version Selector

Version Selector

A dropdown for switching between version options, with a cover variant for hero sections.

Loading...

Installation

pnpm dlx shadcn@latest add https://ui.saturation.io/r/version-selector.json

Usage

import { VersionSelector } from "@/components/ui/version-selector"
<VersionSelector
  versions={["v2.0", "v1.5", "v1.0"]}
  selectedVersion="v2.0"
  onVersionChange={(v) => setVersion(v)}
/>

API Reference

VersionSelector

PropTypeDefaultDescription
versionsstring[]—List of version strings to display.
selectedVersionstring—The currently selected version.
onVersionChange(version: string) => void—Callback when a version is selected.
variant"default" | "cover""default"Visual variant. Use "cover" for hero/banner placements with white styling.
classNamestring—Additional CSS classes.
PreviousTypography

On This Page

  • Installation
  • Usage
  • API Reference
  • VersionSelector