@postenbring/hedwig-react
Version:
React components for [Hedwig Design System](https://github.com/bring/hedwig-design-system).
53 lines • 1.81 kB
TypeScript
/**
* @deprecated The "inverted" variant is deprecated. Use "primary", "secondary", or "tertiary" instead.
*/
export type DeprecatedVariant = "inverted";
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
/**
* The height, font size and padding of the button
*
* @default "large"
*/
size?: "small" | "large";
/**
* The background and fill of the button
*
* @default "primary"
*/
variant?: "primary" | "secondary" | "tertiary" | DeprecatedVariant;
/**
* Make the button use 100% width available.
* Using the "mobile" it only stretch to full width on smaller screens
*/
fullWidth?: boolean | "mobile";
/**
* Specify that there is an icon in the button.
* `icon`: There is only an icon in the button.
* `icon="leading"`: There is an icon before the text.
* `icon="trailing"`: There is an icon after the text.
*
* @default false
*/
icon?: boolean | "leading" | "trailing";
/**
* Change the default rendered element for the one passed as a child, merging their props and behavior.
*
* @default false
*/
asChild?: boolean;
}
/**
* Button component
*
* @example
* <Button variant="primary">Primary</Button>
* <Button variant="secondary" size="large">Secondary</Button>
* <Button variant="tertiary" fullWidth="mobile">Tertiary</Button>
* <Button icon="leading"><LeadingIcon />Leading icon</Button>
*
* @example
* // If used for navigation use the `asChild` prop with a anchor element as a child.
* <Button asChild><a href="/home">Home</a></Button>
*/
export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
//# sourceMappingURL=button.d.ts.map