sag_components 1.0.227 → 1.0.229

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,7 +11,7 @@ var getCurrencySign = function getCurrencySign(currencyTypeToConvert, value) {
11
11
  style: "currency",
12
12
  currency: currencyTypeToConvert
13
13
  });
14
- currencySign = currencyFormatter.format(value).substring(0, 1);
14
+ currencySign = currencyFormatter.format(Math.abs(value)).substring(0, 1);
15
15
  return currencySign;
16
16
  };
17
17
  exports.getCurrencySign = getCurrencySign;
@@ -29,7 +29,9 @@ var Datepicker = function Datepicker(_ref) {
29
29
  value = _ref.value,
30
30
  disableClearable = _ref.disableClearable,
31
31
  _ref$disabled = _ref.disabled,
32
- disabled = _ref$disabled === void 0 ? false : _ref$disabled;
32
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
33
+ _ref$labelColor = _ref.labelColor,
34
+ labelColor = _ref$labelColor === void 0 ? "#1B30AA" : _ref$labelColor;
33
35
  /**
34
36
  * SAG Datepicker
35
37
  */
@@ -53,6 +55,14 @@ var Datepicker = function Datepicker(_ref) {
53
55
  if (shape === "round") {
54
56
  // round
55
57
  return {
58
+ "& .MuiInputLabel-inputRoot": {
59
+ fontFamily: "Poppins",
60
+ fontSize: "14px",
61
+ fontWidth: 400,
62
+ paddingLeft: "10px !important",
63
+ borderRadius: "12px",
64
+ width: width
65
+ },
56
66
  "& .MuiOutlinedInput-root": {
57
67
  borderRadius: "12px",
58
68
  fontFamily: "Poppins",
@@ -60,27 +70,42 @@ var Datepicker = function Datepicker(_ref) {
60
70
  fontWidth: 400,
61
71
  width: width,
62
72
  legend: {
63
- marginLeft: "6px"
73
+ marginLeft: "10px"
74
+ },
75
+ // This matches the specificity of the default styles at https://github.com/mui-org/material-ui/blob/v4.11.3/packages/material-ui-lab/src/Autocomplete/Autocomplete.js#L90
76
+ '&[class*="MuiOutlinedInput-root"] .MuiInputLabel-input:first-of-type': {
77
+ // Default left padding is 6px
78
+ paddingLeft: "10px"
79
+ },
80
+ "& .MuiOutlinedInput-notchedOutline": {
81
+ borderColor: "#E7E7E7",
82
+ color: labelColor
83
+ },
84
+ "&:hover .MuiOutlinedInput-notchedOutline": {
85
+ borderColor: labelColor,
86
+ color: labelColor
87
+ },
88
+ "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
89
+ borderColor: labelColor,
90
+ color: labelColor
64
91
  }
65
92
  },
66
- "& .MuiAutocomplete-inputRoot": {
67
- fontFamily: "Poppins",
93
+ "& .MuiInputLabel-outlined:not(.MuiInputLabel-shrink)": {
94
+ // Default transform is "translate(14px, 20px) scale(1)""
95
+ // This lines up the label with the initial cursor position in the input
96
+ // after changing its padding-left.
97
+ transform: "translate(14px, 18px) scale(1);",
68
98
  fontSize: "14px",
69
- fontWidth: 400,
70
- paddingLeft: "10px !important",
71
- borderRadius: "12px",
72
- width: width
99
+ color: "#212121"
73
100
  },
74
101
  "& .MuiInputLabel-outlined": {
75
102
  fontFamily: "Poppins",
76
- fontSize: "14px",
103
+ paddingLeft: "10px",
104
+ color: labelColor,
77
105
  fontWidth: 400,
78
- paddingLeft: "10px"
106
+ fontSize: "18px"
79
107
  },
80
108
  "& .MuiInputLabel-shrink": {
81
- fontFamily: "Poppins",
82
- fontSize: "14px",
83
- fontWidth: 400,
84
109
  marginLeft: "1px",
85
110
  paddingLeft: "4px",
86
111
  paddingRight: 0,
@@ -20,6 +20,7 @@ var _CheckBoxOutlineBlank = _interopRequireDefault(require("@mui/icons-material/
20
20
  var _CheckBox = _interopRequireDefault(require("@mui/icons-material/CheckBox"));
21
21
  var _Search = _interopRequireDefault(require("@mui/icons-material/Search.js"));
22
22
  var _ArrowDropDownIcon = require("./icons/ArrowDropDownIcon");
23
+ var _colors = require("@mui/material/colors");
23
24
  //import PropTypes from "prop-types";
24
25
 
25
26
  // import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -110,15 +111,42 @@ var Dropdown = function Dropdown(_ref) {
110
111
  "& .MuiOutlinedInput-root": {
111
112
  borderRadius: "12px",
112
113
  legend: {
113
- marginLeft: "6px"
114
+ marginLeft: "12px"
114
115
  }
115
116
  },
116
117
  "& .MuiAutocomplete-inputRoot": {
117
118
  paddingLeft: "10px !important",
118
- borderRadius: "12px"
119
+ borderRadius: "12px",
120
+ // This matches the specificity of the default styles at https://github.com/mui-org/material-ui/blob/v4.11.3/packages/material-ui-lab/src/Autocomplete/Autocomplete.js#L90
121
+ '&[class*="MuiOutlinedInput-root"] .MuiAutocomplete-input:first-of-type': {
122
+ // Default left padding is 6px
123
+ paddingLeft: "10px"
124
+ },
125
+ "& .MuiOutlinedInput-notchedOutline": {
126
+ borderColor: "#E7E7E7",
127
+ color: labelColor
128
+ },
129
+ "&:hover .MuiOutlinedInput-notchedOutline": {
130
+ borderColor: labelColor,
131
+ color: labelColor
132
+ },
133
+ "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
134
+ borderColor: labelColor,
135
+ color: labelColor
136
+ }
137
+ },
138
+ "& .MuiInputLabel-outlined:not(.MuiInputLabel-shrink)": {
139
+ // Default transform is "translate(14px, 20px) scale(1)""
140
+ // This lines up the label with the initial cursor position in the input
141
+ // after changing its padding-left.
142
+ transform: "translate(14px, 18px) scale(1);",
143
+ fontSize: "14px",
144
+ color: "#212121"
119
145
  },
120
146
  "& .MuiInputLabel-outlined": {
121
- paddingLeft: "10px"
147
+ paddingLeft: "10px",
148
+ color: labelColor,
149
+ fontSize: "18px"
122
150
  },
123
151
  "& .MuiInputLabel-shrink": {
124
152
  marginLeft: "1px",
@@ -189,14 +217,7 @@ var Dropdown = function Dropdown(_ref) {
189
217
  },
190
218
  disabled: disabled,
191
219
  disablePortal: true,
192
- disableClearable: disableClearable
193
- // value={defaultValue && !currentOption?.newValue ? defaultValue : currentOption?.newValue}
194
- // value={
195
- // defaultValue && !defaultValueSetFlag
196
- // ? defaultValue
197
- // : currentOption?.newValue
198
- // }
199
- ,
220
+ disableClearable: disableClearable,
200
221
  defaultValue: defaultValue,
201
222
  id: "combo-box",
202
223
  options: options,
@@ -235,7 +256,7 @@ var Dropdown = function Dropdown(_ref) {
235
256
  InputLabelProps: {
236
257
  style: {
237
258
  //color: labelColor,
238
- fontSize: "14px",
259
+ //fontSize: "14px",
239
260
  fontFamily: "Poppins"
240
261
  }
241
262
  }
@@ -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;
@@ -8,9 +8,9 @@ exports.NoDataFoundTitle = exports.NoDataFoundText = exports.NoDataFoundContaine
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;
11
- var NoDataFoundContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n align-items: center;\n /* width: 95%;\n height: 70%; */\n"])));
11
+ var NoDataFoundContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 0.8rem;\n display: flex;\n flex-direction: column;\n align-items: center;\n"])));
12
12
  exports.NoDataFoundContainer = NoDataFoundContainer;
13
- var NoDataFoundTitle = _styledComponents.default.h4(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 1rem;\n margin: 0;\n margin-top: 1.5rem;\n padding-right: 0.7rem;\n"])));
13
+ var NoDataFoundTitle = _styledComponents.default.h4(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 1rem;\n margin: 0;\n margin-top: 1.5rem;\n padding-right: 0.77778rem;\n"])));
14
14
  exports.NoDataFoundTitle = NoDataFoundTitle;
15
15
  var NoDataFoundText = _styledComponents.default.p(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.8rem;\n margin: 0;\n margin-top: 0.4rem;\n text-align: center;\n line-height: 1.1rem;\n"])));
16
16
  exports.NoDataFoundText = NoDataFoundText;
@@ -43,16 +43,15 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
43
43
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
44
44
  hover = _useState2[0],
45
45
  setHover = _useState2[1];
46
- var _useState3 = (0, _react.useState)(200),
46
+ var _useState3 = (0, _react.useState)(null),
47
47
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
48
48
  offsetWidth = _useState4[0],
49
49
  setOffsetWidth = _useState4[1];
50
50
  var anotherRef = (0, _react.useRef)(null);
51
- // useEffect(() => {
52
- // setOffsetWidth(anotherRef.current.offsetWidth);
53
- // console.log(anotherRef.current.offsetWidth);
54
- // }, [anotherRef]);
55
-
51
+ (0, _react.useEffect)(function () {
52
+ setOffsetWidth(anotherRef.current.offsetWidth);
53
+ console.log(anotherRef.current.offsetWidth);
54
+ }, [anotherRef]);
56
55
  return /*#__PURE__*/_react.default.createElement(_OneColumnContainer.StyledContainer, {
57
56
  className: (0, _classnames.default)(itemClass, overStyle, draggingStyle, children && droppedStyle, divStyle),
58
57
  width: width,
@@ -68,7 +67,7 @@ var OneColumnContainer = function OneColumnContainer(_ref) {
68
67
  display: display,
69
68
  gridTemplateColumns: gridTemplateColumns
70
69
  },
71
- ref: nodeRef
70
+ ref: anotherRef
72
71
  }, console.log(anotherRef), isLoading && /*#__PURE__*/_react.default.createElement(_OneColumnContainer.LoadingDiv, {
73
72
  id: "loadingDiv"
74
73
  }, /*#__PURE__*/_react.default.createElement(_reactLoadingSkeleton.SkeletonTheme, {
@@ -41,7 +41,9 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
41
41
  inputRef = _ref.inputRef,
42
42
  _ref$allowedInput = _ref.allowedInput,
43
43
  allowedInput = _ref$allowedInput === void 0 ? "all" : _ref$allowedInput,
44
- onChange = _ref.onChange;
44
+ onChange = _ref.onChange,
45
+ _ref$multiline = _ref.multiline,
46
+ multiline = _ref$multiline === void 0 ? false : _ref$multiline;
45
47
  var _useState = (0, _react.useState)(null),
46
48
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
47
49
  currentInputValue = _useState2[0],
@@ -98,13 +100,14 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
98
100
  height: {
99
101
  height: height
100
102
  },
101
- paddingTop: 0,
103
+ paddingTop: multiline ? "12px" : "0",
102
104
  marginTop: 0,
103
105
  borderColor: "green",
104
106
  borderRadius: "12px",
105
107
  legend: {
106
108
  marginLeft: "6px"
107
- }
109
+ },
110
+ alignItems: multiline ? "flex-start" : "center"
108
111
  },
109
112
  "& .MuiAutocomplete-inputRoot": {
110
113
  paddingLeft: "10px !important",
@@ -146,6 +149,7 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
146
149
  }
147
150
  };
148
151
  return /*#__PURE__*/_react.default.createElement(_TextFieldStyle.TextFieldContainer, {
152
+ id: "TextFieldContainer",
149
153
  width: width
150
154
  }, /*#__PURE__*/_react.default.createElement(_styles.ThemeProvider, {
151
155
  theme: theme
@@ -157,6 +161,7 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
157
161
  }, /*#__PURE__*/_react.default.createElement("div", null, !passwordField && /*#__PURE__*/_react.default.createElement(_TextField.default, {
158
162
  key: resetDefaultValue,
159
163
  label: label,
164
+ multiline: multiline,
160
165
  defaultValue: defaultValue,
161
166
  placeholder: placeHolder,
162
167
  id: "outlined-start-adornment",
@@ -172,7 +177,23 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
172
177
  },
173
178
  onChange: function onChange(event) {
174
179
  onChangeHandler(event);
180
+ },
181
+ InputProps: {
182
+ textAlign: "flex-start",
183
+ alignItems: "flex-start",
184
+ alignContent: "flex-start",
185
+ disableUnderline: true,
186
+ style: {
187
+ //color: 'red',
188
+ textAlign: "start"
189
+ }
175
190
  }
191
+
192
+ // style={{
193
+ // // height: '50px',
194
+ // // width: '50px',
195
+ // textAlign: 'start',
196
+ // justifyContent: 'start'}}
176
197
  }), passwordField && /*#__PURE__*/_react.default.createElement(_FormControl.default, {
177
198
  sx: getTextFieldStyle(),
178
199
  variant: "outlined"
@@ -192,6 +213,7 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
192
213
  }, showPassword ? /*#__PURE__*/_react.default.createElement(_Visibility.default, null) : /*#__PURE__*/_react.default.createElement(_VisibilityOff.default, null))),
193
214
  defaultValue: defaultValue,
194
215
  label: label,
216
+ multiline: multiline,
195
217
  inputRef: inputRef !== null && inputRef !== void 0 ? inputRef : null,
196
218
  ref: ref !== null && ref !== void 0 ? ref : null,
197
219
  onKeyDown: function onKeyDown(event) {
@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _templateObject;
11
11
  //import './font.css';
12
12
 
13
- var TextFieldContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", "; \n text-align: left; \n position: relative; \n align-items: center;\n justify-content: center;\n font-family: Poppins; \n font-size: \"14px\";\n"])), function (props) {
13
+ var TextFieldContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: ", "; \n text-align: left; \n position: relative; \n align-items: flex-start;\n justify-content: flex-start;\n font-family: Poppins; \n font-size: \"14px\";\n"])), function (props) {
14
14
  return props.width;
15
15
  });
16
16
  exports.TextFieldContainer = TextFieldContainer;
@@ -19,7 +19,7 @@ var _TitleDescriptionStyle = require("./TitleDescription.style.js");
19
19
  var _excluded = ["showRetailerIcon", "data", "viewCreativeOnClick", "width", "height", "textColor", "disabled"];
20
20
  /*TitleDescription*/
21
21
  var TitleDescription = function TitleDescription(_ref) {
22
- var _data$objectivesDescr;
22
+ var _data$objectivesDescr, _data$eventDatesValue, _data$eventDatesValue2;
23
23
  var _ref$showRetailerIcon = _ref.showRetailerIcon,
24
24
  showRetailerIcon = _ref$showRetailerIcon === void 0 ? true : _ref$showRetailerIcon,
25
25
  data = _ref.data,
@@ -134,11 +134,11 @@ var TitleDescription = function TitleDescription(_ref) {
134
134
  id: "SubLineContainer"
135
135
  }), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.SubLineContainer, {
136
136
  id: "SubLineContainer"
137
- }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodLabel, {
137
+ }, (data === null || data === void 0 ? void 0 : (_data$eventDatesValue = data.eventDatesValue) === null || _data$eventDatesValue === void 0 ? void 0 : _data$eventDatesValue.length) > 0 ? /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodLabel, {
138
138
  id: "PeriodLabel"
139
- }, "Event Dates: "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
139
+ }, "Event Dates: ") : "", (data === null || data === void 0 ? void 0 : (_data$eventDatesValue2 = data.eventDatesValue) === null || _data$eventDatesValue2 === void 0 ? void 0 : _data$eventDatesValue2.length) > 0 ? /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodValue, {
140
140
  id: "PeriodValue"
141
- }, data.eventDatesValue))))));
141
+ }, data.eventDatesValue) : "")))));
142
142
  };
143
143
  exports.TitleDescription = TitleDescription;
144
144
  var _default = TitleDescription;
@@ -30,11 +30,11 @@ var ViewCreativeContainer = _styledComponents.default.div(_templateObject6 || (_
30
30
  return !props.disabled ? "pointer" : "default";
31
31
  });
32
32
  exports.ViewCreativeContainer = ViewCreativeContainer;
33
- var ViewCreativeTextField = _styledComponents.default.h4(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin: 0 5px;\n"])));
33
+ var ViewCreativeTextField = _styledComponents.default.h4(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin: 0 5px;\n font-weight: 500;\n"])));
34
34
  exports.ViewCreativeTextField = ViewCreativeTextField;
35
35
  var FilterValuesContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-content: center;\n align-items: center;\n width: 100%;\n margin: 0.5rem;\n"])));
36
36
  exports.FilterValuesContainer = FilterValuesContainer;
37
- var FilterValue = _styledComponents.default.p(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n color: #1b30aa;\n margin: 0;\n"])));
37
+ var FilterValue = _styledComponents.default.p(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n //color: #1b30aa;\n margin: 0;\n"])));
38
38
  exports.FilterValue = FilterValue;
39
39
  var FieldsDelimiter = _styledComponents.default.p(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n color: #ccc;\n margin: 0;\n"])));
40
40
  exports.FieldsDelimiter = FieldsDelimiter;
@@ -85,9 +85,11 @@ var TotalBenchmark = function TotalBenchmark(_ref) {
85
85
  underAvarageColor: "#FD5959",
86
86
  backgroundColor: "#F2F2F2"
87
87
  }) : ""))));
88
- }) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
88
+ }) : /*#__PURE__*/_react.default.createElement(_TotalBenchmarkStyle.NoDataFoundContainer, {
89
+ id: "NoDataFoundContainer"
90
+ }, /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
89
91
  noDataText: noDataText
90
- }));
92
+ })));
91
93
  };
92
94
  exports.TotalBenchmark = TotalBenchmark;
93
95
  var _default = TotalBenchmark;
@@ -4,13 +4,13 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.TitleAndValueContainer = exports.Title = exports.FormattedValue = exports.ControlsContainer = exports.Controls = exports.BenchmarkContainerParent = exports.BenchmarkContainer = void 0;
7
+ exports.TitleAndValueContainer = exports.Title = exports.NoDataFoundContainer = exports.FormattedValue = exports.ControlsContainer = exports.Controls = exports.BenchmarkContainerParent = exports.BenchmarkContainer = 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, _templateObject6, _templateObject7;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
11
11
  var MIN_HEIGHT = 300;
12
12
  var MIN_WIDTH = 260;
13
- var 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 font-size: ", ";\n color: ", ";\n width: ", ";\n height: ", ";\n border-radius: 12px;\n align-content: center;\n flex-direction: column; \n place-content: space-between;\n align-items: flex-start; \n background: #ffffff; \n"])), function (props) {
13
+ var 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 font-size: ", ";\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"])), function (props) {
14
14
  return props.rootFont;
15
15
  }, function (props) {
16
16
  return props.textColor;
@@ -20,15 +20,17 @@ 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: 40%; */\n //justify-content: center; \n //align-items: flex-start;\n background: #ffffff;\n margin-bottom: 2rem;\n padding: 0px 0.8rem;\n"])));
23
+ var 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"])));
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;
27
- var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 1rem;\n margin-bottom: 1rem;\n"])));
27
+ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n //margin-bottom: 1rem;\n"])));
28
28
  exports.Title = Title;
29
- var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 2.22rem;\n"])));
29
+ var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
30
30
  exports.FormattedValue = FormattedValue;
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"])));
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"])));
32
32
  exports.BenchmarkContainerParent = BenchmarkContainerParent;
33
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
- exports.BenchmarkContainer = BenchmarkContainer;
34
+ exports.BenchmarkContainer = BenchmarkContainer;
35
+ var NoDataFoundContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: center;\n align-items: center;\n width: 100%;\n height: 100%;\n"])));
36
+ exports.NoDataFoundContainer = NoDataFoundContainer;
@@ -124,19 +124,19 @@ var TotalBenchmarkAreachart = function TotalBenchmarkAreachart(_ref) {
124
124
  return /*#__PURE__*/_react.default.createElement("g", {
125
125
  transform: "translate(".concat(x, ",").concat(y, ")")
126
126
  }, activeLabel === payload.value && /*#__PURE__*/_react.default.createElement("rect", {
127
- x: -10,
127
+ x: -15,
128
128
  y: 0,
129
- width: "26",
129
+ width: "40",
130
130
  height: "18",
131
131
  rx: 9,
132
132
  fill: xselectedColor,
133
133
  fillOpacity: "0.10"
134
134
  }), /*#__PURE__*/_react.default.createElement("text", {
135
135
  x: 0,
136
- y: 13,
137
- dx: -5,
136
+ y: 14,
137
+ dx: -10,
138
138
  fill: "black",
139
- fontSize: "8px"
139
+ fontSize: "14px"
140
140
  }, payload.value));
141
141
  };
142
142
  var CustomTooltip = function CustomTooltip(_ref3) {
@@ -193,9 +193,9 @@ var TotalBenchmarkAreachart = function TotalBenchmarkAreachart(_ref) {
193
193
  data: areaChartData,
194
194
  margin: {
195
195
  top: 0,
196
- right: 20,
197
- bottom: 0,
198
- left: 20
196
+ right: 24,
197
+ bottom: -5,
198
+ left: 24
199
199
  }
200
200
  }, /*#__PURE__*/_react.default.createElement(_recharts.CartesianGrid, {
201
201
  strokeDasharray: "3 3",
@@ -8,7 +8,7 @@ exports.ValueAndBenchmarkContainer = exports.TooltipTitle = exports.TooltipLabel
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;
11
- var 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 font-size: ", ";\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 /* min-height: 280px;\n min-width: 250px;\n max-height: 380px;\n max-width: 350px; */\n"])), function (props) {
11
+ var 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 font-size: ", ";\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\n"])), function (props) {
12
12
  return props.rootFont;
13
13
  }, function (props) {
14
14
  return props.textColor;
@@ -24,23 +24,23 @@ var TooltipLabel = _styledComponents.default.div(_templateObject3 || (_templateO
24
24
  exports.TooltipLabel = TooltipLabel;
25
25
  var TooltipTitle = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: Poppins;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n"])));
26
26
  exports.TooltipTitle = TooltipTitle;
27
- var Controls = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (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 width: 90%;\n /* min-height: 280px;\n min-width: 250px;\n max-height: 380px;\n max-width: 350px; */\n"])));
27
+ var Controls = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (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\n justify-content: space-between;\n width: 100%;\n\n"])));
28
28
  exports.Controls = Controls;
29
- var TitleAndValueContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)([""])));
29
+ var TitleAndValueContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 1rem;\n"])));
30
30
  exports.TitleAndValueContainer = TitleAndValueContainer;
31
- var Title = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 1rem;\n margin-left: 0.5rem;\n /* margin-top: 1rem; */\n margin-bottom: 1rem;\n"])));
31
+ var Title = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n\n"])));
32
32
  exports.Title = Title;
33
- var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: baseline;\n margin-left: 0.5rem;\n"])));
33
+ var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: baseline;\n\n"])));
34
34
  exports.ValueAndBenchmarkContainer = ValueAndBenchmarkContainer;
35
35
  var DetailsRowArrowContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: 1.2rem;\n align-items: flex-end;\n"])));
36
36
  exports.DetailsRowArrowContainer = DetailsRowArrowContainer;
37
- var FormattedValue = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.2rem;\n"])));
37
+ var FormattedValue = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
38
38
  exports.FormattedValue = FormattedValue;
39
- var BenchmarkContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 1rem;\n /* width: 5.35rem; */\n"])));
39
+ var BenchmarkContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 1.5rem;\n"])));
40
40
  exports.BenchmarkContainer = BenchmarkContainer;
41
- var AreaChartContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 51%;\n"])));
41
+ var AreaChartContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\n width: 100%;\n height: 50%;\n"])));
42
42
  exports.AreaChartContainer = AreaChartContainer;
43
43
  var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center;\n"])));
44
44
  exports.BottomDetailsRowContainer = BottomDetailsRowContainer;
45
- var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.7rem;\n"])));
45
+ var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.77778rem;\n"])));
46
46
  exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
@@ -20,25 +20,25 @@ 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 width: 90%;\n height: 100%;\n background: #ffffff; \n flex-direction: column;\n flex-basis: 100%;\n //align-items: center;\n align-items: flex-start;\n justify-content: space-between;\n padding: 0px 0.8rem;\n \n"])));
22
22
  exports.Controls = Controls;
23
- var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n /* width: 14rem; */\n font-weight: 600;\n font-size: 1rem;\n margin-bottom: 1rem;\n"])));
23
+ var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)([" \n font-weight: 500;\n font-size: 1rem;\n // margin-bottom: 1rem;\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: 14rem; */\n height: 45%;\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 height: 45%;\n"])));
26
26
  exports.ValueAndBenchmarkContainer = ValueAndBenchmarkContainer;
27
- var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.2rem;\n"])));
27
+ var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
28
28
  exports.FormattedValue = FormattedValue;
29
- var BenchmarkContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.7rem;\n width: 5.35rem;\n"])));
29
+ var BenchmarkContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.77778rem;\n width: 5.35rem;\n"])));
30
30
  exports.BenchmarkContainer = BenchmarkContainer;
31
31
  var DetailsContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n /* width: 14rem; */\n height: 50%;\n"])));
32
32
  exports.DetailsContainer = DetailsContainer;
33
- var DetailsTitle = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n /* width: 14rem; */\n height: 25%;\n font-weight: 600;\n font-size: 1rem;\n"])));
33
+ var DetailsTitle = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n height: 25%;\n font-weight: 500;\n font-size: 1rem;\n"])));
34
34
  exports.DetailsTitle = DetailsTitle;
35
35
  var DetailsRowContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n text-align: center;\n align-items: baseline;\n height: 25%;\n"])));
36
36
  exports.DetailsRowContainer = DetailsRowContainer;
37
37
  var DetailsRowArrowContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: 0.8rem;\n align-items: flex-end;\n height: 25%;\n"])));
38
38
  exports.DetailsRowArrowContainer = DetailsRowArrowContainer;
39
- var DetailsRowFormattedValue = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 600;\n font-size: 0.88rem;\n"])));
39
+ var DetailsRowFormattedValue = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 0.88889rem;\n"])));
40
40
  exports.DetailsRowFormattedValue = DetailsRowFormattedValue;
41
- var DetailsRowPercentSign = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 400;\n font-size: 0.88rem;\n"])));
41
+ var DetailsRowPercentSign = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 700;\n font-size: 12px;\n"])));
42
42
  exports.DetailsRowPercentSign = DetailsRowPercentSign;
43
- var DetailsRowTitle = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 400;\n font-size: 0.88rem;\n"])));
43
+ var DetailsRowTitle = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.3rem;\n font-weight: 400;\n font-size: 0.88889rem;\n"])));
44
44
  exports.DetailsRowTitle = DetailsRowTitle;
@@ -186,7 +186,9 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
186
186
  }, /*#__PURE__*/_react.default.createElement(_recharts.LabelList, {
187
187
  dataKey: "formattedValue1",
188
188
  position: "top",
189
- fill: textColor
189
+ fill: textColor,
190
+ fontWeight: 400,
191
+ fontSize: "14px"
190
192
  })), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
191
193
  dataKey: "value2",
192
194
  fill: getFormattedBarChartData()[0].color2,
@@ -197,7 +199,9 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
197
199
  }, /*#__PURE__*/_react.default.createElement(_recharts.LabelList, {
198
200
  dataKey: "formattedValue2",
199
201
  position: "top",
200
- fill: textColor
202
+ fill: textColor,
203
+ fontWeight: 400,
204
+ fontSize: "14px"
201
205
  }))), getFormattedBarChartData().length > 0 ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BottomDetailsRowContainer, {
202
206
  id: "BottomDetailsRowContainer"
203
207
  }, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BottomDetailsRowTitle, {
@@ -20,21 +20,21 @@ 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: space-between;\n flex-direction: column;\n flex-basis: 100%;\n //padding: 16px ;\n"])));
22
22
  exports.Controls = Controls;
23
- var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n \n"])));
23
+ var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n margin: 0px;\n"])));
24
24
  exports.TitleAndValueContainer = TitleAndValueContainer;
25
- var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 1rem; \n margin-bottom: 1rem;\n"])));
25
+ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem; \n //margin-bottom: 1rem;\n"])));
26
26
  exports.Title = Title;
27
27
  var ValueAndBenchmarkContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: flex-start;\n align-items: baseline; \n\n"])));
28
28
  exports.ValueAndBenchmarkContainer = ValueAndBenchmarkContainer;
29
29
  var CurrencySign = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)([" \n font-weight: 500;\n font-size: 1rem;\n"])));
30
30
  exports.CurrencySign = CurrencySign;
31
- var FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.2rem;\n"])));
31
+ var FormattedValue = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
32
32
  exports.FormattedValue = FormattedValue;
33
33
  var BenchmarkContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.7em;\n width: 5.35em;\n"])));
34
34
  exports.BenchmarkContainer = BenchmarkContainer;
35
- var BarchartContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n"])));
35
+ var BarchartContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\n\n"])));
36
36
  exports.BarchartContainer = BarchartContainer;
37
- var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center; \n\n"])));
37
+ var BottomDetailsRowContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: flex-start;\n justify-content: center;\n text-align: center; \n //max-height: 20px;\n"])));
38
38
  exports.BottomDetailsRowContainer = BottomDetailsRowContainer;
39
- var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (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.7rem;\n"])));
39
+ var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: center; \n margin-top: 4px;\n width: 14em;\n font-weight: 400;\n font-size: 14px;\n max-height: 20px;\n"])));
40
40
  exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
@@ -26,33 +26,33 @@ var TooltipLabel = _styledComponents.default.p(_templateObject4 || (_templateObj
26
26
  exports.TooltipLabel = TooltipLabel;
27
27
  var TitleAndValueContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: column;\n width: 90%;\n //margin-top: 6%;\n"])));
28
28
  exports.TitleAndValueContainer = TitleAndValueContainer;
29
- var Title = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n font-weight: 600;\n font-size: 1rem;\n margin-bottom: 1rem;\n"])));
29
+ var Title = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n font-weight: 500;\n font-size: 1rem;\n //margin-bottom: 1rem;\n"])));
30
30
  exports.Title = Title;
31
31
  var CurrencySignAndFormattedValueContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n align-items: baseline;\n"])));
32
32
  exports.CurrencySignAndFormattedValueContainer = CurrencySignAndFormattedValueContainer;
33
33
  var CurrencySign = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n"])));
34
34
  exports.CurrencySign = CurrencySign;
35
- var FormattedValue = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 2.22rem;\n"])));
35
+ var FormattedValue = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 2.22222rem;\n"])));
36
36
  exports.FormattedValue = FormattedValue;
37
- var DoughnutChartAndLegendContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n width: 95%;\n height: 37%;\n margin-top: 1em; // 35px;\n margin-bottom: 1em; // 35px;\n"])));
37
+ var DoughnutChartAndLegendContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n width: 95%;\n height: 37%;\n margin-top: 1em; \n margin-bottom: 1em; \n"])));
38
38
  exports.DoughnutChartAndLegendContainer = DoughnutChartAndLegendContainer;
39
39
  var DoughnutChart = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n width: 34%;\n height: 100%;\n min-width: 105px;\n min-height: 105px;\n"])));
40
40
  exports.DoughnutChart = DoughnutChart;
41
41
  var LegendContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n width: 66%;\n padding-left: 10px;\n flex-direction: column;\n align-items: left;\n justify-content: space-between;\n"])));
42
42
  exports.LegendContainer = LegendContainer;
43
- var LegendControlsContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n /* flex-direction: row; */\n align-items: center;\n /* height: 50%;\n width: 100%; */\n margin-bottom: 5px;\n"])));
43
+ var LegendControlsContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n margin-bottom: 5px;\n"])));
44
44
  exports.LegendControlsContainer = LegendControlsContainer;
45
- var LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n //display: flex;\n /* width: 100%;\n height: 100%; */\n margin-left: 0.1rem;\n //flex-direction: column;\n"])));
45
+ var LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n"])));
46
46
  exports.LegendTitleAndFormatedValueContainer = LegendTitleAndFormatedValueContainer;
47
- var LegendFormatedValueContainer = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n /* width: 100%;\n height: 50%; */\n font-weight: 600;\n font-size: 13px;\n"])));
47
+ var LegendFormatedValueContainer = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n flex-direction: row;\n font-weight: 700;\n font-size: 16px;\n"])));
48
48
  exports.LegendFormatedValueContainer = LegendFormatedValueContainer;
49
- var LegendColorRectangle = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n width: 0.8rem;\n height: 0.7rem;\n margin-right: 0.3rem;\n background: ", ";\n"])), function (props) {
49
+ var LegendColorRectangle = _styledComponents.default.div(_templateObject16 || (_templateObject16 = (0, _taggedTemplateLiteral2.default)(["\n width: 0.8rem;\n height: 0.77778rem;\n margin-right: 0.3rem;\n background: ", ";\n"])), function (props) {
50
50
  return props.color;
51
51
  });
52
52
  exports.LegendColorRectangle = LegendColorRectangle;
53
- var LegendTitle = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 13px;\n //width: 100%;\n //height: 50%;\n"])));
53
+ var LegendTitle = _styledComponents.default.div(_templateObject17 || (_templateObject17 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 16px;\n"])));
54
54
  exports.LegendTitle = LegendTitle;
55
- var LegendCurrencySign = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n /* font-weight: 600;\n font-size: 0.8rem; */\n"])));
55
+ var LegendCurrencySign = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n\n"])));
56
56
  exports.LegendCurrencySign = LegendCurrencySign;
57
- var LegendFormattedValue = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n /* font-weight: 600;\n font-size: 0.8rem; */\n"])));
57
+ var LegendFormattedValue = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n\n"])));
58
58
  exports.LegendFormattedValue = LegendFormattedValue;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.227",
3
+ "version": "1.0.229",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
@@ -50,14 +50,11 @@
50
50
  "@mui/material": "^5.13.0",
51
51
  "@mui/styled-engine-sc": "^5.12.0",
52
52
  "@mui/x-date-pickers": "^6.11.1",
53
- "ace-builds": "^1.27.0",
54
53
  "babel-plugin-react-css-modules": "^5.2.6",
55
54
  "classnames": "^2.3.2",
56
55
  "dayjs": "^1.11.9",
57
56
  "hoopy": "^0.1.4",
58
- "react-ace": "^10.1.0",
59
57
  "react-css-modules": "^4.7.11",
60
- "react-hook-form": "^7.46.2",
61
58
  "react-loading-skeleton": "^3.3.1",
62
59
  "react-scripts": "5.0.1",
63
60
  "recharts": "^2.6.2"
@@ -1,39 +0,0 @@
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 = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _reactAce = _interopRequireDefault(require("react-ace"));
10
- require("ace-builds/src-noconflict/mode-sql");
11
- require("ace-builds/src-noconflict/theme-monokai");
12
- // CodeEditor.js
13
-
14
- var CodeEditor = function CodeEditor(_ref) {
15
- var value = _ref.value,
16
- onChange = _ref.onChange;
17
- return /*#__PURE__*/_react.default.createElement(_reactAce.default, {
18
- style: {
19
- height: "200px"
20
- },
21
- mode: "sql",
22
- theme: "monokai",
23
- value: value,
24
- onChange: onChange,
25
- name: "code-editor",
26
- editorProps: {
27
- $blockScrolling: true
28
- },
29
- setOptions: {
30
- enableBasicAutocompletion: true,
31
- enableLiveAutocompletion: true,
32
- enableSnippets: true,
33
- showLineNumbers: true,
34
- tabSize: 1
35
- }
36
- });
37
- };
38
- var _default = CodeEditor;
39
- exports.default = _default;
@@ -1,13 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.AceEditorContent = void 0;
8
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
- var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _reactAce = _interopRequireDefault(require("react-ace"));
11
- var _templateObject;
12
- var AceEditorContent = (0, _styledComponents.default)(_reactAce.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 400px;\n"])));
13
- exports.AceEditorContent = AceEditorContent;
@@ -1,20 +0,0 @@
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 = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _Modal = require("./Modal.style");
10
- var Modal = function Modal(_ref) {
11
- var isOpen = _ref.isOpen,
12
- onClose = _ref.onClose,
13
- children = _ref.children;
14
- if (!isOpen) return null;
15
- return /*#__PURE__*/_react.default.createElement(_Modal.ModalOverlay, null, /*#__PURE__*/_react.default.createElement(_Modal.ModalContent, null, children, /*#__PURE__*/_react.default.createElement(_Modal.CloseButton, {
16
- onClick: onClose
17
- }, "Close")));
18
- };
19
- var _default = Modal;
20
- exports.default = _default;
@@ -1,19 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.ModalOverlay = exports.ModalContent = exports.CloseButton = void 0;
9
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
10
- var _react = _interopRequireDefault(require("react"));
11
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
12
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
13
- var fadeIn = (0, _styledComponents.keyframes)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"])));
14
- var ModalOverlay = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index:999999;\n background-color: rgba(0, 0, 0, 0.7);\n display: flex;\n justify-content: center;\n align-items: center;\n animation: ", " 0.3s ease-in-out;\n"])), fadeIn);
15
- exports.ModalOverlay = ModalOverlay;
16
- var ModalContent = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n background-color: #fff;\n overflow: scroll;\n padding: 20px;\n border-radius: 8px;\n width: 50%;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n animation: ", " 0.5s ease-in-out;\n"])), fadeIn);
17
- exports.ModalContent = ModalContent;
18
- var CloseButton = _styledComponents.default.button(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 10px;\n padding: 5px 15px;\n border: none;\n background-color: #333;\n color: #fff;\n cursor: pointer;\n border-radius: 4px;\n &:hover {\n background-color: #555;\n }\n"])));
19
- exports.CloseButton = CloseButton;
@@ -1,187 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
10
- var _react = _interopRequireWildcard(require("react"));
11
- var _Modal = _interopRequireDefault(require("./Modal"));
12
- var _CodeEditor = _interopRequireDefault(require("./CodeEditor"));
13
- var _TextField = _interopRequireDefault(require("./TextField"));
14
- var _reactHookForm = require("react-hook-form");
15
- var TotalCostModal = function TotalCostModal(_ref) {
16
- var title = _ref.title,
17
- isModalOpen = _ref.isModalOpen,
18
- setModalOpen = _ref.setModalOpen,
19
- setResult = _ref.setResult;
20
- var _useState = (0, _react.useState)("Select PACKAGE_COST,REDEMPTION_COST,(PACKAGE_COST+REDEMPTION_COST) AS TOTAL_COST,from FACT_EVENT_MEASURES A INNER JOIN DIM_EVENTS B ON A.EVENT_CODE = B.EVENT_CODE"),
21
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
22
- code = _useState2[0],
23
- setCode = _useState2[1];
24
- var _useForm = (0, _reactHookForm.useForm)(),
25
- register = _useForm.register,
26
- handleSubmit = _useForm.handleSubmit,
27
- watch = _useForm.watch,
28
- control = _useForm.control,
29
- errors = _useForm.formState.errors;
30
- var onSubmit = function onSubmit(data) {
31
- return setResult(data);
32
- };
33
- return /*#__PURE__*/_react.default.createElement("form", {
34
- onSubmit: handleSubmit(onSubmit)
35
- }, /*#__PURE__*/_react.default.createElement(_Modal.default, {
36
- isOpen: isModalOpen,
37
- onClose: function onClose() {
38
- return setModalOpen(false);
39
- }
40
- }, /*#__PURE__*/_react.default.createElement("h2", null, title), /*#__PURE__*/_react.default.createElement("div", {
41
- style: {
42
- gap: "10px",
43
- display: "grid"
44
- }
45
- }, /*#__PURE__*/_react.default.createElement(_CodeEditor.default, {
46
- value: code,
47
- onChange: setCode
48
- }), /*#__PURE__*/_react.default.createElement("div", {
49
- style: {
50
- gap: "10px",
51
- display: "grid",
52
- gridTemplateColumns: "auto auto auto"
53
- }
54
- }, /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
55
- control: control,
56
- name: "title",
57
- render: function render(_ref2) {
58
- var field = _ref2.field;
59
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
60
- allowedInput: "all",
61
- height: "100%",
62
- label: "Title",
63
- multiline: true,
64
- placeHolder: "Type...",
65
- shape: "round",
66
- size: "small",
67
- width: "100%"
68
- }));
69
- }
70
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
71
- control: control,
72
- name: "titleValueKey",
73
- render: function render(_ref3) {
74
- var field = _ref3.field;
75
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
76
- allowedInput: "all",
77
- height: "100%",
78
- label: "Title Value Item key",
79
- multiline: true,
80
- placeHolder: "Type...",
81
- shape: "round",
82
- size: "small",
83
- width: "100%"
84
- }));
85
- }
86
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
87
- control: control,
88
- name: "firstName",
89
- render: function render(_ref4) {
90
- var field = _ref4.field;
91
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
92
- allowedInput: "all",
93
- height: "100%",
94
- label: "First name",
95
- multiline: true,
96
- placeHolder: "Type...",
97
- shape: "round",
98
- size: "small",
99
- width: "100%"
100
- }));
101
- }
102
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
103
- control: control,
104
- name: "firstColor",
105
- render: function render(_ref5) {
106
- var field = _ref5.field;
107
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
108
- allowedInput: "all",
109
- height: "100%",
110
- label: "First color",
111
- multiline: true,
112
- placeHolder: "Type...",
113
- shape: "round",
114
- size: "small",
115
- width: "100%"
116
- }));
117
- }
118
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
119
- control: control,
120
- name: "firstValueKey",
121
- render: function render(_ref6) {
122
- var field = _ref6.field;
123
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
124
- allowedInput: "all",
125
- height: "100%",
126
- label: "First Value Item key",
127
- multiline: true,
128
- placeHolder: "Type...",
129
- shape: "round",
130
- size: "small",
131
- width: "100%"
132
- }));
133
- }
134
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
135
- control: control,
136
- name: "secondName",
137
- render: function render(_ref7) {
138
- var field = _ref7.field;
139
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
140
- allowedInput: "all",
141
- height: "100%",
142
- label: "Second name",
143
- multiline: true,
144
- placeHolder: "Type...",
145
- shape: "round",
146
- size: "small",
147
- width: "100%"
148
- }));
149
- }
150
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
151
- control: control,
152
- name: "secondColor",
153
- render: function render(_ref8) {
154
- var field = _ref8.field;
155
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
156
- allowedInput: "all",
157
- height: "100%",
158
- label: "Second color",
159
- multiline: true,
160
- placeHolder: "Type...",
161
- shape: "round",
162
- size: "small",
163
- width: "100%"
164
- }));
165
- }
166
- }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
167
- control: control,
168
- name: "secondValueKey",
169
- render: function render(_ref9) {
170
- var field = _ref9.field;
171
- return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
172
- allowedInput: "all",
173
- height: "100%",
174
- label: "Second Value Item key",
175
- multiline: true,
176
- placeHolder: "Type...",
177
- shape: "round",
178
- size: "small",
179
- width: "100%"
180
- }));
181
- }
182
- }))), /*#__PURE__*/_react.default.createElement("input", {
183
- type: "submit"
184
- })));
185
- };
186
- var _default = TotalCostModal;
187
- exports.default = _default;