sag_components 1.0.237 → 1.0.239
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/dist/stories/components/TotalBenchmark.style.js +1 -1
- package/dist/stories/components/TotalBenchmarkArrows.js +9 -7
- package/dist/stories/components/TotalBenchmarkArrows.style.js +6 -4
- package/dist/stories/components/TotalBenchmarkBarchart.js +8 -8
- package/dist/stories/components/TotalBenchmarkBarchart.style.js +8 -6
- package/package.json +1 -1
|
@@ -28,7 +28,7 @@ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4
|
|
|
28
28
|
exports.Title = Title;
|
|
29
29
|
var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
|
|
30
30
|
exports.FormattedValue = FormattedValue;
|
|
31
|
-
var FormattedValueNoData = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 700;\n font-size: 16px;\n"])));
|
|
31
|
+
var FormattedValueNoData = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 700;\n font-size: 16px;\n"])));
|
|
32
32
|
exports.FormattedValueNoData = FormattedValueNoData;
|
|
33
33
|
var BenchmarkContainerParent = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: baseline;\n width: 100%;\n height: 100%;\n margin: 0;\n"])));
|
|
34
34
|
exports.BenchmarkContainerParent = BenchmarkContainerParent;
|
|
@@ -104,12 +104,12 @@ var TotalBenchmarkArrows = function TotalBenchmarkArrows(_ref) {
|
|
|
104
104
|
id: "ValueAndBenchmarkContainer"
|
|
105
105
|
}, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.FormattedValue, {
|
|
106
106
|
id: "FormattedValue"
|
|
107
|
-
}, dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : ""), benchmarkTotalValue ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.BenchmarkContainer, {
|
|
107
|
+
}, value != undefined && value != null && dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), value != undefined && value != null && dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : ""), benchmarkTotalValue ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.BenchmarkContainer, {
|
|
108
108
|
id: "BenchmarkContainer"
|
|
109
109
|
}, /*#__PURE__*/_react.default.createElement(_Benchmark.Benchmark, {
|
|
110
110
|
totalValue: benchmarkTotalValue,
|
|
111
|
-
currentValue: value,
|
|
112
|
-
benchmarkValue: benchmarkValue,
|
|
111
|
+
currentValue: value !== null && value !== void 0 ? value : 0,
|
|
112
|
+
benchmarkValue: benchmarkValue !== null && benchmarkValue !== void 0 ? benchmarkValue : 0,
|
|
113
113
|
height: 12 * getSizeFactor(),
|
|
114
114
|
width: 85 * getSizeFactor(),
|
|
115
115
|
color: "#79DB95",
|
|
@@ -121,14 +121,16 @@ var TotalBenchmarkArrows = function TotalBenchmarkArrows(_ref) {
|
|
|
121
121
|
id: "DetailsContainer"
|
|
122
122
|
}, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsTitle, {
|
|
123
123
|
id: "DetailsTitle"
|
|
124
|
-
}, detailsTitle), detailsData.map(function (item
|
|
124
|
+
}, detailsTitle), detailsData.map(function (item) {
|
|
125
125
|
return /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowContainer, {
|
|
126
126
|
id: "DetailsRowContainer"
|
|
127
|
-
}, getArrowSign(item.value >= 0 ? "up" : "down"), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowFormattedValue, {
|
|
127
|
+
}, item.value != undefined && item.value != null ? getArrowSign(item.value >= 0 ? "up" : "down") : "", /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowFormattedValue, {
|
|
128
128
|
id: "DetailsRowFormattedValue"
|
|
129
|
-
}, item.value ? Math.abs(item.value) : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowPercentSign, {
|
|
129
|
+
}, item.value != undefined && item.value != null ? Math.abs(item.value) : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowPercentSign, {
|
|
130
130
|
id: "DetailsRowPercentSign"
|
|
131
|
-
},
|
|
131
|
+
}, item.value != undefined && item.value != null ? " % " : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowFormattedValueNoDataMessage, {
|
|
132
|
+
id: "DetailsRowFormattedValueNoDataMessage"
|
|
133
|
+
}, item.value === undefined || item.value === null ? "No Data" : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkArrowsStyle.DetailsRowTitle, {
|
|
132
134
|
id: "DetailsRowTitle"
|
|
133
135
|
}, item.title));
|
|
134
136
|
}))) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
|
|
@@ -4,10 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.ValueAndBenchmarkContainer = exports.Title = exports.FormattedValue = exports.DetailsTitle = exports.DetailsRowTitle = exports.DetailsRowPercentSign = exports.DetailsRowFormattedValue = exports.DetailsRowContainer = exports.DetailsRowArrowContainer = exports.DetailsContainer = exports.ControlsContainer = exports.Controls = exports.BenchmarkContainer = void 0;
|
|
7
|
+
exports.ValueAndBenchmarkContainer = exports.Title = exports.FormattedValue = exports.DetailsTitle = exports.DetailsRowTitle = exports.DetailsRowPercentSign = exports.DetailsRowFormattedValueNoDataMessage = exports.DetailsRowFormattedValue = exports.DetailsRowContainer = exports.DetailsRowArrowContainer = exports.DetailsContainer = exports.ControlsContainer = exports.Controls = exports.BenchmarkContainer = void 0;
|
|
8
8
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
9
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
|
|
10
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
|
|
11
11
|
var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n font-size: ", ";\n color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 12px;\n align-content: center;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (props) {
|
|
12
12
|
return props.rootFont;
|
|
13
13
|
}, function (props) {
|
|
@@ -38,7 +38,9 @@ var DetailsRowArrowContainer = _styledComponents.default.div(_templateObject10 |
|
|
|
38
38
|
exports.DetailsRowArrowContainer = DetailsRowArrowContainer;
|
|
39
39
|
var DetailsRowFormattedValue = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 0.88889rem;\n"])));
|
|
40
40
|
exports.DetailsRowFormattedValue = DetailsRowFormattedValue;
|
|
41
|
-
var
|
|
41
|
+
var DetailsRowFormattedValueNoDataMessage = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 0.88889rem;\n margin: 0; \n"])));
|
|
42
|
+
exports.DetailsRowFormattedValueNoDataMessage = DetailsRowFormattedValueNoDataMessage;
|
|
43
|
+
var DetailsRowPercentSign = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 12px;\n"])));
|
|
42
44
|
exports.DetailsRowPercentSign = DetailsRowPercentSign;
|
|
43
|
-
var DetailsRowTitle = _styledComponents.default.div(
|
|
45
|
+
var DetailsRowTitle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 400;\n font-size: 0.88889rem;\n"])));
|
|
44
46
|
exports.DetailsRowTitle = DetailsRowTitle;
|
|
@@ -116,11 +116,11 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
|
|
|
116
116
|
tempFormattedBarChartData.push({
|
|
117
117
|
title1: barChartData[0].title,
|
|
118
118
|
value1: barChartData[0].value,
|
|
119
|
-
formattedValue1: currencySign.concat("", (0, _CommonFunctions.getFormattedValue)(barChartData[0].value), "", (0, _CommonFunctions.getFormattedUnits)(barChartData[0].value)),
|
|
119
|
+
formattedValue1: barChartData[0].value != undefined && barChartData[0].value != null ? currencySign.concat("", (0, _CommonFunctions.getFormattedValue)(barChartData[0].value), "", (0, _CommonFunctions.getFormattedUnits)(barChartData[0].value)) : "No Data",
|
|
120
120
|
color1: barChartData[0].color ? barChartData[0].color : "#79DB95",
|
|
121
121
|
title2: barChartData[1].title,
|
|
122
122
|
value2: barChartData[1].value,
|
|
123
|
-
formattedValue2: currencySign.concat("", (0, _CommonFunctions.getFormattedValue)(barChartData[1].value), "", (0, _CommonFunctions.getFormattedUnits)(barChartData[1].value)),
|
|
123
|
+
formattedValue2: barChartData[1].value != undefined && barChartData[1].value != null ? currencySign.concat("", (0, _CommonFunctions.getFormattedValue)(barChartData[1].value), "", (0, _CommonFunctions.getFormattedUnits)(barChartData[1].value)) : "No Data",
|
|
124
124
|
color2: barChartData[1].color ? barChartData[1].color : "#D4C0FF"
|
|
125
125
|
});
|
|
126
126
|
|
|
@@ -137,7 +137,7 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
|
|
|
137
137
|
textColor: textColor,
|
|
138
138
|
ref: controlsContainerRef,
|
|
139
139
|
rootFont: rootFont
|
|
140
|
-
}, (barChartData === null || barChartData === void 0 ? void 0 : barChartData.length)
|
|
140
|
+
}, value != undefined && value != null || (barChartData === null || barChartData === void 0 ? void 0 : barChartData.length) >= 2 && (barChartData[0].value != undefined && barChartData[0].value != null || barChartData[1].value != undefined && barChartData[1].value != null) ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.Controls, {
|
|
141
141
|
id: "Controls"
|
|
142
142
|
}, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.TitleAndValueContainer, {
|
|
143
143
|
id: "TitleAndValueContainer"
|
|
@@ -147,14 +147,14 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
|
|
|
147
147
|
id: "ValueAndBenchmarkContainer"
|
|
148
148
|
}, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.CurrencySign, {
|
|
149
149
|
id: "CurrencySign"
|
|
150
|
-
}, currency ? (0, _CommonFunctions.getCurrencySign)(currencyType, value) : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.FormattedValue, {
|
|
150
|
+
}, value != undefined && value != null && currency ? (0, _CommonFunctions.getCurrencySign)(currencyType, value) : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.FormattedValue, {
|
|
151
151
|
id: "FormattedValue"
|
|
152
|
-
}, dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : ""), benchmarkTotalValue ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BenchmarkContainer, {
|
|
152
|
+
}, value != undefined && value != null ? dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value) : "", value != undefined && value != null && dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : ""), /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.FormattedValueNoDataMessage, null, value === undefined || value === null ? "No Data" : ""), benchmarkTotalValue ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BenchmarkContainer, {
|
|
153
153
|
id: "BenchmarkContainer"
|
|
154
154
|
}, /*#__PURE__*/_react.default.createElement(_Benchmark.Benchmark, {
|
|
155
|
-
totalValue: benchmarkTotalValue,
|
|
156
|
-
currentValue: value,
|
|
157
|
-
benchmarkValue: benchmarkValue,
|
|
155
|
+
totalValue: benchmarkTotalValue !== null && benchmarkTotalValue !== void 0 ? benchmarkTotalValue : 0,
|
|
156
|
+
currentValue: value !== null && value !== void 0 ? value : 0,
|
|
157
|
+
benchmarkValue: benchmarkValue !== null && benchmarkValue !== void 0 ? benchmarkValue : 0,
|
|
158
158
|
height: 12 * getSizeFactor(),
|
|
159
159
|
width: 85 * getSizeFactor(),
|
|
160
160
|
color: "#79DB95",
|
|
@@ -4,10 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.ValueAndBenchmarkContainer = exports.TitleAndValueContainer = exports.Title = exports.FormattedValue = exports.CurrencySign = exports.ControlsContainer = exports.Controls = exports.BottomDetailsRowTitle = exports.BottomDetailsRowContainer = exports.BenchmarkContainer = exports.BarchartContainer = void 0;
|
|
7
|
+
exports.ValueAndBenchmarkContainer = exports.TitleAndValueContainer = exports.Title = exports.FormattedValueNoDataMessage = exports.FormattedValue = exports.CurrencySign = exports.ControlsContainer = exports.Controls = exports.BottomDetailsRowTitle = exports.BottomDetailsRowContainer = exports.BenchmarkContainer = exports.BarchartContainer = void 0;
|
|
8
8
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
9
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
|
|
10
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
|
|
11
11
|
var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n font-size: ", ";\n color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 12px;\n align-content: center;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n background: #ffffff;\n"])), function (props) {
|
|
12
12
|
return props.rootFont;
|
|
13
13
|
}, function (props) {
|
|
@@ -30,11 +30,13 @@ var CurrencySign = _styledComponents.default.div(_templateObject6 || (_templateO
|
|
|
30
30
|
exports.CurrencySign = CurrencySign;
|
|
31
31
|
var FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
|
|
32
32
|
exports.FormattedValue = FormattedValue;
|
|
33
|
-
var
|
|
33
|
+
var FormattedValueNoDataMessage = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 0.88889rem;\n margin: 0; \n"])));
|
|
34
|
+
exports.FormattedValueNoDataMessage = FormattedValueNoDataMessage;
|
|
35
|
+
var BenchmarkContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.7em;\n width: 5.35em;\n"])));
|
|
34
36
|
exports.BenchmarkContainer = BenchmarkContainer;
|
|
35
|
-
var BarchartContainer = _styledComponents.default.div(
|
|
37
|
+
var BarchartContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n\n"])));
|
|
36
38
|
exports.BarchartContainer = BarchartContainer;
|
|
37
|
-
var BottomDetailsRowContainer = _styledComponents.default.div(
|
|
39
|
+
var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center; \n //max-height: 20px;\n"])));
|
|
38
40
|
exports.BottomDetailsRowContainer = BottomDetailsRowContainer;
|
|
39
|
-
var BottomDetailsRowTitle = _styledComponents.default.div(
|
|
41
|
+
var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: center; \n margin-top: 4px;\n width: 14em;\n font-weight: 400;\n font-size: 14px;\n max-height: 20px;\n"])));
|
|
40
42
|
exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
|