Components
Loading preview...
A larger form of Radio or Checkbox, where the user has a larger tap target and more details.
@shugar
npx shadcn@latest add https://21st.dev/r/shugar/choicebox-1import { useState } from "react";
import { ChoiceboxGroup } from "@/components/ui/choicebox-1";
export default function MultiSelectDemo() {
const [value2, setValue2] = useState<string[]>([]);
return (
<div className="w-3/4">
<ChoiceboxGroup
direction="row"
label="select a plan"
onChange={setValue2}
type="checkbox"
value={value2}
>
<ChoiceboxGroup.Item
description="Free for two weeks"
title="Pro Trial"
value="trial"
/>
<ChoiceboxGroup.Item
description="Get started now"
title="Pro"
value="pro"
/>
</ChoiceboxGroup>
</div>
);
}