sag_components 1.0.265 → 1.0.266
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/package_20231025154948.json +82 -0
- package/dist/stories/components/CollapseData.style.js +3 -3
- package/dist/stories/components/OneColumnContainer.js +1 -1
- package/dist/stories/components/OneColumnContainer.style.js +1 -1
- package/dist/stories/components/PerformanceAnalytics.js +3 -6
- package/dist/stories/components/PerformanceAnalytics.style.js +4 -4
- package/package.json +1 -1
|
@@ -0,0 +1,82 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "sag_components",
|
|
3
|
+
"version": "1.0.266",
|
|
4
|
+
"description": "",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"scripts": {
|
|
7
|
+
"start": "react-scripts start",
|
|
8
|
+
"lint": "eslint .",
|
|
9
|
+
"build": "cross-env BABEL_ENV=production babel src -d dist ",
|
|
10
|
+
"storybook": "storybook dev -p 6006",
|
|
11
|
+
"build-storybook": "storybook build"
|
|
12
|
+
},
|
|
13
|
+
"keywords": [],
|
|
14
|
+
"author": "SAG",
|
|
15
|
+
"license": "ISC",
|
|
16
|
+
"devDependencies": {
|
|
17
|
+
"@babel/cli": "^7.23.0",
|
|
18
|
+
"@babel/preset-env": "^7.23.2",
|
|
19
|
+
"@babel/preset-react": "^7.22.15",
|
|
20
|
+
"@babel/preset-typescript": "^7.23.2",
|
|
21
|
+
"@storybook/addon-a11y": "^7.4.6",
|
|
22
|
+
"@storybook/addon-essentials": "^7.4.6",
|
|
23
|
+
"@storybook/addon-interactions": "^7.4.6",
|
|
24
|
+
"@storybook/addon-links": "^7.4.6",
|
|
25
|
+
"@storybook/addon-storysource": "^7.4.6",
|
|
26
|
+
"@storybook/blocks": "^7.4.6",
|
|
27
|
+
"@storybook/preset-scss": "^1.0.3",
|
|
28
|
+
"@storybook/react": "^7.4.6",
|
|
29
|
+
"@storybook/react-webpack5": "^7.4.6",
|
|
30
|
+
"@storybook/testing-library": "^0.2.2",
|
|
31
|
+
"cross-env": "^7.0.3",
|
|
32
|
+
"css-loader": "^5.2.7",
|
|
33
|
+
"eslint": "^8.50.0",
|
|
34
|
+
"eslint-config-airbnb": "^19.0.4",
|
|
35
|
+
"eslint-plugin-import": "^2.28.1",
|
|
36
|
+
"eslint-plugin-jsx-a11y": "^6.7.1",
|
|
37
|
+
"eslint-plugin-react": "^7.33.2",
|
|
38
|
+
"eslint-plugin-react-hooks": "^4.6.0",
|
|
39
|
+
"react-dom": "^18.2.0",
|
|
40
|
+
"sass": "^1.68.0",
|
|
41
|
+
"sass-loader": "^13.3.2",
|
|
42
|
+
"style-loader": "^3.3.3"
|
|
43
|
+
},
|
|
44
|
+
"dependencies": {
|
|
45
|
+
"@dnd-kit/core": "^6.0.8",
|
|
46
|
+
"@emotion/react": "^11.11.1",
|
|
47
|
+
"@emotion/styled": "^11.11.0",
|
|
48
|
+
"@fontsource/roboto": "^5.0.8",
|
|
49
|
+
"@fortawesome/fontawesome-svg-core": "^6.4.2",
|
|
50
|
+
"@fortawesome/free-solid-svg-icons": "^6.4.2",
|
|
51
|
+
"@fortawesome/react-fontawesome": "^0.2.0",
|
|
52
|
+
"@mui/icons-material": "^5.14.13",
|
|
53
|
+
"@mui/material": "^5.14.13",
|
|
54
|
+
"@mui/styled-engine-sc": "^5.14.12",
|
|
55
|
+
"@mui/x-date-pickers": "^6.16.2",
|
|
56
|
+
"@storybook/addon-designs": "^7.0.5",
|
|
57
|
+
"babel-plugin-react-css-modules": "^5.2.6",
|
|
58
|
+
"classnames": "^2.3.2",
|
|
59
|
+
"dayjs": "^1.11.10",
|
|
60
|
+
"hoopy": "^0.1.4",
|
|
61
|
+
"prop-types": "^15.8.1",
|
|
62
|
+
"react": "^18.2.0",
|
|
63
|
+
"react-css-modules": "^4.7.11",
|
|
64
|
+
"react-loading-skeleton": "^3.3.1",
|
|
65
|
+
"react-scripts": "5.0.1",
|
|
66
|
+
"recharts": "^2.6.2",
|
|
67
|
+
"storybook": "^7.4.6",
|
|
68
|
+
"styled-components": "^5.3.11"
|
|
69
|
+
},
|
|
70
|
+
"browserslist": {
|
|
71
|
+
"production": [
|
|
72
|
+
">0.2%",
|
|
73
|
+
"not dead",
|
|
74
|
+
"not op_mini all"
|
|
75
|
+
],
|
|
76
|
+
"development": [
|
|
77
|
+
"last 1 chrome version",
|
|
78
|
+
"last 1 firefox version",
|
|
79
|
+
"last 1 safari version"
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
}
|
|
@@ -8,7 +8,7 @@ exports.TitleDiv = exports.TitleAccordion = exports.Th = exports.Td = exports.Ta
|
|
|
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;
|
|
11
|
-
var AccordionWrapper = exports.AccordionWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n
|
|
11
|
+
var AccordionWrapper = exports.AccordionWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n padding: 0 20px;\n"])), function (props) {
|
|
12
12
|
return props.width;
|
|
13
13
|
}, function (props) {
|
|
14
14
|
return props.height;
|
|
@@ -16,7 +16,7 @@ var AccordionWrapper = exports.AccordionWrapper = _styledComponents.default.div(
|
|
|
16
16
|
var TitleAccordion = exports.TitleAccordion = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n display: inline-block;\n align-items: center;\n background-color: ", ";\n margin-bottom: 16px;\n"])), function (props) {
|
|
17
17
|
return props.isOpen ? '#D0D0D0' : 'white';
|
|
18
18
|
});
|
|
19
|
-
var IconAndTitle = exports.IconAndTitle = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: auto;\n font-family: \"poppins\";\n font-weight: 400;\n font-size: 16px;\n line-height: 24px;\n display: flex;\n float: left;\n align-items: center;\n & > svg {\n margin-right: 15px;\n }\n"])));
|
|
19
|
+
var IconAndTitle = exports.IconAndTitle = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n width: auto;\n font-family: \"poppins\";\n font-weight: 400;\n font-size: 16px;\n line-height: 24px;\n display: flex;\n float: left;\n align-items: center;\n @media (max-width: 1536px) {\n font-size: 12px;\n }\n & > svg {\n margin-right: 15px;\n }\n"])));
|
|
20
20
|
var ArrowAndNumber = exports.ArrowAndNumber = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n float: right;\n font-family: \"poppins\";\n font-weight: 600;\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 23%;\n margin-right: 20px;\n"])));
|
|
21
21
|
var IconDiv = exports.IconDiv = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: flex-end;\n width: 25%;\n"])));
|
|
22
22
|
var TitleDiv = exports.TitleDiv = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n width: 70%;\n text-align: left;\n padding-left: 3px;\n"])));
|
|
@@ -24,4 +24,4 @@ var TableWrapper = exports.TableWrapper = _styledComponents.default.div(_templat
|
|
|
24
24
|
var Table = exports.Table = _styledComponents.default.table(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n border-collapse: collapse;\n width: 100%;\n table-layout: fixed;\n"])));
|
|
25
25
|
var Th = exports.Th = _styledComponents.default.th(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n background-color: white;\n font-family: \"poppins\";\n font-weight: 600;\n font-size: 12px;\n border: 1px solid #ccc;\n padding: 10px;\n text-align: center;\n line-height: 18px;\n border-top: none;\n border-left: none;\n &:last-of-type {\n border-right: none;\n }\n"])));
|
|
26
26
|
var Td = exports.Td = _styledComponents.default.td(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n border: 1px solid #ccc;\n padding: 10px;\n text-align: center;\n line-height: 21px;\n font-size: 14px;\n font-family: \"poppins\";\n font-weight: 400;\n border-bottom: none;\n border-left: none;\n &:last-of-type {\n border-right: none;\n }\n"])));
|
|
27
|
-
var ComponentHeader = exports.ComponentHeader = _styledComponents.default.h3(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"poppins\";\n font-weight: 500;\n font-size: 18px;\n line-height: 27px;\n"])));
|
|
27
|
+
var ComponentHeader = exports.ComponentHeader = _styledComponents.default.h3(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"poppins\";\n font-weight: 500;\n font-size: 18px;\n line-height: 27px;\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n"])));
|
|
@@ -22,7 +22,7 @@ var _excluded = ["children", "display", "isLoading", "gridTemplateColumns", "nod
|
|
|
22
22
|
var OneColumnContainer = exports.OneColumnContainer = function OneColumnContainer(_ref) {
|
|
23
23
|
var children = _ref.children,
|
|
24
24
|
_ref$display = _ref.display,
|
|
25
|
-
display = _ref$display === void 0 ? '
|
|
25
|
+
display = _ref$display === void 0 ? 'block' : _ref$display,
|
|
26
26
|
isLoading = _ref.isLoading,
|
|
27
27
|
gridTemplateColumns = _ref.gridTemplateColumns,
|
|
28
28
|
nodeRef = _ref.nodeRef,
|
|
@@ -20,7 +20,7 @@ var InfoTextContainer = exports.InfoTextContainer = _styledComponents.default.di
|
|
|
20
20
|
});
|
|
21
21
|
var InfoTitleLabel = exports.InfoTitleLabel = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n color: black;\n margin: 0px 0px 10px 0px;\n font-size: 18px;\n line-height: 32px;\n /* overflow: scroll; */\n overflow: hidden;\n"])));
|
|
22
22
|
var InfoTextLabel = exports.InfoTextLabel = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n color: black;\n font-size: 14px;\n line-height: 20px;\n font-weight: 400;\n\n /* overflow: scroll; */\n overflow: hidden;\n"])));
|
|
23
|
-
var IconContainer = exports.IconContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 20px;\n height: 20px;\n
|
|
23
|
+
var IconContainer = exports.IconContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 20px;\n height: 20px;\n float: right;\n padding: 10px;\n"])));
|
|
24
24
|
var LoadingDiv = exports.LoadingDiv = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n margin-top: 20px;\n display: flex;\n flex-direction: column;\n justify-content: space-evenly;\n align-items: center;\n width: 76%;\n height: 65%;\n"])));
|
|
25
25
|
var mainDiv = exports.mainDiv = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n align-items: \"flex-start\";\n justify-content: \"center\";\n width: ", ";\n height: ", ";\n display: ", ";\n grid-template-columns: ", ";\n"])), function (props) {
|
|
26
26
|
return props.width;
|
|
@@ -161,9 +161,8 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
|
|
|
161
161
|
var displayLineChartROI = function displayLineChartROI() {
|
|
162
162
|
return /*#__PURE__*/_react.default.createElement(_recharts.ResponsiveContainer, {
|
|
163
163
|
id: "ResponsiveContainer",
|
|
164
|
-
height: 150
|
|
165
|
-
|
|
166
|
-
}, segmentedButtonsFilter != PERCENT_CONTRIBUTION_OF_TOTAL_STR ? /*#__PURE__*/_react.default.createElement(_recharts.LineChart, {
|
|
164
|
+
height: 150
|
|
165
|
+
}, segmentedButtonsFilter !== PERCENT_CONTRIBUTION_OF_TOTAL_STR ? /*#__PURE__*/_react.default.createElement(_recharts.LineChart, {
|
|
167
166
|
data: data,
|
|
168
167
|
margin: {
|
|
169
168
|
top: 20,
|
|
@@ -361,9 +360,7 @@ var PerformanceAnalytics = exports.PerformanceAnalytics = function PerformanceAn
|
|
|
361
360
|
width: width,
|
|
362
361
|
textColor: textColor
|
|
363
362
|
}, (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, {
|
|
364
|
-
id: "Controls"
|
|
365
|
-
height: height,
|
|
366
|
-
width: width
|
|
363
|
+
id: "Controls"
|
|
367
364
|
}, displayTotalsData(), displaySegmentedButtons(), displayLineChartROI(), displayBarChart(), displayLegendData()) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
|
|
368
365
|
noDataText: noDataText
|
|
369
366
|
}));
|
|
@@ -17,11 +17,11 @@ var ControlsContainer = exports.ControlsContainer = _styledComponents.default.di
|
|
|
17
17
|
}, function (props) {
|
|
18
18
|
return props.height;
|
|
19
19
|
});
|
|
20
|
-
var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
21
|
-
var TotalsDataContainer = exports.TotalsDataContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n
|
|
22
|
-
var SegmentedButtonContainer = exports.SegmentedButtonContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n
|
|
20
|
+
var Controls = exports.Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n height: 100%;\n padding: 24px 40px;\n background: white;\n @media (max-width: 1536px) {\n padding: 12px 32px;\n } \n"])));
|
|
21
|
+
var TotalsDataContainer = exports.TotalsDataContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n"])));
|
|
22
|
+
var SegmentedButtonContainer = exports.SegmentedButtonContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n padding: 10px 0 0 10px;\n"])));
|
|
23
23
|
var TooltipContainer = exports.TooltipContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (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
24
|
var TooltipLabel = exports.TooltipLabel = _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: 400;\n line-height: normal;\n width: fit-content;\n margin: 0 6px 0 0;\n"])));
|
|
25
25
|
var TooltipValue = exports.TooltipValue = _styledComponents.default.p(_templateObject7 || (_templateObject7 = (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
26
|
var TooltipTitle = exports.TooltipTitle = _styledComponents.default.p(_templateObject8 || (_templateObject8 = (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(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n
|
|
27
|
+
var ToolTipLabelAndValueContainer = exports.ToolTipLabelAndValueContainer = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n"])));
|