@hsl-fi/button

Properties

{
  value: string; - required
  className: string; - optional
  fullWidth: boolean; - optional
  href: string; - optional
  openInNewWindow: boolean; - optional
  size: ButtonSizes; - optional (@hsl-fi/content-delivery-api-types)
  variant: ButtonVariants; - optional (@hsl-fi/content-delivery-api-types)
  disabled: boolean; - optional
  'aria-label': string; - optional
  onClick: (params: any) => void; - optional
  onLinkClick: () => void; - optional
  style: React.CSSProperties; - optional
  type: "button" | "submit" - optional (defaults to "button")
}

Options - ButtonSizes

'small' | 'medium' | 'large'

Options - ButtonVariants

'white' | 'blue' | 'yellow' | 'grey' | 'black'

Example

<Button
  size="large"
  variant="blue"
  value="Button text"
  href="http://example.com"
  onLinkClick={() => {
    // do something before navigating to target, defined in the href-prop
  }}
/>