Button
Enables users to trigger an action or event, such as submitting a form, opening a dialog, canceling an action, or performing a delete operation.
Import
tsimport { Button } from "@kobalte/core";
tsimport { Button } from "@kobalte/core";
Features
- Native HTML 
<button>element support. <a>and custom element type support via the WAI ARIA Button design pattern.- Keyboard event support for Space and Enter keys.
 
Anatomy
The button consists of:
- Button.Root: The root container for a button.
 
tsx<Button.Root />
tsx<Button.Root />
Example
API Reference
Button.Root
| Prop | Description | 
|---|---|
| disabled | boolean Whether the button is disabled.  | 
| Data attribute | Description | 
|---|---|
| data-disabled | Present when the button is disabled. | 
Rendered elements
| Component | Default rendered element | 
|---|---|
Button.Root | button | 
Accessibility
Keyboard Interactions
| Key | Description | 
|---|---|
| Space | Activates the button. | 
| Enter | Activates the button. |