sag_components 1.0.710 → 1.0.712
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.
|
@@ -20,7 +20,8 @@ const BannerEventBoxList = props => {
|
|
|
20
20
|
data,
|
|
21
21
|
retailerFile,
|
|
22
22
|
toggleColor,
|
|
23
|
-
disableToggle
|
|
23
|
+
disableToggle,
|
|
24
|
+
bannerWidth
|
|
24
25
|
} = props;
|
|
25
26
|
const [IsItemOpen, setIsItemOpen] = (0, _react.useState)(false);
|
|
26
27
|
const handleToggle = () => {
|
|
@@ -52,7 +53,7 @@ const BannerEventBoxList = props => {
|
|
|
52
53
|
}, data.map(item => /*#__PURE__*/_react.default.createElement(_BannerEventBox.default, {
|
|
53
54
|
key: item.banner,
|
|
54
55
|
height: "100%",
|
|
55
|
-
width:
|
|
56
|
+
width: bannerWidth,
|
|
56
57
|
banner: item.banner,
|
|
57
58
|
description: item.description,
|
|
58
59
|
dates: item.dates,
|
|
@@ -99,6 +100,7 @@ BannerEventBoxList.defaultProps = {
|
|
|
99
100
|
}]
|
|
100
101
|
}],
|
|
101
102
|
retailerFile: () => {},
|
|
102
|
-
disableToggle: false
|
|
103
|
+
disableToggle: false,
|
|
104
|
+
bannerWidth: 'auto'
|
|
103
105
|
};
|
|
104
106
|
var _default = exports.default = BannerEventBoxList;
|
|
@@ -34,6 +34,7 @@ const BarChartsByWeeks = props => {
|
|
|
34
34
|
barChartSecondColor,
|
|
35
35
|
xselectedColor,
|
|
36
36
|
tooltipTitle,
|
|
37
|
+
tooltipSecondTitle,
|
|
37
38
|
startWeekRange = 0,
|
|
38
39
|
endWeekRange = 0,
|
|
39
40
|
yAxisCounter,
|
|
@@ -67,7 +68,7 @@ const BarChartsByWeeks = props => {
|
|
|
67
68
|
|
|
68
69
|
// eslint-disable-next-line react/no-unstable-nested-components
|
|
69
70
|
const CustomTooltip = tooltipData => {
|
|
70
|
-
var _payload$0$payload, _payload$0$payload2;
|
|
71
|
+
var _payload$0$payload, _payload$0$payload2, _payload$0$payload3, _payload$0$payload4;
|
|
71
72
|
const {
|
|
72
73
|
active,
|
|
73
74
|
payload,
|
|
@@ -76,8 +77,10 @@ const BarChartsByWeeks = props => {
|
|
|
76
77
|
if (!active || !payload || (payload === null || payload === void 0 ? void 0 : payload.length) === 0) return null;
|
|
77
78
|
const week = isTitleOriganal ? label : label && (label === null || label === void 0 ? void 0 : label.toString().length) === 6 ? label.toString().substring(4, 6) : 0;
|
|
78
79
|
let currentTooltipValue = 0;
|
|
80
|
+
let currentTooltipSecondValue = 0;
|
|
79
81
|
if ((_payload$0$payload = payload[0].payload) !== null && _payload$0$payload !== void 0 && _payload$0$payload.value) currentTooltipValue = (_payload$0$payload2 = payload[0].payload) === null || _payload$0$payload2 === void 0 ? void 0 : _payload$0$payload2.value;
|
|
80
|
-
|
|
82
|
+
if ((_payload$0$payload3 = payload[0].payload) !== null && _payload$0$payload3 !== void 0 && _payload$0$payload3.secondValue) currentTooltipSecondValue = (_payload$0$payload4 = payload[0].payload) === null || _payload$0$payload4 === void 0 ? void 0 : _payload$0$payload4.secondValue;
|
|
83
|
+
return /*#__PURE__*/_react.default.createElement(_BarChartsByWeeks.TooltipDiv, null, /*#__PURE__*/_react.default.createElement(_BarChartsByWeeks.TooltipTitle, null, "".concat(isTitleOriganal ? '' : 'Week: ').concat(week)), /*#__PURE__*/_react.default.createElement(_BarChartsByWeeks.TooltipLabel, null, "".concat(tooltipTitle, " \n ").concat(displayFormattedValue(currentTooltipValue), " \n ")), currentTooltipSecondValue ? /*#__PURE__*/_react.default.createElement(_BarChartsByWeeks.TooltipLabel, null, "".concat(tooltipSecondTitle, " \n ").concat(displayFormattedValue(currentTooltipSecondValue), " \n ")) : '');
|
|
81
84
|
};
|
|
82
85
|
const getWeek = () => {
|
|
83
86
|
if (!barChartData || (barChartData === null || barChartData === void 0 ? void 0 : barChartData.length) === 0) return null;
|
|
@@ -134,7 +137,6 @@ const BarChartsByWeeks = props => {
|
|
|
134
137
|
if (showLegend) {
|
|
135
138
|
newHeight -= 50;
|
|
136
139
|
}
|
|
137
|
-
console.log('newHeight', newHeight);
|
|
138
140
|
return "".concat(newHeight, "px");
|
|
139
141
|
};
|
|
140
142
|
return /*#__PURE__*/_react.default.createElement(_BarChartsByWeeks.ControlsContainer, {
|
|
@@ -271,6 +273,7 @@ BarChartsByWeeks.defaultProps = {
|
|
|
271
273
|
barChartSecondColor: '#42977A',
|
|
272
274
|
xselectedColor: '#42977A',
|
|
273
275
|
tooltipTitle: 'Sales',
|
|
276
|
+
tooltipSecondTitle: 'Sales 2',
|
|
274
277
|
startWeekRange: 0,
|
|
275
278
|
endWeekRange: 0,
|
|
276
279
|
yAxisCounter: 10,
|
|
@@ -9,9 +9,9 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
|
|
|
9
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
10
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
|
|
11
11
|
const 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
|
-
const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n font-family: \"Poppins\", sans-serif; \n color: ", ";\n width: ", ";\n height: ", ";\n background-color: white;\n
|
|
13
|
-
const ChartWrapper = exports.ChartWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
14
|
-
const ChartInner = exports.ChartInner = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
12
|
+
const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n font-family: \"Poppins\", sans-serif; \n color: ", ";\n width: ", ";\n height: ", ";\n background-color: white;\n display: flex;\n flex-direction: column;\n .top {\n text-align: center;\n white-space: normal;\n &:before {\n display: none;\n }\n }\n"])), props => props.textColor, props => props.width, props => props.height);
|
|
13
|
+
const ChartWrapper = exports.ChartWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n flex-grow: 1;\n width: 100%;\n ", "\n"])), scrollableStyles);
|
|
14
|
+
const ChartInner = exports.ChartInner = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n min-height: 120%;\n width: 75%;\n"])));
|
|
15
15
|
const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: baseline;\n justify-content: space-between;\n padding: 16px;\n"])));
|
|
16
16
|
const Header = exports.Header = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)([""])));
|
|
17
17
|
const Title = exports.Title = _styledComponents.default.h4(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 20px;\n font-weight: 400;\n line-height: 1;\n margin: 0 0 8px;\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n"])));
|