@widergy/energy-ui 2.10.1 → 2.12.0

package/dist/components/UTCheckbox/index.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -20,15 +19,9 @@ var _theme = require("./theme");
 var _constants = require("./constants");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var Checked = function Checked(props) {
   return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
     d: "M10 14zm0 3l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
@@ -38,47 +31,43 @@ Checked.defaultProps = {
   xmlns: "http://www.w3.org/2000/svg",
   viewBox: "5 6.58 14 10.42"
 };
-var UTCheckbox = function UTCheckbox(_ref) {
-  var _ref$classes = _ref.classes,
-    themeClasses = _ref$classes === void 0 ? {} : _ref$classes,
-    classNames = _ref.classNames,
-    _ref$color = _ref.color,
-    color = _ref$color === void 0 ? 'primary' : _ref$color,
-    _ref$CustomCheckedIco = _ref.CustomCheckedIcon,
-    CustomCheckedIcon = _ref$CustomCheckedIco === void 0 ? Checked : _ref$CustomCheckedIco,
-    CustomRowLabel = _ref.customRowLabel,
-    _ref$CustomUncheckedI = _ref.CustomUncheckedIcon,
-    CustomUncheckedIcon = _ref$CustomUncheckedI === void 0 ? function (_ref2) {
-      var className = _ref2.className;
+const UTCheckbox = _ref => {
+  let {
+    classes: themeClasses = {},
+    classNames,
+    color = 'primary',
+    CustomCheckedIcon = Checked,
+    customRowLabel: CustomRowLabel,
+    CustomUncheckedIcon = _ref2 => {
+      let {
+        className
+      } = _ref2;
       return /*#__PURE__*/_react.default.createElement("div", {
         className: className
       });
-    } : _ref$CustomUncheckedI,
-    disabled = _ref.disabled,
-    disableRipple = _ref.disableRipple,
-    input = _ref.input,
-    item = _ref.item,
-    label = _ref.label,
-    _ref$labelProps = _ref.labelProps,
-    labelProps = _ref$labelProps === void 0 ? {} : _ref$labelProps,
-    meta = _ref.meta,
-    onChange = _ref.onChange,
-    showError = _ref.showError,
-    tooltipContent = _ref.tooltipContent,
-    useCustomIcons = _ref.useCustomIcons,
-    value = _ref.value;
-  var _useMutableState = (0, _energyHooks.useMutableState)(value),
-    _useMutableState2 = _slicedToArray(_useMutableState, 2),
-    checkedRef = _useMutableState2[0],
-    setChecked = _useMutableState2[1];
-  var handleChange = function handleChange(event) {
+    },
+    disabled,
+    disableRipple,
+    input,
+    item,
+    label,
+    labelProps = {},
+    meta,
+    onChange,
+    showError,
+    tooltipContent,
+    useCustomIcons,
+    value
+  } = _ref;
+  const [checkedRef, setChecked] = (0, _energyHooks.useMutableState)(value);
+  const handleChange = event => {
     if (onChange) onChange(value);
     if (input !== null && input !== void 0 && input.onChange) input.onChange(event.target.checked);
   };
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     setChecked(value || (input === null || input === void 0 ? void 0 : input.value));
   }, [input === null || input === void 0 ? void 0 : input.value, value]);
-  var classes = (0, _classesUtils.mergeClasses)(themeClasses, classNames);
+  const classes = (0, _classesUtils.mergeClasses)(themeClasses, classNames);
   return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
     disabled: disabled,
     control: /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {

package/dist/components/UTCheckbox/theme.js

@@ -8,8 +8,10 @@ var _seamlessImmutable = require("seamless-immutable");
 var _styles = require("@material-ui/core/styles");
 var _colorsModule = _interopRequireDefault(require("../../scss/variables/colors.module.scss"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var retrieveStyle = exports.retrieveStyle = function retrieveStyle(_ref) {
-  var theme = _ref.theme;
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
   return {
     checkedIcon: {
       width: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'icon', 'checked', 'width']),
@@ -33,45 +35,45 @@ var retrieveStyle = exports.retrieveStyle = function retrieveStyle(_ref) {
     }
   };
 };
-var retrieveMuiTheme = exports.retrieveMuiTheme = function retrieveMuiTheme(theme) {
-  return (0, _styles.createTheme)({
-    typography: {
-      fontFamily: (0, _seamlessImmutable.getIn)(theme, ['Fonts', 'fontFamily'])
-    },
-    overrides: {
-      MuiFormControlLabel: {
-        label: {
+exports.retrieveStyle = retrieveStyle;
+const retrieveMuiTheme = theme => (0, _styles.createTheme)({
+  typography: {
+    fontFamily: (0, _seamlessImmutable.getIn)(theme, ['Fonts', 'fontFamily'])
+  },
+  overrides: {
+    MuiFormControlLabel: {
+      label: {
+        fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'fontSize'], 14),
+        color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'color'], _colorsModule.default.primary),
+        '& span': {
           fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'fontSize'], 14),
           color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'color'], _colorsModule.default.primary),
-          '& span': {
-            fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'fontSize'], 14),
-            color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'label', 'color'], _colorsModule.default.primary),
-            '& a': {
-              color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'linkLabel', 'color'], _colorsModule.default.primary)
-            }
+          '& a': {
+            color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'linkLabel', 'color'], _colorsModule.default.primary)
           }
         }
-      },
-      MuiFormHelperText: {
-        root: {
-          fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'helperText', 'fontSize'], 14),
-          color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'helperText', 'color'], _colorsModule.default.primary),
-          '&$error': {
-            color: theme.Palette.error['05']
-          }
+      }
+    },
+    MuiFormHelperText: {
+      root: {
+        fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'helperText', 'fontSize'], 14),
+        color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'helperText', 'color'], _colorsModule.default.primary),
+        '&$error': {
+          color: theme.Palette.error['05']
         }
+      }
+    },
+    MuiCheckbox: {
+      root: {
+        color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'color'], _colorsModule.default.gray)
       },
-      MuiCheckbox: {
-        root: {
-          color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'color'], _colorsModule.default.gray)
-        },
-        colorPrimary: {
-          color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'color'], _colorsModule.default.gray),
-          '&$checked': {
-            color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'checkedColor'], _colorsModule.default.inputPrimary)
-          }
+      colorPrimary: {
+        color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'color'], _colorsModule.default.gray),
+        '&$checked': {
+          color: (0, _seamlessImmutable.getIn)(theme, ['UTCheckbox', 'checkbox', 'checkedColor'], _colorsModule.default.inputPrimary)
         }
       }
     }
-  });
-};
+  }
+});
+exports.retrieveMuiTheme = retrieveMuiTheme;

package/dist/components/UTConsumptionBar/components/ConsumptionBarIndicator/index.js

@@ -10,13 +10,14 @@ var _propTypes = require("prop-types");
 var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var ConsumptionBarIndicator = function ConsumptionBarIndicator(_ref) {
-  var left = _ref.left,
-    value = _ref.value,
-    _ref$unit = _ref.unit,
-    unit = _ref$unit === void 0 ? 'kWh' : _ref$unit,
-    total = _ref.total,
-    classes = _ref.classes;
+const ConsumptionBarIndicator = _ref => {
+  let {
+    left,
+    value,
+    unit = 'kWh',
+    total,
+    classes
+  } = _ref;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.indicator,
     style: {

package/dist/components/UTConsumptionBar/constants.js

@@ -4,6 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.UP = exports.MIN_LINE_WIDTH = exports.DOWN = void 0;
-var UP = exports.UP = 'up';
-var DOWN = exports.DOWN = 'down';
-var MIN_LINE_WIDTH = exports.MIN_LINE_WIDTH = '550';
+const UP = exports.UP = 'up';
+const DOWN = exports.DOWN = 'down';
+const MIN_LINE_WIDTH = exports.MIN_LINE_WIDTH = '550';

package/dist/components/UTConsumptionBar/index.js

@@ -1,6 +1,5 @@
 "use strict";
 
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,70 +12,49 @@ var _ConsumptionBarIndicator = _interopRequireDefault(require("./components/Cons
 var _constants = require("./constants");
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var UTConsumptionBar = function UTConsumptionBar(_ref) {
-  var small = _ref.small,
-    values = _ref.values,
-    categoryLines = _ref.categoryLines,
-    classes = _ref.classes;
-  var widthRef = (0, _react.useRef)();
-  var _useState = (0, _react.useState)(true),
-    _useState2 = _slicedToArray(_useState, 2),
-    showLabel = _useState2[0],
-    setShowLabel = _useState2[1];
-  var handleSetShowLabel = function handleSetShowLabel() {
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+const UTConsumptionBar = _ref => {
+  let {
+    small,
+    values,
+    categoryLines,
+    classes
+  } = _ref;
+  const widthRef = (0, _react.useRef)();
+  const [showLabel, setShowLabel] = (0, _react.useState)(true);
+  const handleSetShowLabel = () => {
     if (widthRef.current.offsetWidth < _constants.MIN_LINE_WIDTH) setShowLabel(false);else setShowLabel(true);
   };
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     window.addEventListener('resize', handleSetShowLabel);
     handleSetShowLabel();
-    return function () {
-      return window.removeEventListener('resize', handleSetShowLabel);
-    };
+    return () => window.removeEventListener('resize', handleSetShowLabel);
   }, []);
-  var downIndicators = values.filter(function (value) {
-    return value.position === _constants.DOWN;
-  });
-  var upIndicators = values.filter(function (value) {
-    return value.position === _constants.UP;
-  });
-  var maxValue = Math.max.apply(Math, _toConsumableArray(categoryLines.rates.map(function (category) {
-    return category.range[0];
-  })));
-  var getLeftPosition = function getLeftPosition(watts) {
-    return 25 * 100 / maxValue * (watts / 25);
-  };
-  var getIndicatorPosition = function getIndicatorPosition(value) {
-    return value <= maxValue && value >= 0 ? getLeftPosition(value) : value < 0 ? 0 : 101.7;
-  };
-  var renderCategoryLines = function renderCategoryLines() {
-    var categoryLine = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    var index = arguments.length > 1 ? arguments[1] : undefined;
-    var elements = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
-    var range = categoryLine.range,
-      category = categoryLine.category,
-      name = categoryLine.name;
-    var kwh = range[0];
-    var barPosition = getLeftPosition(kwh);
-    var nextBarPosition;
+  const downIndicators = values.filter(value => value.position === _constants.DOWN);
+  const upIndicators = values.filter(value => value.position === _constants.UP);
+  const maxValue = Math.max(...categoryLines.rates.map(category => category.range[0]));
+  const getLeftPosition = watts => 25 * 100 / maxValue * (watts / 25);
+  const getIndicatorPosition = value => value <= maxValue && value >= 0 ? getLeftPosition(value) : value < 0 ? 0 : 101.7;
+  const renderCategoryLines = function () {
+    let categoryLine = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    let index = arguments.length > 1 ? arguments[1] : undefined;
+    let elements = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+    const {
+      range,
+      category,
+      name
+    } = categoryLine;
+    const kwh = range[0];
+    const barPosition = getLeftPosition(kwh);
+    let nextBarPosition;
     if (elements.length === index + 1) {
       nextBarPosition = barPosition + 4;
     } else {
       nextBarPosition = getLeftPosition(elements[index + 1].kwh);
     }
-    var width = (nextBarPosition - barPosition) / 2;
-    var tippyContent = Number.isInteger(range[1]) ? "".concat(range[0], " - ").concat(range[1], " kWh") : "".concat(range[0], "+ kWh");
+    const width = (nextBarPosition - barPosition) / 2;
+    const tippyContent = Number.isInteger(range[1]) ? "".concat(range[0], " - ").concat(range[1], " kWh") : "".concat(range[0], "+ kWh");
     return /*#__PURE__*/_react.default.createElement("div", {
       key: category,
       className: _stylesModule.default.categoryLineContainer,
@@ -86,17 +64,15 @@ var UTConsumptionBar = function UTConsumptionBar(_ref) {
       }
     }, /*#__PURE__*/_react.default.createElement("div", {
       className: _stylesModule.default.lineContainer
-    }, upIndicators.map(function (indicator) {
-      return kwh === indicator.value && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-        className: _stylesModule.default.subsidiableAmountLabel,
-        weight: "bold"
-      }, indicator.title), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-        className: _stylesModule.default.warningText,
-        colorTheme: "gray"
-      }, indicator.subtitle), /*#__PURE__*/_react.default.createElement("div", {
-        className: _stylesModule.default.indicatorMarker
-      }));
-    }), /*#__PURE__*/_react.default.createElement("div", {
+    }, upIndicators.map(indicator => kwh === indicator.value && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+      className: _stylesModule.default.subsidiableAmountLabel,
+      weight: "bold"
+    }, indicator.title), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+      className: _stylesModule.default.warningText,
+      colorTheme: "gray"
+    }, indicator.subtitle), /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.indicatorMarker
+    }))), /*#__PURE__*/_react.default.createElement("div", {
       className: _stylesModule.default.line
     })), /*#__PURE__*/_react.default.createElement(_react2.default, {
       content: "Categor\xEDa ".concat(name, ": ").concat(tippyContent),
@@ -115,18 +91,16 @@ var UTConsumptionBar = function UTConsumptionBar(_ref) {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(_stylesModule.default.bar, " ").concat(downIndicators.length > 0 && _stylesModule.default.colorizedBar),
     ref: widthRef
-  }), categoryLines.rates.map(renderCategoryLines), downIndicators.map(function (indicator) {
-    return /*#__PURE__*/_react.default.createElement(_ConsumptionBarIndicator.default, {
-      classes: classes,
-      className: _stylesModule.default.indicator,
-      key: indicator.title,
-      left: getIndicatorPosition(indicator.value),
-      small: small,
-      total: indicator.total,
-      unit: indicator.title,
-      value: indicator.value
-    });
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  }), categoryLines.rates.map(renderCategoryLines), downIndicators.map(indicator => /*#__PURE__*/_react.default.createElement(_ConsumptionBarIndicator.default, {
+    classes: classes,
+    className: _stylesModule.default.indicator,
+    key: indicator.title,
+    left: getIndicatorPosition(indicator.value),
+    small: small,
+    total: indicator.total,
+    unit: indicator.title,
+    value: indicator.value
+  }))), /*#__PURE__*/_react.default.createElement("div", {
     className: "".concat(_stylesModule.default.finishLine1, " ").concat(downIndicators.length > 0 && _stylesModule.default.colorizedLine)
   }));
 };