@stratakit/bricks
Version:
Small, modular components for StrataKit
39 lines (38 loc) • 1.13 kB
TypeScript
import type { FocusableProps } from "@stratakit/foundations/secret-internals";
interface ButtonProps extends FocusableProps<"button"> {
/**
* The variant of the button, i.e. solid, outline, or ghost.
*
* @default "solid"
*/
variant?: "solid" | "outline" | "ghost";
/**
* The tone of the button. Most buttons should be neutral.
* Accent buttons can be used to draw attention to the primary action.
*
* @default "neutral"
*/
tone?: "neutral" | "accent";
}
/**
* A styled button element which allows the user to perform an action when clicked.
*
* Example:
* ```tsx
* <Button onClick={() => doSomething()}>Click me</Button>
* ```
*
* Start and end icons can be added by passing `Icon` as children.
*
* ```tsx
* <Button>
* <Icon href={…} />
* Click me
* <Icon href={…} />
* </Button>
* ```
*
* The button's appearance can be customized using the `variant` and `tone` props.
*/
declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLElement | HTMLButtonElement>>;
export default Button;