전체 카탈로그
ActionButton8 props

Button Group

ButtonGroup joins related actions into a single connected control. Use it when multiple buttons represent related choices or operations that belong together visually, like copy/...

공식 문서 열기
live previewAction

Preview

Import

import {ButtonGroup} from '@astryxdesign/core/ButtonGroup';

Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.

When to use

ButtonGroup joins related actions into a single connected control. Use it when multiple buttons represent related choices or operations that belong together visually, like copy/...

button-groupconnectedsplittoolbaractionsgroupedbuttons

Important props

orientationhorizontal | verticaloptional
sizesm | md | lgoptional

Theming targets

astryx-button-group

Best practices

  • DoGroup buttons that perform related actions on the same object, like copy, cut, paste on selected text.
  • DoUse the same variant for all buttons in a group so they look like a single connected unit.
  • DoKeep groups small (2–4 buttons). For more actions, use a Toolbar or DropdownMenu instead.
  • Do notDon't mix wildly different actions. A Save button next to a Delete button in the same group is confusing.