sag_components 1.0.200 → 1.0.202
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.
- package/dist/stories/components/Benchmark.js +5 -0
- package/dist/stories/components/Benchmark.style.js +1 -1
- package/dist/stories/components/InfoIcon.js +38 -0
- package/dist/stories/components/TextField.js +10 -14
- package/dist/stories/components/TotalBenchmark.js +1 -4
- package/dist/stories/components/TotalBenchmark.style.js +2 -2
- package/package.json +1 -1
|
@@ -90,9 +90,11 @@ var Benchmark = function Benchmark(_ref) {
|
|
|
90
90
|
return /*#__PURE__*/_react.default.createElement("h", null, tooltipLabel, tooltipLabel ? ": " : "", (_getFormattedValue = (0, _CommonFunctions.getFormattedValue)(benchmarkValue)) === null || _getFormattedValue === void 0 ? void 0 : _getFormattedValue.toString(), (_getFormattedUnits = (0, _CommonFunctions.getFormattedUnits)(benchmarkValue)) === null || _getFormattedUnits === void 0 ? void 0 : _getFormattedUnits.toString());
|
|
91
91
|
};
|
|
92
92
|
return /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.ControlsContainer, {
|
|
93
|
+
id: "ControlsContainer",
|
|
93
94
|
height: height,
|
|
94
95
|
width: width
|
|
95
96
|
}, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
|
|
97
|
+
id: "Tooltip",
|
|
96
98
|
content: getTooltipText(),
|
|
97
99
|
direction: tooltipDirection
|
|
98
100
|
}, /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.Controls, {
|
|
@@ -100,15 +102,18 @@ var Benchmark = function Benchmark(_ref) {
|
|
|
100
102
|
height: height,
|
|
101
103
|
width: width
|
|
102
104
|
}, /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.BackgroundValueRectangle, {
|
|
105
|
+
id: "BackgroundValueRectangle",
|
|
103
106
|
height: height,
|
|
104
107
|
width: width,
|
|
105
108
|
color: backgroundColor
|
|
106
109
|
}), /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.CurrentValueRectangle, {
|
|
110
|
+
id: "CurrentValueRectangle",
|
|
107
111
|
height: height,
|
|
108
112
|
width: getCurrentValueRectangleWidth(),
|
|
109
113
|
color: getUnderAvarageColor(),
|
|
110
114
|
linearGradientColor: getUnderAvaragelinearGradientColor()
|
|
111
115
|
}), /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.AvarageDelimiter, {
|
|
116
|
+
id: "AvarageDelimiter",
|
|
112
117
|
height: height + 4,
|
|
113
118
|
width: 0,
|
|
114
119
|
top: -2,
|
|
@@ -8,7 +8,7 @@ exports.CurrentValueRectangle = exports.ControlsContainer = exports.Controls = e
|
|
|
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;
|
|
11
|
-
var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n margin: 0px 0 0px;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n width: ", ";\n height: ", ";\n //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n border-radius: 100px;\n //border: 1px solid red;\n"])), function (props) {
|
|
11
|
+
var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n position: relative;\n margin: 0px 0 0px;\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n width: ", ";\n height: ", ";\n //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n border-radius: 100px;\n //border: 1px solid red;\n align-items: center;\n"])), function (props) {
|
|
12
12
|
return props.width.toString().concat("", "px");
|
|
13
13
|
}, function (props) {
|
|
14
14
|
return props.height.toString().concat("", "px");
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = exports.InfoIcon = void 0;
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
var InfoIcon = function InfoIcon(_ref) {
|
|
10
|
+
var clicked = _ref.clicked;
|
|
11
|
+
return /*#__PURE__*/_react.default.createElement("svg", {
|
|
12
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
13
|
+
viewBox: "0 0 24 24",
|
|
14
|
+
fill: "none",
|
|
15
|
+
stroke: clicked ? "white" : "black",
|
|
16
|
+
strokeWidth: "2",
|
|
17
|
+
strokeLinecap: "round",
|
|
18
|
+
strokeLinejoin: "round",
|
|
19
|
+
className: "feather feather-info"
|
|
20
|
+
}, /*#__PURE__*/_react.default.createElement("circle", {
|
|
21
|
+
cx: "12",
|
|
22
|
+
cy: "12",
|
|
23
|
+
r: "10"
|
|
24
|
+
}), /*#__PURE__*/_react.default.createElement("line", {
|
|
25
|
+
x1: "12",
|
|
26
|
+
y1: "16",
|
|
27
|
+
x2: "12",
|
|
28
|
+
y2: "12"
|
|
29
|
+
}), /*#__PURE__*/_react.default.createElement("line", {
|
|
30
|
+
x1: "12",
|
|
31
|
+
y1: "8",
|
|
32
|
+
x2: "12",
|
|
33
|
+
y2: "8"
|
|
34
|
+
}));
|
|
35
|
+
};
|
|
36
|
+
exports.InfoIcon = InfoIcon;
|
|
37
|
+
var _default = InfoIcon;
|
|
38
|
+
exports.default = _default;
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = exports.TextField = void 0;
|
|
9
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/defineProperty"));
|
|
9
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
10
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
12
|
var _TextFieldStyle = require("./TextField.style.js");
|
|
@@ -23,6 +24,7 @@ var _styles = require("@mui/material/styles");
|
|
|
23
24
|
* SAG TextField
|
|
24
25
|
*/
|
|
25
26
|
var TextField = function TextField(_ref) {
|
|
27
|
+
var _React$createElement;
|
|
26
28
|
var _ref$width = _ref.width,
|
|
27
29
|
width = _ref$width === void 0 ? "100%" : _ref$width,
|
|
28
30
|
_ref$height = _ref.height,
|
|
@@ -39,7 +41,6 @@ var TextField = function TextField(_ref) {
|
|
|
39
41
|
resetDefaultValue = _ref.resetDefaultValue,
|
|
40
42
|
required = _ref.required,
|
|
41
43
|
inputRef = _ref.inputRef,
|
|
42
|
-
ref = _ref.ref,
|
|
43
44
|
_ref$allowedInput = _ref.allowedInput,
|
|
44
45
|
allowedInput = _ref$allowedInput === void 0 ? "all" : _ref$allowedInput,
|
|
45
46
|
onChange = _ref.onChange;
|
|
@@ -163,7 +164,6 @@ var TextField = function TextField(_ref) {
|
|
|
163
164
|
size: size,
|
|
164
165
|
required: required,
|
|
165
166
|
inputRef: inputRef !== null && inputRef !== void 0 ? inputRef : null,
|
|
166
|
-
ref: ref !== null && ref !== void 0 ? ref : null,
|
|
167
167
|
onKeyDown: function onKeyDown(event) {
|
|
168
168
|
if (!isInputAllowed(event.key)) {
|
|
169
169
|
event.preventDefault();
|
|
@@ -177,7 +177,7 @@ var TextField = function TextField(_ref) {
|
|
|
177
177
|
variant: "outlined"
|
|
178
178
|
}, /*#__PURE__*/_react.default.createElement(_InputLabel.default, {
|
|
179
179
|
htmlFor: "outlined-adornment-password"
|
|
180
|
-
}, label), /*#__PURE__*/_react.default.createElement(_OutlinedInput.default, {
|
|
180
|
+
}, label), /*#__PURE__*/_react.default.createElement(_OutlinedInput.default, (_React$createElement = {
|
|
181
181
|
id: "outlined-adornment-password",
|
|
182
182
|
type: showPassword ? "text" : "password",
|
|
183
183
|
size: size,
|
|
@@ -190,18 +190,14 @@ var TextField = function TextField(_ref) {
|
|
|
190
190
|
edge: "end"
|
|
191
191
|
}, showPassword ? /*#__PURE__*/_react.default.createElement(_Visibility.default, null) : /*#__PURE__*/_react.default.createElement(_VisibilityOff.default, null))),
|
|
192
192
|
defaultValue: defaultValue,
|
|
193
|
-
label: label
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
if (!isInputAllowed(event.key)) {
|
|
198
|
-
event.preventDefault();
|
|
199
|
-
}
|
|
200
|
-
},
|
|
201
|
-
onChange: function onChange(event) {
|
|
202
|
-
onChangeHandler(event);
|
|
193
|
+
label: label
|
|
194
|
+
}, (0, _defineProperty2.default)(_React$createElement, "defaultValue", defaultValue), (0, _defineProperty2.default)(_React$createElement, "inputRef", inputRef !== null && inputRef !== void 0 ? inputRef : null), (0, _defineProperty2.default)(_React$createElement, "onKeyDown", function onKeyDown(event) {
|
|
195
|
+
if (!isInputAllowed(event.key)) {
|
|
196
|
+
event.preventDefault();
|
|
203
197
|
}
|
|
204
|
-
})))
|
|
198
|
+
}), (0, _defineProperty2.default)(_React$createElement, "onChange", function onChange(event) {
|
|
199
|
+
onChangeHandler(event);
|
|
200
|
+
}), _React$createElement)))))));
|
|
205
201
|
};
|
|
206
202
|
exports.TextField = TextField;
|
|
207
203
|
var _default = TextField;
|
|
@@ -78,10 +78,7 @@ var TotalBenchmark = function TotalBenchmark(_ref) {
|
|
|
78
78
|
currentValue: item.value,
|
|
79
79
|
benchmarkValue: item.benchmarkValue,
|
|
80
80
|
height: 12 * getSizeFactor(),
|
|
81
|
-
width: 85 * getSizeFactor()
|
|
82
|
-
// height={14 * (rootFont.toString().replace("px", "") / DEFAULT_ROOT_FONT)}
|
|
83
|
-
// width={115 * (rootFont.toString().replace("px", "") / DEFAULT_ROOT_FONT)}
|
|
84
|
-
,
|
|
81
|
+
width: 85 * getSizeFactor(),
|
|
85
82
|
color: "#79DB95",
|
|
86
83
|
linearGradientColor: "#C3EFD0",
|
|
87
84
|
linearGradientUnderAvarageColor: "#FDB1B1",
|
|
@@ -28,7 +28,7 @@ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4
|
|
|
28
28
|
exports.Title = Title;
|
|
29
29
|
var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 2.22rem;\n"])));
|
|
30
30
|
exports.FormattedValue = FormattedValue;
|
|
31
|
-
var BenchmarkContainerParent = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex
|
|
31
|
+
var BenchmarkContainerParent = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex; \n align-items: baseline;\n width: 100%;\n height: 100%;\n margin: 0;\n\n"])));
|
|
32
32
|
exports.BenchmarkContainerParent = BenchmarkContainerParent;
|
|
33
|
-
var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n margin-top: 0;\n margin-left: 1rem;\n height: 0.9rem;\n"])));
|
|
33
|
+
var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n margin-top: 0;\n margin-left: 1rem;\n height: 0.9rem;\n //margin: 0;\n"])));
|
|
34
34
|
exports.BenchmarkContainer = BenchmarkContainer;
|