function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from 'react';
import { motion } from 'framer-motion';
import { Box, TruncateWithTooltip, Flexbox } from '../../index';
import { Bar, Item, StyledDot } from './DistributionBar.styled';
export var DistributionBar = function DistributionBar(_ref) {
  var iconFromProps = _ref.icon,
    iconPadding = _ref.iconPadding,
    label = _ref.label,
    labelProps = _ref.labelProps,
    weight = _ref.weight,
    children = _ref.children,
    _ref$delay = _ref.delay,
    delay = _ref$delay === void 0 ? 0 : _ref$delay;
  return React.createElement(Flexbox, {
    container: true,
    alignItems: "center",
    justifyContent: "space-between",
    height: 8,
    width: "100%",
    gap: 2
  }, React.createElement(Item, _extends({
    item: true,
    container: true,
    alignItems: "center",
    gap: 3,
    height: "100%"
  }, labelProps), React.createElement(Box, _extends({
    pl: (iconPadding === null || iconPadding === void 0 ? void 0 : iconPadding.pl) || 2
  }, iconPadding), iconFromProps || React.createElement(StyledDot, {
    color: function color(t) {
      return t.color.buttonBackgroundHoverPrimary;
    }
  })), React.createElement(TruncateWithTooltip, {
    label: label
  }, label), React.createElement(Bar, {
    as: motion.div,
    initial: {
      width: '0'
    },
    animate: {
      width: "calc(".concat(weight, "% - 32px)")
    },
    transition: {
      type: 'linear',
      duration: 1,
      delay: delay
    }
  })), children);
};