"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _useSettings2 = _interopRequireDefault(require("../vm-hooks/useSettings"));

require("./style");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

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); }

var StatItem = function StatItem(props) {
  var icon = props.icon,
      label = props.label,
      _props$value = props.value,
      value = _props$value === void 0 ? 0 : _props$value,
      unit = props.unit,
      color = props.color;
  var style = {};
  var values = [];
  var units = [];

  if (value instanceof Array) {
    values = value;
    units = unit;
  } else {
    values.push(value);
    units.push(unit);
  }

  if (color) style.color = color;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "stat-item"
  }, /*#__PURE__*/_react["default"].createElement("img", {
    src: icon,
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement("div", {
    className: "data"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "label"
  }, label), /*#__PURE__*/_react["default"].createElement("div", {
    className: "value"
  }, values.map(function (v, i) {
    var u = units[i];
    return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
      className: "number",
      style: style
    }, v), u && /*#__PURE__*/_react["default"].createElement("span", {
      className: "unit"
    }, u));
  }))));
};

StatItem.propTypes = {
  icon: _propTypes["default"].string,
  label: _propTypes["default"].string,
  value: _propTypes["default"].string,
  unit: _propTypes["default"].string,
  color: _propTypes["default"].string
};

var StatCollection = function StatCollection(props) {
  var items = props.items;

  var _useSettings = (0, _useSettings2["default"])(),
      theme = _useSettings.theme;

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "vtx-modal-stat-collection ".concat(theme)
  }, items.map(function (item) {
    return /*#__PURE__*/_react["default"].createElement(StatItem, _extends({
      key: item.label
    }, item));
  }));
};

StatCollection.propTypes = {
  items: _propTypes["default"].array
};
var _default = StatCollection;
exports["default"] = _default;
//# sourceMappingURL=index.js.map
