@widergy/utilitygo-smart-bill-web 1.10.0 → 1.12.0

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

@@ -25,32 +25,31 @@ var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const Concept = _ref => {
-  let {
-    contextApiInfo,
-    isFirst,
-    title,
-    percentage,
-    progressBarPercentage,
-    value,
-    showPercentage,
-    negativeAmmount,
-    showProgressBar,
-    color
-  } = _ref;
-  const {
-    Label,
-    ProgressBar
-  } = contextApiInfo;
-  const {
-    isDesktopSize
-  } = (0, _hooks.useScreenSize)();
-  const alias = isFirst ? _aliases.CONCEPT_FIRST_AMOUNT : _aliases.CONCEPT_SECONDARY_AMOUNT;
-  const aliasDecimal = isFirst ? _aliases.CONCEPT_FIRST_AMOUNT_DECIMAL : _aliases.CONCEPT_SECONDARY_AMOUNT_DECIMAL;
-  const aliasName = isFirst ? _aliases.CONCEPT_FIRST_NAME : _aliases.CONCEPT_SECONDARY_NAME;
-  const percentageValue = "".concat((0, _numeral.default)(percentage).format('0,0.0'), "%");
-
-  const renderPercentageValidation = withProgresBar => showPercentage && percentage && (withProgresBar ? showProgressBar : !showProgressBar);
+var Concept = function Concept(_ref) {
+  var contextApiInfo = _ref.contextApiInfo,
+      isFirst = _ref.isFirst,
+      title = _ref.title,
+      percentage = _ref.percentage,
+      progressBarPercentage = _ref.progressBarPercentage,
+      value = _ref.value,
+      showPercentage = _ref.showPercentage,
+      negativeAmmount = _ref.negativeAmmount,
+      showProgressBar = _ref.showProgressBar,
+      color = _ref.color;
+  var Label = contextApiInfo.Label,
+      ProgressBar = contextApiInfo.ProgressBar;
+
+  var _useScreenSize = (0, _hooks.useScreenSize)(),
+      isDesktopSize = _useScreenSize.isDesktopSize;
+
+  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);
+  };
 
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.container

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

@@ -3,6 +3,12 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.RADIAN = void 0;
-const 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,55 +7,52 @@ 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 }; }
 
-const PieChartContainer = _ref => {
-  let {
-    concepts,
-    additionalInfo
-  } = _ref;
-  const pieConceptsData = concepts.map(concept => ({
-    color: concept.color,
-    name: concept.title,
-    value: concept.total
-  }));
+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,
+      contextApiInfo = _ref.contextApiInfo;
+  var PieChart = contextApiInfo.PieChart;
+  var pieConceptsData = concepts.map(function (concept) {
+    return {
+      color: concept.color,
+      name: concept.title,
+      value: concept.total
+    };
+  });
   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(concept => /*#__PURE__*/_react.default.createElement(_recharts.Cell, {
-    fill: concept.color,
-    stroke: "none"
-  })))))), concepts.map((concept, index) => (0, _utils.renderConcept)(concept, additionalInfo, index === 0)));
+    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

@@ -7,21 +7,23 @@ exports.toggleOptions = exports.progressBar = exports.pieChart = exports.COLORS
 
 var _colorsExport = require("../../../../scss/variables/_colorsExport.scss");
 
-const pieChart = 'pieChart';
+var pieChart = 'pieChart';
 exports.pieChart = pieChart;
-const progressBar = 'progressBar';
+var progressBar = 'progressBar';
 exports.progressBar = progressBar;
 
-const toggleOptions = assets => [{
-  value: progressBar,
-  Icon: assets.ListGrayIcon,
-  SelectedIcon: assets.ListWhiteIcon
-}, {
-  value: pieChart,
-  Icon: assets.PieGrayIcon,
-  SelectedIcon: assets.PieWhiteIcon
-}];
+var toggleOptions = function toggleOptions(assets) {
+  return [{
+    value: progressBar,
+    Icon: assets.ListGrayIcon,
+    SelectedIcon: assets.ListWhiteIcon
+  }, {
+    value: pieChart,
+    Icon: assets.PieGrayIcon,
+    SelectedIcon: assets.PieWhiteIcon
+  }];
+};
 
 exports.toggleOptions = toggleOptions;
-const COLORS = [_colorsExport.primary, _colorsExport.darkGray, _colorsExport.pieChartGray, _colorsExport.pieChartLightGray];
+var COLORS = [_colorsExport.primary, _colorsExport.darkGray, _colorsExport.pieChartGray, _colorsExport.pieChartLightGray];
 exports.COLORS = COLORS;

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

@@ -1,5 +1,7 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -25,45 +27,59 @@ var _utils = require("./utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+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 _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+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; }
 
-const BilledConcepts = _ref => {
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var BilledConcepts = function BilledConcepts(_ref) {
   var _billData$detail;
 
-  let {
-    contextApiInfo,
-    billData
-  } = _ref;
-  const {
-    config,
-    Label,
-    Toggle,
-    assets
-  } = contextApiInfo;
-  const {
-    showZeroConcepts,
-    colors
-  } = config;
-  const {
-    billedConceptsTitle
-  } = config.texts.billSummary;
-  const [toggleOption, setToggleOption] = (0, _react.useState)(_constants.progressBar);
-
-  const handleChangeToggleOption = newOption => setToggleOption(newOption);
-
-  const totalAmount = billData === null || billData === void 0 ? void 0 : (_billData$detail = billData.detail) === null || _billData$detail === void 0 ? void 0 : _billData$detail.total_amount;
-  const concepts = (0, _react.useMemo)(() => {
+  var contextApiInfo = _ref.contextApiInfo,
+      billData = _ref.billData;
+  var config = contextApiInfo.config,
+      Label = contextApiInfo.Label,
+      Toggle = contextApiInfo.Toggle,
+      assets = contextApiInfo.assets;
+  var showZeroConcepts = config.showZeroConcepts,
+      colors = config.colors;
+  var billedConceptsTitle = config.texts.billSummary.billedConceptsTitle;
+
+  var _useState = (0, _react.useState)(_constants.progressBar),
+      _useState2 = _slicedToArray(_useState, 2),
+      toggleOption = _useState2[0],
+      setToggleOption = _useState2[1];
+
+  var handleChangeToggleOption = function handleChangeToggleOption(newOption) {
+    return setToggleOption(newOption);
+  };
+
+  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, _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));
   }, []);
-  const negativeAmmount = concepts.some(concept => concept.total < 0);
-  const additionalInfo = {
+  var negativeAmmount = concepts.some(function (concept) {
+    return concept.total < 0;
+  });
+  var additionalInfo = {
     showProgressBar: toggleOption === _constants.progressBar,
-    negativeAmmount: concepts.some(concept => concept.total < 0),
-    totalAmount
+    negativeAmmount: concepts.some(function (concept) {
+      return concept.total < 0;
+    }),
+    totalAmount: totalAmount
   };
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _stylesModule.default.container
@@ -79,7 +95,9 @@ const BilledConcepts = _ref => {
     className: _stylesModule.default.toggle,
     optionClassName: _stylesModule.default.toggleOption,
     orientation: "horizontal"
-  })), !negativeAmmount && toggleOption === _constants.progressBar ? concepts.map((concept, index) => (0, _utils.renderConcept)(concept, additionalInfo, index === 0)) : /*#__PURE__*/_react.default.createElement(_PieChartContainer.default, {
+  })), !negativeAmmount && toggleOption === _constants.progressBar ? concepts.map(function (concept, index) {
+    return (0, _utils.renderConcept)(concept, additionalInfo, index === 0);
+  }) : /*#__PURE__*/_react.default.createElement(_PieChartContainer.default, {
     concepts: concepts,
     additionalInfo: additionalInfo
   }));

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

@@ -13,32 +13,56 @@ var _Concept = _interopRequireDefault(require("./components/Concept"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const roundPercentage = value => Math.round(value * 10) / 10;
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-const calculatePercentages = (billConcepts, totalAmount) => {
-  const indexToAdjust = billConcepts.findIndex(concept => concept.total !== 0);
-  const adjustValue = 100 - billConcepts.reduce((accum, concept) => accum + roundPercentage(concept.total / totalAmount * 100), 0);
-  return billConcepts.map((concept, index) => roundPercentage(concept.total / totalAmount * 100 + (index === indexToAdjust ? adjustValue : 0)));
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+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 _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 _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 _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; }
+
+var roundPercentage = function roundPercentage(value) {
+  return Math.round(value * 10) / 10;
+};
+
+var calculatePercentages = function calculatePercentages(billConcepts, totalAmount) {
+  var indexToAdjust = billConcepts.findIndex(function (concept) {
+    return concept.total !== 0;
+  });
+  var adjustValue = 100 - billConcepts.reduce(function (accum, concept) {
+    return accum + roundPercentage(concept.total / totalAmount * 100);
+  }, 0);
+  return billConcepts.map(function (concept, index) {
+    return roundPercentage(concept.total / totalAmount * 100 + (index === indexToAdjust ? adjustValue : 0));
+  });
 };
 
 exports.calculatePercentages = calculatePercentages;
 
-const getProgressBarPercentage = (maxPercentage, percentage) => percentage / maxPercentage * 100;
-
-const renderConcept = (conceptData, additionalInfo, isFirst) => {
-  const {
-    title,
-    total,
-    color,
-    percentage,
-    progressBarPercentage
-  } = conceptData;
-  const {
-    showProgressBar,
-    negativeAmmount,
-    totalAmount
-  } = additionalInfo;
-  const showPercentage = !(percentage === 0);
+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,
+      progressBarPercentage = conceptData.progressBarPercentage;
+  var showProgressBar = additionalInfo.showProgressBar,
+      negativeAmmount = additionalInfo.negativeAmmount,
+      totalAmount = additionalInfo.totalAmount;
+  var showPercentage = !(percentage === 0);
   return /*#__PURE__*/_react.default.createElement(_Concept.default, {
     key: title,
     title: title,
@@ -56,43 +80,51 @@ const renderConcept = (conceptData, additionalInfo, isFirst) => {
 
 exports.renderConcept = renderConcept;
 
-const isZeroConcept = concept => concept.total === 0;
+var isZeroConcept = function isZeroConcept(concept) {
+  return concept.total === 0;
+};
 
-const getSortedData = (concepts, showZeroConcepts) => {
-  const nonZeroConcepts = concepts === null || concepts === void 0 ? void 0 : concepts.filter(concept => !isZeroConcept(concept));
-  const zeroConcepts = showZeroConcepts && (concepts === null || concepts === void 0 ? void 0 : concepts.filter(isZeroConcept)) || [];
+var getSortedData = function getSortedData(concepts, showZeroConcepts) {
+  var nonZeroConcepts = concepts === null || concepts === void 0 ? void 0 : concepts.filter(function (concept) {
+    return !isZeroConcept(concept);
+  });
+  var zeroConcepts = showZeroConcepts && (concepts === null || concepts === void 0 ? void 0 : concepts.filter(isZeroConcept)) || [];
   return {
-    sortedConcepts: [...nonZeroConcepts, ...zeroConcepts],
+    sortedConcepts: [].concat(_toConsumableArray(nonZeroConcepts), _toConsumableArray(zeroConcepts)),
     nonZeroLength: nonZeroConcepts.length
   };
 };
 
-const getColorsDefinition = externalColors => [externalColors.primary || _constants.COLORS.primary, ..._constants.COLORS.slice(1)];
+var getColorsDefinition = function getColorsDefinition(externalColors) {
+  return [externalColors.primary || _constants.COLORS.primary].concat(_toConsumableArray(_constants.COLORS.slice(1)));
+};
 
 exports.getColorsDefinition = getColorsDefinition;
 
-const getItemColor = (index, nonZeroLength, colorsDefinition) => {
-  const colorsLen = _constants.COLORS.length;
-  const colorIndex = index % colorsLen;
-  const isLastNonZero = index === nonZeroLength - 1;
-  const nextColorIndex = (index + 1) % colorsLen;
+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 colorsDefinition[isLastNonZero && colorsDefinition[colorIndex] === colorsDefinition[0] ? nextColorIndex : colorIndex];
 };
 
 exports.getItemColor = getItemColor;
 
-const getOrderedAndColoredConcepts = (concepts, totalAmount, showZeroConcepts, colorsDefinition) => {
-  const {
-    sortedConcepts,
-    nonZeroLength
-  } = getSortedData(concepts, showZeroConcepts);
-  const percentages = calculatePercentages(sortedConcepts, totalAmount);
-  const maxPercentage = Math.max(...percentages);
-  return sortedConcepts.map((concept, index) => ({ ...concept,
-    percentage: percentages[index],
-    progressBarPercentage: getProgressBarPercentage(maxPercentage, percentages[index]),
-    color: !isZeroConcept(concept) && getItemColor(index, nonZeroLength, colorsDefinition)
-  }));
+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],
+      progressBarPercentage: getProgressBarPercentage(maxPercentage, percentages[index]),
+      color: !isZeroConcept(concept) && getItemColor(index, nonZeroLength, colorsDefinition)
+    });
+  });
 };
 
 exports.getOrderedAndColoredConcepts = getOrderedAndColoredConcepts;