sag_components 1.0.897 → 1.0.899

package/dist/stories/components/PerformanceAnalytics.js

@@ -15,6 +15,15 @@ var _PerformanceAnalyticsTotals = require("./PerformanceAnalyticsTotals");
 var _PerformanceAnalyticsLegend = require("./PerformanceAnalyticsLegend");
 var _CommonFunctions = require("./CommonFunctions");
 var _PerformanceAnalytics = require("./PerformanceAnalytics.style");
+/* eslint-disable no-use-before-define */
+/* eslint-disable react/jsx-no-bind */
+/* eslint-disable no-nested-ternary */
+/* eslint-disable camelcase */
+/* eslint-disable react/prop-types */
+/* eslint-disable no-shadow */
+/* eslint-disable no-unsafe-optional-chaining */
+/* eslint-disable react/no-unstable-nested-components */
+
 const INDIVIDUAL_PERFORMANCE_STR = 'Individual Performance';
 const PERCENT_INCREMENTAL_GROWTH_STR = '% Incremental Growth';
 const PERCENT_CONTRIBUTION_OF_TOTAL_STR = '% Contribution of Total';

package/dist/stories/components/SingleBarLineCharts.js

@@ -24,12 +24,13 @@ const SingleBarLineCharts = props => {
     className,
     width,
     height,
+    title,
     barSize,
     maxRange,
     barChartHeight,
     lineChartHeight,
     showSecondBar,
-    isLineChartPercent,
+    isLineChartCurrency,
     isLineChartBolded,
     isTopBarPercent,
     showPeriod,
@@ -61,7 +62,6 @@ const SingleBarLineCharts = props => {
       const isSecondBar = payload[0].dataKey === 'secondBarValue';
       const percentage = isSecondBar ? currentSecondBarValue / totalSecondBarValue * 100 : currentBarValue / totalBarValue * 100;
       return /*#__PURE__*/_react.default.createElement(_TspanTooltip.default, {
-        id: "Tooltip",
         content: `${percentage.toFixed(1)}%`,
         top: coordinate.y - (isSecondBar ? currentSecondBarValue : currentBarValue),
         left: coordinate.x,
@@ -174,7 +174,15 @@ const SingleBarLineCharts = props => {
       fontWeight: isLineChartBolded ? 600 : 400,
       fontSize: "0.6em",
       textAnchor: "middle"
-    }, `${value}${isLineChartPercent ? '%' : ''}`);
+    }, `${isLineChartCurrency ? currencySign : ''}${value}`);
+  };
+  const isNegativeValueFound = () => {
+    if (data && data.length > 0) {
+      const negativeData = data.filter(item => item.barValue < 0 || item.secondBarValue < 0);
+      if (negativeData && negativeData.length > 0) return true;
+      return false;
+    }
+    return false;
   };
   return /*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.ControlsContainer, {
     className: className,
@@ -182,7 +190,7 @@ const SingleBarLineCharts = props => {
     height: height
   }, (data === null || data === void 0 ? void 0 : data.length) > 0 ? /*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.Controls, {
     className: "Controls"
-  }, totalsData.length > 0 && /*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.LinnerDataBoxWrap, {
+  }, title !== '' && /*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.Title, null, title), totalsData.length > 0 && /*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.LinnerDataBoxWrap, {
     width: "40%",
     height: "60px",
     data: totalsData
@@ -220,15 +228,17 @@ const SingleBarLineCharts = props => {
     tick: CustomizedTickBarChart,
     tickLine: false,
     height: 120,
-    stroke: "#D0D0D0",
-    fill: "#212121",
-    allowDataOverflow: true
+    stroke: isNegativeValueFound() === true ? '#D0D0D0' : '#000',
+    fill: "#212121"
   }), /*#__PURE__*/_react.default.createElement(_recharts.YAxis, {
     type: "number",
     width: 0,
     display: "none",
-    domain: [0, dataMax => dataMax * maxRange],
+    domain: ['auto', dataMax => dataMax * maxRange],
     allowDataOverflow: true
+  }), /*#__PURE__*/_react.default.createElement(_recharts.ReferenceLine, {
+    y: 0,
+    stroke: "#D0D0D0"
   }), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
     dataKey: "barValue",
     barSize: barSize !== null && barSize !== void 0 ? barSize : 60,
@@ -263,12 +273,13 @@ exports.SingleBarLineCharts = SingleBarLineCharts;
 var _default = exports.default = SingleBarLineCharts;
 SingleBarLineCharts.defaultProps = {
   className: '',
+  title: '',
   width: '100%',
   height: '100%',
   barSize: 60,
   barChartHeight: 250,
   lineChartHeight: 50,
-  isLineChartPercent: false,
+  isLineChartCurrency: false,
   isLineChartBolded: false,
   isTopBarPercent: true,
   maxRange: 1,

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SegmentedButtonContainer = exports.LinnerDataBoxWrap = exports.LabelText = exports.LabelBoldText = exports.ControlsContainer = exports.Controls = void 0;
+exports.Title = exports.SegmentedButtonContainer = exports.LinnerDataBoxWrap = exports.LabelText = exports.LabelBoldText = exports.ControlsContainer = exports.Controls = void 0;
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _LinnerDataBox = require("./LinnerDataBox");
 const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div`
@@ -26,6 +26,13 @@ const ControlsContainer = exports.ControlsContainer = _styledComponents.default.
     box-sizing: border-box;
   }
 `;
+const Title = exports.Title = _styledComponents.default.span`
+  color: black;
+  display: inline-block;
+  font-size: 18px;
+  font-weight: 400;
+  margin-bottom: 12px;
+`;
 const Controls = exports.Controls = _styledComponents.default.div`
   width: 100%;
   height: 100%;

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

@@ -12,7 +12,7 @@ const TooltipContainer = exports.TooltipContainer = _styledComponents.default.di
   --tooltip-margin: 40px;
   --tooltip-arrow-size: 10px;
   position: absolute;
-  z-index: 9999;
+  z-index: 999999;
   top: ${props => props.top};
   left: ${props => props.left};
 `;

package/package.json

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