panelui-web v0.9.0

A new component, Button Group.

Added

• Button Group. Related actions joined into one control. The group squares the corners where two children meet and drops the border one of them would double, so any Button, Input or Menu.Trigger placed directly in it joins without a prop. orientation="vertical" stacks them, and a group of groups spaces them apart, for a toolbar. ButtonGroup.Separator divides filled buttons, which have no border to share, and ButtonGroup.Text is a cell that is read rather than pressed, such as a https:// prefix or a count, at the heights of the sm, md and lg buttons.

Docs

• A Button Group page with examples for orientation, sizes, split buttons with a menu, a formatting toolbar, a field with its button, and text cells.

Using it

npm install panelui-web

import { Button } from 'panelui-web/button';
import { ButtonGroup } from 'panelui-web/button-group';

<ButtonGroup aria-label="Message actions">
  <Button variant="outline">Archive</Button>
  <Button variant="outline">Snooze</Button>
  <Button variant="outline">Report</Button>
</ButtonGroup>