Actions components
8 Actions components for React, shadcn, Vue 3, Laravel Blade and HTML + Alpine.js: Button, ButtonGroup, CopyButton, Page Actions, ShareButton, ThemeSwitcher, ToggleGroup, ViewToggle.
- ButtonThe action button, with five variants, five sizes and a built-in loading state. Wraps Base UI Button.
- ButtonGroupButtons joined into one control with shared borders and only the outer corners rounded, horizontal or vertical, with a separator slot for split buttons.
- CopyButtonIcon button that copies text to the clipboard and shows a check for 1.5 seconds, with a screen-reader announcement and a fallback; CopyField pairs it with a read-only, always left-to-right input for keys and URLs.
- Page ActionsThe header's action area. One visible primary action, the rest behind a "More actions" menu, and all of them in the command palette with their shortcuts bound.
- ShareButtonA share button and dialog with copy link, email invites with a role, link access of restricted or anyone with the link, link expiry, the people who already have access and the native Web Share sheet where the browser offers it.
- ThemeSwitcherTheme (light / dark / system) and language controls - a segmented switcher, a one-icon light/dark toggle with a click, a language dropdown, and menu-item variants for embedding in other menus.
- ToggleGroupPressed-state buttons grouped as a segmented control, single or multiple selection, plus a standalone Toggle.
- ViewToggleSwitches how a collection is shown (table, grid, board, list or calendar), with one view always pressed and optional persistence in localStorage.
WorkspaceSettings
Create and manage workspaces. A first-run onboarding page, a create dialog for the workspace switcher, a list of your workspaces, and a settings page with rename, address, picture, leave and type-to-confirm delete.
Button
The action button, with five variants, five sizes and a built-in loading state. Wraps Base UI Button.