Button Group

Ready

Joins related buttons into one control.

Installation

$ npx @oratiq-js/ui add button-group

Copies the component and everything it depends on into your project, then lists the npm packages to install. The code is yours after this.

import

import { ButtonGroup, ButtonGroupText, ButtonGroupSeparator, buttonGroupVariants } from "@/components/ui/button-group";

Shared borders and logical radii — the first item rounds on the start edge, so the group flips correctly in RTL.

https://

Prop	Type	Default	Description
`orientation`	`"horizontal" \| "vertical"`	`"horizontal"`	Layout axis.
`attached`	`boolean`	`true`	Joins items into one control. False adds a gap instead.
`label`	`string`	—	Accessible name for the group.

View source on GitHub → components/ui/button-group.tsx