37 lines
1.1 KiB
JavaScript
37 lines
1.1 KiB
JavaScript
import React from 'react';
|
|
import cn from 'classnames';
|
|
import { Icon } from 'UI';
|
|
import stl from './controlButton.module.css';
|
|
|
|
const ControlButton = ({
|
|
label,
|
|
icon = '',
|
|
disabled=false,
|
|
onClick,
|
|
count = 0,
|
|
hasErrors=false,
|
|
active=false,
|
|
size = 20,
|
|
noLabel,
|
|
labelClassName,
|
|
containerClassName,
|
|
noIcon,
|
|
}) => (
|
|
<button
|
|
className={ cn(stl.controlButton, { [stl.disabled]: disabled }, "relative", active ? 'border-b-2 border-main' : 'rounded',containerClassName) }
|
|
onClick={ onClick }
|
|
id={"control-button-" + label.toLowerCase()}
|
|
disabled={disabled}
|
|
>
|
|
<div className={stl.labels}>
|
|
{ hasErrors && <div className={ stl.errorSymbol } /> }
|
|
{ count > 0 && <div className={ stl.countLabel }>{ count }</div>}
|
|
</div>
|
|
{!noIcon && <Icon name={ icon } size={size} color="gray-dark"/>}
|
|
{!noLabel && <span className={ cn(stl.label, labelClassName, active ? 'color-main' : 'color-gray-darkest') }>{ label }</span>}
|
|
</button>
|
|
);
|
|
|
|
ControlButton.displayName = 'ControlButton';
|
|
|
|
export default ControlButton;
|