Tile UISolid
Source code

Tile UI · SolidJS

CSR · SSR · SSG

ButtonGroup

SolidJS primitives for grouping related native button actions.

Keyboard-ready native actions
import { Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText } from '@tile-ui/solid';

export default function ButtonGroupDemo() {
	return (
		<form class="component-preview__stack" onSubmit={(event) => event.preventDefault()}>
			<ButtonGroup>

Use ButtonGroup to keep related native actions visually and semantically adjacent.

Registry install

pnpm dlx shadcn@latest add @tile-ui/button-group

Package usage

import { ButtonGroup, Button } from '@tile-ui/solid';

<ButtonGroup>
	<Button>One</Button>
	<Button>Two</Button>
	<Button>Three</Button>
</ButtonGroup>

Highlights

  • Horizontal and vertical orientation
  • Text and separator

Registry dependencies

Item Purpose
button-group Component source and module styles
core Framework-agnostic logic helpers
styles Shared SCSS tokens and globals

API reference

ButtonGroup

Prop Type Default
orientation 'horizontal' | 'vertical' —

ButtonGroupText

No custom props.

ButtonGroupSeparator

Prop Type Default
orientation 'horizontal' | 'vertical' —