Repository navigation
panelui-web v0.9.1
Button Group now looks like the segmented Tabs.
Changed
- Button Group is drawn as a track. In 0.9.0 each button in a group drew its own border and shadow, so the outline almost disappeared in dark mode and the shadows showed at every join. A group is now drawn the way the segmented
Tabsare: a muted track, with the buttons inside it at the radius one step smaller, so their corners follow the track's. Outline and ghost buttons lie flat with muted labels, and the one under the pointer rises out of the track like the chosen tab, with the short dividers beside it fading. A field or a filled button keeps its own surface. - Split buttons stay joined. A group with a
ButtonGroup.Separatorin it has no track: its filled halves meet edge to edge, and the separator carries their fill across the seam with a short line in their text colour. A group of groups still spaces them apart, one track each.
The API is unchanged, so nothing in your code needs to move.
Docs
- The Button Group page describes the track, and is marked updated.
- panelui.dev has a new home page hero. Expo and Web tabs switch the install command and where Get Started and Browse Components lead, the headline ends on a word that dissolves between "app" and "website", and a dithered glow lights it from three sides.
Using it
npm install panelui-web@latestimport { 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>