@widergy/utilitygo-smart-bill-web 2.2.1 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +20 -0
- package/dist/components/Advice/index.js +11 -8
- package/dist/components/Amount/index.js +27 -23
- package/dist/components/Amount/utils.js +1 -5
- package/dist/components/Banner/index.js +11 -8
- package/dist/components/BarChart/constants.js +3 -6
- package/dist/components/BarChart/index.js +29 -24
- package/dist/components/BarChart/utils.js +15 -15
- package/dist/components/BillCalculation/components/ConceptCard/index.js +53 -47
- package/dist/components/BillCalculation/components/Glossary/index.js +49 -66
- package/dist/components/BillCalculation/components/Glossary/styles.module.scss +1 -0
- package/dist/components/BillCalculation/constants.js +1 -2
- package/dist/components/BillCalculation/index.js +49 -53
- package/dist/components/BillCalculation/utils.js +19 -22
- package/dist/components/BillSummary/components/BilledConcepts/components/Concept/index.js +26 -24
- package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/constants.js +2 -3
- package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/index.js +16 -17
- package/dist/components/BillSummary/components/BilledConcepts/components/PieChartContainer/styles.module.scss +3 -3
- package/dist/components/BillSummary/components/BilledConcepts/constants.js +12 -17
- package/dist/components/BillSummary/components/BilledConcepts/index.js +30 -41
- package/dist/components/BillSummary/components/BilledConcepts/utils.js +44 -68
- package/dist/components/BillSummary/index.js +71 -71
- package/dist/components/ConsumptionComparison/components/ComparisonTable/components/DataLine/index.js +9 -10
- package/dist/components/ConsumptionComparison/components/ComparisonTable/components/Season/index.js +18 -12
- package/dist/components/ConsumptionComparison/components/ComparisonTable/components/Season/utils.js +1 -1
- package/dist/components/ConsumptionComparison/components/ComparisonTable/constants.js +144 -143
- package/dist/components/ConsumptionComparison/components/ComparisonTable/index.js +17 -16
- package/dist/components/ConsumptionComparison/components/ComparisonTable/utils.js +84 -88
- package/dist/components/ConsumptionComparison/components/ConsumptionAdvice/index.js +22 -13
- package/dist/components/ConsumptionComparison/components/ConsumptionAdvice/utils.js +1 -1
- package/dist/components/ConsumptionComparison/components/PercentageComparison/index.js +22 -16
- package/dist/components/ConsumptionComparison/components/PercentageComparison/utils.js +13 -9
- package/dist/components/ConsumptionComparison/index.js +42 -47
- package/dist/components/ConsumptionEnergyDetails/components/ConsumptionEnergyComparison/index.js +28 -24
- package/dist/components/ConsumptionEnergyDetails/components/ConsumptionEnergyComparison/styles.module.scss +1 -1
- package/dist/components/ConsumptionEnergyDetails/components/ConsumptionInDaysLabel/index.js +19 -15
- package/dist/components/ConsumptionEnergyDetails/components/EnergyTotalConsumption/index.js +16 -14
- package/dist/components/ConsumptionEnergyDetails/components/PercentageComparison/index.js +22 -17
- package/dist/components/ConsumptionEnergyDetails/components/PercentageComparison/utils.js +1 -1
- package/dist/components/ConsumptionEnergyDetails/index.js +47 -43
- package/dist/components/ConsumptionEnergyDetails/styles.module.scss +2 -2
- package/dist/components/ConsumptionIncluded/components/TimelineRow/components/Card/index.js +65 -62
- package/dist/components/ConsumptionIncluded/components/TimelineRow/components/Card/utils.js +11 -13
- package/dist/components/ConsumptionIncluded/components/TimelineRow/components/HeaderConsumption/index.js +21 -19
- package/dist/components/ConsumptionIncluded/components/TimelineRow/components/HeaderSettlement/index.js +17 -12
- package/dist/components/ConsumptionIncluded/components/TimelineRow/index.js +43 -39
- package/dist/components/ConsumptionIncluded/components/TimelineRow/styles.module.scss +2 -2
- package/dist/components/ConsumptionIncluded/index.js +32 -34
- package/dist/components/ConsumptionIncluded/utils.js +29 -33
- package/dist/components/ConsumptionPeriod/components/ConsumptionSummary/components/ReadingRow/index.js +15 -12
- package/dist/components/ConsumptionPeriod/components/ConsumptionSummary/index.js +24 -22
- package/dist/components/ConsumptionPeriod/components/HistoryGraph/index.js +19 -28
- package/dist/components/ConsumptionPeriod/components/Reading/index.js +36 -34
- package/dist/components/ConsumptionPeriod/index.js +13 -10
- package/dist/components/ConsumptionPeriod/utils.js +13 -15
- package/dist/components/Date/index.js +13 -11
- package/dist/components/DebtState/index.js +15 -10
- package/dist/components/IconAndDetails/index.js +20 -19
- package/dist/components/Magnitude/index.js +16 -14
- package/dist/components/Magnitude/utils.js +2 -8
- package/dist/components/MainBillData/components/BillAlert/components/BillParticularConditions/index.js +19 -16
- package/dist/components/MainBillData/components/BillAlert/index.js +25 -33
- package/dist/components/MainBillData/components/BillBody/components/ClientData/index.js +20 -13
- package/dist/components/MainBillData/components/BillBody/components/Consumption/index.js +15 -13
- package/dist/components/MainBillData/components/BillBody/components/Consumption/utils.js +1 -3
- package/dist/components/MainBillData/components/BillBody/components/ReadingDetails/index.js +24 -17
- package/dist/components/MainBillData/components/BillBody/components/ReadingDetails/styles.module.scss +2 -2
- package/dist/components/MainBillData/components/BillBody/components/ReadingDetails/utils.js +1 -1
- package/dist/components/MainBillData/components/BillBody/index.js +43 -46
- package/dist/components/MainBillData/components/BillHeader/components/TypeAndNumber/index.js +17 -13
- package/dist/components/MainBillData/components/BillHeader/index.js +30 -26
- package/dist/components/MainBillData/components/BillHeader/styles.module.scss +1 -1
- package/dist/components/MainBillData/index.js +8 -7
- package/dist/components/MainBillData/theme.js +7 -9
- package/dist/components/MainBillData/utils.js +1 -5
- package/dist/components/Period/index.js +55 -45
- package/dist/components/PowerProgresBar/components/PowerConsumption/index.js +16 -13
- package/dist/components/PowerProgresBar/index.js +32 -32
- package/dist/components/RateAndCategory/index.js +26 -29
- package/dist/components/RatesDefinition/components/BillRate/components/RatePrices/index.js +21 -15
- package/dist/components/RatesDefinition/components/BillRate/index.js +25 -16
- package/dist/components/RatesDefinition/components/BillRate/styles.module.scss +1 -1
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/Category/index.js +15 -11
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Indicator/components/IndicatorLabel/index.js +27 -23
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Indicator/index.js +12 -9
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Indicator/styles.module.scss +1 -1
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Indicator/utils.js +9 -9
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Legend/index.js +22 -21
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Stages/index.js +35 -38
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/components/Stages/styles.module.scss +0 -1
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/constants.js +2 -4
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/index.js +18 -32
- package/dist/components/RatesDefinition/components/CategoryByConsumption/components/RateStagesGraph/utils.js +35 -47
- package/dist/components/RatesDefinition/components/CategoryByConsumption/constants.js +18 -36
- package/dist/components/RatesDefinition/components/CategoryByConsumption/index.js +24 -33
- package/dist/components/RatesDefinition/components/CategoryByConsumption/utils.js +1 -5
- package/dist/components/RatesDefinition/components/PurchasedRate/index.js +20 -15
- package/dist/components/RatesDefinition/index.js +21 -17
- package/dist/components/RatesDefinition/styles.module.scss +1 -1
- package/dist/components/SmartBillProvider/index.js +13 -36
- package/dist/components/StyledAmount/constants.js +2 -3
- package/dist/components/StyledAmount/index.js +20 -29
- package/dist/components/WithContextApi/index.js +19 -27
- package/dist/components/WithContextApi/layout.js +3 -4
- package/dist/components/WithSeason/index.js +7 -11
- package/dist/constants/deviceSizes.js +27 -24
- package/dist/constants/seasons.js +3 -5
- package/dist/index.js +19 -19
- package/dist/scss/variables/commonColors.module.scss +1 -1
- package/dist/shared/Context/index.js +5 -3
- package/dist/shared/constants/aliases.js +691 -694
- package/dist/shared/constants/consumptions.js +5 -9
- package/dist/shared/constants/periodicities.js +2 -3
- package/dist/shared/constants/rates.js +2 -3
- package/dist/shared/constants/readings.js +3 -5
- package/dist/shared/constants/seasons.js +3 -5
- package/dist/shared/constants/stagesGraph.js +4 -8
- package/dist/shared/types/assetsTypes.js +1 -2
- package/dist/shared/types/billDataTypes.js +6 -11
- package/dist/shared/types/componentsTypes.js +19 -14
- package/dist/shared/types/formattersTypes.js +2 -3
- package/dist/shared/types/rateStagesTypes.js +3 -6
- package/dist/shared/types/smartBillTypes.js +5 -11
- package/dist/shared/types/textsTypes.js +2 -3
- package/dist/shared/utils/billCalculation.js +9 -9
- package/dist/shared/utils/consumptions.js +27 -55
- package/dist/shared/utils/context.js +6 -5
- package/dist/shared/utils/expirations.js +1 -5
- package/dist/shared/utils/periods.js +14 -20
- package/dist/shared/utils/rates.js +1 -5
- package/dist/shared/utils/readings.js +2 -10
- package/dist/shared/utils/season.js +1 -5
- package/dist/shared/utils/stagesGraph.js +11 -15
- package/dist/utils/hooks.js +2 -3
- package/dist/utils.js +4 -8
- package/package.json +26 -63
|
@@ -12,27 +12,32 @@ var _Magnitude = _interopRequireDefault(require("../../../../../../../../../Magn
|
|
|
12
12
|
var _aliases = require("../../../../../../../../../../shared/constants/aliases");
|
|
13
13
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
14
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
classes =
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
15
|
+
const IndicatorLabel = _ref => {
|
|
16
|
+
let {
|
|
17
|
+
contextApiInfo,
|
|
18
|
+
value,
|
|
19
|
+
unit,
|
|
20
|
+
labelOffset,
|
|
21
|
+
classes = {}
|
|
22
|
+
} = _ref;
|
|
23
|
+
const {
|
|
24
|
+
assets,
|
|
25
|
+
config,
|
|
26
|
+
Label
|
|
27
|
+
} = contextApiInfo;
|
|
28
|
+
const {
|
|
29
|
+
texts,
|
|
30
|
+
colors
|
|
31
|
+
} = config;
|
|
32
|
+
const {
|
|
33
|
+
indicatorLabel
|
|
34
|
+
} = texts.ratesDefinition;
|
|
35
|
+
const EnergyIcon = () => /*#__PURE__*/_react.default.createElement(assets.EnergyIcon, {
|
|
36
|
+
className: _stylesModule.default.icon,
|
|
37
|
+
style: {
|
|
38
|
+
fill: colors.primary
|
|
39
|
+
}
|
|
40
|
+
});
|
|
36
41
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
37
42
|
style: {
|
|
38
43
|
transform: "translate(".concat(labelOffset, ")")
|
|
@@ -59,5 +64,4 @@ IndicatorLabel.propTypes = {
|
|
|
59
64
|
container: _propTypes.string
|
|
60
65
|
})
|
|
61
66
|
};
|
|
62
|
-
var _default = (0, _WithContextApi.default)()(IndicatorLabel);
|
|
63
|
-
exports.default = _default;
|
|
67
|
+
var _default = exports.default = (0, _WithContextApi.default)()(IndicatorLabel);
|
|
@@ -14,13 +14,17 @@ var _IndicatorLabel = _interopRequireDefault(require("./components/IndicatorLabe
|
|
|
14
14
|
var _utils = require("./utils");
|
|
15
15
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
const Indicator = _ref => {
|
|
18
|
+
let {
|
|
19
|
+
indicatorPosition,
|
|
20
|
+
value,
|
|
21
|
+
unit,
|
|
22
|
+
rateStages,
|
|
23
|
+
contextApiInfo
|
|
24
|
+
} = _ref;
|
|
25
|
+
const {
|
|
26
|
+
primary
|
|
27
|
+
} = contextApiInfo.config.colors;
|
|
24
28
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
25
29
|
className: _stylesModule.default.container
|
|
26
30
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
@@ -46,5 +50,4 @@ Indicator.propTypes = {
|
|
|
46
50
|
contextApiInfo: _smartBillTypes.contextApiInfoTypes,
|
|
47
51
|
rateStages: _rateStagesTypes.rateStagesTypes
|
|
48
52
|
};
|
|
49
|
-
var _default = (0, _WithContextApi.default)()(Indicator);
|
|
50
|
-
exports.default = _default;
|
|
53
|
+
var _default = exports.default = (0, _WithContextApi.default)()(Indicator);
|
|
@@ -6,17 +6,17 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.getLabelOffset = void 0;
|
|
7
7
|
var _constants = require("../../../../constants");
|
|
8
8
|
var _utils = require("../../../../utils");
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
9
|
+
const relativePorcentageValue = (value, rateStages) => {
|
|
10
|
+
const globalLastSubRate = rateStages.at(-1).sub_rate_stages.at(-1).range;
|
|
11
|
+
const globalMaxValue = globalLastSubRate.at(-1) || globalLastSubRate.at(0) + _constants.DEFAULT_INFINITE_SUB_STAGE_RANGE_WIDTH;
|
|
12
|
+
const clippedMaxValue = value > globalMaxValue ? globalMaxValue : value;
|
|
13
13
|
return clippedMaxValue / globalMaxValue * 100;
|
|
14
14
|
};
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
15
|
+
const getLabelOffset = (value, rateStages) => {
|
|
16
|
+
const rateIndex = rateStages.indexOf((0, _utils.getCurrentStage)(value, rateStages));
|
|
17
|
+
const isFirstRate = rateIndex === 0;
|
|
18
|
+
const isLastRate = rateIndex === rateStages.length - 1;
|
|
19
|
+
const baseOffset = "".concat(relativePorcentageValue(value, rateStages), "%");
|
|
20
20
|
return isLastRate ? "calc(-".concat(baseOffset, " + ").concat(_constants.INDICATOR_LABEL_LAST_OFFSET, ")") : isFirstRate ? "calc(-".concat(baseOffset, " - ").concat(_constants.INDICATOR_LABEL_FIRST_OFFSET, ")") : _constants.INDICATOR_LABEL_DEFAULT_OFFSET;
|
|
21
21
|
};
|
|
22
22
|
exports.getLabelOffset = getLabelOffset;
|
|
@@ -10,31 +10,32 @@ var _WithContextApi = _interopRequireDefault(require("../../../../../../../WithC
|
|
|
10
10
|
var _smartBillTypes = require("../../../../../../../../shared/types/smartBillTypes");
|
|
11
11
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
13
|
+
const Legend = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
stagesFormattedData,
|
|
16
|
+
contextApiInfo
|
|
17
|
+
} = _ref;
|
|
18
|
+
const {
|
|
19
|
+
Label,
|
|
20
|
+
config
|
|
21
|
+
} = contextApiInfo;
|
|
22
|
+
const {
|
|
23
|
+
texts
|
|
24
|
+
} = config;
|
|
19
25
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
20
26
|
className: _stylesModule.default.legendContainer
|
|
21
|
-
}, stagesFormattedData.map(
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
weight: "medium"
|
|
31
|
-
}, substage.legend));
|
|
32
|
-
});
|
|
33
|
-
}));
|
|
27
|
+
}, stagesFormattedData.map(stage => stage.sub_rate_stages.map(substage => /*#__PURE__*/_react.default.createElement("div", {
|
|
28
|
+
className: _stylesModule.default.legendLine
|
|
29
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
30
|
+
className: _stylesModule.default.leftLabels
|
|
31
|
+
}, /*#__PURE__*/_react.default.createElement(Label, {
|
|
32
|
+
weight: "medium"
|
|
33
|
+
}, substage.name), /*#__PURE__*/_react.default.createElement(Label, null, substage.i === 0 ? texts.ratesDefinition.consumptionUpToDesktop : texts.ratesDefinition.consumptionMoreThanDesktop)), /*#__PURE__*/_react.default.createElement(Label, {
|
|
34
|
+
weight: "medium"
|
|
35
|
+
}, substage.legend)))));
|
|
34
36
|
};
|
|
35
37
|
Legend.propTypes = {
|
|
36
38
|
contextApiInfo: _smartBillTypes.contextApiInfoTypes,
|
|
37
39
|
stagesFormattedData: (0, _propTypes.arrayOf)(_propTypes.any)
|
|
38
40
|
};
|
|
39
|
-
var _default = (0, _WithContextApi.default)()(Legend);
|
|
40
|
-
exports.default = _default;
|
|
41
|
+
var _default = exports.default = (0, _WithContextApi.default)()(Legend);
|
|
@@ -10,48 +10,45 @@ var _WithContextApi = _interopRequireDefault(require("../../../../../../../WithC
|
|
|
10
10
|
var _smartBillTypes = require("../../../../../../../../shared/types/smartBillTypes");
|
|
11
11
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
13
|
+
const Stages = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
stagesFormattedData,
|
|
16
|
+
contextApiInfo
|
|
17
|
+
} = _ref;
|
|
18
|
+
const {
|
|
19
|
+
Label
|
|
20
|
+
} = contextApiInfo;
|
|
21
|
+
const toFinalWidth = val => ({
|
|
22
|
+
width: "".concat(val * 100, "%")
|
|
23
|
+
});
|
|
22
24
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
23
25
|
className: _stylesModule.default.stagesContainer
|
|
24
|
-
}, stagesFormattedData.map(
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
}
|
|
48
|
-
}, /*#__PURE__*/_react.default.createElement(Label, null, substage.name)));
|
|
49
|
-
})));
|
|
50
|
-
}));
|
|
26
|
+
}, stagesFormattedData.map(stage => /*#__PURE__*/_react.default.createElement("div", {
|
|
27
|
+
className: _stylesModule.default.stage,
|
|
28
|
+
style: toFinalWidth(stage.width, 0.2)
|
|
29
|
+
}, /*#__PURE__*/_react.default.createElement(Label, {
|
|
30
|
+
className: _stylesModule.default.group,
|
|
31
|
+
weight: "medium"
|
|
32
|
+
}, stage.group), /*#__PURE__*/_react.default.createElement("div", {
|
|
33
|
+
className: _stylesModule.default.substagesContainer
|
|
34
|
+
}, stage.sub_rate_stages.map(substage => /*#__PURE__*/_react.default.createElement("div", {
|
|
35
|
+
className: _stylesModule.default.substage,
|
|
36
|
+
style: toFinalWidth(substage.width)
|
|
37
|
+
}, substage.label && /*#__PURE__*/_react.default.createElement(Label, {
|
|
38
|
+
className: _stylesModule.default.substageValue,
|
|
39
|
+
colorTheme: "gray",
|
|
40
|
+
variant: "small",
|
|
41
|
+
weight: "medium",
|
|
42
|
+
withoutMarkdown: true
|
|
43
|
+
}, substage.label), /*#__PURE__*/_react.default.createElement("div", {
|
|
44
|
+
className: _stylesModule.default.substageName,
|
|
45
|
+
style: {
|
|
46
|
+
backgroundColor: substage.color
|
|
47
|
+
}
|
|
48
|
+
}, /*#__PURE__*/_react.default.createElement(Label, null, substage.name))))))));
|
|
51
49
|
};
|
|
52
50
|
Stages.propTypes = {
|
|
53
51
|
contextApiInfo: _smartBillTypes.contextApiInfoTypes,
|
|
54
52
|
stagesFormattedData: (0, _propTypes.arrayOf)(_propTypes.any)
|
|
55
53
|
};
|
|
56
|
-
var _default = (0, _WithContextApi.default)()(Stages);
|
|
57
|
-
exports.default = _default;
|
|
54
|
+
var _default = exports.default = (0, _WithContextApi.default)()(Stages);
|
|
@@ -4,7 +4,5 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.MIN_STAGE_WIDTH = exports.DEFAULT_LAST_INFINITE_RANGE = void 0;
|
|
7
|
-
|
|
8
|
-
exports.
|
|
9
|
-
var MIN_STAGE_WIDTH = 0.2;
|
|
10
|
-
exports.MIN_STAGE_WIDTH = MIN_STAGE_WIDTH;
|
|
7
|
+
const DEFAULT_LAST_INFINITE_RANGE = exports.DEFAULT_LAST_INFINITE_RANGE = 200; // kWh
|
|
8
|
+
const MIN_STAGE_WIDTH = exports.MIN_STAGE_WIDTH = 0.2;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
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); }
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
@@ -16,38 +15,26 @@ var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
|
16
15
|
var _utils = require("./utils");
|
|
17
16
|
var _Legend = _interopRequireDefault(require("./components/Legend"));
|
|
18
17
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
function _getRequireWildcardCache(
|
|
20
|
-
function _interopRequireWildcard(
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
getStageColor = _ref.getStageColor;
|
|
32
|
-
var _useState = (0, _react.useState)((0, _browser.isDesktop)(_deviceSizes.TabletBreakpoint)),
|
|
33
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
34
|
-
isDesktopSize = _useState2[0],
|
|
35
|
-
setIsDesktopSize = _useState2[1];
|
|
36
|
-
var handleResizeScreen = function handleResizeScreen() {
|
|
37
|
-
return setIsDesktopSize((0, _browser.isDesktop)(_deviceSizes.TabletBreakpoint));
|
|
38
|
-
};
|
|
39
|
-
(0, _react.useEffect)(function () {
|
|
18
|
+
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); }
|
|
19
|
+
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; }
|
|
20
|
+
const RateStagesGraph = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
value,
|
|
23
|
+
unit,
|
|
24
|
+
rateStages,
|
|
25
|
+
getStageColor
|
|
26
|
+
} = _ref;
|
|
27
|
+
const [isDesktopSize, setIsDesktopSize] = (0, _react.useState)((0, _browser.isDesktop)(_deviceSizes.TabletBreakpoint));
|
|
28
|
+
const handleResizeScreen = () => setIsDesktopSize((0, _browser.isDesktop)(_deviceSizes.TabletBreakpoint));
|
|
29
|
+
(0, _react.useEffect)(() => {
|
|
40
30
|
window.addEventListener(_browser.RESIZE_EVENT, handleResizeScreen);
|
|
41
31
|
handleResizeScreen();
|
|
42
|
-
return
|
|
43
|
-
return window.removeEventListener(_browser.RESIZE_EVENT, handleResizeScreen);
|
|
44
|
-
};
|
|
32
|
+
return () => window.removeEventListener(_browser.RESIZE_EVENT, handleResizeScreen);
|
|
45
33
|
}, []);
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
indicatorPosition = _useMemo.indicatorPosition;
|
|
34
|
+
const {
|
|
35
|
+
stagesFormattedData,
|
|
36
|
+
indicatorPosition
|
|
37
|
+
} = (0, _react.useMemo)(() => (0, _utils.getStagesFormattedData)(value, rateStages, getStageColor, isDesktopSize), [isDesktopSize, value, rateStages, getStageColor]);
|
|
51
38
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
52
39
|
className: _stylesModule.default.container
|
|
53
40
|
}, /*#__PURE__*/_react.default.createElement(_Stages.default, {
|
|
@@ -68,5 +55,4 @@ RateStagesGraph.propTypes = {
|
|
|
68
55
|
getStageColor: _propTypes.func,
|
|
69
56
|
rateStages: _rateStagesTypes.rateStagesTypes
|
|
70
57
|
};
|
|
71
|
-
var _default = RateStagesGraph;
|
|
72
|
-
exports.default = _default;
|
|
58
|
+
var _default = exports.default = RateStagesGraph;
|
|
@@ -7,70 +7,58 @@ exports.getStagesFormattedData = void 0;
|
|
|
7
7
|
var _lodash = _interopRequireDefault(require("lodash"));
|
|
8
8
|
var _constants = require("./constants");
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
13
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
14
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
15
|
-
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
16
|
-
var getResponsiveStageWidth = function getResponsiveStageWidth(rateStages, stage, totalSubStages) {
|
|
17
|
-
var totalWidth = 1;
|
|
10
|
+
const getResponsiveStageWidth = (rateStages, stage, totalSubStages) => {
|
|
11
|
+
let totalWidth = 1;
|
|
18
12
|
// if we have only one rate, then return max width.
|
|
19
13
|
if (rateStages.length === 1) {
|
|
20
14
|
return totalWidth;
|
|
21
15
|
}
|
|
22
16
|
// We sort the stages based in sub stages in cases that former stages are larger than later ones.
|
|
23
|
-
|
|
24
|
-
return _stage.sub_rate_stages.length;
|
|
25
|
-
});
|
|
17
|
+
const sortedRateStages = _lodash.default.sortBy(rateStages, _stage => _stage.sub_rate_stages.length);
|
|
26
18
|
// Iterate over the sorted array until finished.
|
|
27
|
-
for (
|
|
19
|
+
for (let index = 0; index < sortedRateStages.length; index += 1) {
|
|
28
20
|
// If we reached our stage then we break, we need to know the space former ones ocuppy and not the laters.
|
|
29
21
|
if (sortedRateStages[index].group === stage.group) {
|
|
30
22
|
break;
|
|
31
23
|
}
|
|
32
|
-
|
|
24
|
+
const currentSubStages = sortedRateStages[index].sub_rate_stages.length;
|
|
33
25
|
// Maximum a stage can ocuppy (since minimum is MIN_STAGE_WIDTH), is MIN_STAGE_WIDTH times the other stages.
|
|
34
|
-
|
|
26
|
+
const width = Math.min(Math.max(currentSubStages / totalSubStages, _constants.MIN_STAGE_WIDTH), _constants.MIN_STAGE_WIDTH * rateStages.length);
|
|
35
27
|
totalWidth -= width;
|
|
36
28
|
}
|
|
37
29
|
// Final width will be the minimum value between the calculated width and the total width left.
|
|
38
30
|
return Math.min(Math.max(stage.sub_rate_stages.length / totalSubStages, _constants.MIN_STAGE_WIDTH), totalWidth);
|
|
39
31
|
};
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
if (!isCurrentStage && substage.i === totalSubstagesCount - 1) indicatorPosition += Math.min(currentDeltaWidth / _constants.DEFAULT_LAST_INFINITE_RANGE * currentWidth, currentWidth);else if (!isCurrentStage) indicatorPosition += currentWidth;else indicatorPosition += currentDeltaWidth / (substage.range[1] - substage.range[0]) * currentWidth;
|
|
68
|
-
return isCurrentStage;
|
|
69
|
-
});
|
|
70
|
-
});
|
|
32
|
+
const getStagesFormattedData = (value, rateStages, getStageColor, isDesktop) => {
|
|
33
|
+
const totalSubstagesCount = rateStages.reduce((count, stage) => count += stage.sub_rate_stages.length, 0);
|
|
34
|
+
let i = -1;
|
|
35
|
+
const stagesFormattedData = rateStages.map(stage => ({
|
|
36
|
+
...stage,
|
|
37
|
+
width: isDesktop ? stage.sub_rate_stages.length / totalSubstagesCount : getResponsiveStageWidth(rateStages, stage, totalSubstagesCount),
|
|
38
|
+
sub_rate_stages: stage.sub_rate_stages.map(substage => {
|
|
39
|
+
i += 1;
|
|
40
|
+
const labelValue = "".concat(substage.range[i === 0 ? 1 : 0], " ").concat(stage.unit);
|
|
41
|
+
return {
|
|
42
|
+
...substage,
|
|
43
|
+
i,
|
|
44
|
+
width: 1 / stage.sub_rate_stages.length,
|
|
45
|
+
color: substage.color || getStageColor && getStageColor(i, totalSubstagesCount),
|
|
46
|
+
label: isDesktop && "".concat(i === 0 ? '< ' : i === 1 ? '> ' : '').concat(labelValue),
|
|
47
|
+
legend: !isDesktop && labelValue
|
|
48
|
+
};
|
|
49
|
+
})
|
|
50
|
+
}));
|
|
51
|
+
let indicatorPosition = 0;
|
|
52
|
+
stagesFormattedData.find(stage => stage.sub_rate_stages.find(substage => {
|
|
53
|
+
const isCurrentStage = substage.range[1] >= value;
|
|
54
|
+
const currentWidth = substage.width * stage.width;
|
|
55
|
+
const currentDeltaWidth = value - substage.range[0];
|
|
56
|
+
if (!isCurrentStage && substage.i === totalSubstagesCount - 1) indicatorPosition += Math.min(currentDeltaWidth / _constants.DEFAULT_LAST_INFINITE_RANGE * currentWidth, currentWidth);else if (!isCurrentStage) indicatorPosition += currentWidth;else indicatorPosition += currentDeltaWidth / (substage.range[1] - substage.range[0]) * currentWidth;
|
|
57
|
+
return isCurrentStage;
|
|
58
|
+
}));
|
|
71
59
|
return {
|
|
72
|
-
stagesFormattedData
|
|
73
|
-
indicatorPosition
|
|
60
|
+
stagesFormattedData,
|
|
61
|
+
indicatorPosition
|
|
74
62
|
};
|
|
75
63
|
};
|
|
76
64
|
exports.getStagesFormattedData = getStagesFormattedData;
|
|
@@ -4,39 +4,21 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.THIGT_RANGE_BREAKPOINT_RATIO = exports.SUB_STAGE_MARGIN_MOBILE = exports.SUB_STAGE_MARGIN_DESKTOP = exports.STAGE_MARGIN_MOBILE = exports.STAGE_MARGIN_DESKTOP = exports.MIN_VALUE = exports.MAX_VALUE = exports.MAX_RANGE_LIMIT = exports.LAST_SUB_STAGE_MARGIN = exports.LAST_STAGE_MARGIN = exports.INITIAL_INDICATOR_POSITION = exports.INFINITE = exports.INDICATOR_LABEL_LAST_OFFSET = exports.INDICATOR_LABEL_FIRST_OFFSET = exports.INDICATOR_LABEL_DEFAULT_OFFSET = exports.DEFAULT_INFINITE_SUB_STAGE_RANGE_WIDTH = exports.BARS_MARGIN_MOBILE = exports.BARS_MARGIN_DESKTOP = void 0;
|
|
7
|
-
|
|
8
|
-
exports.
|
|
9
|
-
|
|
10
|
-
exports.
|
|
11
|
-
|
|
12
|
-
exports.
|
|
13
|
-
|
|
14
|
-
exports.
|
|
15
|
-
|
|
16
|
-
exports.
|
|
17
|
-
|
|
18
|
-
exports.
|
|
19
|
-
|
|
20
|
-
exports.
|
|
21
|
-
|
|
22
|
-
exports.
|
|
23
|
-
|
|
24
|
-
exports.
|
|
25
|
-
var STAGE_MARGIN_DESKTOP = '4px';
|
|
26
|
-
exports.STAGE_MARGIN_DESKTOP = STAGE_MARGIN_DESKTOP;
|
|
27
|
-
var STAGE_MARGIN_MOBILE = '2px';
|
|
28
|
-
exports.STAGE_MARGIN_MOBILE = STAGE_MARGIN_MOBILE;
|
|
29
|
-
var SUB_STAGE_MARGIN_DESKTOP = '4px';
|
|
30
|
-
exports.SUB_STAGE_MARGIN_DESKTOP = SUB_STAGE_MARGIN_DESKTOP;
|
|
31
|
-
var SUB_STAGE_MARGIN_MOBILE = '2px';
|
|
32
|
-
exports.SUB_STAGE_MARGIN_MOBILE = SUB_STAGE_MARGIN_MOBILE;
|
|
33
|
-
var LAST_SUB_STAGE_MARGIN = '0px';
|
|
34
|
-
exports.LAST_SUB_STAGE_MARGIN = LAST_SUB_STAGE_MARGIN;
|
|
35
|
-
var INDICATOR_LABEL_FIRST_OFFSET = '0px';
|
|
36
|
-
exports.INDICATOR_LABEL_FIRST_OFFSET = INDICATOR_LABEL_FIRST_OFFSET;
|
|
37
|
-
var INDICATOR_LABEL_LAST_OFFSET = '-8px';
|
|
38
|
-
exports.INDICATOR_LABEL_LAST_OFFSET = INDICATOR_LABEL_LAST_OFFSET;
|
|
39
|
-
var INDICATOR_LABEL_DEFAULT_OFFSET = '-48px';
|
|
40
|
-
exports.INDICATOR_LABEL_DEFAULT_OFFSET = INDICATOR_LABEL_DEFAULT_OFFSET;
|
|
41
|
-
var THIGT_RANGE_BREAKPOINT_RATIO = 0.1;
|
|
42
|
-
exports.THIGT_RANGE_BREAKPOINT_RATIO = THIGT_RANGE_BREAKPOINT_RATIO;
|
|
7
|
+
const INFINITE = exports.INFINITE = null;
|
|
8
|
+
const MAX_VALUE = exports.MAX_VALUE = 1;
|
|
9
|
+
const MIN_VALUE = exports.MIN_VALUE = 0;
|
|
10
|
+
const MAX_RANGE_LIMIT = exports.MAX_RANGE_LIMIT = 9999999;
|
|
11
|
+
const DEFAULT_INFINITE_SUB_STAGE_RANGE_WIDTH = exports.DEFAULT_INFINITE_SUB_STAGE_RANGE_WIDTH = 200;
|
|
12
|
+
const INITIAL_INDICATOR_POSITION = exports.INITIAL_INDICATOR_POSITION = '-6px';
|
|
13
|
+
const BARS_MARGIN_DESKTOP = exports.BARS_MARGIN_DESKTOP = '0px';
|
|
14
|
+
const BARS_MARGIN_MOBILE = exports.BARS_MARGIN_MOBILE = '0px';
|
|
15
|
+
const LAST_STAGE_MARGIN = exports.LAST_STAGE_MARGIN = '0px';
|
|
16
|
+
const STAGE_MARGIN_DESKTOP = exports.STAGE_MARGIN_DESKTOP = '4px';
|
|
17
|
+
const STAGE_MARGIN_MOBILE = exports.STAGE_MARGIN_MOBILE = '2px';
|
|
18
|
+
const SUB_STAGE_MARGIN_DESKTOP = exports.SUB_STAGE_MARGIN_DESKTOP = '4px';
|
|
19
|
+
const SUB_STAGE_MARGIN_MOBILE = exports.SUB_STAGE_MARGIN_MOBILE = '2px';
|
|
20
|
+
const LAST_SUB_STAGE_MARGIN = exports.LAST_SUB_STAGE_MARGIN = '0px';
|
|
21
|
+
const INDICATOR_LABEL_FIRST_OFFSET = exports.INDICATOR_LABEL_FIRST_OFFSET = '0px';
|
|
22
|
+
const INDICATOR_LABEL_LAST_OFFSET = exports.INDICATOR_LABEL_LAST_OFFSET = '-8px';
|
|
23
|
+
const INDICATOR_LABEL_DEFAULT_OFFSET = exports.INDICATOR_LABEL_DEFAULT_OFFSET = '-48px';
|
|
24
|
+
const THIGT_RANGE_BREAKPOINT_RATIO = exports.THIGT_RANGE_BREAKPOINT_RATIO = 0.1;
|