sag_components 1.0.813 → 1.0.816

package/dist/stories/components/ReportTable.js

@@ -11,7 +11,6 @@ var _ArrowSelectIcon = _interopRequireDefault(require("./icons/ArrowSelectIcon")
 var _Duplicate = _interopRequireDefault(require("./icons/Duplicate"));
 var _CheckBoxCheckedIcon = require("./icons/CheckBoxCheckedIcon");
 var _CheckBoxNotCheckedIcon = require("./icons/CheckBoxNotCheckedIcon");
-var _LinkButton = _interopRequireDefault(require("./LinkButton"));
 var _ReportTable = require("./ReportTable.style");
 var _InfoIcon = require("./icons/InfoIcon");
 /* eslint-disable import/no-unresolved */
@@ -46,10 +45,10 @@ const ReportTable = props => {
     };
 
     // column heading - checkbox
-    if (useCheckBoxes && !((_newTableData$columns = newTableData.columnsHeadings) !== null && _newTableData$columns !== void 0 && _newTableData$columns.some(item => item.label === "checkbox" && item.key === "checkbox"))) {
+    if (useCheckBoxes && !((_newTableData$columns = newTableData.columnsHeadings) !== null && _newTableData$columns !== void 0 && _newTableData$columns.some(item => item.label === 'checkbox' && item.key === 'checkbox'))) {
       newTableData.columnsHeadings.push({
-        label: "checkbox",
-        key: "checkbox"
+        label: 'checkbox',
+        key: 'checkbox'
       });
     }
 
@@ -59,21 +58,21 @@ const ReportTable = props => {
     });
 
     // column heading - select button
-    if (useSelectButtons && !((_newTableData$columns2 = newTableData.columnsHeadings) !== null && _newTableData$columns2 !== void 0 && _newTableData$columns2.some(item => item.label === "button" && item.key === "button"))) {
+    if (useSelectButtons && !((_newTableData$columns2 = newTableData.columnsHeadings) !== null && _newTableData$columns2 !== void 0 && _newTableData$columns2.some(item => item.label === 'button' && item.key === 'button'))) {
       newTableData.columnsHeadings.push({
-        label: "button",
-        key: "button"
+        label: 'button',
+        key: 'button'
       });
     }
 
     // rowsValues
     const newRowValues = (_tableData$rowsValues = tableData.rowsValues) === null || _tableData$rowsValues === void 0 ? void 0 : _tableData$rowsValues.map(item => useCheckBoxes ? {
-      checkbox: "checkbox",
+      checkbox: 'checkbox',
       ...item
     } : item);
     const newRowValuesStep2 = newRowValues === null || newRowValues === void 0 ? void 0 : newRowValues.map(item => useSelectButtons ? {
       ...item,
-      button: "button"
+      button: 'button'
     } : item);
     const newRowValuesStep3 = newRowValuesStep2 === null || newRowValuesStep2 === void 0 ? void 0 : newRowValuesStep2.map(item => useCheckBoxes ? {
       ...item,
@@ -140,14 +139,20 @@ const ReportTable = props => {
     } = rest;
     onCheckRowClick(rest2);
   };
-  const displaySelectButton = rowData => /*#__PURE__*/_react.default.createElement(_LinkButton.default, {
-    disabled: disableSelectButtons,
-    onClick: e => handleSelectButtonRowClick(rowData),
-    rightIcon: buttonIconName,
-    size: "medium",
-    text: buttonText || "Select",
-    textColor: selectTextColor
-  });
+  const displaySelectButton = rowData => /*#__PURE__*/_react.default.createElement(_ReportTable.SelectButtonContainer, {
+    className: "SelectButtonContainer"
+  }, /*#__PURE__*/_react.default.createElement(_ReportTable.SelectButtonSubContainer, {
+    className: "SelectButtonSubContainer",
+    selectTextColor: disableSelectButtons ? '#B1B1B1' : selectTextColor,
+    backgroundColor: disableSelectButtons ? '#E3E4E5' : '#ffffff',
+    cursor: disableSelectButtons ? 'default' : 'pointer',
+    onClick: () => disableSelectButtons ? null : handleSelectButtonRowClick(rowData)
+  }, buttonText || 'Select', ' ', buttonIconName === 'duplicate' ? /*#__PURE__*/_react.default.createElement(_Duplicate.default, {
+    color: disableSelectButtons ? '#B1B1B1' : selectTextColor
+  }) : /*#__PURE__*/_react.default.createElement(_ArrowSelectIcon.default, {
+    className: "ArrowSelectIcon",
+    color: disableSelectButtons ? '#B1B1B1' : selectTextColor
+  })));
   const displayCheckBox = (rowData, isHeader) => /*#__PURE__*/_react.default.createElement(_ReportTable.SelectCheckboxContainer, {
     className: "SelectCheckboxContainer"
   }, /*#__PURE__*/_react.default.createElement(_ReportTable.SelectCheckboxSubContainer, {
@@ -184,13 +189,13 @@ const ReportTable = props => {
     className: "headerRow"
   }, FormattedTableData.columnsHeadings.map((headline, index) => {
     // eslint-disable-next-line react/no-array-index-key
-    if (headline.label === "checkbox") {
+    if (headline.label === 'checkbox') {
       return /*#__PURE__*/_react.default.createElement(_ReportTable.Th, {
         key: index
       }, displayCheckBox(headline, true));
     }
     // eslint-disable-next-line react/no-array-index-key
-    if (headline.label === "button") {
+    if (headline.label === 'button') {
       return /*#__PURE__*/_react.default.createElement(_ReportTable.Th, {
         key: index
       });
@@ -208,13 +213,13 @@ const ReportTable = props => {
     useColorLinearGradient: useColorLinearGradient
   }, Object.values(rowData).map((value, dataIndex) =>
   // eslint-disable-next-line no-nested-ternary
-  value === "checkbox" ?
+  value === 'checkbox' ?
   /*#__PURE__*/
   // eslint-disable-next-line react/no-array-index-key
   _react.default.createElement(_ReportTable.Td, {
     className: "checkbox",
     key: index
-  }, displayCheckBox(rowData, false)) : value === "button" ?
+  }, displayCheckBox(rowData, false)) : value === 'button' ?
   /*#__PURE__*/
   // eslint-disable-next-line react/no-array-index-key
   _react.default.createElement(_ReportTable.Td, {
@@ -228,47 +233,47 @@ const ReportTable = props => {
     key: dataIndex
   }, value))))))), !disableInfo ? /*#__PURE__*/_react.default.createElement(_ReportTable.InfoBlock, null, /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, {
     color: "#1B30AA"
-  }), /*#__PURE__*/_react.default.createElement(_ReportTable.InfoText, null, "Download table to get the full data")) : "");
+  }), /*#__PURE__*/_react.default.createElement(_ReportTable.InfoText, null, "Download table to get the full data")) : '');
 };
 exports.ReportTable = ReportTable;
 var _default = exports.default = ReportTable;
 ReportTable.defaultProps = {
-  buttonText: "Select",
-  buttonIconName: "select",
+  buttonText: 'Select',
+  buttonIconName: 'duplicate',
   tableData: {
     columnsHeadings: [{
-      label: "Event Name",
-      key: "eventName"
+      label: 'Event Name',
+      key: 'eventName'
     }, {
-      label: "Retailer",
-      key: "retailer"
+      label: 'Retailer',
+      key: 'retailer'
     }, {
-      label: "Total Cost",
-      key: "totalCost"
+      label: 'Total Cost',
+      key: 'totalCost'
     }, {
-      label: "Inc. Baseline Sales",
-      key: "incBaselineSales"
+      label: 'Inc. Baseline Sales',
+      key: 'incBaselineSales'
     }],
     rowsValues: [{
-      retailer: "Large Selling Event P2 2023",
-      eventDescription: "Food",
-      totalCost: "Food Lion",
-      incBaselineSales: "50K"
+      retailer: 'Large Selling Event P2 2023',
+      eventDescription: 'Food',
+      totalCost: 'Food Lion',
+      incBaselineSales: '50K'
     }, {
-      retailer: "Large Selling Event P2 2023",
-      eventDescription: "Food",
-      totalCost: "$500K",
-      incBaselineSales: "50K"
+      retailer: 'Large Selling Event P2 2023',
+      eventDescription: 'Food',
+      totalCost: '$500K',
+      incBaselineSales: '50K'
     }, {
-      retailer: "Large Selling Event P2 2023",
-      eventDescription: "Food",
-      totalCost: "$500K",
-      incBaselineSales: "50K"
+      retailer: 'Large Selling Event P2 2023',
+      eventDescription: 'Food',
+      totalCost: '$500K',
+      incBaselineSales: '50K'
     }, {
-      retailer: "Large Selling Event P2 2023",
-      eventDescription: "Food",
-      totalCost: "$500K",
-      incBaselineSales: "50K"
+      retailer: 'Large Selling Event P2 2023',
+      eventDescription: 'Food',
+      totalCost: '$500K',
+      incBaselineSales: '50K'
     }]
   },
   maxColumnsNumber: 4,
@@ -276,7 +281,7 @@ ReportTable.defaultProps = {
   useSelectButtons: false,
   disableSelectButtons: false,
   disableInfo: false,
-  selectTextColor: "#229E38",
+  selectTextColor: '#229E38',
   onSelectRowClick: () => {},
   onCheckRowClick: () => {},
   onAllRowsCheckBoxClick: () => {},

package/dist/stories/components/TotalHorizontalCharts.js

@@ -188,6 +188,7 @@ const TotalHorizontalCharts = props => {
       pointerEvents: 'none'
     }
   })))))) : /*#__PURE__*/_react.default.createElement(_NoDataFoundMessage.NoDataFoundMessage, {
+    className: "TotalHorizontalCharts_NoDataFoundMessage",
     noDataText: noDataText
   }));
 };

package/dist/stories/components/TotalHorizontalCharts.style.js

@@ -9,7 +9,7 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
 const scrollableStyles = "\n  overflow-y: auto;\n\n  &::-webkit-scrollbar {\n    width: 5px;\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";
-const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  font-family: \"Poppins\", sans-serif;  \n  color: ", ";\n  width: ", ";\n  height: ", ";\n  background-color: white;\n  display: flex;\n  flex-direction: column;\n  .top {\n    text-align: center;\n    white-space: normal;\n    &:before {\n      display: none;\n    }\n  }\n"])), props => props.textColor, props => props.width, props => props.height);
+const ControlsContainer = exports.ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  font-family: \"Poppins\", sans-serif;  \n  color: ", ";\n  width: ", ";\n  height: ", ";\n  background-color: white;\n  display: flex;\n  flex-direction: column;\n  // justify-content: center;\n  .top {\n    text-align: center;\n    white-space: normal;\n    &:before {\n      display: none;\n    }\n  }\n"])), props => props.textColor, props => props.width, props => props.height);
 const ChartWrapper = exports.ChartWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  flex-grow: 1;\n  width: 100%;\n  ", "\n"])), scrollableStyles);
 const ChartInner = exports.ChartInner = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  min-height: 120%;\n  width: 90%;\n"])));
 const TitleAndValueContainer = exports.TitleAndValueContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: baseline;\n  justify-content: space-between;\n  padding: 16px;\n"])));