Button Group

Inputs

Horizontal or vertical set of buttons with optional attached (joined) styling.

UnificadosDual Action Button

Dual Action Button

Unificado

Instalação via CLI

$ npx kikitocn add button-group

Exemplo de uso

Button GroupExample.tsx

import { ButtonGroup } from "@/components/ui/cn/button-group/ButtonGroup";

export function ButtonGroupExample() {
  return (
    <ButtonGroup orientation="horizontal">
      Button Group
    </ButtonGroup>
  );
}

Props

Prop	Tipo	Padrão	Descrição
`children*`	`React.ReactNode`	—	Botões filhos
`orientation`	`'horizontal' \| 'vertical'`	`'horizontal'`	Orientação do grupo
`attached`	`boolean`	`true`	Unir bordas entre botões adjacentes
`aria-label`	`string`	—	Nome acessível do grupo (role=group)
`className`	`string`	—	Classes CSS extras
`style`	`React.CSSProperties`	—	Estilos inline extras

Voltar para Inputs

Carregando…

Button Group

Dual Action Button

Button Group

Attached (default)

Detached

Dual Action Button

Attached (default)

Detached