sag_components 1.0.342 → 1.0.344

package/dist/stories/components/PerformanceAnalyticsOneColumn.js

@@ -21,19 +21,19 @@ var _excluded = ["totalsData", "data", "legendData", "colorBarchart1", "colorBar
 var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = function PerformanceAnalyticsOneColumn(_ref) {
   var _ref$totalsData = _ref.totalsData,
     totalsData = _ref$totalsData === void 0 ? [{
-      title: 'title',
+      title: "title",
       value: 13,
       dotCut: true,
       currency: true,
-      currencyType: 'USD',
+      currencyType: "USD",
       growthPercent: 14,
       showGrowthPercentSign: true
     }] : _ref$totalsData,
     _ref$data = _ref.data,
     data = _ref$data === void 0 ? [{
-      retailer: '',
-      offerType: '',
-      period: '',
+      retailer: "",
+      offerType: "",
+      period: "",
       // New / existing Shoppers
       newShoppersValue: 44,
       newShoppersPercentValue: 55,
@@ -47,9 +47,9 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
       title: string | null
     }] : _ref$legendData,
     _ref$colorBarchart = _ref.colorBarchart1,
-    colorBarchart1 = _ref$colorBarchart === void 0 ? '#1F7677' : _ref$colorBarchart,
+    colorBarchart1 = _ref$colorBarchart === void 0 ? "#1F7677" : _ref$colorBarchart,
     _ref$colorBarchart2 = _ref.colorBarchart2,
-    colorBarchart2 = _ref$colorBarchart2 === void 0 ? '#90CE9C' : _ref$colorBarchart2,
+    colorBarchart2 = _ref$colorBarchart2 === void 0 ? "#90CE9C" : _ref$colorBarchart2,
     width = _ref.width,
     height = _ref.height,
     lineChartHeight = _ref.lineChartHeight,
@@ -64,7 +64,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
     showLegendTooltip = _useState2[0],
     setShowLegendTooltip = _useState2[1];
   var _useState3 = (0, _react.useState)({
-      content: '',
+      content: "",
       clientX: 0,
       clientY: 0
     }),
@@ -86,13 +86,13 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
     return null;
   };
   var getTopBarSigning = function getTopBarSigning(signing) {
-    if (signing === 'Dollar sign ($)') {
-      return '$';
+    if (signing === "Dollar sign ($)") {
+      return "$";
     }
-    if (signing === 'Euro sign (€)') {
-      return '€';
+    if (signing === "Euro sign (€)") {
+      return "€";
     }
-    return '';
+    return "";
   };
   var CustomizedLabelBarchart = function CustomizedLabelBarchart(props) {
     var x = props.x,
@@ -110,7 +110,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
       fontSize: "16px",
       textAnchor: "middle",
       dominantBaseline: "middle"
-    }, "".concat(getTopBarSigning(topBarSigning), "\n            ").concat((0, _CommonFunctions.getFormattedValue)(totalValue), "\n            ").concat((0, _CommonFunctions.getFormattedUnits)(totalValue), "\n            ").concat(topBarPercentSigning ? '%' : '')));
+    }, "".concat(getTopBarSigning(topBarSigning), "\n            ").concat((0, _CommonFunctions.getFormattedValue)(totalValue), "\n            ").concat((0, _CommonFunctions.getFormattedUnits)(totalValue), "\n            ").concat(topBarPercentSigning ? "%" : "")));
   };
   var CustomizedTickBarChart = function CustomizedTickBarChart(props) {
     var x = props.x,
@@ -192,7 +192,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
         direction: "top"
       }), /*#__PURE__*/_react.default.createElement(_recharts.Tooltip, {
         cursor: {
-          fill: 'transparent'
+          fill: "transparent"
         },
         content: CustomTooltipBarChart
       }), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
@@ -235,7 +235,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
       fontWeight: lineChartValueBold ? 600 : 400,
       fontSize: 14,
       textAnchor: "middle"
-    }, "".concat(value).concat(lineChartValueType ? '%' : ''));
+    }, "".concat(value).concat(lineChartValueType ? "%" : ""));
   };
   var CustomTooltipROI = function CustomTooltipROI(_ref3) {
     var active = _ref3.active,
@@ -288,18 +288,21 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
     })))));
   };
   return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.ControlsContainer, {
-    id: "ControlsContainer",
+    id: "PerformanceAnalyticsControlsContainer",
+    className: (totalsData === null || totalsData === void 0 ? void 0 : totalsData.length) > 0 && (data === null || data === void 0 ? void 0 : data.length) > 0 ? "" : "NoData",
     width: width,
     height: height
   }, (totalsData === null || totalsData === void 0 ? void 0 : totalsData.length) > 0 && (data === null || data === void 0 ? void 0 : data.length) > 0 ? /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.Controls, {
     id: "Controls"
-  }, displayTotalsData(), displayLineChartROI(), displayBarChart(), displayLegendData()) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, null));
+  }, displayTotalsData(), displayLineChartROI(), displayBarChart(), displayLegendData()) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
+    noDataText: noDataText
+  }));
 };
 var _default = exports.default = PerformanceAnalyticsOneColumn;
 PerformanceAnalyticsOneColumn.defaultProps = {
-  lineChartHeight: '50',
-  width: '100%',
-  height: '100%',
+  lineChartHeight: "50",
+  width: "100%",
+  height: "100%",
   totalsData: [],
-  noDataText: 'No data'
+  noDataText: "No data"
 };

package/dist/stories/components/PerformanceAnalyticsOneColumn.style.js

@@ -8,7 +8,7 @@ exports.TotalsDataContainer = exports.TooltipValue = exports.TooltipTitle = expo
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
-var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n\n  > * {\n    box-sizing: border-box;\n  }\n"])), function (props) {
+var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n\n  > * {\n    box-sizing: border-box;\n  }\n  > .NoData {\n    align-self: center;\n    display: flex;\n    align-items: center;\n    width: 50%;\n    margin: auto;\n  }\n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sag_components",
-  "version": "1.0.342",
+  "version": "1.0.344",
   "description": "",
   "main": "dist/index.js",
   "scripts": {