sag_components 1.0.301 → 1.0.302
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.history/.env_20231001120549 +0 -0
- package/.history/.env_20231001120613 +1 -0
- package/.history/.env_20231003143620 +1 -0
- package/.history/.eslintrc_20230928112617.js +26 -0
- package/.history/.eslintrc_20230928130534.js +27 -0
- package/.history/.eslintrc_20230928133400.js +28 -0
- package/.history/.eslintrc_20230928133404.js +28 -0
- package/.history/.eslintrc_20230928133416.js +28 -0
- package/.history/.eslintrc_20230928133419.js +28 -0
- package/.history/.eslintrc_20230928133432.js +28 -0
- package/.history/.eslintrc_20230928133439.js +28 -0
- package/.history/.eslintrc_20230928133458.js +29 -0
- package/.history/.eslintrc_20230928133500.js +28 -0
- package/.history/.eslintrc_20230928134009.js +28 -0
- package/.history/.eslintrc_20230928135318.js +34 -0
- package/.history/.eslintrc_20230928135321.js +34 -0
- package/.history/.eslintrc_20230928135323.js +34 -0
- package/.history/.eslintrc_20230928135332.js +34 -0
- package/.history/.eslintrc_20230928135333.js +34 -0
- package/.history/.eslintrc_20230928135352.js +29 -0
- package/.history/.eslintrc_20230928135353.js +29 -0
- package/.history/.eslintrc_20230928135355.js +29 -0
- package/.history/.eslintrc_20230928135408.js +29 -0
- package/.history/.eslintrc_20230928135538.js +30 -0
- package/.history/.eslintrc_20230928135539.js +30 -0
- package/.history/.eslintrc_20230928135543.js +30 -0
- package/.history/.gitignore_20230921093332 +119 -0
- package/.history/.gitignore_20230921111638 +120 -0
- package/.history/.gitignore_20230921111650 +120 -0
- package/.history/.gitignore_20230921111810 +121 -0
- package/.history/package_20231015134436.json +82 -0
- package/.history/package_20231016165235.json +82 -0
- package/.history/package_20231024150333.json +82 -0
- package/.history/package_20231024154550.json +82 -0
- package/.history/package_20231024154928.json +82 -0
- package/.history/package_20231024155010.json +82 -0
- package/.history/package_20231024165626.json +82 -0
- package/.history/package_20231025125225.json +82 -0
- package/.history/package_20231025125249.json +82 -0
- package/.history/package_20231025141559.json +82 -0
- package/.history/package_20231025152230.json +82 -0
- package/.history/package_20231025154948.json +82 -0
- package/.history/package_20231025155937.json +82 -0
- package/.history/package_20231025165122.json +82 -0
- package/.history/package_20231026135514.json +82 -0
- package/.history/package_20231026170753.json +82 -0
- package/.history/package_20231026171209.json +82 -0
- package/.history/package_20231029152422.json +82 -0
- package/.history/package_20231029153420.json +82 -0
- package/.history/package_20231029154416.json +82 -0
- package/.history/package_20231030094127.json +82 -0
- package/.history/package_20231030114707.json +82 -0
- package/.history/package_20231030130704.json +82 -0
- package/.history/package_20231030132422.json +82 -0
- package/.history/package_20231030134051.json +82 -0
- package/.history/package_20231030142913.json +82 -0
- package/.history/package_20231030143556.json +82 -0
- package/.history/package_20231030144210.json +82 -0
- package/.history/package_20231101113942.json +82 -0
- package/.history/package_20231101114544.json +82 -0
- package/.history/package_20231101151518.json +82 -0
- package/.history/package_20231101154501.json +82 -0
- package/.history/package_20231101155811.json +82 -0
- package/.history/package_20231101160235.json +82 -0
- package/.history/package_20231101160406.json +82 -0
- package/.history/package_20231101161325.json +82 -0
- package/.history/package_20231101161333.json +82 -0
- package/.history/package_20231102123623.json +82 -0
- package/.history/package_20231102125741.json +82 -0
- package/.history/package_20231102130857.json +82 -0
- package/.history/package_20231102132227.json +82 -0
- package/.history/package_20231102142340.json +82 -0
- package/.history/package_20231102143256.json +82 -0
- package/.history/package_20231105153539.json +82 -0
- package/.history/package_20231105154332.json +82 -0
- package/.history/package_20231105171201.json +82 -0
- package/.history/package_20231106123849.json +82 -0
- package/.history/package_20231107170638.json +82 -0
- package/.history/package_20231109103647.json +82 -0
- package/.history/package_20231109103911.json +82 -0
- package/dist/stories/components/Button.js +1 -3
- package/dist/stories/components/PerformanceAnalytics.js +4 -57
- package/dist/stories/components/PerformanceAnalytics.style.js +8 -9
- package/dist/stories/components/TotalDoughnutChart.js +2 -2
- package/dist/stories/components/TotalDoughnutChart.style.js +4 -4
- package/package.json +1 -1
- package/dist/stories/components/CodeEditor.js +0 -40
- package/dist/stories/components/CodeEditor.style.js +0 -12
- package/dist/stories/components/Modal.js +0 -19
- package/dist/stories/components/Modal.style.js +0 -17
- package/dist/stories/components/TotalCostModal.js +0 -143
|
@@ -11,10 +11,9 @@ var React = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
var _Button = _interopRequireDefault(require("@mui/material/Button"));
|
|
12
12
|
var _styles = require("@mui/material/styles");
|
|
13
13
|
var _Stack = _interopRequireDefault(require("@mui/material/Stack"));
|
|
14
|
-
var _excluded = ["text", "
|
|
14
|
+
var _excluded = ["text", "fontFamily", "fontSize", "shape", "size", "height", "width", "disabled", "radius", "textColor", "backgroundColor", "borderColor", "hoverTextColor", "hoverBackgroundColor", "hoverBorderColor", "onClick"];
|
|
15
15
|
var Button = exports.Button = function Button(_ref) {
|
|
16
16
|
var text = _ref.text,
|
|
17
|
-
type = _ref.type,
|
|
18
17
|
fontFamily = _ref.fontFamily,
|
|
19
18
|
fontSize = _ref.fontSize,
|
|
20
19
|
shape = _ref.shape,
|
|
@@ -71,7 +70,6 @@ var Button = exports.Button = function Button(_ref) {
|
|
|
71
70
|
}, /*#__PURE__*/React.createElement(_styles.ThemeProvider, {
|
|
72
71
|
theme: theme
|
|
73
72
|
}, /*#__PURE__*/React.createElement(_Button.default, {
|
|
74
|
-
type: type,
|
|
75
73
|
sx: {
|
|
76
74
|
minHeight: height ? height : null,
|
|
77
75
|
maxHeight: height ? height : null,
|
|
@@ -18,7 +18,7 @@ var _PerformanceAnalyticsTotals = require("./PerformanceAnalyticsTotals");
|
|
|
18
18
|
var _PerformanceAnalyticsLegend = require("./PerformanceAnalyticsLegend");
|
|
19
19
|
var _CommonFunctions = require("./CommonFunctions");
|
|
20
20
|
var _PerformanceAnalytics = require("./PerformanceAnalytics.style");
|
|
21
|
-
var _excluded = ["totalsData", "data", "currencyType", "colorGraphROI", "colorBarchart1", "colorBarchart2", "textcolor", "width", "height", "lineChartHeight", "noDataText"];
|
|
21
|
+
var _excluded = ["totalsData", "data", "currencyType", "colorGraphROI", "colorBarchart1", "colorBarchart2", "textcolor", "width", "height", "dotCut", "lineChartHeight", "noDataText"];
|
|
22
22
|
var INDIVIDUAL_PERFORMANCE_STR = 'Individual Performance';
|
|
23
23
|
var PERCENT_INCREMENTAL_GROWTH_STR = '% Incremental Growth';
|
|
24
24
|
var PERCENT_CONTRIBUTION_OF_TOTAL_STR = '% Contribution of Total';
|
|
@@ -69,6 +69,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
|
|
|
69
69
|
textcolor = _ref$textcolor === void 0 ? '#212121' : _ref$textcolor,
|
|
70
70
|
width = _ref.width,
|
|
71
71
|
height = _ref.height,
|
|
72
|
+
dotCut = _ref.dotCut,
|
|
72
73
|
_ref$lineChartHeight = _ref.lineChartHeight,
|
|
73
74
|
lineChartHeight = _ref$lineChartHeight === void 0 ? 150 : _ref$lineChartHeight,
|
|
74
75
|
noDataText = _ref.noDataText,
|
|
@@ -196,7 +197,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
|
|
|
196
197
|
fontSize: "16px",
|
|
197
198
|
textAnchor: "middle",
|
|
198
199
|
dominantBaseline: "middle"
|
|
199
|
-
}, segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? currencyType ? "".concat((0, _CommonFunctions.getCurrencySign)(currencyType).toString()).concat(value) : '' : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "".concat(plusSign).concat(value, "%") : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "".concat(value, "%") : ''));
|
|
200
|
+
}, segmentedButtonsFilter === INDIVIDUAL_PERFORMANCE_STR ? currencyType ? "".concat((0, _CommonFunctions.getCurrencySign)(currencyType).toString(), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), "\n ").concat(dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : '', " ") : '' : segmentedButtonsFilter === PERCENT_INCREMENTAL_GROWTH_STR ? "".concat(plusSign).concat(value, "%") : segmentedButtonsFilter === PERCENT_CONTRIBUTION_OF_TOTAL_STR ? "".concat(value, "%") : ''));
|
|
200
201
|
};
|
|
201
202
|
function CustomizedTickBarChart(props) {
|
|
202
203
|
var x = props.x,
|
|
@@ -359,61 +360,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
|
|
|
359
360
|
textcolor: textcolor
|
|
360
361
|
}, (totalsData === null || totalsData === void 0 ? void 0 : totalsData.length) > 0 && (data === null || data === void 0 ? void 0 : data.length) > 0 ? /*#__PURE__*/_react.default.createElement(_PerformanceAnalytics.Controls, {
|
|
361
362
|
id: "Controls"
|
|
362
|
-
},
|
|
363
|
-
backgroundcolor: "#F2F2F2",
|
|
364
|
-
controlradius: 8,
|
|
365
|
-
defaultIndex: 1,
|
|
366
|
-
fontSize: 14,
|
|
367
|
-
height: 40,
|
|
368
|
-
name: "segmentedDollarsOrUnits",
|
|
369
|
-
onClick: function onClick() {},
|
|
370
|
-
options: [{
|
|
371
|
-
value: 'Dollars'
|
|
372
|
-
}, {
|
|
373
|
-
value: 'Units'
|
|
374
|
-
}],
|
|
375
|
-
segmentradius: 8,
|
|
376
|
-
selectedsegmentcolor: "#FFFFFF",
|
|
377
|
-
selectedtextcolor: "#212121",
|
|
378
|
-
unselectedtextcolor: "#212121",
|
|
379
|
-
width: 200
|
|
380
|
-
}), /*#__PURE__*/_react.default.createElement(_SegmentedButton.SegmentedButton, {
|
|
381
|
-
backgroundcolor: "#F2F2F2",
|
|
382
|
-
controlradius: 8,
|
|
383
|
-
defaultIndex: 1,
|
|
384
|
-
fontSize: 14,
|
|
385
|
-
height: 40,
|
|
386
|
-
name: "segmentedDollarsOrUnits",
|
|
387
|
-
onClick: function onClick() {},
|
|
388
|
-
options: [{
|
|
389
|
-
value: 'Baseline'
|
|
390
|
-
}, {
|
|
391
|
-
value: 'STLY'
|
|
392
|
-
}],
|
|
393
|
-
segmentradius: 8,
|
|
394
|
-
selectedsegmentcolor: "#FFFFFF",
|
|
395
|
-
selectedtextcolor: "#212121",
|
|
396
|
-
unselectedtextcolor: "#212121",
|
|
397
|
-
width: 200
|
|
398
|
-
}), /*#__PURE__*/_react.default.createElement(_SegmentedButton.SegmentedButton, {
|
|
399
|
-
backgroundcolor: "#F2F2F2",
|
|
400
|
-
controlradius: 8,
|
|
401
|
-
defaultIndex: 1,
|
|
402
|
-
fontSize: 14,
|
|
403
|
-
height: 40,
|
|
404
|
-
name: "segmentedDollarsOrUnits",
|
|
405
|
-
onClick: function onClick() {},
|
|
406
|
-
options: [{
|
|
407
|
-
value: 'Incremental Sales'
|
|
408
|
-
}, {
|
|
409
|
-
value: 'Actual Sales'
|
|
410
|
-
}],
|
|
411
|
-
segmentradius: 8,
|
|
412
|
-
selectedsegmentcolor: "#FFFFFF",
|
|
413
|
-
selectedtextcolor: "#212121",
|
|
414
|
-
unselectedtextcolor: "#212121",
|
|
415
|
-
width: 200
|
|
416
|
-
})), displayTotalsData(), displaySegmentedButtons(), displayLineChartROI(), displayBarChart(), displayLegendData()) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
|
|
363
|
+
}, displayTotalsData(), displaySegmentedButtons(), displayLineChartROI(), displayBarChart(), displayLegendData()) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
|
|
417
364
|
noDataText: noDataText
|
|
418
365
|
}));
|
|
419
366
|
};
|
|
@@ -4,10 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.TooltipValue = exports.TooltipTitle = exports.TooltipLabel = exports.TooltipContainer = exports.ToolTipLabelAndValueContainer = exports.
|
|
7
|
+
exports.TooltipValue = exports.TooltipTitle = exports.TooltipLabel = exports.TooltipContainer = exports.ToolTipLabelAndValueContainer = exports.SegmentedButtonContainer = exports.ControlsContainer = exports.Controls = 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, _templateObject8;
|
|
11
11
|
var scrollableStyles = "\n overflow-y: auto;\n\n &::-webkit-scrollbar {\n width: 8px;\n }\n\n &::-webkit-scrollbar-track {\n background: #E8E8E8;\n border-radius: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background: #D0D0D0;\n border-radius: 5px;\n }\n";
|
|
12
12
|
var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n\n > * {\n box-sizing: border-box;\n }\n"])), function (props) {
|
|
13
13
|
return props.rootFont;
|
|
@@ -19,10 +19,9 @@ var ControlsContainer = exports.ControlsContainer = _styledComponents.default.di
|
|
|
19
19
|
return props.height;
|
|
20
20
|
});
|
|
21
21
|
var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n padding: 14px 28px;\n background: white;\n ", "\n @media (max-width: 1536px) {\n padding: 12px 24px;\n } \n > #SegmentedButtonContainer {\n padding-left: 0;\n margin-bottom: 16px;\n > #Controls {\n background: #f2f2f2;\n }\n }\n"])), scrollableStyles);
|
|
22
|
-
var
|
|
23
|
-
var
|
|
24
|
-
var
|
|
25
|
-
var
|
|
26
|
-
var
|
|
27
|
-
var
|
|
28
|
-
var ToolTipLabelAndValueContainer = exports.ToolTipLabelAndValueContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n"])));
|
|
22
|
+
var SegmentedButtonContainer = exports.SegmentedButtonContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n padding: 10px 0 0 10px;\n"])));
|
|
23
|
+
var TooltipContainer = exports.TooltipContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n border-radius: 5px;\n background: #fff;\n font-family: \"Poppins\", sans-serif;\n border-radius: 5px;\n padding: 8px 12px;\n display: grid;\n"])));
|
|
24
|
+
var TooltipLabel = exports.TooltipLabel = _styledComponents.default.p(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: \"Poppins\", sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: normal;\n width: fit-content;\n margin: 0 6px 0 0;\n"])));
|
|
25
|
+
var TooltipValue = exports.TooltipValue = _styledComponents.default.p(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n color: #212121;\n font-family: \"Poppins\", sans-serif;\n font-size: 14px;\n font-style: normal;\n font-weight: 600;\n line-height: normal;\n width: fit-content;\n margin: 0;\n"])));
|
|
26
|
+
var TooltipTitle = exports.TooltipTitle = _styledComponents.default.p(_templateObject7 || (_templateObject7 = (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 margin: 0;\n"])));
|
|
27
|
+
var ToolTipLabelAndValueContainer = exports.ToolTipLabelAndValueContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n"])));
|
|
@@ -70,7 +70,7 @@ var TotalDoughnutChart = exports.TotalDoughnutChart = function TotalDoughnutChar
|
|
|
70
70
|
width: width
|
|
71
71
|
}, /*#__PURE__*/_react.default.createElement(_TotalDoughnutChart.CurrencySign, {
|
|
72
72
|
id: "CurrencySign"
|
|
73
|
-
}, currencySign ? (0, _CommonFunctions.getCurrencySign)(currencyType, value) : ''), dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(value) : ''), addingBenchmark && /*#__PURE__*/_react.default.createElement(_Benchmark.Benchmark, null))), /*#__PURE__*/_react.default.createElement(_TotalDoughnutChart.DoughnutChartAndLegendContainer, {
|
|
73
|
+
}, currencySign ? (0, _CommonFunctions.getCurrencySign)(currencyType, value) : ''), dotCut ? (0, _CommonFunctions.getFormattedValue)(value) : (0, _CommonFunctions.getNumberWithCommas)(value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(value).toFixed(2) : ''), addingBenchmark && /*#__PURE__*/_react.default.createElement(_Benchmark.Benchmark, null))), /*#__PURE__*/_react.default.createElement(_TotalDoughnutChart.DoughnutChartAndLegendContainer, {
|
|
74
74
|
id: "DoughnutChartAndLegendContainer"
|
|
75
75
|
}, /*#__PURE__*/_react.default.createElement(_TotalDoughnutChart.DoughnutChart, {
|
|
76
76
|
id: "DoughnutChart",
|
|
@@ -122,7 +122,7 @@ var TotalDoughnutChart = exports.TotalDoughnutChart = function TotalDoughnutChar
|
|
|
122
122
|
};
|
|
123
123
|
var _default = exports.default = TotalDoughnutChart;
|
|
124
124
|
TotalDoughnutChart.defaultProps = {
|
|
125
|
-
title: '
|
|
125
|
+
title: '',
|
|
126
126
|
value: 0,
|
|
127
127
|
addingBenchmark: false,
|
|
128
128
|
dotCut: false,
|
|
@@ -9,7 +9,7 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
|
|
|
9
9
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
10
|
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18;
|
|
11
11
|
var scrollableStyles = "\n overflow-y: auto;\n\n &::-webkit-scrollbar {\n width: 8px;\n }\n\n &::-webkit-scrollbar-track {\n background: #E8E8E8;\n border-radius: 5px;\n }\n\n &::-webkit-scrollbar-thumb {\n background: #D0D0D0;\n border-radius: 5px;\n }\n";
|
|
12
|
-
var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n @media (max-width: 1536px) {\n
|
|
12
|
+
var ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\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-self: center;\n @media (max-width: 1536px) {\n ", "\n }\n\n > * {\n box-sizing: border-box;\n }\n"])), function (props) {
|
|
13
13
|
return props.rootFont;
|
|
14
14
|
}, function (props) {
|
|
15
15
|
return props.textColor;
|
|
@@ -26,9 +26,9 @@ var Title = exports.Title = _styledComponents.default.h4(_templateObject6 || (_t
|
|
|
26
26
|
var CurrencySignAndFormattedValueContainer = exports.CurrencySignAndFormattedValueContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n gap: 16px;\n"])));
|
|
27
27
|
var CurrencySign = exports.CurrencySign = _styledComponents.default.span(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 16px;\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n @media (max-width: 1366px) {\n font-size: 11px;\n }\n"])));
|
|
28
28
|
var FormattedValue = exports.FormattedValue = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 40px;\n @media (max-width: 1536px) {\n font-size: 24px;\n } \n @media (max-width: 1366px) {\n font-size: 20px;\n }\n"])));
|
|
29
|
-
var DoughnutChartAndLegendContainer = exports.DoughnutChartAndLegendContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex
|
|
30
|
-
var DoughnutChart = exports.DoughnutChart = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n min-width:
|
|
31
|
-
var LegendContainer = exports.LegendContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
29
|
+
var DoughnutChartAndLegendContainer = exports.DoughnutChartAndLegendContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: space-between;\n margin-top: auto;\n padding: 0 20px;\n"])));
|
|
30
|
+
var DoughnutChart = exports.DoughnutChart = _styledComponents.default.div(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n min-width: 45%;\n flex-basis: 45%;\n min-height: 6rem;\n"])));
|
|
31
|
+
var LegendContainer = exports.LegendContainer = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n padding-left: 10px;\n display: flex;\n flex-direction: column;\n justify-content: space-evenly;\n"])));
|
|
32
32
|
var LegendControlsContainer = exports.LegendControlsContainer = _styledComponents.default.div(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n gap: 0.5rem;\n align-items: center;\n margin-bottom: 0.375rem;\n"])));
|
|
33
33
|
var LegendTitleAndFormatedValueContainer = exports.LegendTitleAndFormatedValueContainer = _styledComponents.default.div(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteral2.default)(["\n flex-grow: 1;\n"])));
|
|
34
34
|
var LegendFormatedValueContainer = exports.LegendFormatedValueContainer = _styledComponents.default.div(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteral2.default)(["\n font-size: .875rem;\n"])));
|
package/package.json
CHANGED
|
@@ -1,40 +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-mysql");
|
|
11
|
-
require("ace-builds/src-noconflict/theme-monokai");
|
|
12
|
-
require("ace-builds/src-noconflict/ext-language_tools");
|
|
13
|
-
require("ace-builds/src-noconflict/snippets/mysql");
|
|
14
|
-
// CodeEditor.js
|
|
15
|
-
|
|
16
|
-
var CodeEditor = function CodeEditor(_ref) {
|
|
17
|
-
var value = _ref.value,
|
|
18
|
-
onChange = _ref.onChange;
|
|
19
|
-
return /*#__PURE__*/_react.default.createElement(_reactAce.default, {
|
|
20
|
-
style: {
|
|
21
|
-
height: "200px"
|
|
22
|
-
},
|
|
23
|
-
mode: "mysql",
|
|
24
|
-
theme: "monokai",
|
|
25
|
-
value: value,
|
|
26
|
-
onChange: onChange,
|
|
27
|
-
name: "code-editor",
|
|
28
|
-
editorProps: {
|
|
29
|
-
$blockScrolling: true
|
|
30
|
-
},
|
|
31
|
-
setOptions: {
|
|
32
|
-
enableBasicAutocompletion: true,
|
|
33
|
-
enableLiveAutocompletion: true,
|
|
34
|
-
enableSnippets: true,
|
|
35
|
-
showLineNumbers: true,
|
|
36
|
-
tabSize: 1
|
|
37
|
-
}
|
|
38
|
-
});
|
|
39
|
-
};
|
|
40
|
-
var _default = exports.default = CodeEditor;
|
|
@@ -1,12 +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 = exports.AceEditorContent = (0, _styledComponents.default)(_reactAce.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 400px;\n"])));
|
|
@@ -1,19 +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 = exports.default = Modal;
|
|
@@ -1,17 +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.SubmitButton = 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, _templateObject5;
|
|
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 = exports.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
|
-
var ModalContent = exports.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);
|
|
16
|
-
var CloseButton = exports.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"])));
|
|
17
|
-
var SubmitButton = exports.SubmitButton = _styledComponents.default.input(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 10px;\n margin-right: 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"])));
|
|
@@ -1,143 +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 _Dropdown = _interopRequireDefault(require("./Dropdown"));
|
|
15
|
-
var _reactHookForm = require("react-hook-form");
|
|
16
|
-
var _Modal2 = require("./Modal.style");
|
|
17
|
-
var TotalCostModal = function TotalCostModal(_ref) {
|
|
18
|
-
var title = _ref.title,
|
|
19
|
-
isModalOpen = _ref.isModalOpen,
|
|
20
|
-
setModalOpen = _ref.setModalOpen,
|
|
21
|
-
setResult = _ref.setResult;
|
|
22
|
-
var _useState = (0, _react.useState)([{
|
|
23
|
-
id: "title",
|
|
24
|
-
label: "Title",
|
|
25
|
-
type: "text"
|
|
26
|
-
}, {
|
|
27
|
-
id: "dotCut",
|
|
28
|
-
label: "Do Cut",
|
|
29
|
-
type: "select",
|
|
30
|
-
options: ["true", "false"]
|
|
31
|
-
}, {
|
|
32
|
-
id: "currency",
|
|
33
|
-
label: "Currency",
|
|
34
|
-
type: "select",
|
|
35
|
-
options: ["true", "false"]
|
|
36
|
-
}, {
|
|
37
|
-
id: "currencyType",
|
|
38
|
-
label: "Currency Type",
|
|
39
|
-
type: "select",
|
|
40
|
-
options: ["USD", "EUR", "ILS", "GBP", "JPY"]
|
|
41
|
-
}, {
|
|
42
|
-
id: "width",
|
|
43
|
-
label: "Width",
|
|
44
|
-
type: "text"
|
|
45
|
-
}, {
|
|
46
|
-
id: "height",
|
|
47
|
-
label: "Height",
|
|
48
|
-
type: "text"
|
|
49
|
-
}, {
|
|
50
|
-
id: "textColor",
|
|
51
|
-
label: "Text Color",
|
|
52
|
-
type: "text"
|
|
53
|
-
}, {
|
|
54
|
-
id: "noDataText",
|
|
55
|
-
label: "No Data Text",
|
|
56
|
-
type: "text"
|
|
57
|
-
}]),
|
|
58
|
-
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
59
|
-
params = _useState2[0],
|
|
60
|
-
setParams = _useState2[1];
|
|
61
|
-
var _useState3 = (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"),
|
|
62
|
-
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
63
|
-
code = _useState4[0],
|
|
64
|
-
setCode = _useState4[1];
|
|
65
|
-
var _useForm = (0, _reactHookForm.useForm)(),
|
|
66
|
-
register = _useForm.register,
|
|
67
|
-
handleSubmit = _useForm.handleSubmit,
|
|
68
|
-
watch = _useForm.watch,
|
|
69
|
-
control = _useForm.control,
|
|
70
|
-
errors = _useForm.formState.errors;
|
|
71
|
-
var onSubmit = function onSubmit(data) {
|
|
72
|
-
return setResult(data);
|
|
73
|
-
};
|
|
74
|
-
return /*#__PURE__*/_react.default.createElement("form", {
|
|
75
|
-
onSubmit: handleSubmit(onSubmit)
|
|
76
|
-
}, /*#__PURE__*/_react.default.createElement(_Modal.default, {
|
|
77
|
-
isOpen: isModalOpen,
|
|
78
|
-
onClose: function onClose() {
|
|
79
|
-
return setModalOpen(false);
|
|
80
|
-
}
|
|
81
|
-
}, /*#__PURE__*/_react.default.createElement("h2", null, title), /*#__PURE__*/_react.default.createElement("div", {
|
|
82
|
-
style: {
|
|
83
|
-
gap: "10px",
|
|
84
|
-
display: "grid"
|
|
85
|
-
}
|
|
86
|
-
}, /*#__PURE__*/_react.default.createElement(_CodeEditor.default, {
|
|
87
|
-
value: code,
|
|
88
|
-
onChange: setCode
|
|
89
|
-
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
90
|
-
style: {
|
|
91
|
-
gap: "10px",
|
|
92
|
-
display: "grid",
|
|
93
|
-
gridTemplateColumns: "auto auto auto"
|
|
94
|
-
}
|
|
95
|
-
}, params.map(function (item) {
|
|
96
|
-
if (item.type === "text") {
|
|
97
|
-
return /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
|
|
98
|
-
control: control,
|
|
99
|
-
name: item.id,
|
|
100
|
-
render: function render(_ref2) {
|
|
101
|
-
var field = _ref2.field;
|
|
102
|
-
return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
|
|
103
|
-
allowedInput: "all",
|
|
104
|
-
height: "100%",
|
|
105
|
-
label: item.label,
|
|
106
|
-
multiline: true,
|
|
107
|
-
placeHolder: "Type...",
|
|
108
|
-
shape: "round",
|
|
109
|
-
size: "small",
|
|
110
|
-
width: "300px"
|
|
111
|
-
}));
|
|
112
|
-
}
|
|
113
|
-
});
|
|
114
|
-
} else {
|
|
115
|
-
return /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
|
|
116
|
-
control: control,
|
|
117
|
-
name: item.id,
|
|
118
|
-
render: function render(_ref3) {
|
|
119
|
-
var field = _ref3.field;
|
|
120
|
-
return /*#__PURE__*/_react.default.createElement(_Dropdown.default, Object.assign({}, field, {
|
|
121
|
-
allowedInput: "all",
|
|
122
|
-
labelColor: "#1B30AA",
|
|
123
|
-
limitTagsOnMultiSelect: 0,
|
|
124
|
-
onInputChange: function onInputChange(e) {
|
|
125
|
-
var _e$inputValue;
|
|
126
|
-
console.log("e", e);
|
|
127
|
-
field.onChange((_e$inputValue = e === null || e === void 0 ? void 0 : e.inputValue) !== null && _e$inputValue !== void 0 ? _e$inputValue : "");
|
|
128
|
-
},
|
|
129
|
-
options: item.options,
|
|
130
|
-
placeHolder: "Type...",
|
|
131
|
-
shape: "round",
|
|
132
|
-
size: "small",
|
|
133
|
-
text: item.label,
|
|
134
|
-
width: "300px"
|
|
135
|
-
}));
|
|
136
|
-
}
|
|
137
|
-
});
|
|
138
|
-
}
|
|
139
|
-
}))), /*#__PURE__*/_react.default.createElement(_Modal2.SubmitButton, {
|
|
140
|
-
type: "submit"
|
|
141
|
-
})));
|
|
142
|
-
};
|
|
143
|
-
var _default = exports.default = TotalCostModal;
|