sag_components 1.0.107 → 1.0.109

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 (8) hide show
  1. package/dist/stories/components/OneColumnContainer.js +7 -17
  2. package/dist/stories/components/OneColumnContainer.style.js +8 -10
  3. package/dist/stories/components/TotalBenchmarkAreachart.js +2 -2
  4. package/dist/stories/components/TotalBenchmarkAreachart.style.js +7 -7
  5. package/dist/stories/components/TotalBenchmarkArrows.style.js +3 -3
  6. package/dist/stories/components/TotalBenchmarkBarchart.js +1 -1
  7. package/dist/stories/components/TotalBenchmarkBarchart.style.js +1 -1
  8. package/package.json +1 -1
package/dist/stories/components/OneColumnContainer.js CHANGED
@@ -39,8 +39,8 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
39
39
  props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
40
40
  var _useState = (0, _react.useState)(false),
41
41
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
42
- clicked = _useState2[0],
43
- setClicked = _useState2[1];
42
+ hover = _useState2[0],
43
+ setHover = _useState2[1];
44
44
  return /*#__PURE__*/_react.default.createElement(_OneColumnContainer.StyledContainer, {
45
45
  className: (0, _classnames.default)(itemClass, overStyle, draggingStyle, children && droppedStyle, divStyle),
46
46
  width: width,
@@ -57,17 +57,8 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
57
57
  gridTemplateColumns: gridTemplateColumns
58
58
  },
59
59
  ref: nodeRef
60
- }, children, isLoading && /*#__PURE__*/_react.default.createElement("div", {
61
- id: "loadingDiv",
62
- style: {
63
- marginTop: "20px",
64
- display: "flex",
65
- flexDirection: "column",
66
- justifyContent: "space-evenly",
67
- alignItems: "center",
68
- width: "76%",
69
- height: "65%"
70
- }
60
+ }, isLoading && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.LoadingDiv, {
61
+ id: "loadingDiv"
71
62
  }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.SkeletonTheme, {
72
63
  baseColor: "#EAEAEA"
73
64
  }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.default, {
@@ -81,9 +72,8 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
81
72
  width: width.replace("px", "") * 0.76,
82
73
  height: 10,
83
74
  containerClassName: "avatar-skeleton"
84
- }))), !isLoading && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextContainer, {
75
+ }))), !isLoading && !hover && children, !isLoading && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, hover && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTextContainer, {
85
76
  id: "InfoTextContainer",
86
- clicked: clicked,
87
77
  width: width,
88
78
  height: height
89
79
  }, /*#__PURE__*/_react.default.createElement(_OneColumnContainer.InfoTitleLabel, {
@@ -93,10 +83,10 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
93
83
  }, infoText)), /*#__PURE__*/_react.default.createElement(_OneColumnContainer.IconContainer, {
94
84
  id: "IconContainer",
95
85
  onMouseEnter: function onMouseEnter() {
96
- return setClicked(true);
86
+ return setHover(true);
97
87
  },
98
88
  onMouseLeave: function onMouseLeave() {
99
- return setClicked(false);
89
+ return setHover(false);
100
90
  }
101
91
  }, /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, null)))));
102
92
  };
package/dist/stories/components/OneColumnContainer.style.js CHANGED
@@ -4,29 +4,27 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.StyledContainer = exports.InfoTitleLabel = exports.InfoTextLabel = exports.InfoTextContainer = exports.IconContainer = void 0;
7
+ exports.StyledContainer = exports.LoadingDiv = exports.InfoTitleLabel = exports.InfoTextLabel = exports.InfoTextContainer = exports.IconContainer = 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;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
11
11
  var StyledContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.1);\n display: flex;\n position: relative;\n border-radius: 10px;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n"])), function (props) {
12
12
  return props.width;
13
13
  }, function (props) {
14
14
  return props.height;
15
15
  });
16
16
  exports.StyledContainer = StyledContainer;
17
- var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Lato\", sans-serif;\n width: ", ";\n height: ", ";\n /* visibility: ", "; */\n display: ", "; \n flex-direction: column;\n justify-content: center;\n background: white;\n margin: 0px 30px 0px 30px;\n"])), function (props) {
17
+ var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Lato\", sans-serif;\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: column;\n justify-content: center;\n background: white;\n margin: 0px 30px 0px 30px;\n \n"])), function (props) {
18
18
  return props.width;
19
19
  }, function (props) {
20
20
  return props.height;
21
- }, function (props) {
22
- return props.clicked ? "visible" : "hidden";
23
- }, function (props) {
24
- return props.clicked ? "flex" : "none";
25
21
  });
26
22
  exports.InfoTextContainer = InfoTextContainer;
27
- var InfoTitleLabel = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 700;\n color: black;\n margin: 0px 0px 10px 0px;\n font-size: 1.1em; \n"])));
23
+ var InfoTitleLabel = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 700;\n color: black;\n margin: 0px 0px 10px 0px;\n font-size: 1.1em;\n \n /* overflow: scroll; */\n\n"])));
28
24
  exports.InfoTitleLabel = InfoTitleLabel;
29
- var InfoTextLabel = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n color: black;\n font-size: 0.9em;\n line-height: 1.4em;\n font-weight: 500;\n"])));
25
+ var InfoTextLabel = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n color: black;\n font-size: 0.9em;\n line-height: 1.4em;\n font-weight: 500;\n\n /* overflow: scroll; */\n"])));
30
26
  exports.InfoTextLabel = InfoTextLabel;
31
27
  var IconContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 15px;\n height: 15px;\n position: absolute;\n margin-top: 10px;\n margin-right: 10px;\n top: 0;\n right: 0;\n"])));
32
- exports.IconContainer = IconContainer;
28
+ exports.IconContainer = IconContainer;
29
+ var LoadingDiv = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 20px;\n display: flex;\n flex-direction: column;\n justify-content: space-evenly;\n align-items: center;\n width: 76%;\n height: 65%;\n"])));
30
+ exports.LoadingDiv = LoadingDiv;
package/dist/stories/components/TotalBenchmarkAreachart.js CHANGED
@@ -130,9 +130,9 @@ var TotalBenchmarkAreachart = function TotalBenchmarkAreachart(_ref) {
130
130
  data: areaChartData,
131
131
  margin: {
132
132
  top: 0,
133
- right: 10,
133
+ right: 12,
134
134
  bottom: 0,
135
- left: 10
135
+ left: 12
136
136
  }
137
137
  }, /*#__PURE__*/_react.default.createElement(_recharts.CartesianGrid, {
138
138
  strokeDasharray: "3 3",
package/dist/stories/components/TotalBenchmarkAreachart.style.js CHANGED
@@ -18,21 +18,21 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
18
18
  return props.height;
19
19
  });
20
20
  exports.ControlsContainer = ControlsContainer;
21
- var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n width: 90%;\n height: 90%;\n background: #ffffff;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n"])));
21
+ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n background: #ffffff;\n justify-content: center; \n flex-direction: column;\n flex-basis: 100%;\n padding: 16px;\n"])));
22
22
  exports.Controls = Controls;
23
- var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n font-weight: 600;\n font-size: 1em;\n margin-top: 15%;\n"])));
23
+ var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)([" \n font-weight: 600;\n font-size: 1em; \n"])));
24
24
  exports.Title = Title;
25
- var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n width: 14em;\n height: 20%;\n"])));
25
+ var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: baseline; \n"])));
26
26
  exports.ValueAndBenchmarkContainer = ValueAndBenchmarkContainer;
27
27
  var DetailsRowArrowContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)([" \n display: flex;\n width: 1.2em; \n align-items: flex-end;\n"])));
28
28
  exports.DetailsRowArrowContainer = DetailsRowArrowContainer;
29
29
  var FormattedValue = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1em;\n font-weight: 500;\n font-size: 2.2em; \n"])));
30
30
  exports.FormattedValue = FormattedValue;
31
- var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.7em;\n width: 5.35em;\n"])));
31
+ var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.7em;\n /* width: 5.35em; */\n"])));
32
32
  exports.BenchmarkContainer = BenchmarkContainer;
33
- var AreaChartContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n height: 50%;\n\n"])));
33
+ var AreaChartContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n height: 46%;\n\n"])));
34
34
  exports.AreaChartContainer = AreaChartContainer;
35
- var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center;\n height: 20%;\n"])));
35
+ var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center;\n"])));
36
36
  exports.BottomDetailsRowContainer = BottomDetailsRowContainer;
37
- var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: center; \n margin-top: 0.2em;\n width: 14em;\n font-weight: 400;\n font-size: 0.7em;\n"])));
37
+ var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.7em;\n"])));
38
38
  exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
package/dist/stories/components/TotalBenchmarkArrows.style.js CHANGED
@@ -18,11 +18,11 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
18
18
  return props.height;
19
19
  });
20
20
  exports.ControlsContainer = ControlsContainer;
21
- var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n width: 90%;\n height: 90%;\n background: #ffffff;\n justify-content: center;\n align-items: center;\n flex-direction: column;\n"])));
21
+ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n background: #ffffff;\n justify-content: center; \n flex-direction: column;\n flex-basis: 100%;\n padding: 16px ;\n"])));
22
22
  exports.Controls = Controls;
23
- var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n font-weight: 600;\n font-size: 1em;\n margin-top: 15%;\n"])));
23
+ var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n font-weight: 600;\n font-size: 1em;\n margin-top: 17%;\n"])));
24
24
  exports.Title = Title;
25
- var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: baseline;\n width: 14em;\n height: 20%;\n"])));
25
+ var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: baseline;\n width: 14em;\n height: 50%;\n"])));
26
26
  exports.ValueAndBenchmarkContainer = ValueAndBenchmarkContainer;
27
27
  var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1em;\n font-weight: 500;\n font-size: 2.2em;\n"])));
28
28
  exports.FormattedValue = FormattedValue;
package/dist/stories/components/TotalBenchmarkBarchart.js CHANGED
@@ -112,7 +112,7 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
112
112
  id: "BarchartContainer"
113
113
  }, /*#__PURE__*/_react.default.createElement(_recharts.BarChart, {
114
114
  width: 224 * getSizeFactor(),
115
- height: 126 * heightFactor,
115
+ height: 104 * heightFactor,
116
116
  data: formattedBarChartData,
117
117
  margin: {
118
118
  top: 40 * heightFactor,
package/dist/stories/components/TotalBenchmarkBarchart.style.js CHANGED
@@ -18,7 +18,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
18
18
  return props.height;
19
19
  });
20
20
  exports.ControlsContainer = ControlsContainer;
21
- var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n background: #ffffff;\n justify-content: center; \n flex-direction: column;\n flex-basis: 100%;\n padding: 16px;\n"])));
21
+ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n background: #ffffff;\n justify-content: center; \n flex-direction: column;\n flex-basis: 100%;\n padding: 16px ;\n"])));
22
22
  exports.Controls = Controls;
23
23
  var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n \n"])));
24
24
  exports.TitleAndValueContainer = TitleAndValueContainer;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.107",
3
+ "version": "1.0.109",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {