sag_components 1.0.327 → 1.0.328

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.
Files changed (3) hide show
  1. package/dist/stories/components/PerformanceAnalytics.js +37 -36
  2. package/dist/stories/components/PerformanceAnalyticsOneColumn.js +31 -31
  3. package/package.json +1 -1
package/dist/stories/components/PerformanceAnalytics.js CHANGED
@@ -19,9 +19,9 @@ var _PerformanceAnalyticsLegend = require("./PerformanceAnalyticsLegend");
19
19
  var _CommonFunctions = require("./CommonFunctions");
20
20
  var _PerformanceAnalytics = require("./PerformanceAnalytics.style");
21
21
  var _excluded = ["totalsData", "data", "currencyType", "colorGraphROI", "colorBarchart1", "colorBarchart2", "textcolor", "width", "height", "dotCut", "lineChartHeight", "noDataText"];
22
- var INDIVIDUAL_PERFORMANCE_STR = 'Individual Performance';
23
- var PERCENT_INCREMENTAL_GROWTH_STR = '% Incremental Growth';
24
- var PERCENT_CONTRIBUTION_OF_TOTAL_STR = '% Contribution of Total';
22
+ var INDIVIDUAL_PERFORMANCE_STR = "Individual Performance";
23
+ var PERCENT_INCREMENTAL_GROWTH_STR = "% Incremental Growth";
24
+ var PERCENT_CONTRIBUTION_OF_TOTAL_STR = "% Contribution of Total";
25
25
 
26
26
  /* PerformanceAnalytics */
27
27
  var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAnalytics(_ref) {
@@ -58,15 +58,15 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
58
58
  existingShoppersPercentValue: _propTypes.number | null
59
59
  }] : _ref$data,
60
60
  _ref$currencyType = _ref.currencyType,
61
- currencyType = _ref$currencyType === void 0 ? 'USD' : _ref$currencyType,
61
+ currencyType = _ref$currencyType === void 0 ? "USD" : _ref$currencyType,
62
62
  _ref$colorGraphROI = _ref.colorGraphROI,
63
- colorGraphROI = _ref$colorGraphROI === void 0 ? '#9CCB3B' : _ref$colorGraphROI,
63
+ colorGraphROI = _ref$colorGraphROI === void 0 ? "#9CCB3B" : _ref$colorGraphROI,
64
64
  _ref$colorBarchart = _ref.colorBarchart1,
65
- colorBarchart1 = _ref$colorBarchart === void 0 ? '#1F7677' : _ref$colorBarchart,
65
+ colorBarchart1 = _ref$colorBarchart === void 0 ? "#1F7677" : _ref$colorBarchart,
66
66
  _ref$colorBarchart2 = _ref.colorBarchart2,
67
- colorBarchart2 = _ref$colorBarchart2 === void 0 ? '#90CE9C' : _ref$colorBarchart2,
67
+ colorBarchart2 = _ref$colorBarchart2 === void 0 ? "#90CE9C" : _ref$colorBarchart2,
68
68
  _ref$textcolor = _ref.textcolor,
69
- textcolor = _ref$textcolor === void 0 ? '#212121' : _ref$textcolor,
69
+ textcolor = _ref$textcolor === void 0 ? "#212121" : _ref$textcolor,
70
70
  width = _ref.width,
71
71
  height = _ref.height,
72
72
  dotCut = _ref.dotCut,
@@ -188,7 +188,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
188
188
  value = props.value,
189
189
  payload = props.payload;
190
190
  var radius = 10;
191
- var plusSign = value > 0 ? '+' : '';
191
+ var plusSign = value > 0 ? "+" : "";
192
192
  return /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("text", {
193
193
  x: x + width / 2,
194
194
  y: y - radius,
@@ -197,7 +197,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
197
197
  fontSize: "16px",
198
198
  textAnchor: "middle",
199
199
  dominantBaseline: "middle"
200
- }, segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? currencyType ? "".concat((0, _CommonFunctions.getCurrencySign)(currencyType).toString(), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : '', " ") : '' : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "".concat(plusSign).concat(value, "%") : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "".concat(value, "%") : ''));
200
+ }, segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? currencyType ? "".concat((0, _CommonFunctions.getCurrencySign)(currencyType).toString(), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : "", " ") : "" : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "".concat(plusSign).concat(value, "%") : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "".concat(value, "%") : ""));
201
201
  };
202
202
  function CustomizedTickBarChart(props) {
203
203
  var x = props.x,
@@ -242,10 +242,10 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
242
242
  return null;
243
243
  }
244
244
  var getDataKeyNameBar1 = function getDataKeyNameBar1() {
245
- return segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? 'totalValue' : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? '' : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? 'contributionTotalCostValue' : '';
245
+ return segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? "totalValue" : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "" : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "contributionTotalCostValue" : "";
246
246
  };
247
247
  var getDataKeyNameBar2 = function getDataKeyNameBar2() {
248
- return segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? 'incrementalSalesValue' : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? 'IncrementalGrowthValue' : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? 'contributionIncrementalSalesValue' : '';
248
+ return segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? "incrementalSalesValue" : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "IncrementalGrowthValue" : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "contributionIncrementalSalesValue" : "";
249
249
  };
250
250
  var displayBarChart = function displayBarChart() {
251
251
  if (data && data.length > 0) {
@@ -261,6 +261,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
261
261
  width: width
262
262
  }, /*#__PURE__*/_react.default.createElement(_recharts.BarChart, {
263
263
  data: formatedData,
264
+ maxBarSize: 60,
264
265
  margin: {
265
266
  top: 30,
266
267
  right: 30,
@@ -272,7 +273,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
272
273
  tick: CustomizedTickBarChart,
273
274
  tickLine: false,
274
275
  height: 120,
275
- stroke: isNegativeValueFound() === true ? '#D0D0D0' : '#000'
276
+ stroke: isNegativeValueFound() === true ? "#D0D0D0" : "#000"
276
277
  }), /*#__PURE__*/_react.default.createElement(_recharts.Tooltip, {
277
278
  content: CustomTooltipBarChart
278
279
  }), /*#__PURE__*/_react.default.createElement(_recharts.ReferenceLine, {
@@ -286,7 +287,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
286
287
  }, /*#__PURE__*/_react.default.createElement(_recharts.LabelList, {
287
288
  dataKey: getDataKeyNameBar1(),
288
289
  content: CustomizedLabelBarchart
289
- })) : '', /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
290
+ })) : "", /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
290
291
  dataKey: getDataKeyNameBar2(),
291
292
  fill: colorBarchart2,
292
293
  minPointSize: 10,
@@ -313,45 +314,45 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
313
314
  case INDIVIDUAL_PERFORMANCE_STR:
314
315
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
315
316
  legendData: [{
316
- iconColor: '#1F7677',
317
- iconType: 'Square',
318
- title: 'Total Cost'
317
+ iconColor: "#1F7677",
318
+ iconType: "Square",
319
+ title: "Total Cost"
319
320
  }, {
320
- iconColor: '#90CE9C',
321
- iconType: 'Square',
322
- title: 'Incremental Sales'
321
+ iconColor: "#90CE9C",
322
+ iconType: "Square",
323
+ title: "Incremental Sales"
323
324
  }, {
324
- iconColor: '#9CCB3B',
325
- iconType: 'LegendUnionIcon',
326
- title: 'Incremental Sales ROI'
325
+ iconColor: "#9CCB3B",
326
+ iconType: "LegendUnionIcon",
327
+ title: "Incremental Sales ROI"
327
328
  }]
328
329
  });
329
330
  case PERCENT_INCREMENTAL_GROWTH_STR:
330
331
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
331
332
  legendData: [{
332
- iconColor: '#90CE9C',
333
- iconType: 'Square',
334
- title: '% Incremental Growth'
333
+ iconColor: "#90CE9C",
334
+ iconType: "Square",
335
+ title: "% Incremental Growth"
335
336
  }, {
336
- iconColor: '#9CCB3B',
337
- iconType: 'LegendUnionIcon',
338
- title: 'Incremental Sales ROI'
337
+ iconColor: "#9CCB3B",
338
+ iconType: "LegendUnionIcon",
339
+ title: "Incremental Sales ROI"
339
340
  }]
340
341
  });
341
342
  case PERCENT_CONTRIBUTION_OF_TOTAL_STR:
342
343
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
343
344
  legendData: [{
344
- iconColor: '#1F7677',
345
- iconType: 'Square',
346
- title: '% Contribution to the Total Cost'
345
+ iconColor: "#1F7677",
346
+ iconType: "Square",
347
+ title: "% Contribution to the Total Cost"
347
348
  }, {
348
- iconColor: '#90CE9C',
349
- iconType: 'Square',
350
- title: '% Contribution to the Inc. Sales'
349
+ iconColor: "#90CE9C",
350
+ iconType: "Square",
351
+ title: "% Contribution to the Inc. Sales"
351
352
  }]
352
353
  });
353
354
  default:
354
- return '';
355
+ return "";
355
356
  }
356
357
  };
357
358
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ControlsContainer, {
package/dist/stories/components/PerformanceAnalyticsOneColumn.js CHANGED
@@ -18,19 +18,19 @@ var _excluded = ["totalsData", "data", "colorBarchart1", "colorBarchart2", "widt
18
18
  var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = function PerformanceAnalyticsOneColumn(_ref) {
19
19
  var _ref$totalsData = _ref.totalsData,
20
20
  totalsData = _ref$totalsData === void 0 ? [{
21
- title: 'tile',
21
+ title: "tile",
22
22
  value: 13,
23
23
  dotCut: true,
24
24
  currency: true,
25
- currencyType: 'UGH',
25
+ currencyType: "UGH",
26
26
  growthPercent: 14,
27
27
  showGrowthPercentSign: true
28
28
  }] : _ref$totalsData,
29
29
  _ref$data = _ref.data,
30
30
  data = _ref$data === void 0 ? [{
31
- retailer: '',
32
- offerType: '',
33
- period: '',
31
+ retailer: "",
32
+ offerType: "",
33
+ period: "",
34
34
  // New / existing Shoppers
35
35
  newShoppersValue: 44,
36
36
  newShoppersPercentValue: 55,
@@ -38,9 +38,9 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
38
38
  existingShoppersPercentValue: 45
39
39
  }] : _ref$data,
40
40
  _ref$colorBarchart = _ref.colorBarchart1,
41
- colorBarchart1 = _ref$colorBarchart === void 0 ? '#1F7677' : _ref$colorBarchart,
41
+ colorBarchart1 = _ref$colorBarchart === void 0 ? "#1F7677" : _ref$colorBarchart,
42
42
  _ref$colorBarchart2 = _ref.colorBarchart2,
43
- colorBarchart2 = _ref$colorBarchart2 === void 0 ? '#90CE9C' : _ref$colorBarchart2,
43
+ colorBarchart2 = _ref$colorBarchart2 === void 0 ? "#90CE9C" : _ref$colorBarchart2,
44
44
  width = _ref.width,
45
45
  height = _ref.height,
46
46
  lineChartHeight = _ref.lineChartHeight,
@@ -71,13 +71,13 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
71
71
  return null;
72
72
  };
73
73
  var getTopBarSigning = function getTopBarSigning(signing) {
74
- if (signing === 'Dollar sign ($)') {
75
- return '$';
74
+ if (signing === "Dollar sign ($)") {
75
+ return "$";
76
76
  }
77
- if (signing === 'Euro sign (€)') {
78
- return '€';
77
+ if (signing === "Euro sign (€)") {
78
+ return "€";
79
79
  }
80
- return '';
80
+ return "";
81
81
  };
82
82
  var CustomizedLabelBarchart = function CustomizedLabelBarchart(props) {
83
83
  var x = props.x,
@@ -95,7 +95,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
95
95
  fontSize: "16px",
96
96
  textAnchor: "middle",
97
97
  dominantBaseline: "middle"
98
- }, "".concat(getTopBarSigning(topBarSigning)).concat(totalValue).concat(topBarPercentSigning ? '%' : '')));
98
+ }, "".concat(getTopBarSigning(topBarSigning), "\n ").concat((0, _CommonFunctions.getFormattedValue)(totalValue), "\n ").concat((0, _CommonFunctions.getFormattedUnits)(totalValue), " \n ").concat(topBarPercentSigning ? "%" : "")));
99
99
  };
100
100
  var CustomizedTickBarChart = function CustomizedTickBarChart(props) {
101
101
  var x = props.x,
@@ -160,7 +160,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
160
160
  fill: "#212121"
161
161
  }), /*#__PURE__*/_react.default.createElement(_recharts.Tooltip, {
162
162
  cursor: {
163
- fill: 'transparent'
163
+ fill: "transparent"
164
164
  },
165
165
  content: CustomTooltipBarChart
166
166
  }), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
@@ -188,21 +188,21 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
188
188
  var displayLegendData = function displayLegendData() {
189
189
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
190
190
  legendData: [{
191
- iconColor: '#1F7677',
192
- iconType: 'Square',
193
- title: '% New Shoppers'
191
+ iconColor: "#1F7677",
192
+ iconType: "Square",
193
+ title: "% New Shoppers"
194
194
  }, {
195
- iconColor: '#1F7677',
196
- iconType: 'LegendUnionIcon',
197
- title: '% New Shoppers'
195
+ iconColor: "#1F7677",
196
+ iconType: "LegendUnionIcon",
197
+ title: "% New Shoppers"
198
198
  }, {
199
- iconColor: '#90CE9C',
200
- iconType: 'Square',
201
- title: '# Existing Shoppers'
199
+ iconColor: "#90CE9C",
200
+ iconType: "Square",
201
+ title: "# Existing Shoppers"
202
202
  }, {
203
- iconColor: '#9CCB3B',
204
- iconType: 'LegendUnionIcon',
205
- title: '# Existing Shoppers'
203
+ iconColor: "#9CCB3B",
204
+ iconType: "LegendUnionIcon",
205
+ title: "# Existing Shoppers"
206
206
  }]
207
207
  });
208
208
  };
@@ -219,7 +219,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
219
219
  fontWeight: lineChartValueBold ? 600 : 400,
220
220
  fontSize: 14,
221
221
  textAnchor: "middle"
222
- }, "".concat(value).concat(lineChartValueType ? '%' : ''));
222
+ }, "".concat(value).concat(lineChartValueType ? "%" : ""));
223
223
  };
224
224
  var CustomTooltipROI = function CustomTooltipROI(_ref3) {
225
225
  var active = _ref3.active,
@@ -281,9 +281,9 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
281
281
  };
282
282
  var _default = exports.default = PerformanceAnalyticsOneColumn;
283
283
  PerformanceAnalyticsOneColumn.defaultProps = {
284
- lineChartHeight: '50',
285
- width: '100%',
286
- height: '100%',
284
+ lineChartHeight: "50",
285
+ width: "100%",
286
+ height: "100%",
287
287
  totalsData: [],
288
- noDataText: 'No data'
288
+ noDataText: "No data"
289
289
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.327",
3
+ "version": "1.0.328",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {