Component

Version Selector

A dropdown for selecting software versions with a "Latest" badge indicator. Uses the headless @refraction-ui/version-selector core.

Examples

Version dropdown with latest badge.

With Latest Badge

Installation

$pnpm add @refraction-ui/react-version-selector

Usage

tsx

import { VersionSelector } from '@refraction-ui/react-version-selector'

export function MyComponent() {
  const [version, setVersion] = useState('3.0.0')
  return (
    <VersionSelector
      value={version}
      onValueChange={setVersion}
      versions={[
        { value: '3.0.0', label: 'v3.0.0', isLatest: true },
        { value: '2.0.0', label: 'v2.0.0' },
      ]}
    />
  )
}

Props

Prop	Type	Default	Description
`value`	`string`	--	Selected version value.
`onValueChange`	`(value: string) => void`	--	Callback when version changes.
`versions`	`VersionOption[]`	--	Array of { value, label, isLatest? }.
`placeholder`	`string`	`'Select version...'`	Placeholder text.
`className`	`string`	--	Additional CSS classes.