oa-componentbook 0.9.0 → 0.11.0

package/build/components/Accordians.js

@@ -5,21 +5,28 @@ require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+exports.default = exports.SmallText = void 0;
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _antd = require("antd");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _Typography = _interopRequireWildcard(require("./oa-component-typography/Typography"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _templateObject;
 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 }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const SmallText = _styledComponents.default.small(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: 18px;\n  color: #E21616;\n  margin: 0 0 0 4px;\n"])));
+exports.SmallText = SmallText;
 function Accordians(_ref) {
   let {
     disabled,
     onChange,
-    text,
+    headerText,
+    smallText,
     typography,
-    borderRadius
+    borderRadius,
+    body
   } = _ref;
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Collapse, {
     className: "collapseHead",
@@ -28,33 +35,26 @@ function Accordians(_ref) {
     key: "1",
     header: /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
       typography: typography
-    }, "Mandatory Documents", /*#__PURE__*/_react.default.createElement("small", null, "*")), /*#__PURE__*/_react.default.createElement("div", {
-      className: "mendatoryHead gridContainer"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      className: "col-xl-6"
-    }, /*#__PURE__*/_react.default.createElement("h6", null, "Documents")), /*#__PURE__*/_react.default.createElement("div", {
-      className: "col-xl-6"
-    }, /*#__PURE__*/_react.default.createElement("h6", null, "Actions"))))
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "gridContainer"
+    }, headerText, smallText && /*#__PURE__*/_react.default.createElement(SmallText, null, smallText)))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "gridContainer"
-  }, /*#__PURE__*/_react.default.createElement("div", null, "test"), /*#__PURE__*/_react.default.createElement("div", null, "upload")), /*#__PURE__*/_react.default.createElement("div", {
-    className: "col-xl-6"
-  }, /*#__PURE__*/_react.default.createElement("div", null, "radio 1 radio 2"))))));
+  }, body))));
 }
 Accordians.propTypes = {
+  body: _propTypes.default.string,
+  borderRadius: _propTypes.default.oneOf(['border-radius-xlarge', 'border-radius-large', 'border-radius-medium', 'border-radius-small', 'border-radius-xsmall', 'border-radius-none', 'border-radius-full']),
   disabled: _propTypes.default.bool,
   onChange: _propTypes.default.func.isRequired,
-  text: _propTypes.default.string,
-  typography: _propTypes.default.oneOf(_Typography.typographyOptions),
-  borderRadius: _propTypes.default.oneOf(['border-radius-xlarge', 'border-radius-large', 'border-radius-medium', 'border-radius-small', 'border-radius-xsmall', 'border-radius-none', 'border-radius-full'])
+  headerText: _propTypes.default.string.isRequired,
+  smallText: _propTypes.default.string,
+  typography: _propTypes.default.oneOf(_Typography.typographyOptions)
 };
 Accordians.defaultProps = {
-  borderRadius: '.border-radius-xsmall',
+  body: '',
+  borderRadius: 'border-radius-xsmall',
   disabled: false,
-  text: 'Accordian Body',
-  typography: '.type-button-500'
+  smallText: '',
+  typography: 'type-button-500'
 };
 var _default = Accordians;
 exports.default = _default;

package/build/components/oa-component-table/CustomTable.js

@@ -22,7 +22,7 @@ function CustomTable(_ref) {
     pagination,
     rowKey
   } = _ref;
-  const StyledTable = (0, _styledComponents.default)(_antd.Table)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border: '1px solid #e8e8e8';\n  "])));
+  const StyledTable = (0, _styledComponents.default)(_antd.Table)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border: 1px solid #e8e8e8;\n    border-radius: 4px;\n    .ant-table-cell{\n      font-size: 10px;\n      letter-spacing: 1px;\n      text-transform: uppercase;\n      color: #6f7c87 !important;\n      line-height: 10px;\n    }\n    .ant-table-tbody > tr > td{\n      font-size: 14px;\n      letter-spacing: 0;\n      line-height: 22px;\n      color: #454545 !important;\n    }\n    .ant-table-thead >tr>th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before{\n      display: none;\n    }\n    .ant-pagination-item{\n      border-radius: 0;\n    }\n    .ant-pagination-item-link{\n      border: 1px solid #d9d9d9 !important;\n      border-radius: 0 !important;\n    }\n    .ant-table-thead > tr > th{\n      background: #f6f6f6;\n      white-space: nowrap;\n    }\n  "])));
   return /*#__PURE__*/_react.default.createElement(StyledTable, {
     columns: columns,
     dataSource: dataSource,

package/build/index.js

@@ -17,12 +17,24 @@ Object.defineProperty(exports, "Address", {
     return _Address.default;
   }
 });
+Object.defineProperty(exports, "ApprovalWidget", {
+  enumerable: true,
+  get: function get() {
+    return _ApprovalWidget.default;
+  }
+});
 Object.defineProperty(exports, "CheckBox", {
   enumerable: true,
   get: function get() {
     return _CustomCheckBox.default;
   }
 });
+Object.defineProperty(exports, "CloseClaim", {
+  enumerable: true,
+  get: function get() {
+    return _CloseClaim.default;
+  }
+});
 Object.defineProperty(exports, "ColorUsage", {
   enumerable: true,
   get: function get() {
@@ -95,6 +107,12 @@ Object.defineProperty(exports, "KeyValueDataView", {
     return _KeyValueDataView.default;
   }
 });
+Object.defineProperty(exports, "NotesWidget", {
+  enumerable: true,
+  get: function get() {
+    return _NotesWidget.default;
+  }
+});
 Object.defineProperty(exports, "SendPaymentLink", {
   enumerable: true,
   get: function get() {
@@ -107,10 +125,22 @@ Object.defineProperty(exports, "SpacingScales", {
     return _SpacingScales.default;
   }
 });
+Object.defineProperty(exports, "SparePart", {
+  enumerable: true,
+  get: function get() {
+    return _SparePart.default;
+  }
+});
 Object.defineProperty(exports, "StageTimeline", {
   enumerable: true,
   get: function get() {
-    return _StageTimeline.default;
+    return _StageTimeline.StageTimeline;
+  }
+});
+Object.defineProperty(exports, "StageTimelineChild", {
+  enumerable: true,
+  get: function get() {
+    return _StageTimeline.StageTimelineChild;
   }
 });
 Object.defineProperty(exports, "TextArea", {
@@ -137,6 +167,12 @@ Object.defineProperty(exports, "Typography", {
     return _Typography.default;
   }
 });
+Object.defineProperty(exports, "UploadDownloadDocument", {
+  enumerable: true,
+  get: function get() {
+    return _UploadDownloadDocument.default;
+  }
+});
 Object.defineProperty(exports, "colorOptions", {
   enumerable: true,
   get: function get() {
@@ -168,9 +204,14 @@ var _TrackShipment = _interopRequireDefault(require("./widgets/oa-widget-track-s
 var _Typography = _interopRequireWildcard(require("./components/oa-component-typography/Typography"));
 var _ColorVariables = _interopRequireDefault(require("./components/ColorVariables"));
 var _Address = _interopRequireDefault(require("./widgets/oa-widget-address/Address"));
+var _ApprovalWidget = _interopRequireDefault(require("./widgets/oa-widget-approval/ApprovalWidget"));
+var _CloseClaim = _interopRequireDefault(require("./widgets/oa-widget-close-claim/CloseClaim"));
 var _KeyValueDataView = _interopRequireDefault(require("./widgets/oa-widget-keyValueDataView/KeyValueDataView"));
+var _UploadDownloadDocument = _interopRequireDefault(require("./widgets/oa-widget-document/UploadDownloadDocument"));
+var _NotesWidget = _interopRequireDefault(require("./widgets/oa-widget-notes/NotesWidget"));
 var _SendPaymentLink = _interopRequireDefault(require("./widgets/oa-widget-send-payment-link/SendPaymentLink"));
-var _StageTimeline = _interopRequireDefault(require("./widgets/oa-widget-stagesTimeline/StageTimeline"));
+var _StageTimeline = require("./widgets/oa-widget-stage-timeline/StageTimeline");
+var _SparePart = _interopRequireDefault(require("./widgets/oa-widget-sparePart/SparePart"));
 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/build/widgets/{oa-widget-approval.js → oa-widget-approval/ApprovalWidget.js}

@@ -9,17 +9,21 @@ require("core-js/modules/es.symbol.description.js");
 require("core-js/modules/web.dom-collections.iterator.js");
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _antd = require("antd");
 var _icons = require("@ant-design/icons");
+var _templateObject;
 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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const StyledAside = _styledComponents.default.aside(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.ant-typography{\n      font-size: 14px;\n      font-style: normal;\n      font-weight: 400;\n      line-height: 20px; \n      color: #212121;\n      padding: 0 0 10px;\n      display: block;\n    }\n    .ant-typography strong{\n      font-weight: 400;\n    }\n    a{\n      color: #014FC5 !important;\n      padding:10px 0 0 !important;\n      font-weight: 500 !important;\n      display: block;\n    }\n    .ant-typography-secondary{\n      color: #717171;\n      padding: 0 !important;\n    }\n    .ant-radio-group-outline{\n      display: flex;\n      gap: 32px;\n    }\n    section{\n      padding: 16px 0 0;\n    }\n    section span{\n      padding: 0 0 4px !important;\n      display: block;\n    }\n    textarea{\n      padding: 12px;\n      min-height: 88px;\n      resize: none;\n      border-radius: 4px;\n    }\n"])));
 const layoutTypes = {
   faq: 'faq',
   doc: 'doc'
 };
 const isUndefined = () => typeof testVar === 'undefined';
-function OaWidgetQnaApproval(_ref) {
+function ApprovalWidget(_ref) {
   let {
     title,
     description,
@@ -34,7 +38,7 @@ function OaWidgetQnaApproval(_ref) {
   const [drawer, setDrawer] = (0, _react.useState)(false);
   const layoutFor = layoutType || 'faq';
   const isDivider = isUndefined(divider) ? true : divider;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement(StyledAside, {
     key: key
   }, /*#__PURE__*/_react.default.createElement(_antd.Row, null, /*#__PURE__*/_react.default.createElement(_antd.Col, {
     lg: layoutFor === layoutTypes.doc ? 8 : 14,
@@ -79,14 +83,14 @@ function OaWidgetQnaApproval(_ref) {
     options: field.options,
     onChange: field.onChange,
     value: field.value
-  }), remarks && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Typography.Text, {
+  }), remarks && /*#__PURE__*/_react.default.createElement("section", null, /*#__PURE__*/_react.default.createElement(_antd.Typography.Text, {
     level: 5
   }, "Remarks"), /*#__PURE__*/_react.default.createElement(_antd.Input.TextArea, {
     onChange: remarks.onChange,
     value: remarks.value
   })))), isDivider && /*#__PURE__*/_react.default.createElement(_antd.Divider, null));
 }
-OaWidgetQnaApproval.propTypes = {
+ApprovalWidget.propTypes = {
   title: _propTypes.default.string.isRequired,
   // Make title required
   description: _propTypes.default.string,
@@ -115,7 +119,7 @@ OaWidgetQnaApproval.propTypes = {
   divider: _propTypes.default.bool // Leave divider optional
 };
 
-OaWidgetQnaApproval.defaultProps = {
+ApprovalWidget.defaultProps = {
   description: '',
   // Provide a default value for description
   layoutType: 'faq',
@@ -130,5 +134,5 @@ OaWidgetQnaApproval.defaultProps = {
   // Provide a default value for docDetails
   divider: false // Provide a default value for divider
 };
-var _default = OaWidgetQnaApproval;
+var _default = ApprovalWidget;
 exports.default = _default;

package/build/widgets/oa-widget-approval/styles.js

@@ -0,0 +1 @@
+"use strict";

package/build/widgets/oa-widget-close-claim/CloseClaim.js

@@ -0,0 +1,157 @@
+"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");
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _antd = require("antd");
+var _CustomDrawer = _interopRequireDefault(require("../../components/oa-component-drawer/CustomDrawer"));
+var _templateObject;
+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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const {
+  Option
+} = _antd.Select;
+const {
+  TextArea
+} = _antd.Input;
+const Label = _styledComponents.default.label(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
+function CloseClaim(_ref) {
+  let {
+    visible,
+    onCancel,
+    onConfirm,
+    fraudReasons,
+    closingClaimReasons,
+    serviceRequestData // Data for the service request
+  } = _ref;
+  const [form] = _antd.Form.useForm();
+  const [isClaimClosed, setIsClaimClosed] = (0, _react.useState)(false);
+  const [isFraud, setIsFraud] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
+    console.log(fraudReasons, 'fraudReasons');
+  }, []);
+  const handleConfirm = () => {
+    form.validateFields().then(values => {
+      onConfirm(values);
+    });
+  };
+  const handleCancel = () => {
+    onCancel();
+  };
+  const handleRadioChange = e => {
+    const selectedValue = e.target.value;
+    setIsFraud(selectedValue);
+  };
+  return /*#__PURE__*/_react.default.createElement(_CustomDrawer.default, {
+    title: "Close Claim",
+    buttonConfig: [{
+      callback: handleCancel,
+      label: 'Cancel',
+      type: 'secondary'
+    }, {
+      callback: handleConfirm,
+      label: 'Done',
+      type: 'primary'
+    }],
+    open: visible,
+    onClose: handleCancel,
+    placement: "right"
+  }, /*#__PURE__*/_react.default.createElement("h1", null, "Close Claim"), /*#__PURE__*/_react.default.createElement("p", null, "Are you sure you would like to close this claim as this action will close the SR#", serviceRequestData === null || serviceRequestData === void 0 ? void 0 : serviceRequestData.referencePrimaryTrackingNo, ' ', "and no further processing will be allowed. Please provide the reason for closure."), /*#__PURE__*/_react.default.createElement(_antd.Form, {
+    form: form
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "closeReason"
+  }, "Select reason for rejection (Visible to the customer) "), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    name: "closeReason",
+    rules: [{
+      required: true,
+      message: 'Required'
+    }],
+    initialValue: false,
+    id: "closeReason"
+  }, /*#__PURE__*/_react.default.createElement(_antd.Select, {
+    placeholder: "Select"
+  }, /*#__PURE__*/_react.default.createElement(Option, {
+    value: true,
+    disabled: true
+  }, "Select"), (closingClaimReasons === null || closingClaimReasons === void 0 ? void 0 : closingClaimReasons.length) > 0 && closingClaimReasons.map(row => /*#__PURE__*/_react.default.createElement(Option, {
+    key: row.key,
+    value: row.key,
+    width: 432
+  }, row.value)))), /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "isFraud"
+  }, "Is this a fraud case?"), /*#__PURE__*/_react.default.createElement("div", {
+    className: ""
+  }, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    name: "isFraud",
+    rules: [{
+      required: true,
+      message: 'Required'
+    }],
+    initialValue: undefined,
+    id: "isFraud"
+  }, /*#__PURE__*/_react.default.createElement(_antd.Radio.Group, {
+    name: "isFraud",
+    onChange: handleRadioChange
+  }, /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    value: true
+  }, "Yes"), /*#__PURE__*/_react.default.createElement(_antd.Radio, {
+    value: false
+  }, "No")))), isFraud && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "fraudReason"
+  }, "Why is this a fraud case?", /*#__PURE__*/_react.default.createElement("span", {
+    className: "redColor"
+  }, "*")), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    name: "fraudReason",
+    rules: [{
+      required: true,
+      message: 'Required',
+      type: 'array'
+    }],
+    initialValue: undefined,
+    id: "fraudReason"
+  }, /*#__PURE__*/_react.default.createElement(_antd.Select, {
+    mode: "multiple",
+    placeholder: "Select"
+  }, /*#__PURE__*/_react.default.createElement(Option, {
+    value: true,
+    disabled: true
+  }, "Select"), fraudReasons.map(row => /*#__PURE__*/_react.default.createElement(Option, {
+    key: row.key,
+    value: row.key
+  }, row.value)))))), /*#__PURE__*/_react.default.createElement("label", {
+    htmlFor: "fraudRemark"
+  }, "Remarks", /*#__PURE__*/_react.default.createElement("span", {
+    className: "redColor"
+  }, "*")), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    name: "fraudRemark",
+    rules: [{
+      required: true,
+      message: 'Required'
+    }],
+    initialValue: null,
+    id: "fraudRemark"
+  }, /*#__PURE__*/_react.default.createElement(TextArea, {
+    rows: "3",
+    placeholder: "Start typing..."
+  }))), isClaimClosed && /*#__PURE__*/_react.default.createElement("div", {
+    className: "claim-closed-message"
+  }, "Claim has been closed successfully."));
+}
+CloseClaim.propTypes = {
+  visible: _propTypes.default.bool.isRequired,
+  onCancel: _propTypes.default.func.isRequired,
+  onConfirm: _propTypes.default.func.isRequired,
+  fraudReasons: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.string || _propTypes.default.number || _propTypes.default.null)).isRequired,
+  closingClaimReasons: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.string || _propTypes.default.number || _propTypes.default.null)).isRequired,
+  serviceRequestData: _propTypes.default.object.isRequired
+};
+var _default = CloseClaim;
+exports.default = _default;

package/build/widgets/oa-widget-document/UploadDownloadDocument.js

@@ -0,0 +1,62 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _antd = require("antd");
+var _icons = require("@ant-design/icons");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const {
+  Text,
+  Link
+} = _antd.Typography;
+const StyledUpload = (0, _styledComponents.default)(_antd.Upload)(_templateObject || (_templateObject = _taggedTemplateLiteral([""])));
+const StyledAside = _styledComponents.default.aside(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n .ant-btn-dangerous{\n  padding: 0;\n }\n .ant-btn >.anticon+span{\n  margin-inline-start: 4px;\n }\n .ant-btn-link{\n  padding: 4px 4px 4px 4px;\n }\n"])));
+function UploadDownloadDocument(_ref) {
+  let {
+    type,
+    name,
+    onClick,
+    deleteBtn,
+    deleteOnClick
+  } = _ref;
+  const isDownload = type === 'download';
+  const notUploaded = type === 'download' && !name;
+  const isUpload = type === 'upload';
+  return /*#__PURE__*/_react.default.createElement("div", null, isDownload && !notUploaded && /*#__PURE__*/_react.default.createElement(StyledAside, null, /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    type: "link",
+    onClick: onClick,
+    strong: true
+  }, /*#__PURE__*/_react.default.createElement(_icons.DownloadOutlined, null), ' ', /*#__PURE__*/_react.default.createElement("span", null, name)), deleteBtn && /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    type: "link",
+    onClick: deleteOnClick,
+    danger: true,
+    strong: true
+  }, /*#__PURE__*/_react.default.createElement(_icons.DeleteOutlined, null))), notUploaded && /*#__PURE__*/_react.default.createElement(Text, {
+    strong: true
+  }, "Not Uploaded"), isUpload && /*#__PURE__*/_react.default.createElement(StyledUpload, {
+    onClick: onClick
+  }, /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    icon: /*#__PURE__*/_react.default.createElement(_icons.UploadOutlined, null)
+  }, "Click to Upload")));
+}
+UploadDownloadDocument.propTypes = {
+  type: _propTypes.default.string.isRequired,
+  name: _propTypes.default.string,
+  onClick: _propTypes.default.func.isRequired,
+  deleteBtn: _propTypes.default.bool,
+  deleteOnClick: _propTypes.default.func
+};
+UploadDownloadDocument.defaultProps = {
+  name: '',
+  deleteBtn: false,
+  deleteOnClick: () => {}
+};
+var _default = UploadDownloadDocument;
+exports.default = _default;

package/build/widgets/oa-widget-document/styles.js

@@ -0,0 +1 @@
+"use strict";

package/build/widgets/oa-widget-notes/NotesWidget.js

@@ -0,0 +1,76 @@
+"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");
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _antd = require("antd");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _CustomTable = _interopRequireDefault(require("../../components/oa-component-table/CustomTable"));
+var _templateObject;
+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; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const StyledAside = _styledComponents.default.aside(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ant-table-thead > tr > th {\n    padding: 4px 16px;\n  }\n  .ant-table-tbody > tr > td {\n    padding: 8px 16px;\n  }\n  input {\n    height: 30px;\n  }\n"])));
+function NotesWidget(_ref) {
+  let {
+    records,
+    onBlur,
+    resetSearch
+  } = _ref;
+  const [val, setVal] = (0, _react.useState)('');
+  records === null || records === void 0 || records.unshift({
+    key: 0
+  });
+  (0, _react.useEffect)(() => {
+    if (resetSearch) {
+      setVal('');
+    }
+  }, [resetSearch]);
+  const columns = [{
+    title: 'SERIAL NO.',
+    dataIndex: 'sr',
+    render: (text, obj, index) => index === 0 ? /*#__PURE__*/_react.default.createElement(_antd.Input, {
+      size: "small",
+      value: val,
+      onChange: e => {
+        setVal(e.target.value);
+      },
+      onBlur: onBlur,
+      placeholder: "Type here .."
+    }) : text,
+    onCell: (_, index) => ({
+      colSpan: index === 0 ? 1 : 1
+    })
+  }, {
+    title: 'NOTES',
+    dataIndex: 'notes'
+  }, {
+    title: 'DATE AND TIME',
+    dataIndex: 'dateTime'
+  }, {
+    title: 'USER',
+    dataIndex: 'user'
+  }];
+  return /*#__PURE__*/_react.default.createElement(StyledAside, null, /*#__PURE__*/_react.default.createElement(_CustomTable.default, {
+    columns: columns,
+    dataSource: records,
+    size: "small",
+    pagination: false
+  }));
+}
+NotesWidget.propTypes = {
+  records: _propTypes.default.arrayOf(_propTypes.default.objectOf(_propTypes.default.string)).isRequired,
+  onBlur: _propTypes.default.func.isRequired,
+  resetSearch: _propTypes.default.bool
+};
+NotesWidget.defaultProps = {
+  resetSearch: false
+};
+var _default = NotesWidget;
+exports.default = _default;

package/build/widgets/oa-widget-notes/styles.js

@@ -0,0 +1 @@
+"use strict";

package/build/widgets/oa-widget-sparePart/SparePart.js

@@ -0,0 +1,58 @@
+"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 = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Typography = _interopRequireWildcard(require("../../components/oa-component-typography/Typography"));
+var _styles = require("./styles");
+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 }; }
+function SparePart(_ref) {
+  let {
+    cost,
+    onDelete,
+    partId,
+    partName,
+    type,
+    typography
+  } = _ref;
+  const handleDelete = () => {
+    onDelete();
+    // Perform any other required action.
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_styles.StyledWrapper, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: "secondarygrey-text",
+    typography: typography
+  }, "".concat(partName, " ").concat(partId !== null ? "(".concat(partId, ")") : '')), /*#__PURE__*/_react.default.createElement(_styles.StatusContainer, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    color: "secondarygrey-text",
+    typography: typography
+  }, "\u20B9 ".concat(cost)), type === 'delete' && /*#__PURE__*/_react.default.createElement(_styles.DeleteButton, {
+    type: "button",
+    onClick: handleDelete
+  }, /*#__PURE__*/_react.default.createElement(_styles.DeleteIcon, null))), type !== 'delete' && /*#__PURE__*/_react.default.createElement(_styles.StatusContainer, null, type === 'covered' ? /*#__PURE__*/_react.default.createElement(_styles.CheckIcon, null) : /*#__PURE__*/_react.default.createElement(_styles.CloseIcon, null), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: typography
+  }, type === 'covered' ? 'Covered by Insurer' : 'Not Covered')));
+}
+SparePart.propTypes = {
+  cost: (_propTypes.default.string || _propTypes.default.number).isRequired,
+  onDelete: _propTypes.default.func,
+  partId: _propTypes.default.string || _propTypes.default.number,
+  partName: _propTypes.default.string.isRequired,
+  type: _propTypes.default.oneOf(['delete', 'covered', 'not covered']),
+  typography: _propTypes.default.oneOf(_Typography.typographyOptions)
+};
+SparePart.defaultProps = {
+  partId: null,
+  onDelete: () => {},
+  type: 'delete',
+  typography: 'type-b2-400'
+};
+var _default = SparePart;
+exports.default = _default;

package/build/widgets/oa-widget-sparePart/styles.js

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledWrapper = exports.StatusContainer = exports.DeleteIcon = exports.DeleteButton = exports.CloseIcon = exports.CheckIcon = void 0;
+var _icons = require("@ant-design/icons");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const StyledWrapper = _styledComponents.default.section(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: flex;\n    justify-content: space-between;\n    gap: 24px;\n    margin: 0;\n\n    padding: 12px;\n    border: 1px solid #E0E0E0;\n    border-radius: 4px;\n    max-width: 406px;\n"])));
+exports.StyledWrapper = StyledWrapper;
+const StatusContainer = _styledComponents.default.section(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  display: flex;\n  gap: 8px;\n  align-items: center;\n"])));
+exports.StatusContainer = StatusContainer;
+const DeleteButton = _styledComponents.default.button(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  background: none;\n  color: inherit;\n  border: none;\n  padding: 0;\n  font: inherit;\n  cursor: pointer;\n  outline: inherit;\n"])));
+exports.DeleteButton = DeleteButton;
+const DeleteIcon = (0, _styledComponents.default)(_icons.DeleteOutlined)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  color: #DE350B;\n"])));
+exports.DeleteIcon = DeleteIcon;
+const CloseIcon = (0, _styledComponents.default)(_icons.CloseCircleFilled)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  color: #DE350B;\n"])));
+exports.CloseIcon = CloseIcon;
+const CheckIcon = (0, _styledComponents.default)(_icons.CheckCircleFilled)(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  color: green;\n"])));
+exports.CheckIcon = CheckIcon;

package/build/widgets/oa-widget-stage-timeline/StageTimeline.js

@@ -0,0 +1,54 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StageTimeline = StageTimeline;
+exports.StageTimelineChild = StageTimelineChild;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
+var _styles = require("./styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// Import the styles
+
+function StageTimelineChild(_ref) {
+  let {
+    data
+  } = _ref;
+  let pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageDefault, null);
+  let className = '';
+  if (data.status === 'completed') {
+    className = 'completed';
+    pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageSuccess, null);
+  } else if (data.status === 'In-Progress') {
+    className = 'inprogress';
+    pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageInprocess, null);
+  }
+  return /*#__PURE__*/_react.default.createElement("li", {
+    key: data.stageId
+  }, /*#__PURE__*/_react.default.createElement(_styles.StageInfo, {
+    onClick: data.onClick,
+    className: className
+  }, /*#__PURE__*/_react.default.createElement(_styles.StageIcon, null, pickedIcon), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: "type-b2-400"
+  }, data.stageName)));
+}
+StageTimelineChild.propTypes = {
+  data: _propTypes.default.shape({
+    data: _propTypes.default.objectOf(_propTypes.default.string),
+    onClick: _propTypes.default.func.isRequired,
+    stageId: (_propTypes.default.string || _propTypes.default.number).isRequired,
+    stageName: _propTypes.default.string.isRequired,
+    status: _propTypes.default.oneOf(['Not-Started', 'In-Progress', 'completed']).isRequired
+  }).isRequired
+};
+function StageTimeline(_ref2) {
+  let {
+    children
+  } = _ref2;
+  return /*#__PURE__*/_react.default.createElement(_styles.StagesList, null, children);
+}
+StageTimeline.propTypes = {
+  children: _propTypes.default.node.isRequired
+};

package/build/widgets/{oa-widget-stagesTimeline → oa-widget-stage-timeline}/styles.js

@@ -5,18 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StagesList = exports.StageSuccess = exports.StageInprocess = exports.StageInfo = exports.StageIcon = exports.StageDefault = void 0;
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6; // LeftPanelTabStyles.js
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-const StagesList = _styledComponents.default.ul(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  list-style-type: none;\n"])));
-exports.StagesList = StagesList;
-const StageInfo = _styledComponents.default.a(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  color: #BFBFBF;\n  display: flex;\n  align-items: center;\n  padding: 12px 24px 12px 24px;\n  text-decoration: none;\n  border: 1px solid #BFBFBF;\n  border-radius: 28px;\n\n  &.inprogress {\n    display: flex;\n    align-items: center;\n    color: #014FC5;\n    background: #DEF1FB;\n    border-color: #DEF1FB;\n  }\n\n  &.success {\n    background: #fff;\n  }\n"])));
+const StageInfo = _styledComponents.default.a(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  color: var(--color-grey2-disabled);\n  display: flex;\n  align-items: center;\n  padding: 12px 24px 12px 24px;\n  text-decoration: none;\n  border: 1px solid transparent;\n  border-radius: 28px;\n\n  &.inprogress {\n    display: flex;\n    align-items: center;\n    color: #014FC5;\n    background: #DEF1FB;\n    border-color: #DEF1FB;\n  }\n\n  &.completed {\n    color: var(--color-secondarygrey-text);\n    border: 1px solid var(--color-secondarygrey-text);\n    background: #fff;\n  }\n"])));
 exports.StageInfo = StageInfo;
-const StageIcon = _styledComponents.default.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  margin: 0 10px 0 0;\n  display: flex;\n"])));
+const StageIcon = _styledComponents.default.span(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  margin: 0 10px 0 0;\n  display: flex;\n"])));
 exports.StageIcon = StageIcon;
-const StageInprocess = _styledComponents.default.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: #014FC5;\n  border-radius: 50px;\n"])));
+const StageInprocess = _styledComponents.default.span(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: #014FC5;\n  border-radius: 50px;\n"])));
 exports.StageInprocess = StageInprocess;
-const StageDefault = _styledComponents.default.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: #BFBFBF;\n  border-radius: 50px;\n"])));
+const StageDefault = _styledComponents.default.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: #BFBFBF;\n  border-radius: 50px;\n"])));
 exports.StageDefault = StageDefault;
-const StageSuccess = _styledComponents.default.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: green;\n  border-radius: 50px;\n"])));
-exports.StageSuccess = StageSuccess;
+const StageSuccess = _styledComponents.default.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  width: 12px;\n  height: 12px;\n  background: green;\n  border-radius: 50px;\n"])));
+exports.StageSuccess = StageSuccess;
+const StagesList = _styledComponents.default.ul(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  list-style-type: none;\n"])));
+exports.StagesList = StagesList;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oa-componentbook",
-  "version": "0.9.0",
+  "version": "0.11.0",
   "private": false,
   "description": "Reusable components",
   "main": "build/index.js",
@@ -61,8 +61,24 @@
       "airbnb"
     ],
     "rules": {
-      "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"]}],
-      "no-unused-vars": [1]
+      "react/jsx-filename-extension": [
+        1,
+        {
+          "extensions": [
+            ".js",
+            ".jsx"
+          ]
+        }
+      ],
+      "no-unused-vars": [
+        1
+      ],
+      "react/forbid-prop-types": [
+        1
+      ],
+      "jsx-a11y/label-has-associated-control": [ 2, {
+        "controlComponents": ["Form.Item"]
+      }]
     }
   },
   "browserslist": {

package/build/widgets/oa-widget-stagesTimeline/StageTimeline.js

@@ -1,49 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Typography = _interopRequireDefault(require("../../components/oa-component-typography/Typography"));
-var _styles = require("./styles");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-// Import the styles
-
-function StageTimeline(_ref) {
-  let {
-    stagesArr
-  } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_styles.StagesList, null, stagesArr.map(stage => {
-    let pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageDefault, null);
-    let className = '';
-    if (stage.isComplete) {
-      className = 'success';
-      pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageSuccess, null);
-    } else if (stage.isActive) {
-      className = 'inprogress';
-      pickedIcon = /*#__PURE__*/_react.default.createElement(_styles.StageInprocess, null);
-    }
-
-    // Use a unique and stable key based on the stage data
-    const stageKey = "".concat(stage.stageName, "-").concat(stage.isComplete, "-").concat(stage.isActive);
-    return /*#__PURE__*/_react.default.createElement("li", {
-      key: stageKey
-    }, /*#__PURE__*/_react.default.createElement(_styles.StageInfo, {
-      href: "",
-      className: className
-    }, /*#__PURE__*/_react.default.createElement(_styles.StageIcon, null, pickedIcon), /*#__PURE__*/_react.default.createElement(_Typography.default, {
-      typography: "type-b2-400"
-    }, stage.stageName)));
-  }));
-}
-StageTimeline.propTypes = {
-  stagesArr: _propTypes.default.arrayOf(_propTypes.default.shape({
-    stageName: _propTypes.default.string.isRequired,
-    isComplete: _propTypes.default.bool.isRequired,
-    isActive: _propTypes.default.bool.isRequired
-  })).isRequired
-};
-var _default = StageTimeline;
-exports.default = _default;