Buttonv9.8.3 Edit this page
Changes the button to `display: block`, making it go full width.
Applies a CSS classname to the component.
Allows you to provide a React component or other HTML element, overriding the default `a` and `button` options.
Renders a button as disabled, making it non-interactable.
Renders a button loading visual state.
Renders a button with the highest visual affordances.
Renders a button with the tertiary visual affordances.
Force the component to use its hover styles.
Force the component to use its focus styles.
Force the component to use its active styles.
Buttons That Look Like Links
You often want a button that looks like a link, or vice-versa a link that looks like a button. The
<Link> components can be used interchangeably, and which one you use should be determined by what you want it to look like. Both components can render either
<button> tags depending on the props used (
onClick), ensuring you get both the right styling and the right dom elements for semantics and accessibility.
- Use this component (
<Button>) when you want something that looks like a button.
<Link>when you want something that looks like a link.
In addition to props defined by this component, any props
<a> take are also accepted.
This component is maintained by the FEI team.
- [This component on the NDS Style Guide][styleguide]
- This component on Storybook