Skip to main content

Button

Loading...
import { Button } from "@nudge-coach/ui";

Overview​

The Button component should be used for all actions in Nudge Coach.

Props​

children​

React.ReactNode

The content displayed inside the button. Either text or icons.

onClick​

() => void

Callback when the button is clicked.

primary​

boolean

Indicates when a button is the default choice or primary action within a given experience. In general there shouldn't be 2 primary buttons in a single view.

Loading...
<Button primary>Label</Button>

destructive​

boolean

Indicates when an action is negative or has a destructive result.

Loading...
<Button destructive>Label</Button>

small​

boolean

Makes the button smaller for more constrained layouts.

Loading...
<Button small>Label</Button>

expanded​

boolean

Makes the button fill its container.

Loading...
<Button expanded>Label</Button>

implied​

boolean

A frameless button used only when a button can be implied.

Loading...
<Button implied>Label</Button>