sag_components 1.0.126 → 1.0.128

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/SegmentedButton.js +9 -8
  2. package/dist/stories/components/SegmentedButton.style.js +1 -1
  3. package/dist/stories/components/TotalBenchmark.style.js +1 -1
  4. package/dist/stories/components/TotalBenchmarkAreachart.style.js +1 -1
  5. package/dist/stories/components/TotalBenchmarkArrows.style.js +1 -1
  6. package/dist/stories/components/TotalBenchmarkBarchart.style.js +1 -1
  7. package/dist/stories/components/TotalDoughnutChart.style.js +10 -10
  8. package/package.json +1 -1
package/dist/stories/components/SegmentedButton.js CHANGED
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
8
  exports.default = exports.SegmentedButton = void 0;
9
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
10
9
  var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
11
10
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
12
11
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
@@ -94,7 +93,6 @@ var SegmentedButton = function SegmentedButton(_ref) {
94
93
  segmentWidth: segmentWidth,
95
94
  className: "controls ".concat(componentReady.current ? "ready" : "idle")
96
95
  }, optionsRef === null || optionsRef === void 0 ? void 0 : optionsRef.map(function (item, i) {
97
- var _React$createElement;
98
96
  return /*#__PURE__*/_react.default.createElement(_SegmentedButtonStyle.Segment, {
99
97
  id: "Segment",
100
98
  key: item.id,
@@ -105,13 +103,16 @@ var SegmentedButton = function SegmentedButton(_ref) {
105
103
  segmentWidth: segmentWidth,
106
104
  className: "".concat(activeIndex === i ? "active" : "inactive"),
107
105
  ref: item.ref
108
- }, /*#__PURE__*/_react.default.createElement(_SegmentedButtonStyle.ControlsInput, (_React$createElement = {
109
- id: "ControlsInput",
106
+ }, /*#__PURE__*/_react.default.createElement(_SegmentedButtonStyle.ControlsInput, {
110
107
  type: "radio",
111
- value: item.value
112
- }, (0, _defineProperty2.default)(_React$createElement, "id", item.id), (0, _defineProperty2.default)(_React$createElement, "name", name), (0, _defineProperty2.default)(_React$createElement, "onChange", function onChange() {
113
- return onInputChangeHandler(item.value, item.id);
114
- }), (0, _defineProperty2.default)(_React$createElement, "checked", i === activeIndex), _React$createElement)), /*#__PURE__*/_react.default.createElement(_SegmentedButtonStyle.SegmentLabel, {
108
+ value: item.value,
109
+ id: item.id,
110
+ name: name,
111
+ onChange: function onChange() {
112
+ return onInputChangeHandler(item.value, item.id);
113
+ },
114
+ checked: i === activeIndex
115
+ }), /*#__PURE__*/_react.default.createElement(_SegmentedButtonStyle.SegmentLabel, {
115
116
  id: "SegmentLabel",
116
117
  selectedTextColor: selectedTextColor,
117
118
  unselectedTextColor: unselectedTextColor,
package/dist/stories/components/SegmentedButton.style.js CHANGED
@@ -13,7 +13,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
13
13
  return (_props$fontSize = props.fontSize) === null || _props$fontSize === void 0 ? void 0 : _props$fontSize.toString().concat("", "px Lato, sans-serif");
14
14
  });
15
15
  exports.ControlsContainer = ControlsContainer;
16
- var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n justify-content: space-between; \n background: ", ";\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n border-radius: ", "; //12px\n // max-width: 500px; //use this to limit max lenght of the control \n padding: 6px; \n margin: auto;\n overflow: hidden;\n position: relative;\n &.controls::before {\n content: \"\";\n background: ", "; /* #3a9df9; #5465ff;*/\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n border-radius: ", "; //12px\n width: var(--highlight-width);\n transform: translateX(var(--highlight-x-pos));\n position: absolute;\n top: 6px;\n bottom: 6px;\n left: 0;\n z-index: 0;\n }\n &.controls.ready::before {\n transition: transform 0.3s ease, width 0.3s ease;\n }\n"])), function (props) {
16
+ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n justify-content: space-between; \n background: ", ";\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n border-radius: ", "; //12px\n // max-width: 500px; //use this to limit max lenght of the control \n padding: 6px; \n margin: auto;\n overflow: hidden;\n position: relative;\n &.controls::before {\n content: \"\";\n background: ", "; /* #3a9df9; #5465ff;*/\n box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n border-radius: ", "; //12px\n width: var(--highlight-width);\n transform: translateX(var(--highlight-x-pos));\n position: absolute;\n top: 3px;\n bottom: 3px;\n left: 0; \n z-index: 0;\n }\n &.controls.ready::before {\n transition: transform 0.3s ease, width 0.3s ease;\n }\n"])), function (props) {
17
17
  return props.backgroundColor;
18
18
  }, function (props) {
19
19
  return props.controlRadius.toString().concat("", "px");
package/dist/stories/components/TotalBenchmark.style.js CHANGED
@@ -20,7 +20,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
20
20
  return props.height;
21
21
  });
22
22
  exports.ControlsContainer = ControlsContainer;
23
- var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n width: 90%;\n height: 42%;\n justify-content: center;\n align-items: center;\n background: #ffffff;\n"])));
23
+ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n border-radius: 12px;\n width: 90%;\n height: 45%;\n justify-content: center;\n /* align-items: center; */\n align-items: flex-start;\n background: #ffffff;\n"])));
24
24
  exports.Controls = Controls;
25
25
  var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n width: 100%;\n"])));
26
26
  exports.TitleAndValueContainer = TitleAndValueContainer;
package/dist/stories/components/TotalBenchmarkAreachart.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: 0 16px;\n justify-content: space-between;\n"])));
22
22
  exports.Controls = Controls;
23
23
  var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)([" \n font-weight: 600;\n font-size: 1em; \n margin-left: 0.5em;\n margin-top: 10px;\n"])));
24
24
  exports.Title = Title;
package/dist/stories/components/TotalBenchmarkArrows.style.js CHANGED
@@ -20,7 +20,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
20
20
  exports.ControlsContainer = ControlsContainer;
21
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: 17%;\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
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;
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 /* height: 90%; */\n justify-content: space-between;\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/dist/stories/components/TotalDoughnutChart.style.js CHANGED
@@ -8,7 +8,7 @@ exports.TitleAndValueContainer = exports.Title = exports.LegendTitleAndFormatedV
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, _templateObject14, _templateObject15, _templateObject16, _templateObject17;
11
- var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Lato\", sans-serif;\n font-style: normal; \n font-size: ", ";\n color: ", ";\n width: ", ";\n height: ", ";\n //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n border-radius: 12px; \n align-content: center;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (props) {
11
+ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n font-family: \"Lato\", sans-serif;\n font-style: normal;\n font-size: ", ";\n color: ", ";\n width: ", ";\n height: ", ";\n //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n border-radius: 12px;\n align-content: center;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (props) {
12
12
  return props.rootFont;
13
13
  }, function (props) {
14
14
  return props.textColor;
@@ -18,17 +18,17 @@ 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:100%;\n height:100%;\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 width: 100%;\n height: 100%;\n background: #ffffff;\n align-items: center;\n flex-direction: column;\n justify-content: space-between;\n"])));
22
22
  exports.Controls = Controls;
23
- var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n width: 90%;\n margin-top: 12%;\n"])));
23
+ var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n width: 90%;\n margin-top: 5%;\n"])));
24
24
  exports.TitleAndValueContainer = TitleAndValueContainer;
25
- var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%; \n height: 100%; \n font-weight: 600;\n font-size: 1em;\n"])));
25
+ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n font-weight: 600;\n font-size: 1em;\n"])));
26
26
  exports.Title = Title;
27
27
  var CurrencySignAndFormattedValueContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n"])));
28
28
  exports.CurrencySignAndFormattedValueContainer = CurrencySignAndFormattedValueContainer;
29
29
  var CurrencySign = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1em;\n"])));
30
30
  exports.CurrencySign = CurrencySign;
31
- var FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 2.22em; \n"])));
31
+ var FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 2.22em;\n"])));
32
32
  exports.FormattedValue = FormattedValue;
33
33
  var DoughnutChartAndLegendContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n width: 90%;\n height: 27%;\n margin-top: 2.18em; // 35px;\n margin-bottom: 2.18em; // 35px;\n"])));
34
34
  exports.DoughnutChartAndLegendContainer = DoughnutChartAndLegendContainer;
@@ -38,17 +38,17 @@ var LegendContainer = _styledComponents.default.div(_templateObject10 || (_templ
38
38
  exports.LegendContainer = LegendContainer;
39
39
  var LegendControlsContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n align-items: center;\n height: 50%;\n width: 100%;\n"])));
40
40
  exports.LegendControlsContainer = LegendControlsContainer;
41
- var LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: 100%;\n height: 100%;\n margin-left: 0.1em; \n flex-direction: column;\n"])));
41
+ var LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: 100%;\n height: 100%;\n margin-left: 0.1em;\n flex-direction: column;\n"])));
42
42
  exports.LegendTitleAndFormatedValueContainer = LegendTitleAndFormatedValueContainer;
43
43
  var LegendFormatedValueContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n width: 100%;\n height: 50%;\n"])));
44
44
  exports.LegendFormatedValueContainer = LegendFormatedValueContainer;
45
- var LegendColorRectangle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n width: 0.8em;\n height: 0.7em;\n margin-right:0.3em;\n background: ", ";\n"])), function (props) {
45
+ var LegendColorRectangle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n width: 0.8em;\n height: 0.7em;\n margin-right: 0.3em;\n background: ", ";\n"])), function (props) {
46
46
  return props.color;
47
47
  });
48
48
  exports.LegendColorRectangle = LegendColorRectangle;
49
- var LegendTitle = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.8em; \n width: 100%;\n height: 50%;\n"])));
49
+ var LegendTitle = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.8em;\n width: 100%;\n height: 50%;\n"])));
50
50
  exports.LegendTitle = LegendTitle;
51
- var LegendCurrencySign = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 0.8em; \n"])));
51
+ var LegendCurrencySign = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 0.8em;\n"])));
52
52
  exports.LegendCurrencySign = LegendCurrencySign;
53
- var LegendFormattedValue = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 0.8em; \n"])));
53
+ var LegendFormattedValue = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 0.8em;\n"])));
54
54
  exports.LegendFormattedValue = LegendFormattedValue;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.126",
3
+ "version": "1.0.128",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {