@amsterdam/design-system-react
Version:
All React components from the Amsterdam Design System. Use it to compose pages in your website or application.
30 lines (29 loc) • 1.48 kB
TypeScript
/**
* @license EUPL-1.2+
* Copyright Gemeente Amsterdam
*/
import type { ButtonHTMLAttributes } from 'react';
import type { IconProps } from '../Icon';
export type IconButtonProps = {
/** Changes the text colour for readability on a light or dark background. */
color?: 'contrast' | 'inverse';
/** The accessible text for the button. Will be announced by screen readers. Should describe the button’s action. */
label: string;
/** The size of the icon. Match it to the text that the Icon Buttons aligns with. */
size?: IconProps['size'];
/** The component rendering the icon’s markup. */
svg?: IconProps['svg'];
} & ButtonHTMLAttributes<HTMLButtonElement>;
/**
* @see {@link https://designsystem.amsterdam/?path=/docs/components-buttons-icon-button--docs Icon Button docs at Amsterdam Design System}
*/
export declare const IconButton: import("react").ForwardRefExoticComponent<{
/** Changes the text colour for readability on a light or dark background. */
color?: "contrast" | "inverse";
/** The accessible text for the button. Will be announced by screen readers. Should describe the button’s action. */
label: string;
/** The size of the icon. Match it to the text that the Icon Buttons aligns with. */
size?: IconProps["size"];
/** The component rendering the icon’s markup. */
svg?: IconProps["svg"];
} & ButtonHTMLAttributes<HTMLButtonElement> & import("react").RefAttributes<HTMLButtonElement>>;