@amsterdam/design-system-react/dist/IconButton/IconButton.d.ts

All React components from the Amsterdam Design System. Use it to compose pages in your website or application.

/**
 * @license EUPL-1.2+
 * Copyright Gemeente Amsterdam
 */
import type { ButtonHTMLAttributes } from 'react';
import type { IconProps } from '../Icon';
export declare const iconButtonColors: readonly ["contrast", "inverse"];
export type IconButtonColor = (typeof iconButtonColors)[number];
export type IconButtonProps = {
    /** Changes the text colour for readability on a light or dark background. */
    color?: IconButtonColor;
    /** 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?: IconButtonColor;
    /** 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>>;