Button Group

Anatomie

1. Label: Společný textový popisek nad celou skupinou tlačítek, který identifikuje účel komponenty.
2. Container: Slot - prostor seskupující jednotlivá tlačítka do přednastaveného layoutu. Podle nastavení řadí prvky horizontálně nebo vertikálně.
3. Buttons: Jednotlivá tlačítka uvnitř skupiny, která nesou samostatné akce.

Použité komponenty

Varianty

1. Horizontal: Výchozí zobrazení, kde jsou tlačítka řazena vedle sebe v řádku.
2. Vertical: Varianta, která řadí tlačítka do sloupce.

Varianty, velikosti a stavy buttons

Komponenta ButtonGroup jako celek neobsahuje specifické vlastnosti tlačítek, plně přebírá standardní stavy, velikosti a varianty vložených buttonů. Použití variant danger/warning/info/success je povolené, stejně tak další konfigurace, které button umožňuje.

Jak používat

• Používejte ButtonGroup pro úzce související volby, kde výběr jedné možnosti ovlivňuje stejný kontext.
• Vždy udržujte u vložených buttons stejný style, variant a size.

Jak nepoužívat

• Nikdy neseskupujte do ButtonGroup akce, které spolu tematicky nesouvisí (nedávejte tlačítko "Smazat profil" a "Stáhnout manuál" do jedné skupiny).
• Nepoužívejte příliš velký počet tlačítek. Pokud skupina obsahuje více možností, zvažte použití komponenty Dropdown.
• Vyhněte se kombinování tlačítek s textem a tlačítek pouze s ikonou v jedné skupině, pokud to nerespektuje jasný vizuální vzor.
• Nekombinujte nastavení style.