| 1 |
import {forwardRef, MouseEventHandler, ReactNode} from 'react'; |
| 2 |
import cx from 'classnames'; |
| 3 |
import './style.scss'; |
| 4 |
|
| 5 |
/** |
| 6 |
* |
| 7 |
* @since 3.0.0 |
| 8 |
*/ |
| 9 |
export type ButtonProps = { |
| 10 |
variant?: 'primary' | 'secondary' | 'danger'; |
| 11 |
size?: 'small' | 'large'; |
| 12 |
type?: 'button' | 'reset' | 'submit'; |
| 13 |
children: ReactNode; |
| 14 |
onClick?: MouseEventHandler; |
| 15 |
disabled?: boolean; |
| 16 |
className?: string; |
| 17 |
[x: string]: any; |
| 18 |
}; |
| 19 |
|
| 20 |
const Button = forwardRef<HTMLButtonElement, ButtonProps>( |
| 21 |
({children, type = 'button', variant = 'primary', size = 'small', disabled = false, className, ...props}, ref) => ( |
| 22 |
<button |
| 23 |
ref={ref} |
| 24 |
disabled={disabled} |
| 25 |
type={type} |
| 26 |
className={cx('givewp-button', variant, size, className)} |
| 27 |
{...props} |
| 28 |
> |
| 29 |
{children} |
| 30 |
</button> |
| 31 |
) |
| 32 |
); |
| 33 |
|
| 34 |
export default Button; |
| 35 |
|
