import type { ReactNode } from 'react'; import type { ButtonProps as RACButtonProps } from 'react-aria-components'; import type { AriaLabelingProps, CommonProps, StringLikeChildren } from '../types.js'; /** * Props available on all buttons. */ export interface BaseButtonProps extends CommonProps { /** * Determines the visual appearance of the button. * @default 'secondary' */ variant?: 'primary' | 'secondary' | 'tertiary'; /** * Determines the color tone of the button. * @default 'base' */ tone?: 'base' | 'critical'; /** * The size of the button. * @default 'medium' */ size?: 'small' | 'medium' | 'large'; /** * Whether the button should take up the whole available width. * * @default false */ fullWidth?: boolean; } /** * Props available on buttons containing text. */ export interface TextButtonProps extends AriaLabelingProps { /** The text displayed on the button. */ children: StringLikeChildren; /** An icon displayed before the button text. */ iconStart?: ReactNode; /** An icon displayed after the button text. */ iconEnd?: ReactNode; } /** * Props available on buttons containing a single icon. */ export interface SingleIconButtonProps extends Omit { /** The icon displayed on the button. */ icon: ReactNode; /** The label describing the function of this button for assistive technologies. */ 'aria-label': string; } /** * Props available on buttons that perform an action (non-navigational). */ export interface ActionButtonProps extends Pick { /** * Whether the button is in a loading state. * This disables the button and replaces its contents with a spinner. * * @default false */ isLoading?: boolean; /** * A string that identifies the loading state to assistive technologies. * It will be announced by screen readers together with the button label. * You must provide this prop if `isLoading` is `true`. */ loadingLabel?: string; } //# sourceMappingURL=types.d.ts.map