import type * as React from 'react'; import type { KIND, SIZE, SHAPE } from './constants'; import type { Override } from '../helpers/overrides'; export type ButtonOverrides = { Root?: Override; BaseButton?: Override; StartEnhancer?: Override; EndEnhancer?: Override; LoadingSpinnerContainer?: Override; LoadingSpinner?: Override; }; export type CustomColors = { backgroundColor: string; color: string; }; interface BaseButtonProps { children?: React.ReactNode; colors?: CustomColors; disabled?: boolean; /** A helper rendered at the end of the button. */ endEnhancer?: React.ReactNode | React.ComponentType; /** Show loading button style and spinner. */ isLoading?: boolean; /** Indicates that the button is selected */ isSelected?: boolean; /** Defines the kind (purpose) of a button */ kind?: keyof typeof KIND; onClick?: (a: React.SyntheticEvent) => unknown; overrides?: ButtonOverrides; /** Defines the shape of the button */ shape?: keyof typeof SHAPE; /** Defines the size of the button */ size?: keyof typeof SIZE; /** A helper rendered at the start of the button. */ startEnhancer?: React.ReactNode | React.ComponentType; type?: 'submit' | 'reset' | 'button'; } export interface LinkButtonProps { /** Convert button to tag allowing for opening links directly. * * Use this over window.open as it handles accessibility better. */ href?: string | null; target?: string; } export interface ButtonProps extends BaseButtonProps, LinkButtonProps { } export type SharedStyleProps | keyof JSX.IntrinsicElements> = { $colors?: CustomColors; $kind?: keyof typeof KIND; $isSelected?: boolean; $shape?: keyof typeof SHAPE; $size?: keyof typeof SIZE; $isLoading?: boolean; $disabled?: boolean; $isFocusVisible?: boolean; $as?: AS; }; export {};