@widergy/utilitygo-smart-bill-web 1.7.3 → 1.10.1

package/dist/components/BillCalculation/utils.js

@@ -7,7 +7,7 @@ exports.periodToTitleMapper = void 0;
 
 var _string = require("@widergy/web-utils/lib/string");
 
-var _moment = _interopRequireDefault(require("moment"));
+var _dayjs = _interopRequireDefault(require("dayjs"));
 
 var _periodicities = require("../../shared/constants/periodicities");
 
@@ -15,21 +15,26 @@ var _periods = require("../../shared/utils/periods");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var periodToTitleMapper = function periodToTitleMapper(billData, texts, withBillCalcTitleDate) {
-  var _currentPeriod$settle, _currentPeriod$settle2, _currentPeriod$settle3, _currentPeriod$settle4, _currentPeriod$settle5, _currentPeriod$settle6;
+var periodToTitleMapper = function periodToTitleMapper(billData, texts, periodFormatter, withBillCalcTitleDate) {
+  var _settlements$current, _settlements$current2;
 
-  var currentPeriod = (0, _periods.getCurrentPeriod)(billData);
-  var periodicity = currentPeriod === null || currentPeriod === void 0 ? void 0 : (_currentPeriod$settle = currentPeriod.settlements) === null || _currentPeriod$settle === void 0 ? void 0 : _currentPeriod$settle.periodicity;
-  var currentSettlement = (currentPeriod === null || currentPeriod === void 0 ? void 0 : (_currentPeriod$settle2 = currentPeriod.settlements) === null || _currentPeriod$settle2 === void 0 ? void 0 : (_currentPeriod$settle3 = _currentPeriod$settle2.current) === null || _currentPeriod$settle3 === void 0 ? void 0 : _currentPeriod$settle3.number) || '-';
-  var totalSettlements = (currentPeriod === null || currentPeriod === void 0 ? void 0 : (_currentPeriod$settle4 = currentPeriod.settlements) === null || _currentPeriod$settle4 === void 0 ? void 0 : _currentPeriod$settle4.total_settlements) || '-';
+  var currentPeriod = (0, _periods.getCurrentPeriod)(billData) || {};
+  var settlements = currentPeriod.settlements;
+  var periodicity = settlements === null || settlements === void 0 ? void 0 : settlements.periodicity;
+  var currentSettlement = (settlements === null || settlements === void 0 ? void 0 : (_settlements$current = settlements.current) === null || _settlements$current === void 0 ? void 0 : _settlements$current.number) || '-';
+  var totalSettlements = (settlements === null || settlements === void 0 ? void 0 : settlements.total_settlements) || '-';
   var periodNumber = (currentPeriod === null || currentPeriod === void 0 ? void 0 : currentPeriod.number) || '-';
   var year = (currentPeriod === null || currentPeriod === void 0 ? void 0 : currentPeriod.year) || '-';
   var _texts$commons = texts.commons,
       settlement = _texts$commons.settlement,
       period = _texts$commons.period,
       bimester = _texts$commons.bimester;
-  var issueedDate = currentPeriod === null || currentPeriod === void 0 ? void 0 : (_currentPeriod$settle5 = currentPeriod.settlements) === null || _currentPeriod$settle5 === void 0 ? void 0 : (_currentPeriod$settle6 = _currentPeriod$settle5.current) === null || _currentPeriod$settle6 === void 0 ? void 0 : _currentPeriod$settle6.issued_on;
-  var issuedDateLabel = withBillCalcTitleDate ? " (".concat((0, _moment.default)(issueedDate, 'YYYY-MM-DD').format('MM/YYYY'), ")") : '';
+  var issueedDate = settlements === null || settlements === void 0 ? void 0 : (_settlements$current2 = settlements.current) === null || _settlements$current2 === void 0 ? void 0 : _settlements$current2.issued_on;
+  var issuedDateLabel = withBillCalcTitleDate ? " (".concat((0, _dayjs.default)(issueedDate, 'YYYY-MM-DD').format('MM/YYYY'), ")") : '';
+  if (periodFormatter) return periodFormatter({
+    startDate: settlements === null || settlements === void 0 ? void 0 : settlements.start_date,
+    endDate: settlements === null || settlements === void 0 ? void 0 : settlements.end_date
+  });
   if ((0, _string.stringToCompareWithoutAccentsInclusive)(periodicity, _periodicities.PERIODICITY.MONTHLY)) return "".concat(year, " - ").concat(period, " ").concat(periodNumber).concat(issuedDateLabel);
   if ((0, _string.stringToCompareWithoutAccentsInclusive)(periodicity, _periodicities.PERIODICITY.BIMONTHLY)) return "".concat(settlement, " ").concat(currentSettlement, " ").concat(texts.commons.ofPreposition, " ").concat(totalSettlements, " - ").concat(bimester, " ").concat(periodNumber).concat(issuedDateLabel);
   return '-';

package/dist/components/BillSummary/components/BilledConcepts/components/Concept/index.js

@@ -30,6 +30,7 @@ var Concept = function Concept(_ref) {
       isFirst = _ref.isFirst,
       title = _ref.title,
       percentage = _ref.percentage,
+      progressBarPercentage = _ref.progressBarPercentage,
       value = _ref.value,
       showPercentage = _ref.showPercentage,
       negativeAmmount = _ref.negativeAmmount,
@@ -41,23 +42,15 @@ var Concept = function Concept(_ref) {
   var _useScreenSize = (0, _hooks.useScreenSize)(),
       isDesktopSize = _useScreenSize.isDesktopSize;
 
-  var Percentage = function Percentage() {
-    return /*#__PURE__*/_react.default.createElement(Label, {
-      primary: isFirst,
-      gray: !isFirst,
-      semibold: true,
-      large: true,
-      className: _stylesModule.default.graphicPercentages
-    }, "(".concat((0, _numeral.default)(percentage).format('0,0.0'), "%)"));
-  };
+  var alias = isFirst ? _aliases.CONCEPT_FIRST_AMOUNT : _aliases.CONCEPT_SECONDARY_AMOUNT;
+  var aliasDecimal = isFirst ? _aliases.CONCEPT_FIRST_AMOUNT_DECIMAL : _aliases.CONCEPT_SECONDARY_AMOUNT_DECIMAL;
+  var aliasName = isFirst ? _aliases.CONCEPT_FIRST_NAME : _aliases.CONCEPT_SECONDARY_NAME;
+  var percentageValue = "".concat((0, _numeral.default)(percentage).format('0,0.0'), "%");
 
   var renderPercentageValidation = function renderPercentageValidation(withProgresBar) {
     return showPercentage && percentage && (withProgresBar ? showProgressBar : !showProgressBar);
   };
 
-  var alias = isFirst ? _aliases.CONCEPT_FIRST_AMOUNT : _aliases.CONCEPT_SECONDARY_AMOUNT;
-  var aliasDecimal = isFirst ? _aliases.CONCEPT_CARD_AMOUNT_DECIMAL : _aliases.CONCEPT_LIST_AMOUNT_DECIMAL;
-  var aliasName = isFirst ? _aliases.CONCEPT_FIRST_NAME : _aliases.CONCEPT_SECONDARY_NAME;
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.container
   }, /*#__PURE__*/_react.default.createElement("div", {
@@ -68,19 +61,18 @@ var Concept = function Concept(_ref) {
       backgroundColor: color
     }
   }), /*#__PURE__*/_react.default.createElement(Label, {
-    alias: aliasName,
-    className: _stylesModule.default.titleLabelContainer
-  }, title), isDesktopSize && renderPercentageValidation(false) && /*#__PURE__*/_react.default.createElement(Percentage, null), !isDesktopSize && /*#__PURE__*/_react.default.createElement("div", {
+    alias: aliasName
+  }, "".concat(title, " ").concat(renderPercentageValidation(false) ? "(".concat(percentageValue, ")") : '')), !isDesktopSize && /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.mobileAmount
   }, /*#__PURE__*/_react.default.createElement(_StyledAmount.default, {
     alias: alias,
     aliasDecimal: aliasDecimal,
     variant: "xlarge",
     amount: value
-  }))), !isDesktopSize && renderPercentageValidation(false) && /*#__PURE__*/_react.default.createElement(Percentage, null), renderPercentageValidation(true) && /*#__PURE__*/_react.default.createElement("div", {
+  }))), renderPercentageValidation(true) && /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.progressBarContainer
   }, /*#__PURE__*/_react.default.createElement(ProgressBar, {
-    value: percentage,
+    value: progressBarPercentage,
     classNames: {
       root: "".concat(_stylesModule.default.progressBarRoot, " ").concat(value === 0 && _stylesModule.default.hidden),
       barColorPrimary: isFirst ? _stylesModule.default.primaryProgressBar : _stylesModule.default.grayProgressBar,
@@ -88,7 +80,7 @@ var Concept = function Concept(_ref) {
       container: _stylesModule.default.progressContainer
     },
     withLabel: value !== 0,
-    customLabel: "".concat((0, _numeral.default)(percentage).format('0,0.0'), "%")
+    customLabel: percentageValue
   })), isDesktopSize && /*#__PURE__*/_react.default.createElement("div", {
     className: showProgressBar ? _stylesModule.default.progressBarValueContainer : _stylesModule.default.graphicValueContainer
   }, /*#__PURE__*/_react.default.createElement(_StyledAmount.default, {
@@ -105,6 +97,7 @@ Concept.propTypes = {
   title: _propTypes.string,
   value: _propTypes.number,
   percentage: _propTypes.number,
+  progressBarPercentage: _propTypes.number,
   showPercentage: _propTypes.bool,
   negativeAmmount: _propTypes.bool,
   showProgressBar: _propTypes.bool,

package/dist/components/BillSummary/components/BilledConcepts/components/Concept/styles.module.scss

@@ -9,7 +9,7 @@ $progress-bar-border-radius: 2px;
 %progress-bar-label {
   font-size: $xsmall;
   font-weight: 600;
-  margin: 0;
+  margin: 2px 0;
 
   @media #{$tablet-mobile} {
     font-size: $small;
@@ -59,10 +59,6 @@ $progress-bar-border-radius: 2px;
   width: 15px;
 }
 
-.titleLabelContainer {
-  max-width: 55%;
-}
-
 .graphicPercentages {
   margin-left: 24px;
 

package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/constants.js

@@ -3,6 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.RADIAN = void 0;
-var RADIAN = Math.PI / 180;
-exports.RADIAN = RADIAN;
+exports.PIE_CHART_CUSTOMIZATION = void 0;
+var PIE_CHART_CUSTOMIZATION = {
+  animationLength: 800,
+  height: 200,
+  minAngle: 0.1,
+  outerRadius: 100,
+  width: 200
+};
+exports.PIE_CHART_CUSTOMIZATION = PIE_CHART_CUSTOMIZATION;

package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/index.js

@@ -7,21 +7,27 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _recharts = require("recharts");
-
 var _propTypes = require("prop-types");
 
+var _smartBillTypes = require("../../../../../../shared/types/smartBillTypes");
+
+var _WithContextApi = _interopRequireDefault(require("../../../../../WithContextApi"));
+
 var _utils = require("../../utils");
 
-var _utils2 = require("./utils");
+var _constants = require("./constants");
 
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function _extends() { _extends = Object.assign || 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 PieChartContainer = function PieChartContainer(_ref) {
   var concepts = _ref.concepts,
-      additionalInfo = _ref.additionalInfo;
+      additionalInfo = _ref.additionalInfo,
+      contextApiInfo = _ref.contextApiInfo;
+  var PieChart = contextApiInfo.PieChart;
   var pieConceptsData = concepts.map(function (concept) {
     return {
       color: concept.color,
@@ -31,35 +37,22 @@ var PieChartContainer = function PieChartContainer(_ref) {
   });
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.container
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.graphContainer
-  }, !additionalInfo.negativeAmmount && /*#__PURE__*/_react.default.createElement(_recharts.ResponsiveContainer, {
-    height: 250
-  }, /*#__PURE__*/_react.default.createElement(_recharts.PieChart, {
-    width: 400,
-    height: 250
-  }, /*#__PURE__*/_react.default.createElement(_recharts.Pie, {
+  }, !additionalInfo.negativeAmmount && /*#__PURE__*/_react.default.createElement(PieChart, _extends({
+    className: _stylesModule.default.pie,
     data: pieConceptsData,
-    cx: "50%",
-    cy: "50%",
-    labelLine: false,
-    label: _utils2.renderCustomizedLabel,
-    outerRadius: 100,
-    fill: "#8884d8",
-    dataKey: "value"
-  }, concepts === null || concepts === void 0 ? void 0 : concepts.map(function (concept) {
-    return /*#__PURE__*/_react.default.createElement(_recharts.Cell, {
-      fill: concept.color,
-      stroke: "none"
-    });
-  }))))), concepts.map(function (concept) {
-    return (0, _utils.renderConcept)(concept, additionalInfo);
+    withLabels: false,
+    withLegend: false
+  }, _constants.PIE_CHART_CUSTOMIZATION)), concepts.map(function (concept, index) {
+    return (0, _utils.renderConcept)(concept, additionalInfo, index === 0);
   }));
 };
 
 PieChartContainer.propTypes = {
+  additionalInfo: (0, _propTypes.shape)((0, _propTypes.objectOf)(_propTypes.any)),
   concepts: (0, _propTypes.shape)((0, _propTypes.objectOf)(_propTypes.any)),
-  additionalInfo: (0, _propTypes.shape)((0, _propTypes.objectOf)(_propTypes.any))
+  contextApiInfo: _smartBillTypes.contextApiInfoTypes
 };
-var _default = PieChartContainer;
+
+var _default = (0, _WithContextApi.default)()(PieChartContainer);
+
 exports.default = _default;

package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/styles.module.scss

@@ -5,6 +5,6 @@
   flex-direction: column;
 }
 
-.graphContainer {
-  margin-bottom: 20px;
+.pie {
+  margin: auto auto 20px auto;
 }

package/dist/components/BillSummary/components/BilledConcepts/constants.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.COLORS = exports.toggleOptions = exports.progressBar = exports.pieChart = void 0;
+exports.toggleOptions = exports.progressBar = exports.pieChart = exports.COLORS = void 0;
 
 var _colorsExport = require("../../../../scss/variables/_colorsExport.scss");
 

package/dist/components/BillSummary/components/BilledConcepts/index.js

@@ -44,7 +44,7 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 var BilledConcepts = function BilledConcepts(_ref) {
-  var _billData$detail, _billData$detail2;
+  var _billData$detail;
 
   var contextApiInfo = _ref.contextApiInfo,
       billData = _ref.billData;
@@ -52,7 +52,8 @@ var BilledConcepts = function BilledConcepts(_ref) {
       Label = contextApiInfo.Label,
       Toggle = contextApiInfo.Toggle,
       assets = contextApiInfo.assets;
-  var showZeroConcepts = config.showZeroConcepts;
+  var showZeroConcepts = config.showZeroConcepts,
+      colors = config.colors;
   var billedConceptsTitle = config.texts.billSummary.billedConceptsTitle;
 
   var _useState = (0, _react.useState)(_constants.progressBar),
@@ -65,7 +66,11 @@ var BilledConcepts = function BilledConcepts(_ref) {
   };
 
   var totalAmount = billData === null || billData === void 0 ? void 0 : (_billData$detail = billData.detail) === null || _billData$detail === void 0 ? void 0 : _billData$detail.total_amount;
-  var concepts = (0, _utils.getOrderedAndColoredConcepts)(billData === null || billData === void 0 ? void 0 : (_billData$detail2 = billData.detail) === null || _billData$detail2 === void 0 ? void 0 : _billData$detail2.concepts, totalAmount, showZeroConcepts);
+  var concepts = (0, _react.useMemo)(function () {
+    var _billData$detail2;
+
+    return (0, _utils.getOrderedAndColoredConcepts)(billData === null || billData === void 0 ? void 0 : (_billData$detail2 = billData.detail) === null || _billData$detail2 === void 0 ? void 0 : _billData$detail2.concepts, totalAmount, showZeroConcepts, (0, _utils.getColorsDefinition)(colors));
+  }, []);
   var negativeAmmount = concepts.some(function (concept) {
     return concept.total < 0;
   });

package/dist/components/BillSummary/components/BilledConcepts/styles.module.scss

@@ -15,7 +15,7 @@ $toggle-size: 30px;
   padding: $default-container-padding $default-container-padding 0;
 
   @media #{$tablet-mobile} {
-    padding: $default-container-padding 15px 0;
+    padding: $default-container-padding;
   }
 }
 

package/dist/components/BillSummary/components/BilledConcepts/utils.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getOrderedAndColoredConcepts = exports.getItemColor = exports.renderConcept = exports.calculatePercentages = void 0;
+exports.renderConcept = exports.getOrderedAndColoredConcepts = exports.getItemColor = exports.getColorsDefinition = exports.calculatePercentages = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -49,11 +49,16 @@ var calculatePercentages = function calculatePercentages(billConcepts, totalAmou
 
 exports.calculatePercentages = calculatePercentages;
 
+var getProgressBarPercentage = function getProgressBarPercentage(maxPercentage, percentage) {
+  return percentage / maxPercentage * 100;
+};
+
 var renderConcept = function renderConcept(conceptData, additionalInfo, isFirst) {
   var title = conceptData.title,
       total = conceptData.total,
       color = conceptData.color,
-      percentage = conceptData.percentage;
+      percentage = conceptData.percentage,
+      progressBarPercentage = conceptData.progressBarPercentage;
   var showProgressBar = additionalInfo.showProgressBar,
       negativeAmmount = additionalInfo.negativeAmmount,
       totalAmount = additionalInfo.totalAmount;
@@ -62,6 +67,7 @@ var renderConcept = function renderConcept(conceptData, additionalInfo, isFirst)
     key: title,
     title: title,
     percentage: showPercentage && !negativeAmmount && percentage,
+    progressBarPercentage: progressBarPercentage,
     showPercentage: showPercentage,
     negativeAmmount: negativeAmmount,
     value: total,
@@ -89,26 +95,34 @@ var getSortedData = function getSortedData(concepts, showZeroConcepts) {
   };
 };
 
-var getItemColor = function getItemColor(index, nonZeroLength) {
+var getColorsDefinition = function getColorsDefinition(externalColors) {
+  return [externalColors.primary || _constants.COLORS.primary].concat(_toConsumableArray(_constants.COLORS.slice(1)));
+};
+
+exports.getColorsDefinition = getColorsDefinition;
+
+var getItemColor = function getItemColor(index, nonZeroLength, colorsDefinition) {
   var colorsLen = _constants.COLORS.length;
   var colorIndex = index % colorsLen;
   var isLastNonZero = index === nonZeroLength - 1;
   var nextColorIndex = (index + 1) % colorsLen;
-  return _constants.COLORS[isLastNonZero && _constants.COLORS[colorIndex] === _constants.COLORS[0] ? nextColorIndex : colorIndex];
+  return colorsDefinition[isLastNonZero && colorsDefinition[colorIndex] === colorsDefinition[0] ? nextColorIndex : colorIndex];
 };
 
 exports.getItemColor = getItemColor;
 
-var getOrderedAndColoredConcepts = function getOrderedAndColoredConcepts(concepts, totalAmount, showZeroConcepts) {
+var getOrderedAndColoredConcepts = function getOrderedAndColoredConcepts(concepts, totalAmount, showZeroConcepts, colorsDefinition) {
   var _getSortedData = getSortedData(concepts, showZeroConcepts),
       sortedConcepts = _getSortedData.sortedConcepts,
       nonZeroLength = _getSortedData.nonZeroLength;
 
   var percentages = calculatePercentages(sortedConcepts, totalAmount);
+  var maxPercentage = Math.max.apply(Math, _toConsumableArray(percentages));
   return sortedConcepts.map(function (concept, index) {
     return _objectSpread(_objectSpread({}, concept), {}, {
       percentage: percentages[index],
-      color: !isZeroConcept(concept) && getItemColor(index, nonZeroLength)
+      progressBarPercentage: getProgressBarPercentage(maxPercentage, percentages[index]),
+      color: !isZeroConcept(concept) && getItemColor(index, nonZeroLength, colorsDefinition)
     });
   });
 };

package/dist/components/BillSummary/styles.module.scss

@@ -5,7 +5,6 @@
 
 $containers-width: 50%;
 
-
 .container {
   display: flex;
   justify-content: center;
@@ -20,7 +19,7 @@ $containers-width: 50%;
 
 .ConsumptionBannerIcon {
   border-radius: $default-container-border-radius;
-  margin: 35px 0;
+  margin: 24px 0;
   width: 100%;
 }
 
@@ -49,7 +48,7 @@ $containers-width: 50%;
   padding: $default-container-padding;
 
   @media #{$tablet-mobile} {
-    padding: $default-container-padding 15px;
+    padding: $default-container-padding;
   }
 }
 

package/dist/components/ConsumptionComparison/components/ComparisonTable/components/DataLine/index.js

@@ -19,14 +19,14 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 var DataLine = function DataLine(_ref) {
   var fields = _ref.fields;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return !(0, _object.objectIsEmpty)(fields) && /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.container
-  }, !(0, _object.objectIsEmpty)(fields) && (fields === null || fields === void 0 ? void 0 : fields.map(function (field) {
+  }, fields === null || fields === void 0 ? void 0 : fields.map(function (field) {
     return field && /*#__PURE__*/_react.default.createElement("div", {
       key: field.id,
       className: _stylesModule.default.cell
     }, field.Component);
-  })));
+  }));
 };
 
 DataLine.propTypes = {

package/dist/components/ConsumptionComparison/components/ComparisonTable/components/DataLine/styles.module.scss

@@ -12,8 +12,8 @@
   }
 
   @media #{$tablet-mobile} {
-    justify-content: space-around;
-    margin-bottom: 0;
+    justify-content: space-between;
+    margin-bottom: 24px;
   }
 }
 
@@ -33,10 +33,12 @@
 
     &:first-child {
       justify-content: flex-start;
+      text-align: left;
     }
 
     &:last-child {
       justify-content: flex-end;
+      text-align: right;
     }
   }
 }

package/dist/components/ConsumptionComparison/components/ComparisonTable/components/Season/index.js

@@ -15,6 +15,8 @@ var _WithContextApi = _interopRequireDefault(require("../../../../../WithContext
 
 var _WithSeason = _interopRequireDefault(require("../../../../../WithSeason"));
 
+var _aliases = require("../../../../../../shared/constants/aliases");
+
 var _utils = require("./utils");
 
 var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
@@ -38,9 +40,7 @@ var Season = function Season(_ref) {
   }, /*#__PURE__*/_react.default.createElement(Icon, {
     className: _stylesModule.default.icon
   }), /*#__PURE__*/_react.default.createElement(Label, {
-    primary: true,
-    semibold: true,
-    large: true
+    alias: _aliases.SEASON
   }, text)) : null;
 };
 

package/dist/components/ConsumptionComparison/components/ComparisonTable/constants.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.noPeriodData = exports.getField = exports.desktopGetHeaderFields = exports.dataFieldDictonary = exports.NO_DATA_FIELD = exports.FIELD_AVERAGE_TEMPERATURE = exports.FIELD_DAILY_CONSUMPTIONS = exports.FIELD_TOTAL_CONSUMPTIONS = exports.FIELD_POWER_CONSUMPTION = exports.FIELD_ENERGY_CONSUMPTION = exports.FIELD_SETTLEMENTS_DAYS = exports.FIELD_PERIOD_DATES = exports.FIELD_PERIOD_COMPARISION = void 0;
+exports.noPeriodData = exports.getField = exports.desktopGetHeaderFields = exports.dataFieldDictonary = exports.NO_DATA_FIELD = exports.FIELD_TOTAL_CONSUMPTIONS = exports.FIELD_SETTLEMENTS_DAYS = exports.FIELD_POWER_CONSUMPTION = exports.FIELD_PERIOD_DATES = exports.FIELD_PERIOD_COMPARISION = exports.FIELD_ENERGY_CONSUMPTION = exports.FIELD_DAILY_CONSUMPTIONS = exports.FIELD_AVERAGE_TEMPERATURE = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _moment = _interopRequireDefault(require("moment"));
+var _dayjs = _interopRequireDefault(require("dayjs"));
 
 var _consumptions = require("../../../../shared/utils/consumptions");
 
@@ -62,8 +62,7 @@ var desktopGetHeaderFields = function desktopGetHeaderFields(contextApiInfo, wit
   return [{
     id: 'season',
     Component: /*#__PURE__*/_react.default.createElement(Label, {
-      alias: _aliases.DETAIL,
-      semibold: true
+      alias: _aliases.DETAIL
     }, withPowerComparison ? yearOrBimester : yearOrPeriod)
   }, {
     id: 'period_dates',
@@ -110,87 +109,112 @@ var formatInterval = function formatInterval(period) {
 
   var startDate = period === null || period === void 0 ? void 0 : (_period$settlements = period.settlements) === null || _period$settlements === void 0 ? void 0 : _period$settlements.start_date;
   var endDate = period === null || period === void 0 ? void 0 : (_period$settlements2 = period.settlements) === null || _period$settlements2 === void 0 ? void 0 : _period$settlements2.end_date;
-  return startDate && endDate && "".concat((0, _moment.default)(startDate).format('DD/MM'), " - ").concat((0, _moment.default)(endDate).format('DD/MM'));
+  return startDate && endDate && "".concat((0, _dayjs.default)(startDate).format('DD/MM'), " - ").concat((0, _dayjs.default)(endDate).format('DD/MM'));
 };
 
-var getField = function getField(options, contextApiInfo) {
-  var _options$data$period, _options$data$period$, _getDailyConsumption$, _ref;
+var getField = function getField() {
+  var _data$period, _data$period$settleme, _getDailyConsumption$, _ref;
 
+  var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var contextApiInfo = arguments.length > 1 ? arguments[1] : undefined;
   var Label = contextApiInfo.Label;
+  var isHeader = options.isHeader,
+      data = options.data,
+      primary = options.primary,
+      mobileLastYear = options.mobileLastYear,
+      text = options.text;
 
   var textLabel = /*#__PURE__*/_react.default.createElement(Label, {
     alias: _aliases.DETAIL
-  }, options.text);
+  }, text);
 
-  var textAlias = options.primary ? _aliases.PERIOD_COMPARISON_TEXT : _aliases.PERIOD_COMPARISON_TEXT_PREV;
-  var magnitudeAlias = options.primary ? _aliases.PERIOD_COMPARISON_NUMBER : _aliases.PERIOD_COMPARISON_NUMBER_PREV;
-  var unitAlias = options.primary ? _aliases.PERIOD_COMPARISON_UNIT : _aliases.PERIOD_COMPARISON_UNIT_PREV;
+  var textAlias = primary ? _aliases.PERIOD_COMPARISON_TEXT : _aliases.PERIOD_COMPARISON_TEXT_PREV;
+  var magnitudeAlias = primary ? _aliases.PERIOD_COMPARISON_NUMBER : _aliases.PERIOD_COMPARISON_NUMBER_PREV;
+  var unitAlias = primary ? _aliases.PERIOD_COMPARISON_UNIT : _aliases.PERIOD_COMPARISON_UNIT_PREV;
   return _ref = {}, _defineProperty(_ref, FIELD_PERIOD_COMPARISION, {
     id: FIELD_PERIOD_COMPARISION,
-    Component: !options.isHeader ? /*#__PURE__*/_react.default.createElement(Label, {
+    Component: !isHeader ? /*#__PURE__*/_react.default.createElement(Label, {
       alias: textAlias,
-      className: "".concat(options.mobileLastYear && _stylesModule.default.mobileLastYear)
-    }, options.text || (0, _utils.stringOrDash)(options.data)) : textLabel
+      className: "".concat(mobileLastYear && _stylesModule.default.mobileLastYear)
+    }, text || (0, _utils.stringOrDash)(data)) : textLabel
   }), _defineProperty(_ref, FIELD_PERIOD_DATES, {
     id: FIELD_PERIOD_DATES,
-    Component: !options.isHeader ? /*#__PURE__*/_react.default.createElement(Label, {
+    Component: !isHeader ? /*#__PURE__*/_react.default.createElement(Label, {
       alias: textAlias
-    }, options.text || (0, _utils.stringOrDash)(formatInterval(options.data))) : textLabel
+    }, text || (0, _utils.stringOrDash)(formatInterval(data))) : textLabel
   }), _defineProperty(_ref, FIELD_SETTLEMENTS_DAYS, {
     id: FIELD_SETTLEMENTS_DAYS,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: (_options$data$period = options.data.period) === null || _options$data$period === void 0 ? void 0 : (_options$data$period$ = _options$data$period.settlements) === null || _options$data$period$ === void 0 ? void 0 : _options$data$period$.total_settlements_days,
-      unit: options.data.daysUnit
+      value: (_data$period = data.period) === null || _data$period === void 0 ? void 0 : (_data$period$settleme = _data$period.settlements) === null || _data$period$settleme === void 0 ? void 0 : _data$period$settleme.total_settlements_days,
+      unit: data.daysUnit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : textLabel
   }), _defineProperty(_ref, FIELD_TOTAL_CONSUMPTIONS, {
     id: FIELD_TOTAL_CONSUMPTIONS,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).value,
-      unit: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).unit
+      value: (0, _consumptions.getTotalConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).value,
+      unit: (0, _consumptions.getTotalConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).unit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : textLabel
   }), _defineProperty(_ref, FIELD_ENERGY_CONSUMPTION, {
     id: FIELD_ENERGY_CONSUMPTION,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).value,
-      unit: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).unit
+      value: (0, _consumptions.getTotalConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).value,
+      unit: (0, _consumptions.getTotalConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).unit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : textLabel
   }), _defineProperty(_ref, FIELD_POWER_CONSUMPTION, {
     id: FIELD_POWER_CONSUMPTION,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.POWER_TYPES.REGISTERED).value,
-      unit: (0, _consumptions.getTotalConsumption)(options.data, _consumptions2.POWER_TYPES.REGISTERED).unit
+      value: (0, _consumptions.getTotalConsumption)(data, _consumptions2.POWER_TYPES.REGISTERED).value,
+      unit: (0, _consumptions.getTotalConsumption)(data, _consumptions2.POWER_TYPES.REGISTERED).unit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : textLabel
   }), _defineProperty(_ref, FIELD_DAILY_CONSUMPTIONS, {
     id: FIELD_DAILY_CONSUMPTIONS,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: (_getDailyConsumption$ = (0, _consumptions.getDailyConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).value) === null || _getDailyConsumption$ === void 0 ? void 0 : _getDailyConsumption$.toFixed(1).toString().replace(/\./, ','),
-      unit: (0, _consumptions.getDailyConsumption)(options.data, _consumptions2.ENERGY_TYPES.ACTIVE).unit
+      value: (_getDailyConsumption$ = (0, _consumptions.getDailyConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).value) === null || _getDailyConsumption$ === void 0 ? void 0 : _getDailyConsumption$.toFixed(1).toString().replace(/\./, ','),
+      unit: (0, _consumptions.getDailyConsumption)(data, _consumptions2.ENERGY_TYPES.ACTIVE).unit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : /*#__PURE__*/_react.default.createElement(Label, {
       alias: _aliases.DETAIL
-    }, options.text)
+    }, text)
   }), _defineProperty(_ref, FIELD_AVERAGE_TEMPERATURE, {
     id: FIELD_AVERAGE_TEMPERATURE,
-    Component: options.data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
+    Component: data ? /*#__PURE__*/_react.default.createElement(_Magnitude.default, {
       numberAlias: magnitudeAlias,
       unitAlias: unitAlias,
-      value: Math.round(options.data.periodAverageTemperature || options.data.period),
-      unit: options.data.temperatureUnit
+      value: Math.round(data.periodAverageTemperature || data.period),
+      unit: data.temperatureUnit,
+      classes: {
+        numberAndUnit: _stylesModule.default.numberAndUnit
+      }
     }) : textLabel
   }), _defineProperty(_ref, NO_DATA_FIELD, {
     id: NO_DATA_FIELD,
     Component: /*#__PURE__*/_react.default.createElement(Label, {
-      primary: options.primary
-    }, options.data)
+      alias: textAlias
+    }, data)
   }), _ref;
 };