oa-componentbook 0.6.0 → 0.7.0

package/build/index.js

@@ -1,12 +1,14 @@
 "use strict";
 
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "BasicQuestions", {
+Object.defineProperty(exports, "CheckBoxes", {
   enumerable: true,
   get: function get() {
-    return _basicQuestions.default;
+    return _CheckBoxes.default;
   }
 });
 Object.defineProperty(exports, "CloseClaim", {
@@ -15,10 +17,22 @@ Object.defineProperty(exports, "CloseClaim", {
     return _CloseClaim.default;
   }
 });
+Object.defineProperty(exports, "ColorUsage", {
+  enumerable: true,
+  get: function get() {
+    return _ColorUsage.default;
+  }
+});
+Object.defineProperty(exports, "ColorVariables", {
+  enumerable: true,
+  get: function get() {
+    return _ColorUsage.ColorVariables;
+  }
+});
 Object.defineProperty(exports, "ComplaintDetails", {
   enumerable: true,
   get: function get() {
-    return _complaintDetail.default;
+    return _ComplaintDetail.default;
   }
 });
 Object.defineProperty(exports, "ComplaintsTable", {
@@ -27,16 +41,16 @@ Object.defineProperty(exports, "ComplaintsTable", {
     return _ComplaintsTable.default;
   }
 });
-Object.defineProperty(exports, "CustomButton", {
+Object.defineProperty(exports, "CornerRadius", {
   enumerable: true,
   get: function get() {
-    return _Button.default;
+    return _CornerRadius.default;
   }
 });
 Object.defineProperty(exports, "DrawerDesign", {
   enumerable: true,
   get: function get() {
-    return _Drawer.default;
+    return _DrawerDesign.default;
   }
 });
 Object.defineProperty(exports, "KeyValueDataView", {
@@ -45,86 +59,98 @@ Object.defineProperty(exports, "KeyValueDataView", {
     return _KeyValueDataView.default;
   }
 });
-Object.defineProperty(exports, "QuesAnsView", {
+Object.defineProperty(exports, "Notification", {
   enumerable: true,
   get: function get() {
-    return _QuesAnsView.default;
+    return _Notification.default;
   }
 });
-Object.defineProperty(exports, "ServiceDetailsTabView", {
+Object.defineProperty(exports, "OACustomButton", {
   enumerable: true,
   get: function get() {
-    return _serviceDetailsTabView.default;
+    return _OACustomButton.default;
   }
 });
-Object.defineProperty(exports, "TableDesign", {
+Object.defineProperty(exports, "RadioButton", {
   enumerable: true,
   get: function get() {
-    return _Table.default;
+    return _RadioButton.default;
   }
 });
-Object.defineProperty(exports, "TabsDesign", {
+Object.defineProperty(exports, "ServiceDetailsTabView", {
   enumerable: true,
   get: function get() {
-    return _Tabs.default;
+    return _ServiceDetailsTabView.default;
   }
 });
-Object.defineProperty(exports, "ViewDetailsDrawer", {
+Object.defineProperty(exports, "SpacingScales", {
   enumerable: true,
   get: function get() {
-    return _viewMoreDetailsDrawer.default;
+    return _SpacingScales.default;
   }
 });
-Object.defineProperty(exports, "WalletServiceDetails", {
+Object.defineProperty(exports, "TableDesign", {
   enumerable: true,
   get: function get() {
-    return _walletServiceDetails.default;
+    return _TableDesign.default;
   }
 });
-Object.defineProperty(exports, "WorkflowSummaryNotesModal", {
+Object.defineProperty(exports, "TabsDesign", {
   enumerable: true,
   get: function get() {
-    return _WorkflowSummaryNotesModal.default;
+    return _TabsDesign.default;
   }
 });
-Object.defineProperty(exports, "WorkflowSummaryTable", {
+Object.defineProperty(exports, "Typography", {
   enumerable: true,
   get: function get() {
-    return _WorkflowSummaryTable.default;
+    return _Typography.default;
   }
 });
-Object.defineProperty(exports, "buttonStyles", {
+Object.defineProperty(exports, "ViewDetailsDrawer", {
   enumerable: true,
   get: function get() {
-    return _styles.buttonStyles;
+    return _ViewMoreDetailsDrawer.default;
   }
 });
-Object.defineProperty(exports, "keyValueDataViewStyles", {
+Object.defineProperty(exports, "WalletServiceDetails", {
+  enumerable: true,
+  get: function get() {
+    return _WalletServiceDetails.default;
+  }
+});
+Object.defineProperty(exports, "WorkflowSummaryNotesModal", {
   enumerable: true,
   get: function get() {
-    return _styles.keyValueDataViewStyles;
+    return _WorkflowSummaryNotesModal.default;
   }
 });
-Object.defineProperty(exports, "tableStyles", {
+Object.defineProperty(exports, "WorkflowSummaryTable", {
   enumerable: true,
   get: function get() {
-    return _styles.tableStyles;
+    return _WorkflowSummaryTable.default;
   }
 });
-var _Button = _interopRequireDefault(require("./components/Button"));
-var _Drawer = _interopRequireDefault(require("./components/Drawer"));
+var _CheckBoxes = _interopRequireDefault(require("./components/CheckBoxes"));
+var _ColorUsage = _interopRequireWildcard(require("./components/ColorUsage"));
+var _CornerRadius = _interopRequireDefault(require("./components/CornerRadius"));
+var _OACustomButton = _interopRequireDefault(require("./components/oa-button/OACustomButton"));
+var _DrawerDesign = _interopRequireDefault(require("./components/DrawerDesign"));
 var _KeyValueDataView = _interopRequireDefault(require("./components/KeyValueDataView"));
-var _QuesAnsView = _interopRequireDefault(require("./components/QuesAnsView"));
-var _Table = _interopRequireDefault(require("./components/Table"));
-var _Tabs = _interopRequireDefault(require("./components/Tabs"));
-var _basicQuestions = _interopRequireDefault(require("./components/Wallet Service Details/basicQuestions"));
-var _complaintDetail = _interopRequireDefault(require("./components/Wallet Service Details/complaintDetail"));
-var _viewMoreDetailsDrawer = _interopRequireDefault(require("./components/Wallet Service Details/viewMoreDetailsDrawer"));
-var _serviceDetailsTabView = _interopRequireDefault(require("./components/Wallet Service Details/serviceDetailsTabView"));
-var _walletServiceDetails = _interopRequireDefault(require("./components/Wallet Service Details/walletServiceDetails"));
-var _WorkflowSummaryTable = _interopRequireDefault(require("./components/peclaim-components/WorkflowSummaryTable"));
-var _WorkflowSummaryNotesModal = _interopRequireDefault(require("./components/peclaim-components/WorkflowSummaryNotesModal"));
-var _ComplaintsTable = _interopRequireDefault(require("./components/peclaim-components/ComplaintsTable"));
+var _Notification = _interopRequireDefault(require("./components/Notification"));
+var _RadioButton = _interopRequireDefault(require("./components/RadioButton"));
+var _SpacingScales = _interopRequireDefault(require("./components/SpacingScales"));
+var _TableDesign = _interopRequireDefault(require("./components/TableDesign"));
+var _TabsDesign = _interopRequireDefault(require("./components/TabsDesign"));
+var _Typography = _interopRequireDefault(require("./components/Typography"));
+var _ComplaintDetail = _interopRequireDefault(require("./components/wallet-service-details/ComplaintDetail"));
+var _ServiceDetailsTabView = _interopRequireDefault(require("./components/wallet-service-details/ServiceDetailsTabView"));
+var _ViewMoreDetailsDrawer = _interopRequireDefault(require("./components/wallet-service-details/ViewMoreDetailsDrawer"));
+var _WalletServiceDetails = _interopRequireDefault(require("./components/wallet-service-details/WalletServiceDetails"));
 var _CloseClaim = _interopRequireDefault(require("./components/peclaim-components/CloseClaim"));
-var _styles = require("./components/styles");
+var _ComplaintsTable = _interopRequireDefault(require("./components/peclaim-components/ComplaintsTable"));
+var _WorkflowSummaryNotesModal = _interopRequireDefault(require("./components/peclaim-components/WorkflowSummaryNotesModal"));
+var _WorkflowSummaryTable = _interopRequireDefault(require("./components/peclaim-components/WorkflowSummaryTable"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oa-componentbook",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "private": false,
   "description": "Reusable components",
   "main": "build/index.js",
@@ -13,8 +13,12 @@
     "access": "public"
   },
   "dependencies": {
+    "@ant-design/icons": "^5.2.6",
+    "@storybook/addon-actions": "^7.4.3",
+    "@storybook/addon-styling": "^1.3.7",
     "@storybook/cli": "^7.3.2",
-    "antd": "^3.23.3",
+    "antd": "^5.9.2",
+    "prop-types": "^15.8.1",
     "react": "^16.9.0",
     "react-dom": "^16.9.0",
     "react-router-dom": "^5.3.4",
@@ -34,8 +38,8 @@
     "@storybook/react-webpack5": "^7.3.2",
     "@storybook/testing-library": "^0.2.0",
     "babel-plugin-named-exports-order": "^0.0.2",
+    "eslint-config-airbnb": "^19.0.4",
     "eslint-plugin-storybook": "^0.6.13",
-    "prop-types": "^15.8.1",
     "react-scripts": "^5.0.1",
     "storybook": "^7.3.2",
     "webpack": "^5.88.2",
@@ -45,14 +49,21 @@
     "start": "react-scripts start",
     "build": "rm -rf build && NODE_ENV=production babel src/lib --out-dir build --copy-files",
     "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
+    "build-storybook": "storybook build",
+    "lint-fix": "eslint --fix src/** --ext .js,.jsx",
+    "lint": "eslint src/** --ext .js,.jsx"
   },
   "eslintConfig": {
     "extends": [
       "react-app",
       "react-app/jest",
-      "plugin:storybook/recommended"
-    ]
+      "plugin:storybook/recommended",
+      "airbnb"
+    ],
+    "rules": {
+      "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"]}],
+      "no-unused-vars": [1]
+    }
   },
   "browserslist": {
     "production": [

package/build/components/Login.js

@@ -1,80 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.weak-map.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-require("core-js/modules/web.dom-collections.iterator.js");
-require("core-js/modules/es.array.includes.js");
-require("core-js/modules/es.string.includes.js");
-var _react = _interopRequireWildcard(require("react"));
-var _antd = require("antd");
-require("./style/css/login.css");
-var _Button = _interopRequireDefault(require("./Button"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-// import { Link } from 'react-router-dom';
-
-const Login = () => {
-  const [userName, setUserName] = (0, _react.useState)('');
-  const [data] = (0, _react.useState)({
-    project: 'oasysadmin',
-    pageHeading: 'Log in to CRM',
-    pageSubHeading: 'All new and improved. Empowering you daily.',
-    fields: ['username', 'email'],
-    forgotLink: '',
-    btnLoading: false
-  });
-  const handleSubmit = event => {
-    event.preventDefault();
-    // Handle form submission logic here
-  };
-
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: "formBox"
-  }, /*#__PURE__*/_react.default.createElement(_antd.Form, {
-    name: "loginForm",
-    autoComplete: "off",
-    onSubmit: handleSubmit
-  }, /*#__PURE__*/_react.default.createElement("h1", null, data.pageHeading), /*#__PURE__*/_react.default.createElement("p", {
-    className: "subdesc"
-  }, data.pageHeading), data.fields.includes('username') && /*#__PURE__*/_react.default.createElement("div", {
-    className: "fieldDivSet"
-  }, /*#__PURE__*/_react.default.createElement("label", null, "Username"), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
-    placeholder: "Enter username",
-    value: userName,
-    onChange: e => setUserName(e.target.value),
-    required: true
-  }))), data.fields.includes('email') && /*#__PURE__*/_react.default.createElement("div", {
-    className: "fieldDivSet"
-  }, /*#__PURE__*/_react.default.createElement("label", null, "Email"), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, null, /*#__PURE__*/_react.default.createElement(_antd.Input, {
-    placeholder: "Enter email",
-    required: true
-  }))), /*#__PURE__*/_react.default.createElement("div", {
-    className: "fieldDivSet"
-  }, /*#__PURE__*/_react.default.createElement("label", null, "Password"), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, null, /*#__PURE__*/_react.default.createElement(_antd.Input.Password, {
-    type: "password",
-    placeholder: "Enter password",
-    required: true
-  }))), /*#__PURE__*/_react.default.createElement("div", {
-    className: "actionDiv"
-  }, data.btnLoading ? /*#__PURE__*/_react.default.createElement(_antd.Spin, {
-    className: "fullWidth",
-    tip: 'Please wait! validating your session'
-  }) : /*#__PURE__*/_react.default.createElement("button", {
-    className: "ant-btn-primary fullWidth loginBtn",
-    type: "submit"
-  }, "Let's Start")), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    label: 'Test'
-  }), data.project === 'oasysadmin' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    className: "divedLine"
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: "googleBtn"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    id: "buttonOfGoogle"
-  })))));
-};
-var _default = Login;
-exports.default = _default;

package/build/components/Wallet Service Details/complaintDetail.js

@@ -1,65 +0,0 @@
-"use strict";
-
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _Button = _interopRequireDefault(require("../Button"));
-var _KeyValueDataView = _interopRequireDefault(require("../KeyValueDataView"));
-var _styles = require("../styles");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-const ComplaintDetails = props => {
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
-    style: _styles.keyValueDataViewStyles['.mainDiv']
-  }, /*#__PURE__*/_react.default.createElement("h3", {
-    style: _styles.keyValueDataViewStyles['.mainDiv h3']
-  }, "SR#21463 - BER Payment - Beyond 5 days"), /*#__PURE__*/_react.default.createElement("h2", {
-    style: _styles.keyValueDataViewStyles['.mainDiv h2']
-  }, "Complaint Details"), /*#__PURE__*/_react.default.createElement("div", {
-    style: _styles.keyValueDataViewStyles['.flexBody']
-  }, /*#__PURE__*/_react.default.createElement(_KeyValueDataView.default, {
-    data: {
-      "Complaint#": "Lalit",
-      "Complaint Type": "9999999999",
-      "Status": "edfe@sdfd.com",
-      "Customer Remarks": "edfe@sdfd.com",
-      "Source": "edfe@sdfd.com",
-      "Allocated Team": "",
-      "Date Modified": ""
-    }
-  }), /*#__PURE__*/_react.default.createElement(_KeyValueDataView.default, {
-    data: {
-      "Priority": "Lalit",
-      "SR No.": "9999999999",
-      "Membership Id": "edfe@sdfd.com",
-      "Customer Name": "edfe@sdfd.com",
-      "CMS User": "edfe@sdfd.com",
-      "Date Entered": "",
-      "Notes": /*#__PURE__*/_react.default.createElement(_Button.default, {
-        text: "Add Notes",
-        size: "small",
-        className: "ant-btn-primary"
-      })
-    }
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    style: _styles.keyValueDataViewStyles['.footerBtn']
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    text: "Resolve",
-    size: "small",
-    className: "ant-btn-primary"
-  }), /*#__PURE__*/_react.default.createElement(_Button.default, {
-    text: "Cancel",
-    size: "small",
-    className: "sml-secondary-btn",
-    style: {
-      marginLeft: '12px'
-    }
-  }))));
-};
-var _default = ComplaintDetails;
-exports.default = _default;

package/build/components/Wallet Service Details/styles/styles.css

@@ -1,99 +0,0 @@
-.walletTab .walletContent li:first-child {
-    padding: 0 0 20px;
-}
-
-.walletTab .walletContent li {
-    display: flex;
-    border-bottom: 1px solid #E0E0E0;
-    padding: 20px 0;
-    /* margin: 0 0 16px; */
-}
-
-.walletTab .walletContent li .custumerSaid {
-    width: 450px;
-}
-
-.custumerSaid p+span {
-    width: 100%;
-}
-
-.walletContent .ant-radio-wrapper {
-    margin: 0 32px 0 0;
-    display: flex;
-}
-
-.walletContent p {
-    color: #212121;
-    font-size: 14px;
-    width: 100%;
-    letter-spacing: 0;
-    line-height: 22px;
-    padding: 0 0 8px;
-}
-
-.walletContent span {
-    color: #757575;
-    font-size: 14px;
-    letter-spacing: 0;
-    line-height: 22px;
-    display: block;
-}
-
-.walletContent .actionLInk {
-    margin: 8px 0 0;
-}
-
-.walletContent li .rightAlign {
-    width: 36%;
-    position: relative;
-    right: -50px;
-}
-
-/* .walletTab .walletContent li {
-    flex-direction: column;
-} */
-
-/* .walletContent li .rightAlign {
-    width: 100%;
-} */
-
-/* .walletTab .walletContent li,
-.radioAlign {
-    flex-direction: column;
-} */
-
-.walletContent li .rightAlign {
-    width: 100%;
-}
-
-.walletTab .walletContent li {
-    padding: 12px 0;
-    margin: 0;
-}
-
-.walletContent p,
-.walletContent span {
-    font-size: 12px;
-}
-
-.walletContent .ant-radio-wrapper {
-    margin: 8px 0 0;
-    font-size: 12px;
-}
-
-.custumerSaid {
-    width: 350px;
-}
-
-.rightAlign .ant-form-item {
-    margin-bottom: 0px;
-}
-
-div.widthRadio {
-    width: 340px !important;
-}
-
-.radioAlign {
-    display: flex;
-    width: 100%;
-}