Spaces:
Configuration error
Configuration error
File size: 1,604 Bytes
74aacd5 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 |
import React, { ReactNode } from 'react'
import Tooltip from './Tooltip'
interface ButtonProps {
border?: boolean
disabled?: boolean
children?: ReactNode
className?: string
icon?: ReactNode
toolTip?: string
onKeyDown?: () => void
onClick?: () => void
onDown?: (ev: PointerEvent) => void
onUp?: (ev: PointerEvent) => void
style?: React.CSSProperties
}
const Button: React.FC<ButtonProps> = props => {
const {
children,
border,
className,
disabled,
icon,
toolTip,
onKeyDown,
onClick,
onDown,
onUp,
style,
} = props
const blurOnClick = (e: React.MouseEvent<HTMLDivElement>) => {
e.currentTarget.blur()
onClick?.()
}
const renderButton = () => {
return (
<div
role="button"
style={style}
onKeyDown={onKeyDown}
onClick={blurOnClick}
onPointerDown={(ev: React.PointerEvent<HTMLDivElement>) => {
onDown?.(ev.nativeEvent)
}}
onPointerUp={(ev: React.PointerEvent<HTMLDivElement>) => {
onUp?.(ev.nativeEvent)
}}
tabIndex={-1}
className={[
'btn-primary',
children ? 'btn-primary-content' : '',
disabled === true ? 'btn-primary-disabled' : '',
className,
border ? `btn-border` : '',
].join(' ')}
>
{icon}
{children}
</div>
)
}
if (toolTip) {
return <Tooltip content={toolTip}>{renderButton()}</Tooltip>
}
return renderButton()
}
Button.defaultProps = {
disabled: false,
border: false,
}
export default Button
|