UNPKG

@rws-air/webcomponents

Version:
62 lines 2.02 kB
import React from 'react'; import { TooltipProps } from '../../Tooltip'; export interface ToolbarButtonProps { /** The Material Icon to display in this paper button */ icon: JSX.Element; /** * Whether this button should be disabled or not * @default false */ disabled?: boolean; /** * The text content to put in the tooltip * @default 'Click Me' */ tooltipText?: TooltipProps['title']; /** * The placement for the tooltip * @default top */ tooltipPlacement?: TooltipProps['placement']; /** * Disables the inclusion of a tooltip * @default false */ disableTooltip?: boolean; /** * The elevation to apply to the paper component * @default 2 */ paperElevation?: number; /** Data-qa tag to apply to the paper component */ 'paper-data-qa'?: string; /** Custom CSS classes to pass to the paper component */ paperCustomclasses?: string | string[]; /** Data-qa tag to apply to the IconButton component */ 'iconButton-data-qa'?: string; /** Custom CSS classes to pass to the IconButton component */ iconButtonCustomclasses?: string | string[]; /** Custom CSS classes to pass to the Tooltip component */ tooltipCustomClasses?: string | string[]; /** Data-qa tag to apply to the Tooltip component */ 'tooltip-data-qa'?: string; /** The action to trigger when clicking the icon button */ onClick(...args: unknown[]): unknown; } /** * Constructs a ToolbarButton (elevated button with Material Paper) using pre-defined Rijkswaterstaat styling * @param props Props to pass to the ToolbarButton * @example * ```jsx * <ToolbarButton * icon={<CloudDownload/>} * disabled={false} * onClick={console.log} * tooltipText='SAMPLE' * tooltipPlacement={'top'} * disableTooltip={false} * /> * ``` */ export declare const ToolbarButton: React.MemoExoticComponent<(props: ToolbarButtonProps) => JSX.Element>; //# sourceMappingURL=index.d.ts.map