gorbenko.pavel
32 lines
783 B
TypeScript
32 lines
783 B
TypeScript
import * as React from 'react';
|
|
import styles from './Button.module.scss';
|
|
import { Icon, IconName } from './Icon';
|
|
|
|
export type ButtonVariant = 'primary' | 'accent' | 'secondary' | 'ghost' | 'danger';
|
|
|
|
export interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
variant?: ButtonVariant;
|
|
size?: 'md' | 'sm';
|
|
icon?: IconName;
|
|
}
|
|
|
|
export const Button: React.FC<IButtonProps> = ({
|
|
variant = 'secondary',
|
|
size = 'md',
|
|
icon,
|
|
className,
|
|
children,
|
|
...rest
|
|
}) => {
|
|
const classes = [styles.btn, styles[variant], size === 'sm' ? styles.sm : '', className]
|
|
.filter(Boolean)
|
|
.join(' ');
|
|
|
|
return (
|
|
<button type="button" className={classes} {...rest}>
|
|
{icon && <Icon name={icon} size="sm" />}
|
|
{children}
|
|
</button>
|
|
);
|
|
};
|