sag_components 1.0.221 → 1.0.223

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 (21) hide show
  1. package/dist/stories/components/CodeEditor.js +39 -0
  2. package/dist/stories/components/CodeEditor.style.js +13 -0
  3. package/dist/stories/components/CommonFunctions.js +1 -1
  4. package/dist/stories/components/Modal.js +20 -0
  5. package/dist/stories/components/Modal.style.js +19 -0
  6. package/dist/stories/components/NoDataFoundMessage.style.js +2 -2
  7. package/dist/stories/components/TextField.js +3 -25
  8. package/dist/stories/components/TextField.style.js +1 -1
  9. package/dist/stories/components/TitleDescription.js +4 -4
  10. package/dist/stories/components/TitleDescription.style.js +2 -2
  11. package/dist/stories/components/TotalBenchmark.js +2 -4
  12. package/dist/stories/components/TotalBenchmark.style.js +8 -10
  13. package/dist/stories/components/TotalBenchmarkAreachart.js +8 -8
  14. package/dist/stories/components/TotalBenchmarkAreachart.style.js +9 -9
  15. package/dist/stories/components/TotalBenchmarkArrows.style.js +8 -8
  16. package/dist/stories/components/TotalBenchmarkBarchart.js +2 -6
  17. package/dist/stories/components/TotalBenchmarkBarchart.style.js +6 -6
  18. package/dist/stories/components/TotalCostModal.js +186 -0
  19. package/dist/stories/components/TotalDoughnutChart.style.js +10 -10
  20. package/package.json +4 -1
  21. package/dist/stories/components/InfoIcon.js +0 -38
package/dist/stories/components/CodeEditor.js ADDED
@@ -0,0 +1,39 @@
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;
package/dist/stories/components/CodeEditor.style.js ADDED
@@ -0,0 +1,13 @@
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;
package/dist/stories/components/CommonFunctions.js CHANGED
@@ -11,7 +11,7 @@ var getCurrencySign = function getCurrencySign(currencyTypeToConvert, value) {
11
11
  style: "currency",
12
12
  currency: currencyTypeToConvert
13
13
  });
14
- currencySign = currencyFormatter.format(Math.abs(value)).substring(0, 1);
14
+ currencySign = currencyFormatter.format(value).substring(0, 1);
15
15
  return currencySign;
16
16
  };
17
17
  exports.getCurrencySign = getCurrencySign;
package/dist/stories/components/Modal.js ADDED
@@ -0,0 +1,20 @@
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;
package/dist/stories/components/Modal.style.js ADDED
@@ -0,0 +1,19 @@
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 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;
package/dist/stories/components/NoDataFoundMessage.style.js CHANGED
@@ -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 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"])));
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"])));
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.77778rem;\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.7rem;\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;
package/dist/stories/components/TextField.js CHANGED
@@ -41,9 +41,7 @@ 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,
45
- _ref$multiline = _ref.multiline,
46
- multiline = _ref$multiline === void 0 ? false : _ref$multiline;
44
+ onChange = _ref.onChange;
47
45
  var _useState = (0, _react.useState)(null),
48
46
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
49
47
  currentInputValue = _useState2[0],
@@ -100,14 +98,13 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
100
98
  height: {
101
99
  height: height
102
100
  },
103
- paddingTop: multiline ? "12px" : "0",
101
+ paddingTop: 0,
104
102
  marginTop: 0,
105
103
  borderColor: "green",
106
104
  borderRadius: "12px",
107
105
  legend: {
108
106
  marginLeft: "6px"
109
- },
110
- alignItems: multiline ? "flex-start" : "center"
107
+ }
111
108
  },
112
109
  "& .MuiAutocomplete-inputRoot": {
113
110
  paddingLeft: "10px !important",
@@ -149,7 +146,6 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
149
146
  }
150
147
  };
151
148
  return /*#__PURE__*/_react.default.createElement(_TextFieldStyle.TextFieldContainer, {
152
- id: "TextFieldContainer",
153
149
  width: width
154
150
  }, /*#__PURE__*/_react.default.createElement(_styles.ThemeProvider, {
155
151
  theme: theme
@@ -161,7 +157,6 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
161
157
  }, /*#__PURE__*/_react.default.createElement("div", null, !passwordField && /*#__PURE__*/_react.default.createElement(_TextField.default, {
162
158
  key: resetDefaultValue,
163
159
  label: label,
164
- multiline: multiline,
165
160
  defaultValue: defaultValue,
166
161
  placeholder: placeHolder,
167
162
  id: "outlined-start-adornment",
@@ -177,23 +172,7 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
177
172
  },
178
173
  onChange: function onChange(event) {
179
174
  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
- }
190
175
  }
191
-
192
- // style={{
193
- // // height: '50px',
194
- // // width: '50px',
195
- // textAlign: 'start',
196
- // justifyContent: 'start'}}
197
176
  }), passwordField && /*#__PURE__*/_react.default.createElement(_FormControl.default, {
198
177
  sx: getTextFieldStyle(),
199
178
  variant: "outlined"
@@ -213,7 +192,6 @@ var TextField = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
213
192
  }, showPassword ? /*#__PURE__*/_react.default.createElement(_Visibility.default, null) : /*#__PURE__*/_react.default.createElement(_VisibilityOff.default, null))),
214
193
  defaultValue: defaultValue,
215
194
  label: label,
216
- multiline: multiline,
217
195
  inputRef: inputRef !== null && inputRef !== void 0 ? inputRef : null,
218
196
  ref: ref !== null && ref !== void 0 ? ref : null,
219
197
  onKeyDown: function onKeyDown(event) {
package/dist/stories/components/TextField.style.js CHANGED
@@ -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 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) {
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) {
14
14
  return props.width;
15
15
  });
16
16
  exports.TextFieldContainer = TextFieldContainer;
package/dist/stories/components/TitleDescription.js CHANGED
@@ -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, _data$eventDatesValue, _data$eventDatesValue2;
22
+ var _data$objectivesDescr;
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
- }, (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, {
137
+ }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.PeriodLabel, {
138
138
  id: "PeriodLabel"
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, {
139
+ }, "Event Dates: "), /*#__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;
package/dist/stories/components/TitleDescription.style.js CHANGED
@@ -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 font-weight: 500;\n"])));
33
+ var ViewCreativeTextField = _styledComponents.default.h4(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin: 0 5px;\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: #212121;\n //color: #1b30aa;\n margin: 0;\n"])));
37
+ var FilterValue = _styledComponents.default.p(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\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;
package/dist/stories/components/TotalBenchmark.js CHANGED
@@ -85,11 +85,9 @@ var TotalBenchmark = function TotalBenchmark(_ref) {
85
85
  underAvarageColor: "#FD5959",
86
86
  backgroundColor: "#F2F2F2"
87
87
  }) : ""))));
88
- }) : /*#__PURE__*/_react.default.createElement(_TotalBenchmarkStyle.NoDataFoundContainer, {
89
- id: "NoDataFoundContainer"
90
- }, /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
88
+ }) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
91
89
  noDataText: noDataText
92
- })));
90
+ }));
93
91
  };
94
92
  exports.TotalBenchmark = TotalBenchmark;
95
93
  var _default = TotalBenchmark;
package/dist/stories/components/TotalBenchmark.style.js CHANGED
@@ -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.NoDataFoundContainer = exports.FormattedValue = exports.ControlsContainer = exports.Controls = exports.BenchmarkContainerParent = exports.BenchmarkContainer = void 0;
7
+ exports.TitleAndValueContainer = exports.Title = 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, _templateObject8;
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
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 justify-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 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,17 +20,15 @@ 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: 500;\n font-size: 1rem;\n //margin-bottom: 1rem;\n"])));
27
+ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\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.22222rem;\n"])));
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;\n align-items: baseline;\n width: 100%;\n height: 100%;\n margin: 0;\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\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;
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;
34
+ exports.BenchmarkContainer = BenchmarkContainer;
package/dist/stories/components/TotalBenchmarkAreachart.js CHANGED
@@ -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: -15,
127
+ x: -10,
128
128
  y: 0,
129
- width: "40",
129
+ width: "26",
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: 14,
137
- dx: -10,
136
+ y: 13,
137
+ dx: -5,
138
138
  fill: "black",
139
- fontSize: "14px"
139
+ fontSize: "8px"
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: 24,
197
- bottom: -5,
198
- left: 24
196
+ right: 20,
197
+ bottom: 0,
198
+ left: 20
199
199
  }
200
200
  }, /*#__PURE__*/_react.default.createElement(_recharts.CartesianGrid, {
201
201
  strokeDasharray: "3 3",
package/dist/stories/components/TotalBenchmarkAreachart.style.js CHANGED
@@ -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\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 /* min-height: 280px;\n min-width: 250px;\n max-height: 380px;\n max-width: 350px; */\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\n justify-content: space-between;\n width: 100%;\n\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 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"])));
28
28
  exports.Controls = Controls;
29
- var TitleAndValueContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 1rem;\n"])));
29
+ var TitleAndValueContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)([""])));
30
30
  exports.TitleAndValueContainer = TitleAndValueContainer;
31
- var Title = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem;\n\n"])));
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"])));
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\n"])));
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"])));
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.22222rem;\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.2rem;\n"])));
38
38
  exports.FormattedValue = FormattedValue;
39
- var BenchmarkContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 1.5rem;\n"])));
39
+ var BenchmarkContainer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 1rem;\n /* width: 5.35rem; */\n"])));
40
40
  exports.BenchmarkContainer = BenchmarkContainer;
41
- var AreaChartContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n\n width: 100%;\n height: 50%;\n"])));
41
+ var AreaChartContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 51%;\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.77778rem;\n"])));
45
+ var BottomDetailsRowTitle = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 0.7rem;\n"])));
46
46
  exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
package/dist/stories/components/TotalBenchmarkArrows.style.js CHANGED
@@ -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 font-weight: 500;\n font-size: 1rem;\n // margin-bottom: 1rem;\n"])));
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"])));
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 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 /* width: 14rem; */\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.22222rem;\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.2rem;\n"])));
28
28
  exports.FormattedValue = FormattedValue;
29
- var BenchmarkContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.77778rem;\n width: 5.35rem;\n"])));
29
+ var BenchmarkContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n margin-left: 0.7rem;\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 height: 25%;\n font-weight: 500;\n font-size: 1rem;\n"])));
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"])));
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: 700;\n font-size: 0.88889rem;\n"])));
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"])));
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: 700;\n font-size: 12px;\n"])));
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"])));
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.88889rem;\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.88rem;\n"])));
44
44
  exports.DetailsRowTitle = DetailsRowTitle;
package/dist/stories/components/TotalBenchmarkBarchart.js CHANGED
@@ -186,9 +186,7 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
186
186
  }, /*#__PURE__*/_react.default.createElement(_recharts.LabelList, {
187
187
  dataKey: "formattedValue1",
188
188
  position: "top",
189
- fill: textColor,
190
- fontWeight: 400,
191
- fontSize: "14px"
189
+ fill: textColor
192
190
  })), /*#__PURE__*/_react.default.createElement(_recharts.Bar, {
193
191
  dataKey: "value2",
194
192
  fill: getFormattedBarChartData()[0].color2,
@@ -199,9 +197,7 @@ var TotalBenchmarkBarchart = function TotalBenchmarkBarchart(_ref) {
199
197
  }, /*#__PURE__*/_react.default.createElement(_recharts.LabelList, {
200
198
  dataKey: "formattedValue2",
201
199
  position: "top",
202
- fill: textColor,
203
- fontWeight: 400,
204
- fontSize: "14px"
200
+ fill: textColor
205
201
  }))), getFormattedBarChartData().length > 0 ? /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BottomDetailsRowContainer, {
206
202
  id: "BottomDetailsRowContainer"
207
203
  }, /*#__PURE__*/_react.default.createElement(_TotalBenchmarkBarchartStyle.BottomDetailsRowTitle, {
package/dist/stories/components/TotalBenchmarkBarchart.style.js CHANGED
@@ -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 margin: 0px;\n"])));
23
+ var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n \n"])));
24
24
  exports.TitleAndValueContainer = TitleAndValueContainer;
25
- var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 1rem; \n //margin-bottom: 1rem;\n"])));
25
+ var Title = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\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.22222rem;\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.2rem;\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\n"])));
35
+ var BarchartContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n width: 14em;\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 //max-height: 20px;\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\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: 6px;\n width: 14em;\n font-weight: 400;\n font-size: 14px;\n max-height: 18px;\n"])));
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"])));
40
40
  exports.BottomDetailsRowTitle = BottomDetailsRowTitle;
package/dist/stories/components/TotalCostModal.js ADDED
@@ -0,0 +1,186 @@
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
+ 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"),
20
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
21
+ code = _useState2[0],
22
+ setCode = _useState2[1];
23
+ var _useForm = (0, _reactHookForm.useForm)(),
24
+ register = _useForm.register,
25
+ handleSubmit = _useForm.handleSubmit,
26
+ watch = _useForm.watch,
27
+ control = _useForm.control,
28
+ errors = _useForm.formState.errors;
29
+ var onSubmit = function onSubmit(data) {
30
+ return console.log(data);
31
+ };
32
+ return /*#__PURE__*/_react.default.createElement("form", {
33
+ onSubmit: handleSubmit(onSubmit)
34
+ }, /*#__PURE__*/_react.default.createElement(_Modal.default, {
35
+ isOpen: isModalOpen,
36
+ onClose: function onClose() {
37
+ return setModalOpen(false);
38
+ }
39
+ }, /*#__PURE__*/_react.default.createElement("h2", null, title), /*#__PURE__*/_react.default.createElement("div", {
40
+ style: {
41
+ gap: "10px",
42
+ display: "grid"
43
+ }
44
+ }, /*#__PURE__*/_react.default.createElement(_CodeEditor.default, {
45
+ value: code,
46
+ onChange: setCode
47
+ }), /*#__PURE__*/_react.default.createElement("div", {
48
+ style: {
49
+ gap: "10px",
50
+ display: "grid",
51
+ gridTemplateColumns: "auto auto auto"
52
+ }
53
+ }, /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
54
+ control: control,
55
+ name: "title",
56
+ render: function render(_ref2) {
57
+ var field = _ref2.field;
58
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
59
+ allowedInput: "all",
60
+ height: "100%",
61
+ label: "Title",
62
+ multiline: true,
63
+ placeHolder: "Type...",
64
+ shape: "round",
65
+ size: "small",
66
+ width: "100%"
67
+ }));
68
+ }
69
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
70
+ control: control,
71
+ name: "titleValueKey",
72
+ render: function render(_ref3) {
73
+ var field = _ref3.field;
74
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
75
+ allowedInput: "all",
76
+ height: "100%",
77
+ label: "Title Value Item key",
78
+ multiline: true,
79
+ placeHolder: "Type...",
80
+ shape: "round",
81
+ size: "small",
82
+ width: "100%"
83
+ }));
84
+ }
85
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
86
+ control: control,
87
+ name: "firstName",
88
+ render: function render(_ref4) {
89
+ var field = _ref4.field;
90
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
91
+ allowedInput: "all",
92
+ height: "100%",
93
+ label: "First name",
94
+ multiline: true,
95
+ placeHolder: "Type...",
96
+ shape: "round",
97
+ size: "small",
98
+ width: "100%"
99
+ }));
100
+ }
101
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
102
+ control: control,
103
+ name: "firstColor",
104
+ render: function render(_ref5) {
105
+ var field = _ref5.field;
106
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
107
+ allowedInput: "all",
108
+ height: "100%",
109
+ label: "First color",
110
+ multiline: true,
111
+ placeHolder: "Type...",
112
+ shape: "round",
113
+ size: "small",
114
+ width: "100%"
115
+ }));
116
+ }
117
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
118
+ control: control,
119
+ name: "firstValueKey",
120
+ render: function render(_ref6) {
121
+ var field = _ref6.field;
122
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
123
+ allowedInput: "all",
124
+ height: "100%",
125
+ label: "First Value Item key",
126
+ multiline: true,
127
+ placeHolder: "Type...",
128
+ shape: "round",
129
+ size: "small",
130
+ width: "100%"
131
+ }));
132
+ }
133
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
134
+ control: control,
135
+ name: "secondName",
136
+ render: function render(_ref7) {
137
+ var field = _ref7.field;
138
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
139
+ allowedInput: "all",
140
+ height: "100%",
141
+ label: "Second name",
142
+ multiline: true,
143
+ placeHolder: "Type...",
144
+ shape: "round",
145
+ size: "small",
146
+ width: "100%"
147
+ }));
148
+ }
149
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
150
+ control: control,
151
+ name: "secondColor",
152
+ render: function render(_ref8) {
153
+ var field = _ref8.field;
154
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
155
+ allowedInput: "all",
156
+ height: "100%",
157
+ label: "Second color",
158
+ multiline: true,
159
+ placeHolder: "Type...",
160
+ shape: "round",
161
+ size: "small",
162
+ width: "100%"
163
+ }));
164
+ }
165
+ }), /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
166
+ control: control,
167
+ name: "secondValueKey",
168
+ render: function render(_ref9) {
169
+ var field = _ref9.field;
170
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
171
+ allowedInput: "all",
172
+ height: "100%",
173
+ label: "Second Value Item key",
174
+ multiline: true,
175
+ placeHolder: "Type...",
176
+ shape: "round",
177
+ size: "small",
178
+ width: "100%"
179
+ }));
180
+ }
181
+ }))), /*#__PURE__*/_react.default.createElement("input", {
182
+ type: "submit"
183
+ })));
184
+ };
185
+ var _default = TotalCostModal;
186
+ exports.default = _default;
package/dist/stories/components/TotalDoughnutChart.style.js CHANGED
@@ -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: 500;\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: 600;\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.22222rem;\n"])));
35
+ var FormattedValue = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 2.22rem;\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; \n margin-bottom: 1em; \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; // 35px;\n margin-bottom: 1em; // 35px;\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 align-items: center;\n margin-bottom: 5px;\n"])));
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"])));
44
44
  exports.LegendControlsContainer = LegendControlsContainer;
45
- var LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n margin-left: 0.1rem;\n"])));
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"])));
46
46
  exports.LegendTitleAndFormatedValueContainer = LegendTitleAndFormatedValueContainer;
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"])));
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"])));
48
48
  exports.LegendFormatedValueContainer = LegendFormatedValueContainer;
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) {
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) {
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: 16px;\n"])));
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"])));
54
54
  exports.LegendTitle = LegendTitle;
55
- var LegendCurrencySign = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n\n"])));
55
+ var LegendCurrencySign = _styledComponents.default.div(_templateObject18 || (_templateObject18 = (0, _taggedTemplateLiteral2.default)(["\n /* font-weight: 600;\n font-size: 0.8rem; */\n"])));
56
56
  exports.LegendCurrencySign = LegendCurrencySign;
57
- var LegendFormattedValue = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n\n"])));
57
+ var LegendFormattedValue = _styledComponents.default.div(_templateObject19 || (_templateObject19 = (0, _taggedTemplateLiteral2.default)(["\n /* font-weight: 600;\n font-size: 0.8rem; */\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.221",
3
+ "version": "1.0.223",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
@@ -50,11 +50,14 @@
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",
53
54
  "babel-plugin-react-css-modules": "^5.2.6",
54
55
  "classnames": "^2.3.2",
55
56
  "dayjs": "^1.11.9",
56
57
  "hoopy": "^0.1.4",
58
+ "react-ace": "^10.1.0",
57
59
  "react-css-modules": "^4.7.11",
60
+ "react-hook-form": "^7.46.2",
58
61
  "react-loading-skeleton": "^3.3.1",
59
62
  "react-scripts": "5.0.1",
60
63
  "recharts": "^2.6.2"
package/dist/stories/components/InfoIcon.js DELETED
@@ -1,38 +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 = 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;