import "./button.scss" ; import React , { ButtonHTMLAttributes , ReactNode } from "react" ; import { cssNames } from "../../utils" ; import { TooltipDecoratorProps , withTooltip } from "../tooltip" ; export interface ButtonProps extends ButtonHTMLAttributes < any > , TooltipDecoratorProps { label ? : React . ReactNode ; waiting ? : boolean ; primary ? : boolean ; accent ? : boolean ; outline ? : boolean ; hidden ? : boolean ; active ? : boolean ; big ? : boolean ; round ? : boolean ; href ? : string ; target ? : string ; } @ withTooltip export class Button extends React . PureComponent < ButtonProps , { } > { private link : HTMLAnchorElement ; private button : HTMLButtonElement ; render ( ) { var { className , waiting , label , primary , accent , outline , hidden , active , big , round , tooltip , children , ... props } = this . props ; var btnProps = props as Partial < ButtonProps > ; if ( hidden ) return null ; btnProps . className = cssNames ( 'Button' , className , { waiting , primary , accent , outline , active , big , round , } ) ; var btnContent = ( < > { label } { children } < />); if ( this . props . href ) { return ( < a { ... btnProps } ref = { e => this . link = e } > { btnContent } < /a>); } return ( < button type = "button" { ... btnProps } ref = { e => this . button = e } > { btnContent } < /button>); } }