sag_components 1.0.421 → 1.0.423

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/CommonFunctions.js

@@ -3,18 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isNumericValue = exports.getNumberWithCommas = exports.getFormattedValue = exports.getFormattedUnits = exports.getCurrencySign = void 0;
+exports.getNumberWithCommas = exports.getFormattedValue = exports.getFormattedUnits = exports.getCurrencySign = void 0;
 const getCurrencySign = (currencyTypeToConvert, value) => {
   if (value === undefined || value === null) {
-    return "";
+    return '';
   }
   if (isNaN(parseFloat(value))) {
-    return "";
+    return '';
   }
-  if (!currencyTypeToConvert) return "";
-  let currencySign = "";
-  const currencyFormatter = new Intl.NumberFormat("en-US", {
-    style: "currency",
+  if (!currencyTypeToConvert) return '';
+  let currencySign = '';
+  const currencyFormatter = new Intl.NumberFormat('en-US', {
+    style: 'currency',
     currency: currencyTypeToConvert
   });
   currencySign = currencyFormatter.format(Math.abs(value)).substring(0, 1);
@@ -23,21 +23,21 @@ const getCurrencySign = (currencyTypeToConvert, value) => {
 exports.getCurrencySign = getCurrencySign;
 const getFormattedUnits = num => {
   if (num === undefined || num === null) {
-    return "";
+    return '';
   }
   if (isNaN(parseFloat(num))) {
-    return "";
+    return '';
   }
   if (Math.abs(num) >= 1000000000) {
-    return "B";
+    return 'B';
   }
   if (Math.abs(num) >= 1000000) {
-    return "M";
+    return 'M';
   }
   if (Math.abs(num) >= 1000) {
-    return "K";
+    return 'K';
   }
-  return "";
+  return '';
 };
 exports.getFormattedUnits = getFormattedUnits;
 const getFormattedValue = num => {
@@ -50,13 +50,13 @@ const getFormattedValue = num => {
 
   // if (typeof num === 'number') {
   if (Math.abs(num) >= 1000000000) {
-    return (num / 1000000000).toFixed(1).replace(/\.0$/, "");
+    return (num / 1000000000).toFixed(1).replace(/\.0$/, '');
   }
   if (Math.abs(num) >= 1000000) {
-    return (num / 1000000).toFixed(1).replace(/\.0$/, "");
+    return (num / 1000000).toFixed(1).replace(/\.0$/, '');
   }
   if (Math.abs(num) >= 1000) {
-    return (num / 1000).toFixed(1).replace(/\.0$/, "");
+    return (num / 1000).toFixed(1).replace(/\.0$/, '');
   }
   return num;
   // }
@@ -65,17 +65,7 @@ exports.getFormattedValue = getFormattedValue;
 const getNumberWithCommas = x => {
   let param = x.toString();
   const pattern = /(-?\d+)(\d{3})/;
-  while (pattern.test(param)) param = param.replace(pattern, "$1,$2");
+  while (pattern.test(param)) param = param.replace(pattern, '$1,$2');
   return param;
 };
-exports.getNumberWithCommas = getNumberWithCommas;
-const isNumericValue = num => {
-  if (num === undefined || num === null) {
-    return false;
-  }
-  if (isNaN(parseFloat(num))) {
-    return false;
-  }
-  return true;
-};
-exports.isNumericValue = isNumericValue;
+exports.getNumberWithCommas = getNumberWithCommas;

package/dist/stories/components/IconButton.js

@@ -17,7 +17,10 @@ var _IconButton = require("./IconButton.style");
 /* IconButton */
 const IconButton = props => {
   const {
-    downloadStatus,
+    // downloadStatus,
+    fileName,
+    fileLink,
+    showProcess,
     contentColor,
     buttonText,
     backgroundColor,
@@ -27,30 +30,28 @@ const IconButton = props => {
     iconWidth,
     iconHeight,
     disabled,
-    inProgress,
     onClick,
     onCancelClick
   } = props;
-  const [mouseDownPressed, setMouseDownPressed] = (0, _react.useState)(false);
   const [progress, setProgress] = (0, _react.useState)(0);
   const incrementProgress = () => {
-    if (downloadStatus === 'in progress' && progress <= 90) {
+    if (showProcess && progress <= 90) {
       const interval = setInterval(() => {
         setProgress(prevProgress => {
-          const newProgress = prevProgress + 1;
+          const newProgress = prevProgress + 3;
           if (newProgress >= 90) {
             clearInterval(interval);
           }
           return newProgress;
         });
       }, 500);
-    } else if (downloadStatus === 'success') {
+    } else {
       setProgress(0);
     }
   };
   (0, _react.useEffect)(() => {
     incrementProgress();
-  }, [downloadStatus]);
+  }, [showProcess]);
   const getIcon = icon => {
     switch (icon) {
       case 'download':
@@ -99,54 +100,35 @@ const IconButton = props => {
         return '';
     }
   };
-  const onMouseDownHandler = () => {
-    if (disabled) return;
-    setMouseDownPressed(true);
-  };
-  const onMouseUpHandler = () => {
-    if (disabled) return;
-    setMouseDownPressed(false);
-  };
-  const onPointerOutHandler = () => {
-    if (disabled) return;
-    if (!mouseDownPressed) return;
-    setMouseDownPressed(false);
-  };
-  const getClassNameExtention = () => {
-    if (disabled) return 'disabled';
-    if (mouseDownPressed) return 'mouseDownPressed';
-    return '';
-  };
   const onClickHandler = event => {
-    if (disabled) return;
     onClick(event);
   };
   const onCancelClickHandler = event => {
     onCancelClick(event);
   };
   return /*#__PURE__*/_react.default.createElement(_IconButton.ButtonWrapper, null, /*#__PURE__*/_react.default.createElement(_IconButton.IconButtonContainer, {
-    className: getClassNameExtention(),
+    download: fileName,
+    href: fileLink,
     backgroundColor: backgroundColor,
     borderColor: borderColor,
     borderRadius: borderRadius,
     color: contentColor,
-    onMouseDown: onMouseDownHandler,
-    onMouseUp: onMouseUpHandler,
-    onPointerOut: onPointerOutHandler,
-    inProgress: inProgress,
+    inProgress: showProcess,
     progress: progress,
     onClick: event => {
       onClickHandler(event);
     }
-  }, getIcon(iconName), buttonText !== '' && buttonText !== undefined && /*#__PURE__*/_react.default.createElement(_IconButton.SpanText, null, buttonText)), inProgress && /*#__PURE__*/_react.default.createElement(_IconButton.CancelClick, {
+  }, getIcon(iconName), buttonText !== '' && buttonText !== undefined && /*#__PURE__*/_react.default.createElement(_IconButton.SpanText, null, buttonText)), showProcess && /*#__PURE__*/_react.default.createElement(_IconButton.CancelClick, {
     onClick: event => onCancelClickHandler(event)
   }, "Click here to cancel"));
 };
 exports.IconButton = IconButton;
 var _default = exports.default = IconButton;
 IconButton.defaultProps = {
-  // downloadStatus: 'fail',
-  downloadStatus: 'in progress',
+  // downloadStatus: '',
+  fileName: '',
+  fileLink: '',
+  showProcess: false,
   buttonText: '',
   iconName: 'eye',
   contentColor: '#212121',
@@ -156,7 +138,6 @@ IconButton.defaultProps = {
   iconHeight: 18,
   iconWidth: 18,
   disabled: false,
-  inProgress: false,
   onClick: () => {},
   onCancelClick: () => {}
 };

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

@@ -10,6 +10,6 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 const ButtonWrapper = exports.ButtonWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: fit-content;\n  text-align: center;\n"])));
-const IconButtonContainer = exports.IconButtonContainer = _styledComponents.default.button(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  font-size: 14px;\n  font-weight: 400;\n  display: flex;\n  gap: 10px;\n  align-items: center;\n  justify-content: center;\n  padding: 12px 20px;\n  margin-bottom: 5px;\n  color: ", ";\n  border-radius: ", ";\n  border: 1px solid ", ";\n  background: ", ";\n  position: relative;\n  transition: all .3s;\n  ", "\n  &:hover, &:focus {\n    cursor: pointer;\n    box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.1);\n  }\n"])), props => props.color, props => props.borderRadius, props => props.borderColor.toString(), props => props.backgroundColor.toString(), props => props.inProgress && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n      pointer-events: none;\n      &:after {\n        content: 'In Progress';\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        text-wrap: nowrap;\n        position: absolute;\n        background: linear-gradient(\n          to right,\n          #5FCC70 ", "%,\n          #B1B1B1 ", "%,\n          #B1B1B1 100%\n        );\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        border-width: 0;\n        z-index: 9;\n      }\n    "])), props.progress, props.progress + 1, props => props.borderRadius));
+const IconButtonContainer = exports.IconButtonContainer = _styledComponents.default.a(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  font-size: 14px;\n  font-weight: 400;\n  display: flex;\n  gap: 10px;\n  align-items: center;\n  justify-content: center;\n  padding: 12px 20px;\n  text-decoration: none;\n  color: ", ";\n  border-radius: ", ";\n  border: 1px solid ", ";\n  background: ", ";\n  position: relative;\n  transition: all .3s;\n  ", "\n  &:hover, &:focus {\n    cursor: pointer;\n    box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.1);\n  }\n"])), props => props.color, props => props.borderRadius, props => props.borderColor.toString(), props => props.backgroundColor.toString(), props => props.inProgress && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n      pointer-events: none;\n      &:after {\n        content: ", ";\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        text-wrap: nowrap;\n        position: absolute;\n        background: linear-gradient(\n          to right,\n          #5FCC70 ", "%,\n          #B1B1B1 ", "%,\n          #B1B1B1 100%\n        );\n        width: 100%;\n        height: 100%;\n        border-radius: ", ";\n        border-width: 0;\n        z-index: 9;\n      }\n    "])), props => props.buttonText, props.progress, props.progress + 1, props => props.borderRadius));
 const SpanText = exports.SpanText = _styledComponents.default.span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n"])));
-const CancelClick = exports.CancelClick = _styledComponents.default.span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: inherit;\n  font-family: \"Lato\", sans-serif;;\n  font-size: 14px;\n  color: #568202;\n"])));
+const CancelClick = exports.CancelClick = _styledComponents.default.span(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: inherit;\n  font-family: \"Lato\", sans-serif;;\n  font-size: 14px;\n  color: #568202;\n  cursor: pointer;\n  margin-top: 5px;\n"])));