import { default as React, AriaAttributes } from 'react'; import { HTMLButtonProps, HTMLAnchorProps } from '../../constants'; export type ButtonConcept = 'normal' | 'destructive'; export type ButtonVariant = 'fill' | 'outline' | 'borderless'; export type ButtonSize = 'medium' | 'large'; export type ButtonOnColor = 'onlight' | 'ondark'; export type ButtonTags = 'button' | 'a'; export type ButtonArrows = 'icon' | 'accessibility-character'; export type ButtonTextPosition = 'left' | 'centered'; export interface ButtonProps extends Omit, Omit, AriaAttributes { /** Sets the aria-label of the button, use when the button only includes an icon */ ariaLabel?: string; /** Gives a unique id to the button */ id?: string; /** Sets the content of the button. */ children: React.ReactNode; /** Adds custom classes to the wrapper element. */ wrapperClassName?: string; /** Adds custom classes to the element. */ className?: string; /** Enables an arrow icon to the right inside the button (Not available in borderless variant) */ arrow?: ButtonArrows; /** Changes the intent of the button. Mostly changes the color profile. */ concept?: ButtonConcept; /** Disables text wrapping and enables ellipsis. */ ellipsis?: boolean; /** Makes the button scale to full width of its parent element. */ fluid?: boolean; /** Changes the underlying element of the button. */ htmlMarkup?: ButtonTags; /** Changes the button colors for different backgrounds. */ onColor?: ButtonOnColor; /** Function that is called when the Button loses focus */ onBlur?: () => void; /** Function that is called when clicked */ onClick?: (e?: React.MouseEvent | React.FormEvent | React.KeyboardEvent | null) => void; /** Changes the button colors for different backgrounds. (Large not available in borderless variant) */ size?: ButtonSize; /** Changes the visual representation of the button. */ variant?: ButtonVariant; /** Specifies the focus order relative to the other buttons or controls on the page */ tabIndex?: number; /** Sets the data-testid attribute. */ testId?: string; /** Adds custom classes to the text */ textClassName?: string; /** Sets the position of the text in the button - only applies when button is fluid */ textPosition?: ButtonTextPosition; /** Button type. Default: button */ type?: React.ButtonHTMLAttributes['type']; /** Ref that is passed to the component */ ref?: React.RefObject; } declare const Button: React.FC; export default Button;