sag_components 1.0.370 → 1.0.372

package/.history/package_20231122100718.json

@@ -0,0 +1,77 @@
+{
+  "name": "sag_components",
+  "version": "1.0.338",
+  "description": "",
+  "main": "dist/index.js",
+  "scripts": {
+    "start": "react-scripts start",
+    "lint": "eslint .",
+    "build": "cross-env BABEL_ENV=production babel src -d dist  ",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "keywords": [],
+  "author": "SAG",
+  "license": "ISC",
+  "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@babel/cli": "^7.23.0",
+    "@babel/preset-env": "^7.23.2",
+    "@babel/preset-react": "^7.22.15",
+    "@babel/preset-typescript": "^7.23.2",
+    "babel-plugin-react-css-modules": "^5.2.6",
+    "babel-preset-react-app": "^10.0.1",
+    "@storybook/addon-designs": "^7.0.5",
+    "@storybook/addon-essentials": "^7.4.6",
+    "@storybook/addon-interactions": "^7.4.6",
+    "@storybook/addon-links": "^7.4.6",
+    "@storybook/addon-storysource": "^7.4.6",
+    "@storybook/addons": "^7.5.3",
+    "@storybook/blocks": "^7.4.6",
+    "@storybook/preset-scss": "^1.0.3",
+    "@storybook/react": "^7.4.6",
+    "@storybook/react-webpack5": "^7.4.6",
+    "@storybook/testing-library": "^0.2.2",
+    "@storybook/theming": "^7.5.3",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.8.1",
+    "eslint": "^8.53.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "react-dom": "^18.2.0",
+    "sass": "^1.69.5",
+    "sass-loader": "^13.3.2",
+    "style-loader": "^3.3.3"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
+    "@mui/icons-material": "^5.14.16",
+    "@mui/material": "^5.14.16",
+    "@mui/x-date-pickers": "^6.18.0",
+    "classnames": "^2.3.2",
+    "dayjs": "^1.11.10",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-css-modules": "^4.7.11",
+    "react-loading-skeleton": "^3.3.1",
+    "recharts": "^2.9.2",
+    "storybook": "^7.4.6",
+    "styled-components": "^5.3.1"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

package/.history/package_20231128125149.json

@@ -0,0 +1,82 @@
+{
+  "name": "sag_components",
+  "version": "1.0.346",
+  "description": "",
+  "main": "dist/index.js",
+  "scripts": {
+    "start": "react-scripts start",
+    "lint": "eslint .",
+    "build": "cross-env BABEL_ENV=production babel src -d dist  ",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "keywords": [],
+  "author": "SAG",
+  "license": "ISC",
+  "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@babel/cli": "^7.23.0",
+    "@babel/preset-env": "^7.23.2",
+    "@babel/preset-react": "^7.22.15",
+    "@babel/preset-typescript": "^7.23.2",
+    "babel-plugin-react-css-modules": "^5.2.6",
+    "babel-preset-react-app": "^10.0.1",
+    "@storybook/addon-designs": "^7.0.5",
+    "@storybook/addon-essentials": "^7.4.6",
+    "@storybook/addon-interactions": "^7.4.6",
+    "@storybook/addon-links": "^7.4.6",
+    "@storybook/addon-storysource": "^7.4.6",
+    "@storybook/addons": "^7.5.3",
+    "@storybook/blocks": "^7.4.6",
+    "@storybook/preset-scss": "^1.0.3",
+    "@storybook/react": "^7.4.6",
+    "@storybook/react-webpack5": "^7.4.6",
+    "@storybook/testing-library": "^0.2.2",
+    "@storybook/theming": "^7.5.3",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.8.1",
+    "eslint": "^8.53.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "react-dom": "^18.2.0",
+    "sass": "^1.69.5",
+    "sass-loader": "^13.3.2",
+    "style-loader": "^3.3.3"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
+    "@mui/icons-material": "^5.14.16",
+    "@mui/material": "^5.14.16",
+    "@mui/x-date-pickers": "^6.18.0",
+    "classnames": "^2.3.2",
+    "dayjs": "^1.11.10",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-css-modules": "^4.7.11",
+    "react-loading-skeleton": "^3.3.1",
+    "recharts": "^2.9.2",
+    "storybook": "^7.4.6",
+    "styled-components": "^5.3.1"
+  },
+  "bundler": {
+    "exportEntries": ["src/index.ts"],
+    "managerEntries": ["src/manager.ts"],
+    "previewEntries": ["src/preview.ts"]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

package/.history/package_20231128125208.json

@@ -0,0 +1,82 @@
+{
+  "name": "sag_components",
+  "version": "1.0.346",
+  "description": "",
+  "main": "dist/index.js",
+  "scripts": {
+    "start": "react-scripts start",
+    "lint": "eslint .",
+    "build": "cross-env BABEL_ENV=production babel src -d dist  ",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "keywords": [],
+  "author": "SAG",
+  "license": "ISC",
+  "devDependencies": {
+    "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
+    "@babel/cli": "^7.23.0",
+    "@babel/preset-env": "^7.23.2",
+    "@babel/preset-react": "^7.22.15",
+    "@babel/preset-typescript": "^7.23.2",
+    "babel-plugin-react-css-modules": "^5.2.6",
+    "babel-preset-react-app": "^10.0.1",
+    "@storybook/addon-designs": "^7.0.5",
+    "@storybook/addon-essentials": "^7.4.6",
+    "@storybook/addon-interactions": "^7.4.6",
+    "@storybook/addon-links": "^7.4.6",
+    "@storybook/addon-storysource": "^7.4.6",
+    "@storybook/addons": "^7.5.3",
+    "@storybook/blocks": "^7.4.6",
+    "@storybook/preset-scss": "^1.0.3",
+    "@storybook/react": "^7.4.6",
+    "@storybook/react-webpack5": "^7.4.6",
+    "@storybook/testing-library": "^0.2.2",
+    "@storybook/theming": "^7.5.3",
+    "cross-env": "^7.0.3",
+    "css-loader": "^6.8.1",
+    "eslint": "^8.53.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-plugin-import": "^2.29.0",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "react-dom": "^18.2.0",
+    "sass": "^1.69.5",
+    "sass-loader": "^13.3.2",
+    "style-loader": "^3.3.3"
+  },
+  "dependencies": {
+    "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
+    "@mui/icons-material": "^5.14.16",
+    "@mui/material": "^5.14.16",
+    "@mui/x-date-pickers": "^6.18.0",
+    "classnames": "^2.3.2",
+    "dayjs": "^1.11.10",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-css-modules": "^4.7.11",
+    "react-loading-skeleton": "^3.3.1",
+    "recharts": "^2.9.2",
+    "storybook": "^7.4.6",
+    "styled-components": "^5.3.1"
+  },
+  "bundler": {
+    "exportEntries": ["src/index.js"],
+    "managerEntries": ["src/manager.js"],
+    "previewEntries": ["src/preview.js"]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

package/dist/stories/components/Dropdown.js

@@ -33,7 +33,7 @@ var checkedIcon = /*#__PURE__*/_react.default.createElement(_CheckBox.default, {
  */
 var Dropdown = exports.Dropdown = function Dropdown(_ref) {
   var _ref$width = _ref.width,
-    width = _ref$width === void 0 ? "100%" : _ref$width,
+    width = _ref$width === void 0 ? '100%' : _ref$width,
     size = _ref.size,
     text = _ref.text,
     shape = _ref.shape,
@@ -46,24 +46,18 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
     onChange = _ref.onChange,
     onInputChange = _ref.onInputChange,
     _ref$labelColor = _ref.labelColor,
-    labelColor = _ref$labelColor === void 0 ? "#1B30AA" : _ref$labelColor,
+    labelColor = _ref$labelColor === void 0 ? '#1B30AA' : _ref$labelColor,
     required = _ref.required,
     inputRef = _ref.inputRef,
     defaultValue = _ref.defaultValue,
     _ref$allowedInput = _ref.allowedInput,
-    allowedInput = _ref$allowedInput === void 0 ? "all" : _ref$allowedInput,
+    allowedInput = _ref$allowedInput === void 0 ? 'all' : _ref$allowedInput,
     _ref$reset = _ref.reset,
     reset = _ref$reset === void 0 ? false : _ref$reset,
     _ref$disableClearable = _ref.disableClearable,
     disableClearable = _ref$disableClearable === void 0 ? false : _ref$disableClearable,
     _ref$disabled = _ref.disabled,
-    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
-    _ref$dropdownListfont = _ref.dropdownListfontSize,
-    dropdownListfontSize = _ref$dropdownListfont === void 0 ? "14px" : _ref$dropdownListfont,
-    _ref$inputLabelFontSi = _ref.inputLabelFontSize,
-    inputLabelFontSize = _ref$inputLabelFontSi === void 0 ? "16px" : _ref$inputLabelFontSi,
-    _ref$placeHolderFontS = _ref.placeHolderFontSize,
-    placeHolderFontSize = _ref$placeHolderFontS === void 0 ? "14px" : _ref$placeHolderFontS;
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled;
   /**
    *  SAG Dropdown
    */
@@ -95,114 +89,60 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
       MuiFormLabel: {
         styleOverrides: {
           asterisk: {
-            color: "#db3131"
+            color: '#db3131'
           }
         }
       }
     }
   });
 
-  // Single Text Style
-  var getTextFieldStyleSingle = function getTextFieldStyleSingle() {
-    if (shape === "round") {
+  // defines shape: squire or round
+  var getTextFieldStyle = function getTextFieldStyle() {
+    if (shape === 'round') {
       // round
       return {
-        "& .MuiOutlinedInput-root": {
-          borderRadius: "12px",
+        '& .MuiOutlinedInput-root': {
+          borderRadius: '12px',
           legend: {
-            marginLeft: "10px"
+            marginLeft: '10px'
           }
         },
-        "& .MuiAutocomplete-inputRoot": {
-          paddingLeft: "10px !important",
-          borderRadius: "12px",
+        '& .MuiAutocomplete-inputRoot': {
+          paddingLeft: '10px !important',
+          borderRadius: '12px',
           // This matches the specificity of the default styles at https://github.com/mui-org/material-ui/blob/v4.11.3/packages/material-ui-lab/src/Autocomplete/Autocomplete.js#L90
           '&[class*="MuiOutlinedInput-root"] .MuiAutocomplete-input:first-of-type': {
             // Default left padding is 6px
-            paddingLeft: "10px"
+            paddingLeft: '10px'
           },
-          "& .MuiOutlinedInput-notchedOutline": {
-            borderColor: "#E7E7E7"
+          '& .MuiOutlinedInput-notchedOutline': {
+            borderColor: '#E7E7E7'
           },
-          "&:hover .MuiOutlinedInput-notchedOutline": {
-            borderColor: disabled ? "#E7E7E7" : labelColor
+          '&:hover .MuiOutlinedInput-notchedOutline': {
+            borderColor: disabled ? '#E7E7E7' : labelColor
           },
-          "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
-            borderColor: disabled ? "#E7E7E7" : labelColor
+          '&.Mui-focused .MuiOutlinedInput-notchedOutline': {
+            borderColor: disabled ? '#E7E7E7' : labelColor
           }
         },
-        "& .MuiInputLabel-outlined:not(.MuiInputLabel-shrink)": {
+        '& .MuiInputLabel-outlined:not(.MuiInputLabel-shrink)': {
           // Default transform is "translate(14px, 20px) scale(1)""
           // This lines up the label with the initial cursor position in the input
           // after changing its padding-left.
-          transform: "translate(14px, 18px) scale(1);",
-          fontSize: "14px",
-          color: disabled ? "#E7E7E7" : currentInputValue && currentInputValue.length > 0 ? "#212121" : "#757575"
+          transform: 'translate(14px, 18px) scale(1);',
+          fontSize: '14px',
+          color: disabled ? '#E7E7E7' : currentInputValue && currentInputValue.length > 0 ? '#212121' : '#757575'
         },
-        "& .MuiInputLabel-outlined": {
-          paddingLeft: "10px",
-          color: disabled ? "#E7E7E7" : labelColor,
-          fontSize: "18px"
+        '& .MuiInputLabel-outlined': {
+          paddingLeft: '10px',
+          color: disabled ? '#E7E7E7' : labelColor,
+          fontSize: '18px'
         },
-        "& .MuiInputLabel-shrink": {
-          marginLeft: "1px",
-          paddingLeft: "4px",
-          paddingRight: "6px",
-          background: "white"
-        }
-      };
-    }
-    // square
-    return null;
-  };
-
-  // ---------------------------- Multi Text Style -----------------------------------------
-  var getTextFieldStyleMulti = function getTextFieldStyleMulti() {
-    if (shape === "round") {
-      // round
-      return {
-        "& .MuiOutlinedInput-root": {
-          borderRadius: "12px",
-          legend: {
-            marginLeft: "10px"
-          }
-        },
-        "& .MuiAutocomplete-inputRoot": {
-          paddingLeft: "10px !important",
-          borderRadius: "12px",
-          // This matches the specificity of the default styles at https://github.com/mui-org/material-ui/blob/v4.11.3/packages/material-ui-lab/src/Autocomplete/Autocomplete.js#L90
-          '&[class*="MuiOutlinedInput-root"] .MuiAutocomplete-input:first-of-type': {
-            // Default left padding is 6px
-            paddingLeft: "10px"
-          },
-          "& .MuiOutlinedInput-notchedOutline": {
-            borderColor: "#E7E7E7"
-          },
-          "&:hover .MuiOutlinedInput-notchedOutline": {
-            borderColor: disabled ? "#E7E7E7" : labelColor
-          },
-          "&.Mui-focused .MuiOutlinedInput-notchedOutline": {
-            borderColor: disabled ? "#E7E7E7" : labelColor
-          }
-        },
-        "& .MuiInputLabel-outlined:not(.MuiInputLabel-shrink)": {
-          // Default transform is "translate(14px, 20px) scale(1)""
-          // This lines up the label with the initial cursor position in the input
-          // after changing its padding-left.
-          transform: "translate(14px, 18px) scale(1);",
-          fontSize: "14px",
-          color: disabled ? "#E7E7E7" : currentInputValue && currentInputValue.length > 0 ? "#212121" : "#757575"
-        },
-        "& .MuiInputLabel-outlined": {
-          paddingLeft: "10px",
-          color: disabled ? "#E7E7E7" : labelColor,
-          fontSize: "18px"
-        },
-        "& .MuiInputLabel-shrink": {
-          marginLeft: "1px",
-          paddingLeft: "4px",
-          paddingRight: "6px",
-          background: "white"
+        '& .MuiInputLabel-shrink': {
+          marginLeft: '1px',
+          paddingLeft: '4px',
+          paddingRight: '6px',
+          background: 'white'
         }
       };
     }
@@ -240,23 +180,21 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
     var ALPHA_REGEX = /^[a-zA-Z]+$/;
     var ALPHA_NUMERIC_REGEX = /^[a-zA-Z0-9-]+$/;
     switch (allowedInput) {
-      case "all":
+      case 'all':
         return true;
-      case "alpha":
+      case 'alpha':
         if (ALPHA_REGEX.test(inputChar)) return true;
         return false;
-      case "numeric":
+      case 'numeric':
         if (NUMERIC_REGEX.test(inputChar)) return true;
         return false;
-      case "alphaNumeric":
+      case 'alphaNumeric':
         if (ALPHA_NUMERIC_REGEX.test(inputChar)) return true;
         return false;
       default:
         return true;
     }
   };
-
-  // --------------------------------------- DROPDOWN SINGLE --------------------------------
   var getAutocompleteSingle = function getAutocompleteSingle() {
     return /*#__PURE__*/_react.default.createElement(_styles.ThemeProvider, {
       theme: theme
@@ -293,32 +231,36 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
           label: text,
           inputRef: inputRef || null,
           size: size,
-          sx: getTextFieldStyleSingle(),
+          sx: getTextFieldStyle(),
           placeholder: placeHolder,
           InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
             style: {
-              fontSize: placeHolderFontSize,
-              fontFamily: "Poppins"
+              fontSize: '14px',
+              fontFamily: 'Poppins'
             },
             startAdornment: showSearchIcon ? /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
               position: "start"
             }, /*#__PURE__*/_react.default.createElement(_Search.default, {
               fontSize: "medium"
             })) : null
-          })
+          }),
+          InputLabelProps: {
+            style: {
+              // color: labelColor,
+              // fontSize: "14px",
+              fontFamily: 'Poppins'
+            }
+          }
         }));
       },
       ListboxProps: {
         style: {
-          fontSize: dropdownListfontSize,
-          //default: 14px
-          fontFamily: "Poppins"
+          fontSize: '14px',
+          fontFamily: 'Poppins'
         }
       }
     }));
   };
-
-  // --------------------------------------- DROPDOWN MULTI --------------------------------
   var getAutocompleteMulti = function getAutocompleteMulti() {
     return /*#__PURE__*/_react.default.createElement(_styles.ThemeProvider, {
       theme: theme
@@ -353,6 +295,11 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
         return /*#__PURE__*/_react.default.createElement("li", props, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
           icon: icon,
           checkedIcon: checkedIcon,
+          style: {
+            marginRight: 8,
+            fontSize: '14px',
+            fontFamily: 'Poppins'
+          },
           checked: selected
         }), option.label);
       },
@@ -360,7 +307,7 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
         return showSearchIcon && (!currentOption || currentOption && currentOption.length === 0) ? /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, params, {
           label: text,
           size: size,
-          sx: getTextFieldStyleMulti(),
+          sx: getTextFieldStyle(),
           placeholder: placeHolder,
           onKeyDown: function onKeyDown(event) {
             if (!isInputAllowed(event.key)) {
@@ -371,41 +318,51 @@ var Dropdown = exports.Dropdown = function Dropdown(_ref) {
           required: required,
           InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
             style: {
-              fontSize: placeHolderFontSize,
-              fontFamily: "Poppins"
+              fontSize: '14px',
+              fontFamily: 'Poppins'
+            },
+            startAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
+              position: "start"
+            }, /*#__PURE__*/_react.default.createElement(_Search.default, {
+              fontSize: "medium"
+            }))
+          }),
+          InputLabelProps: {
+            style: {
+              // color: labelColor,
+              fontSize: '16px',
+              fontFamily: 'Poppins'
             }
-          })
+          }
         })) : /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, params, {
           label: text,
           size: size,
-          sx: getTextFieldStyleMulti(),
+          sx: getTextFieldStyle(),
           placeholder: placeHolder,
-          InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
-            style: {
-              fontSize: placeHolderFontSize,
-              fontFamily: "Poppins"
-            }
-          }),
           onKeyDown: function onKeyDown(event) {
             if (!isInputAllowed(event.key)) {
               event.preventDefault();
             }
           },
           inputRef: inputRef || null,
-          required: required
+          required: required,
+          InputLabelProps: {
+            style: {
+              // color: labelColor,
+              fontSize: '16px',
+              fontFamily: 'Poppins'
+            }
+          }
         }));
       },
       ListboxProps: {
         style: {
-          fontSize: dropdownListfontSize,
-          //default: 14px
-          fontFamily: "Poppins"
+          fontSize: '14px',
+          fontFamily: 'Poppins'
         }
       }
     }));
   };
-
-  // --------------------------------- MAIN -------------------------------------
   return /*#__PURE__*/_react.default.createElement(_Dropdown.DropdownContainer, {
     width: width
   }, multiSelect ? getAutocompleteMulti() : getAutocompleteSingle());

package/dist/stories/components/ReportTable.js

@@ -12,11 +12,12 @@ var ReportTable = exports.ReportTable = function ReportTable(props) {
   var tableData = props.tableData,
     maxColumnsNumber = props.maxColumnsNumber;
   var columnsNumber = tableData.columnsHeadings.length;
+  var tableWidthSize = 100 / maxColumnsNumber * columnsNumber;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ReportTable.TableWrapper, {
     maxColumnsNumber: maxColumnsNumber,
     columnsNumber: columnsNumber
   }, /*#__PURE__*/_react.default.createElement(_ReportTable.Table, {
-    tableWidthSize: 100 / maxColumnsNumber * columnsNumber
+    tableWidthSize: tableWidthSize
   }, /*#__PURE__*/_react.default.createElement("thead", null, /*#__PURE__*/_react.default.createElement("tr", null, tableData.columnsHeadings.map(function (headline, index) {
     return /*#__PURE__*/_react.default.createElement(_ReportTable.Th, {
       key: index
@@ -33,4 +34,43 @@ var ReportTable = exports.ReportTable = function ReportTable(props) {
     color: "#1B30AA"
   }), /*#__PURE__*/_react.default.createElement(_ReportTable.InfoText, null, "Download table to get the full data")));
 };
-var _default = exports.default = ReportTable;
+var _default = exports.default = ReportTable;
+ReportTable.defaultProps = {
+  tableData: {
+    columnsHeadings: [{
+      label: 'Event Name',
+      key: 'eventName'
+    }, {
+      label: 'Retailer',
+      key: 'retailer'
+    }, {
+      label: 'Total Cost',
+      key: 'totalCost'
+    }, {
+      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: '$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: 3
+};