import React, { useCallback } from 'react';
import classnames from 'classnames';
import { is } from 'ramda';
import { useStyles } from './styles';
var widthIsNumber = function (width) { return is(Number, width); };
export var ColorBar = function (_a) {
    var className = _a.className, _b = _a.width, width = _b === void 0 ? 0 : _b, maxWidth = _a.maxWidth;
    var styles = useStyles();
    var getBarColorWidth = useCallback(function (width) {
        return (maxWidth ? (100 * width) / maxWidth : 0) + '%';
    }, [maxWidth]);
    return width ? (React.createElement("div", { className: classnames(styles.bar, className), style: { width: widthIsNumber(width) ? getBarColorWidth(width) : width } })) : null;
};
