sag_components 1.0.328 → 1.0.330

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 (5) hide show
  1. package/dist/stories/components/PerformanceAnalytics.js +81 -7
  2. package/dist/stories/components/PerformanceAnalytics.style.js +9 -4
  3. package/dist/stories/components/PerformanceAnalyticsOneColumn.js +11 -27
  4. package/dist/stories/components/PerformanceAnalyticsOneColumn.style.js +2 -2
  5. package/package.json +1 -1
package/dist/stories/components/PerformanceAnalytics.js CHANGED
@@ -146,11 +146,80 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
146
146
  var redemptionCostPercent = totalCostValue ? ((_payload$0$payload5 = payload[0].payload) === null || _payload$0$payload5 === void 0 ? void 0 : _payload$0$payload5.redemptionCostValue) / totalCostValue * 100 : 0;
147
147
  switch (segmentedButtonsFilter) {
148
148
  case INDIVIDUAL_PERFORMANCE_STR:
149
- return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipTitle, null, "".concat(payload[0].payload.retailer)), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Package Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.packageCostValue), "\n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.packageCostValue), " (").concat(packageCostPercent.toFixed(2), "%) "))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Redemption Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.redemptionCostValue), " \n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.redemptionCostValue), " (").concat(redemptionCostPercent.toFixed(2), "%) "))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Incremental Sales:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.incrementalSalesValue), " \n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.incrementalSalesValue), " "))));
149
+ return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, {
150
+ id: "TooltipContainer"
151
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipBarchart1Container, {
152
+ id: "ToolTipBarchart1Container"
153
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.LegendColorRectangle, {
154
+ id: "LegendColorRectangle",
155
+ color: colorBarchart1
156
+ }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipBarchart1LabelAndValueContainer, {
157
+ id: "ToolTipBarchart1LabelAndValueContainer"
158
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
159
+ id: "ToolTipLabelAndValueContainer"
160
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
161
+ id: "TooltipLabel"
162
+ }, "Package Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
163
+ id: "TooltipValue"
164
+ }, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.packageCostValue), "\n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.packageCostValue), " (").concat(packageCostPercent.toFixed(1), "%) "))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
165
+ id: "ToolTipLabelAndValueContainer"
166
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
167
+ id: "TooltipLabel"
168
+ }, "Redemption Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
169
+ id: "TooltipValue"
170
+ }, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.redemptionCostValue), " \n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.redemptionCostValue), " (").concat(redemptionCostPercent.toFixed(1), "%) "))))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
171
+ id: "ToolTipLabelAndValueContainer"
172
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.LegendColorRectangle, {
173
+ id: "LegendColorRectangle",
174
+ color: colorBarchart2
175
+ }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
176
+ id: "TooltipLabel"
177
+ }, "Incremental Sales:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
178
+ id: "TooltipValue"
179
+ }, "".concat((0, _CommonFunctions.getCurrencySign)(currencyType)).concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.incrementalSalesValue), " \n ").concat((0, _CommonFunctions.getFormattedUnits)(payload[0].payload.incrementalSalesValue), " "))));
150
180
  case PERCENT_INCREMENTAL_GROWTH_STR:
151
- return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipTitle, null, "".concat(payload[0].payload.retailer)), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Incremental Growth Value:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((_payload$0$payload$In = payload[0].payload.IncrementalGrowthValue) === null || _payload$0$payload$In === void 0 ? void 0 : _payload$0$payload$In.toFixed(2), "% "))));
181
+ return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, {
182
+ id: "TooltipContainer"
183
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
184
+ id: "ToolTipLabelAndValueContainer"
185
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.LegendColorRectangle, {
186
+ id: "LegendColorRectangle",
187
+ color: colorBarchart2
188
+ }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
189
+ id: "TooltipLabel"
190
+ }, "Incremental Growth Value:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
191
+ id: "TooltipValue"
192
+ }, "".concat((_payload$0$payload$In = payload[0].payload.IncrementalGrowthValue) === null || _payload$0$payload$In === void 0 ? void 0 : _payload$0$payload$In.toFixed(1), "% "))));
152
193
  case PERCENT_CONTRIBUTION_OF_TOTAL_STR:
153
- return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipTitle, null, "".concat(payload[0].payload.retailer)), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Contribution of Total Package Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((_payload$0$payload$co = payload[0].payload.contributionPackageCostValue) === null || _payload$0$payload$co === void 0 ? void 0 : _payload$0$payload$co.toFixed(2), "%"))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Contribution of Total Redemption Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((_payload$0$payload$co2 = payload[0].payload.contributionRedemptionCostValue) === null || _payload$0$payload$co2 === void 0 ? void 0 : _payload$0$payload$co2.toFixed(2), "%"))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, null, "Contribution of Total Incremental Sales:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, null, "".concat((_payload$0$payload$co3 = payload[0].payload.contributionIncrementalSalesValue) === null || _payload$0$payload$co3 === void 0 ? void 0 : _payload$0$payload$co3.toFixed(2), "%"))));
194
+ return /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipContainer, {
195
+ id: "TooltipContainer"
196
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipBarchart1Container, {
197
+ id: "ToolTipBarchart1Container"
198
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.LegendColorRectangle, {
199
+ id: "LegendColorRectangle",
200
+ color: colorBarchart1
201
+ }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipBarchart1LabelAndValueContainer, {
202
+ id: "ToolTipBarchart1LabelAndValueContainer"
203
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
204
+ id: "ToolTipLabelAndValueContainer"
205
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
206
+ id: "TooltipLabel"
207
+ }, "Contribution of Total Package Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
208
+ id: "TooltipValue"
209
+ }, "".concat((_payload$0$payload$co = payload[0].payload.contributionPackageCostValue) === null || _payload$0$payload$co === void 0 ? void 0 : _payload$0$payload$co.toFixed(1), "%"))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
210
+ id: "TooltipLabel"
211
+ }, "Contribution of Total Redemption Cost:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
212
+ id: "TooltipValue"
213
+ }, "".concat((_payload$0$payload$co2 = payload[0].payload.contributionRedemptionCostValue) === null || _payload$0$payload$co2 === void 0 ? void 0 : _payload$0$payload$co2.toFixed(1), "%"))))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.ToolTipLabelAndValueContainer, {
214
+ id: "ToolTipLabelAndValueContainer"
215
+ }, /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.LegendColorRectangle, {
216
+ id: "LegendColorRectangle",
217
+ color: colorBarchart2
218
+ }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipLabel, {
219
+ id: "TooltipLabel"
220
+ }, "Contribution of Total Incremental Sales:"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.TooltipValue, {
221
+ id: "TooltipValue"
222
+ }, "".concat((_payload$0$payload$co3 = payload[0].payload.contributionIncrementalSalesValue) === null || _payload$0$payload$co3 === void 0 ? void 0 : _payload$0$payload$co3.toFixed(1), "%"))));
154
223
  default:
155
224
  return null;
156
225
  }
@@ -275,6 +344,9 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
275
344
  height: 120,
276
345
  stroke: isNegativeValueFound() === true ? "#D0D0D0" : "#000"
277
346
  }), /*#__PURE__*/_react.default.createElement(_recharts.Tooltip, {
347
+ cursor: {
348
+ fill: "transparent"
349
+ },
278
350
  content: CustomTooltipBarChart
279
351
  }), /*#__PURE__*/_react.default.createElement(_recharts.ReferenceLine, {
280
352
  y: 0,
@@ -330,11 +402,13 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
330
402
  case PERCENT_INCREMENTAL_GROWTH_STR:
331
403
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
332
404
  legendData: [{
333
- iconColor: "#90CE9C",
405
+ iconColor: colorBarchart2,
334
406
  iconType: "Square",
335
407
  title: "% Incremental Growth"
336
408
  }, {
337
- iconColor: "#9CCB3B",
409
+ iconColor: {
410
+ colorGraphROI: colorGraphROI
411
+ },
338
412
  iconType: "LegendUnionIcon",
339
413
  title: "Incremental Sales ROI"
340
414
  }]
@@ -342,11 +416,11 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
342
416
  case PERCENT_CONTRIBUTION_OF_TOTAL_STR:
343
417
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
344
418
  legendData: [{
345
- iconColor: "#1F7677",
419
+ iconColor: colorBarchart1,
346
420
  iconType: "Square",
347
421
  title: "% Contribution to the Total Cost"
348
422
  }, {
349
- iconColor: "#90CE9C",
423
+ iconColor: colorBarchart2,
350
424
  iconType: "Square",
351
425
  title: "% Contribution to the Inc. Sales"
352
426
  }]
package/dist/stories/components/PerformanceAnalytics.style.js CHANGED
@@ -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.TooltipValue = exports.TooltipTitle = exports.TooltipLabel = exports.TooltipContainer = exports.ToolTipLabelAndValueContainer = exports.SegmentedButtonContainer = exports.ControlsContainer = exports.Controls = void 0;
7
+ exports.TooltipValue = exports.TooltipTitle = exports.TooltipLabel = exports.TooltipContainer = exports.ToolTipLabelAndValueContainer = exports.ToolTipBarchart1LabelAndValueContainer = exports.ToolTipBarchart1Container = exports.SegmentedButtonContainer = exports.LegendColorRectangle = exports.ControlsContainer = exports.Controls = 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;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
11
11
  var scrollableStyles = "\n overflow-y: auto;\n\n &::-webkit-scrollbar {\n width: 8px;\n }\n\n &::-webkit-scrollbar-track {\n background: #E8E8E8;\n border-radius: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background: #D0D0D0;\n border-radius: 5px;\n }\n";
12
12
  var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n\n > * {\n box-sizing: border-box;\n }\n"])), function (props) {
13
13
  return props.rootFont;
@@ -18,10 +18,15 @@ var ControlsContainer = exports.ControlsContainer = _styledComponents.default.di
18
18
  }, function (props) {
19
19
  return props.height;
20
20
  });
21
- var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n padding: 14px 28px;\n background: white;\n ", "\n @media (max-width: 1536px) {\n padding: 12px 24px;\n } \n > #SegmentedButtonContainer {\n padding-left: 0;\n margin-bottom: 16px;\n > #Controls {\n background: #f2f2f2;\n }\n }\n"])), scrollableStyles);
21
+ var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n padding: 14px 28px;\n background: white;\n ", "\n @media (max-width: 1536px) {\n padding: 12px 24px;\n }\n > #SegmentedButtonContainer {\n padding-left: 0;\n margin-bottom: 16px;\n > #Controls {\n background: #f2f2f2;\n }\n }\n"])), scrollableStyles);
22
22
  var SegmentedButtonContainer = exports.SegmentedButtonContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n padding: 10px 0 0 10px;\n"])));
23
23
  var TooltipContainer = exports.TooltipContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n border-radius: 5px;\n background: #fff;\n font-family: \"Poppins\", sans-serif;\n border-radius: 5px;\n padding: 8px 12px;\n display: grid;\n"])));
24
24
  var TooltipLabel = exports.TooltipLabel = _styledComponents.default.p(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: \"Poppins\", sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: normal;\n width: fit-content;\n margin: 0 6px 0 0;\n"])));
25
25
  var TooltipValue = exports.TooltipValue = _styledComponents.default.p(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: \"Poppins\", sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n width: fit-content;\n margin: 0;\n"])));
26
26
  var TooltipTitle = exports.TooltipTitle = _styledComponents.default.p(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: Poppins;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n margin: 0;\n"])));
27
- var ToolTipLabelAndValueContainer = exports.ToolTipLabelAndValueContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n"])));
27
+ var ToolTipBarchart1Container = exports.ToolTipBarchart1Container = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n margin-bottom: 10px;\n"])));
28
+ var ToolTipBarchart1LabelAndValueContainer = exports.ToolTipBarchart1LabelAndValueContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n /* display: flex;\n flex-direction: column; */\n // align-items: center;\n gap: 8px;\n"])));
29
+ var ToolTipLabelAndValueContainer = exports.ToolTipLabelAndValueContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n gap: 8px;\n"])));
30
+ var LegendColorRectangle = exports.LegendColorRectangle = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n width: 0.875rem;\n min-width: 0.875rem;\n height: 0.875rem;\n border-radius: 2px;\n background: ", ";\n"])), function (props) {
31
+ return props.color;
32
+ });
package/dist/stories/components/PerformanceAnalyticsOneColumn.js CHANGED
@@ -14,7 +14,7 @@ var _PerformanceAnalyticsTotals = require("./PerformanceAnalyticsTotals");
14
14
  var _PerformanceAnalyticsOneColumn = require("./PerformanceAnalyticsOneColumn.style");
15
15
  var _PerformanceAnalyticsLegend = require("./PerformanceAnalyticsLegend");
16
16
  var _CommonFunctions = require("./CommonFunctions");
17
- var _excluded = ["totalsData", "data", "colorBarchart1", "colorBarchart2", "width", "height", "lineChartHeight", "lineChartValueType", "lineChartValueBold", "topBarPercentSigning", "topBarSigning", "noDataText"];
17
+ var _excluded = ["totalsData", "data", "legendData", "colorBarchart1", "colorBarchart2", "width", "height", "lineChartHeight", "lineChartValueType", "lineChartValueBold", "topBarPercentSigning", "topBarSigning", "noDataText"];
18
18
  var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = function PerformanceAnalyticsOneColumn(_ref) {
19
19
  var _ref$totalsData = _ref.totalsData,
20
20
  totalsData = _ref$totalsData === void 0 ? [{
@@ -22,7 +22,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
22
22
  value: 13,
23
23
  dotCut: true,
24
24
  currency: true,
25
- currencyType: "UGH",
25
+ currencyType: "USD",
26
26
  growthPercent: 14,
27
27
  showGrowthPercentSign: true
28
28
  }] : _ref$totalsData,
@@ -37,6 +37,12 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
37
37
  existingShoppersValue: 66,
38
38
  existingShoppersPercentValue: 45
39
39
  }] : _ref$data,
40
+ _ref$legendData = _ref.legendData,
41
+ legendData = _ref$legendData === void 0 ? [{
42
+ iconColor: string | null,
43
+ iconType: string | null,
44
+ title: string | null
45
+ }] : _ref$legendData,
40
46
  _ref$colorBarchart = _ref.colorBarchart1,
41
47
  colorBarchart1 = _ref$colorBarchart === void 0 ? "#1F7677" : _ref$colorBarchart,
42
48
  _ref$colorBarchart2 = _ref.colorBarchart2,
@@ -50,22 +56,16 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
50
56
  topBarSigning = _ref.topBarSigning,
51
57
  noDataText = _ref.noDataText,
52
58
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
53
- // const {
54
- // totalsData,
55
- // noDataText,
56
- // height,
57
- // width,
58
- // } = props;
59
59
  var CustomTooltipBarChart = function CustomTooltipBarChart(_ref2) {
60
60
  var active = _ref2.active,
61
61
  payload = _ref2.payload;
62
62
  if (active && payload && payload.length > 0) {
63
63
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.TooltipContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.LegendColorRectangle, {
64
64
  id: "LegendColorRectangle",
65
- color: "#1F7677"
65
+ color: colorBarchart1
66
66
  }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.TooltipLabel, null, "New Shoppers"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.TooltipValue, null, "".concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.newShoppersValue), "\n (").concat(payload[0].payload.newShoppersPercentValue.toFixed(2), "%) "))), /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.ToolTipLabelAndValueContainer, null, /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.LegendColorRectangle, {
67
67
  id: "LegendColorRectangle",
68
- color: "#90CE9C"
68
+ color: colorBarchart2
69
69
  }), /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.TooltipLabel, null, "Existing Shoppers"), /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsOneColumn.TooltipValue, null, "".concat((0, _CommonFunctions.getFormattedValue)(payload[0].payload.existingShoppersValue), "\n (").concat(payload[0].payload.existingShoppersPercentValue.toFixed(2), "%) "))));
70
70
  }
71
71
  return null;
@@ -187,23 +187,7 @@ var PerformanceAnalyticsOneColumn = exports.PerformanceAnalyticsOneColumn = func
187
187
  };
188
188
  var displayLegendData = function displayLegendData() {
189
189
  return /*#__PURE__*/_react.default.createElement(_PerformanceAnalyticsLegend.PerformanceAnalyticsLegend, {
190
- legendData: [{
191
- iconColor: "#1F7677",
192
- iconType: "Square",
193
- title: "% New Shoppers"
194
- }, {
195
- iconColor: "#1F7677",
196
- iconType: "LegendUnionIcon",
197
- title: "% New Shoppers"
198
- }, {
199
- iconColor: "#90CE9C",
200
- iconType: "Square",
201
- title: "# Existing Shoppers"
202
- }, {
203
- iconColor: "#9CCB3B",
204
- iconType: "LegendUnionIcon",
205
- title: "# Existing Shoppers"
206
- }]
190
+ legendData: legendData
207
191
  });
208
192
  };
209
193
  var CustomizedLabelROI = function CustomizedLabelROI(props) {
package/dist/stories/components/PerformanceAnalyticsOneColumn.style.js CHANGED
@@ -8,7 +8,7 @@ exports.TotalsDataContainer = exports.TooltipValue = exports.TooltipTitle = expo
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
11
- 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) {
11
+ 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) {
12
12
  return props.rootFont;
13
13
  }, function (props) {
14
14
  return props.textColor;
@@ -19,7 +19,7 @@ var ControlsContainer = exports.ControlsContainer = _styledComponents.default.di
19
19
  });
20
20
  var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n padding: 24px 40px;\n background: white;\n @media (max-width: 1536px) {\n padding: 12px 32px;\n }\n"])));
21
21
  var SegmentedButtonContainer = exports.SegmentedButtonContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n padding: 10px 0 0 10px;\n"])));
22
- var TotalsDataContainer = exports.TotalsDataContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n"])));
22
+ var TotalsDataContainer = exports.TotalsDataContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)([""])));
23
23
  var LabelBoldText = exports.LabelBoldText = _styledComponents.default.tspan(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n @media (max-width: 1536px) {\n font-size: 12px;\n }\n"])));
24
24
  var LabelText = exports.LabelText = _styledComponents.default.tspan(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n @media (max-width: 1536px) {\n font-size: 10px;\n }\n @media (max-width: 1366px) {\n font-size: 8px;\n }\n"])));
25
25
  var TooltipContainer = exports.TooltipContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n border-radius: 5px;\n background: #fff;\n font-family: \"Poppins\", sans-serif;\n border-radius: 5px;\n padding: 8px 12px;\n display: grid;\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.328",
3
+ "version": "1.0.330",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {