Buttons are used as triggers for actions. Buttons can contain a label and/or an icon and come in a variety of styles and sizes.
| Name | Description | Default |
|---|---|---|
| disabled | @deprecated use The All DLS components are designed to use the boolean | - |
| aria-disabled | If true, styles component as disabled and prevents interactivity. Screen reader reads as "dimmed" or "disabled". Booleanish | - |
| children | Contents of button body ReactNode | - |
| onClick | The event handler for click events on button, disabled for disabled buttons MouseEventHandler<HTMLButtonElement> | - |
| isLoading | If true, shows loading button with spinner boolean | - |
| variant | Determines style of button "primary" | "secondary" | "tertiary" | - |
| iconPosition | Place icon before or after text "start" | "end" | - |
| icon | Custom icon displayed in notification ReactNode | - |
| reactlytics | ReactlyticsProp | - |
| labelOverrides | Overrides for labels that have been defaulted in the component. ButtonLabelOverrides | - |
Connect with the DLS Team on Slack or by email.
Check out additional resources.