CoastalCommitsPastes/client/app/components/button/index.tsx

47 lines
915 B
TypeScript
Raw Normal View History

2022-04-09 20:48:19 -04:00
import styles from "./button.module.css"
import { forwardRef, Ref } from "react"
type Props = React.HTMLProps<HTMLButtonElement> & {
2022-04-09 20:48:19 -04:00
children: React.ReactNode
buttonType?: "primary" | "secondary"
className?: string
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void
iconRight?: React.ReactNode
}
// eslint-disable-next-line react/display-name
const Button = forwardRef<HTMLButtonElement, Props>(
2022-04-09 20:48:19 -04:00
(
{
children,
onClick,
className,
buttonType = "primary",
type = "button",
disabled = false,
iconRight,
2022-04-09 20:48:19 -04:00
...props
},
ref
) => {
return (
<button
ref={ref}
className={`${styles.button} ${styles[type]} ${className}`}
disabled={disabled}
onClick={onClick}
{...props}
>
{children}
{iconRight && (
<span className={`${styles.icon} ${styles.iconRight}`}>
{iconRight}
</span>
)}
2022-04-09 20:48:19 -04:00
</button>
)
}
)
export default Button