Skip to content

Radio Group

One dot for the whole group. On a change it leaves the old well and travels to the new one, stretching along its path, then settles.

$149 once · every Pro piece

Customize

Arrow keys move and select.

Install

npx shadcn@latest add @obsyde/radio-group

Needs your licence key · Get Pro

Usage

Import it from where the CLI puts it, or copy the files below by hand.

import { RadioGroup } from '@/components/obsyde/ember/radio-group/RadioGroup';

export function Example() {
  return (
    <RadioGroup options="North, East, South, West" value="East" />
  );
}

Files

What you get with Pro: plain React, TypeScript and CSS, with no dependencies.

  • ember/radio-group/RadioGroup.tsxcomponent
  • ember/radio-group/radio-group.cssstyles
  • ember/radio-group/RadioGroupDemo.tsxdemo
  • ember/actions-kit/kit.tsshared
  • ember/shared/accent.tsshared
  • ember/shared/spring.tsshared
  • ember/shared/ember.cssshared

API

PropTypeDefault
accentAccent'ember' | 'volt' | 'arc''ember'
optionsOptionsstring'North, East, South, West'
valueValuestring'East'
orientationOrientation'vertical' | 'horizontal''vertical'
disabledDisabledbooleanfalse