@hypothesis/frontend-shared
Version:
Shared components, styles and utilities for Hypothesis projects
46 lines (45 loc) • 2.27 kB
TypeScript
/**
* @typedef {import('../../types').IconComponent} IconComponent
* @typedef {import('../../types').PresentationalProps} CommonProps
* @typedef {import('./ButtonBase').ButtonCommonProps} ButtonCommonProps
* @typedef {import('./ButtonBase').HTMLButtonAttributes} HTMLButtonAttributes
*
* @typedef IconButtonProps
* @prop {IconComponent} [icon] - reference to an icon function component
* to render in this button, e.g. CautionIcon
* @prop {'sm'|'md'|'lg'} [size='md']
* @prop {boolean} [disableTouchSizing=false] - Disable minimum tap target
* sizing for touch devices. This may be necessary in legacy patterns where
* there isn't enough room in the interface for these larger dimensions.
* @prop {'primary'|'secondary'|'dark'} [variant='secondary']
* @prop {string} title - Required for `IconButton` as there is no text label
*/
/**
* Render a button that only contains an icon.
*
* @param {CommonProps & ButtonCommonProps & IconButtonProps & HTMLButtonAttributes} props
*/
export default function IconButton({ children, classes, elementRef, pressed, expanded, icon: Icon, disableTouchSizing, size, title, variant, ...htmlAttributes }: CommonProps & ButtonCommonProps & IconButtonProps & HTMLButtonAttributes): import("preact").JSX.Element;
export type IconComponent = import('../../types').IconComponent;
export type CommonProps = import('../../types').PresentationalProps;
export type ButtonCommonProps = import('./ButtonBase').ButtonCommonProps;
export type HTMLButtonAttributes = import('./ButtonBase').HTMLButtonAttributes;
export type IconButtonProps = {
/**
* - reference to an icon function component
* to render in this button, e.g. CautionIcon
*/
icon?: import("preact").FunctionComponent<import("preact").JSX.SVGAttributes<SVGSVGElement>> | undefined;
size?: "sm" | "md" | "lg" | undefined;
/**
* - Disable minimum tap target
* sizing for touch devices. This may be necessary in legacy patterns where
* there isn't enough room in the interface for these larger dimensions.
*/
disableTouchSizing?: boolean | undefined;
variant?: "primary" | "dark" | "secondary" | undefined;
/**
* - Required for `IconButton` as there is no text label
*/
title: string;
};