BaseRadioGroup

A set of radios, and the reason there is no BaseRadio.

Import it from rei-kit: import { BaseRadioGroup } from 'rei-kit'

Open BaseRadioGroup in the live documentation, where every prop below is a control you can change, in four materials and ten palettes.

Usage

<script setup lang="ts">
import { ref } from 'vue'
import { BaseRadioGroup } from 'rei-kit'

const plan = ref('monthly')
const plans = [
  { value: 'monthly', label: 'Monthly' },
  { value: 'yearly', label: 'Yearly' },
]
</script>

<template>
  <BaseRadioGroup v-model="plan" legend="Plan" :options="plans" />
</template>

Props

Props
PropTypeRequired or defaultWhat it is for
modelValuestringundefinedThe chosen option's value, with `v-model`.
legendstringyes
optionsreadonly { value: string; label: string; disabled?: boolean | undefined }[]yes
errorstring''
hintstring''
legendHiddenbooleanfalse

About rei-kit

rei-kit is an accessible Vue 3 and Tailwind CSS 4 component library: 106 components, themed by role rather than by colour on three independent axes — ten WCAG-checked palettes, four materials and light or dark, each switched with one attribute. Typed, tested, SSR-safe, no runtime dependencies, MIT.

pnpm add rei-kit · npm · GitHub