Button is a user interface element typically used to trigger some action or event. Users can click the button to perform specific functions, such as submitting a form, launching a program, or navigating to other pages. Buttons usually appear in rectangular or circular shapes and can contain text, icons, or a combination of both.
import { Button } from "wis/button"
API Reference#
| Name | Type | Default | Description |
|---|---|---|---|
| text | string | none | The text information displayed on the button. |
| variant | primary classic secondary tertiary ghost | secondary | The visual variant to apply to button. |
| status | danger | none | Sets the special status of the button. |
| disabled | boolean | false | Disabled the button click. |
| icon | ReactNode | none | The icon element will be displayed next to the button text. |
| iconControl | prefix suffix | prefix | Controls the display position of the icon relative to the text. |
| size | md sm xs | md | Set the size of button. |
| shortcutKey | string | none | Sets a global shortcut key, such as Control+I. When the user presses the combination key, the button's click event will be triggered. View Keyboard |
| onClick | (event: MouseEvent<HTMLButtonElement>) => void | none | Event handler called when the button is clicked. |