Welcome UI logo
FOUNDATIONSCOMPONENTSBLOG650+
10.0.0

Menu

    Actions

    • Button
    • ButtonGroup
    • Close Button
    • Link

    Data display

    • Accordion
    • Avatar
    • Badge
    • Card
    • Swiper
    • Table
    • Tag
    • VisuallyHidden

    Feedback

    • Alert
    • StickyNote

      NEW

    • Toast

    Forms

    • Checkbox
    • DatePicker
    • DateTimePicker
    • Field
    • FileDrop
    • FileUpload
    • Hint
    • InputText
    • Label
    • PasswordInput
    • Radio
    • RadioGroup
    • RadioTab
    • Search
    • Select
    • Slider
    • Textarea
    • TimePicker
    • Toggle

    Icons & logo

    • Icon
    • IconStamp

      NEW

    • Logo
    • VariantIcon
    • WelcomeLoader

    Layout

    • AspectRatio
    • Loader
    • Window

      NEW

    Navigation

    • Breadcrumb
    • DropdownMenu
    • Pagination
    • Stepper

      NEW

    • Tabs

    Overlay

    • Drawer
    • Modal
    • Popover
    • Tooltip

    Typography

    • Text

    Utilities

    • Grid background

Overview

Props

RadioTab

The RadioTab component is a collection of radio tab that allows users to select one option from a set of mutually exclusive choices. It ensures that only one option can be selected at a time, providing a clear and accessible way to present multiple-choice options. This component is essential for forms and settings where a single selection is required.

SourceBuilt with Ariakit
Github
import { RadioGroup } from 'welcome-ui/RadioGroup'
import { RadioTab } from 'welcome-ui/RadioTab'
export const ITEMS = [
{ label: 'Bold', value: 'bold' },
{ label: 'Italic', value: 'italic' },
{ label: 'Strikethrough', value: 'strikethrough' },
{ label: 'Underline', value: 'underline' },
]
const Example = () => {
return (
<RadioGroup
hideLabel
label="RadioGroup component rendered as RadioTab"
name="social"
options={ITEMS}
renderOption={RadioTab}
/>
)
}
export default Example

Examples

Disabled

Add disabled property

Github
Radio groupSearch

On this page

  • Definition
  • Examples
    • Disabled
Made with by
Welcome to the jungle logo

Documentations

  • Foundations
  • Components
  • Source code

Updates

  • Releases
  • Issues

Community

  • Github
  • Twitter
  • Medium
  • Jobs