import { clsx } from 'clsx'; import Body from '../body/Body'; import { Breakpoint, ControlType, Priority, Typography } from '../common'; import IconButton, { IconButtonProps } from '../iconButton'; import { useMedia } from '../common/hooks/useMedia'; /** * @deprecated Use `'default'` instead. */ type DeprecatedTypes = `${ControlType.ACCENT | ControlType.POSITIVE}`; export interface CircularButtonProps { className?: string; children: string; disabled?: boolean; icon: React.ReactElement<{ size?: unknown }> | React.ReactNode; onClick?: React.MouseEventHandler & React.MouseEventHandler & React.MouseEventHandler; priority?: `${Priority.PRIMARY | Priority.SECONDARY}`; /** * `"accent"` and `"positive"` values are **deprecated**, please use `"default"` instead */ type?: DeprecatedTypes | 'default' | `${ControlType.NEGATIVE}`; } const CircularButton = ({ className, children, disabled, icon, onClick, priority = Priority.PRIMARY, type = 'default', }: CircularButtonProps) => { const isTinyViewport = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`); return ( {icon} {children} ); }; export default CircularButton;