sag_components 1.0.438 → 1.0.440

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.
@@ -11,11 +11,11 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
11
11
  const MIN_HEIGHT = 300;
12
12
  const MIN_WIDTH = 260;
13
13
  const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 12px;\n align-content: center;\n flex-direction: column;\n place-content: space-between;\n justify-content: space-between;\n align-items: flex-start;\n background: #ffffff;\n"])), props => props.textcolor, props => props.width, props => props.height);
14
- const Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n //display: flex;\n border-radius: 12px;\n /* width: 90%;\n height: 40%; */\n //justify-content: center;\n //align-items: flex-start;\n background: #ffffff;\n margin-bottom: 2rem;\n padding: 0px 0.8rem;\n"])));
15
- const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n //display: flex;\n //flex-direction: column;\n width: 100%;\n"])));
16
- const Title = exports.Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n //margin-bottom: 1rem;\n"])));
17
- const FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
14
+ const Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n border-radius: 12px;\n background: #ffffff;\n margin-bottom: 2rem;\n padding: 0px 0.8rem;\n"])));
15
+ const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n"])));
16
+ const Title = exports.Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n"])));
17
+ const FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 40px;\n @media (max-width: 1366px) {\n font-size: 20px;\n }\n @media (max-width: 1536px) {\n font-size: 24px;\n }\n"])));
18
18
  const FormattedValueNoData = exports.FormattedValueNoData = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 700;\n font-size: 16px;\n"])));
19
19
  const BenchmarkContainerParent = exports.BenchmarkContainerParent = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: baseline;\n width: 100%;\n height: 100%;\n margin: 0;\n"])));
20
- const BenchmarkContainer = exports.BenchmarkContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n margin-top: 0;\n margin-left: 1rem;\n height: 0.9rem;\n //margin: 0;\n"])));
20
+ const BenchmarkContainer = exports.BenchmarkContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n margin-top: 0;\n margin-left: 1rem;\n height: 0.9rem;\n"])));
21
21
  const NoDataFoundContainer = exports.NoDataFoundContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"])));
@@ -42,6 +42,7 @@ const TotalBenchmarkAreachart = props => {
42
42
  } = props;
43
43
  const DEFAULT_ROOT_FONT = 16;
44
44
  const DEFAULT_COMPONENT_WIDTH = 250;
45
+ const DEFAULT_COMPONENT_HEIGHT = 280;
45
46
  const [rootFont, setRootFont] = (0, _react.useState)(DEFAULT_ROOT_FONT.toString().concat('', 'px'));
46
47
  const anotherRef = (0, _react.useRef)(null);
47
48
  const [activeLabel, setActiveLabel] = (0, _react.useState)('');
@@ -123,12 +124,15 @@ const TotalBenchmarkAreachart = props => {
123
124
  if (!areaChartData || areaChartData.length === 0) return '';
124
125
  return /*#__PURE__*/_react.default.createElement(_TotalBenchmarkAreachart.EventWeeksLegendDataElementsContainer, {
125
126
  id: "EventWeeksLegendDataElementsContainer"
126
- }, (_getAreaChartFormatte = getAreaChartFormattedData()) === null || _getAreaChartFormatte === void 0 ? void 0 : _getAreaChartFormatte.map(item => /*#__PURE__*/_react.default.createElement(_TotalBenchmarkAreachart.EventWeeksLegendDataElement, {
127
- id: "EventWeeksLegendDataElement",
128
- color: item.title >= startWeekRange && item.title <= endWeekRange ? xselectedColor : '',
129
- borderLeftRadius: item.title === startWeekRange ? '12px' : '0px',
130
- borderRightRadius: item.title === endWeekRange ? '12px' : '0px'
131
- }, item.titleWeek)));
127
+ }, (_getAreaChartFormatte = getAreaChartFormattedData()) === null || _getAreaChartFormatte === void 0 ? void 0 : _getAreaChartFormatte.map(item => {
128
+ console.log('displayEventWeeksElements', item);
129
+ return /*#__PURE__*/_react.default.createElement(_TotalBenchmarkAreachart.EventWeeksLegendDataElement, {
130
+ id: "EventWeeksLegendDataElement",
131
+ color: item.title >= startWeekRange && item.title <= endWeekRange ? xselectedColor : '',
132
+ borderLeftRadius: item.title === startWeekRange ? '12px' : '0px',
133
+ borderRightRadius: item.title === endWeekRange ? '12px' : '0px'
134
+ }, item.titleWeek);
135
+ }));
132
136
  };
133
137
  const displayEventWeeksLegendData = () => /*#__PURE__*/_react.default.createElement(_TotalBenchmarkAreachart.EventWeeksLegendMainContainer, {
134
138
  id: "EventWeeksLegendMainContainer"
@@ -17,7 +17,7 @@ const TooltipTitle = exports.TooltipTitle = _styledComponents.default.div(_templ
17
17
  const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n padding: 0 1rem;\n"])));
18
18
  const Title = exports.Title = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n"])));
19
19
  const ValueAndBenchmarkContainer = exports.ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: center;\n"])));
20
- const DetailsRowArrowContainer = exports.DetailsRowArrowContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-end;\n width: 22px;\n @media (max-width: 1366px) {\n width: 12px;\n }\n @media (max-width: 1536px) {\n width: 14px;\n }\n"])));
20
+ const DetailsRowArrowContainer = exports.DetailsRowArrowContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-end;\n width: 22px;\n margin-right: 5px;\n @media (max-width: 1366px) {\n width: 12px;\n }\n @media (max-width: 1536px) {\n width: 14px;\n }\n"])));
21
21
  const FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 40px;\n @media (max-width: 1366px) {\n font-size: 20px;\n }\n @media (max-width: 1536px) {\n font-size: 24px;\n }\n"])));
22
22
  const CurrencySign = exports.CurrencySign = _styledComponents.default.span(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n"])));
23
23
  const FormattedValueNoDataMessage = exports.FormattedValueNoDataMessage = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 16px;\n margin: 0;\n"])));
@@ -117,6 +117,7 @@ const TotalBenchmarkBarchart = props => {
117
117
  }), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
118
118
  dataKey: "value",
119
119
  name: "title",
120
+ maxBarSize: 55,
120
121
  radius: [5, 5, 0, 0]
121
122
  }, getFormattedBarChartData().map(entry => /*#__PURE__*/_react.default.createElement(_recharts.Cell, {
122
123
  key: entry.id,
@@ -10,11 +10,11 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
11
11
  const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 12px;\n align-content: center;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n background: #ffffff;\n"])), props => props.textColor, props => props.width, props => props.height);
12
12
  const Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n background: #ffffff; \n justify-content: space-between;\n flex-direction: column;\n flex-basis: 100%;\n"])));
13
- const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin: 0px;\n"])));
14
- const Title = exports.Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem; \n"])));
13
+ const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin: 0px;\n"])));
14
+ const Title = exports.Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem; \n @media (max-width: 1366px) {\n font-size: 12px;\n }\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n"])));
15
15
  const ValueAndBenchmarkContainer = exports.ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: flex-start;\n align-items: baseline; \n\n"])));
16
16
  const CurrencySign = exports.CurrencySign = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)([" \n font-weight: 500;\n font-size: 1rem;\n"])));
17
- const FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
17
+ const FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 40px;\n @media (max-width: 1366px) {\n font-size: 20px;\n }\n @media (max-width: 1536px) {\n font-size: 24px;\n }\n"])));
18
18
  const FormattedValueNoDataMessage = exports.FormattedValueNoDataMessage = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 16px;\n margin: 0; \n"])));
19
19
  const BenchmarkContainer = exports.BenchmarkContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.7em;\n width: 5.35em;\n"])));
20
20
  const BarchartContainer = exports.BarchartContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.438",
3
+ "version": "1.0.440",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {