oa-componentbook 1.0.1-stage.54 → 1.0.1-stage.55

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -20,6 +20,8 @@ var _styles = _interopRequireDefault(require("./styles"));
20
20
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
21
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
22
22
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
23
+ /* eslint-disable */
24
+
23
25
  _reactPdf.pdfjs.GlobalWorkerOptions.workerSrc = "//cdnjs.cloudflare.com/ajax/libs/pdf.js/".concat(_reactPdf.pdfjs.version, "/pdf.worker.js");
24
26
  const ZOOM_STEP = 0.2;
25
27
  const MIN_ZOOM = 0.5;
@@ -48,9 +50,8 @@ function CustomDocumentViewer(_ref) {
48
50
  let {
49
51
  numPages
50
52
  } = _ref2;
51
- return setTotalPages(numPages);
53
+ setTotalPages(numPages);
52
54
  };
53
-
54
55
  // Zoom handlers.
55
56
  const handleZoomIn = (0, _react.useCallback)(() => setScale(prev => Math.min(prev + ZOOM_STEP, MAX_ZOOM)), []);
56
57
  const handleZoomOut = (0, _react.useCallback)(() => setScale(prev => Math.max(prev - ZOOM_STEP, MIN_ZOOM)), []);
@@ -63,27 +64,27 @@ function CustomDocumentViewer(_ref) {
63
64
 
64
65
  // Default download function; can be overridden by passing an onDownload prop.
65
66
  const defaultDownload = (0, _react.useCallback)(() => {
66
- if (fileType === "image") {
67
+ if (fileType === 'image') {
67
68
  // Fetch the image as a blob to force download.
68
69
  fetch(fileUrl, {
69
- mode: "cors"
70
+ mode: 'cors'
70
71
  }).then(res => res.blob()).then(blob => {
71
72
  const url = window.URL.createObjectURL(blob);
72
- const link = document.createElement("a");
73
+ const link = document.createElement('a');
73
74
  link.href = url;
74
- link.download = fileUrl.split("/").pop();
75
+ link.download = fileUrl.split('/').pop();
75
76
  document.body.appendChild(link);
76
77
  link.click();
77
78
  document.body.removeChild(link);
78
79
  window.URL.revokeObjectURL(url);
79
80
  }).catch(error => {
80
- console.error("Image download failed:", error);
81
+ console.error('Image download failed:', error);
81
82
  });
82
83
  } else {
83
84
  // For PDFs and other file types, use the standard download.
84
- const link = document.createElement("a");
85
+ const link = document.createElement('a');
85
86
  link.href = fileUrl;
86
- link.download = fileUrl.split("/").pop();
87
+ link.download = fileUrl.split('/').pop();
87
88
  document.body.appendChild(link);
88
89
  link.click();
89
90
  document.body.removeChild(link);
@@ -92,7 +93,7 @@ function CustomDocumentViewer(_ref) {
92
93
  const handleDownload = onDownload || defaultDownload;
93
94
 
94
95
  // Enable dragging when zoomed in.
95
- (0, _react.useEffect)(function () {
96
+ (0, _react.useEffect)(() => {
96
97
  const container = containerRef.current;
97
98
  if (!container) return;
98
99
  let isDragging = false;
@@ -103,7 +104,7 @@ function CustomDocumentViewer(_ref) {
103
104
  const onMouseDown = e => {
104
105
  if (scale > 1.0) {
105
106
  isDragging = true;
106
- container.style.cursor = "grabbing";
107
+ container.style.cursor = 'grabbing';
107
108
  startX = e.pageX;
108
109
  startY = e.pageY;
109
110
  scrollLeft = container.scrollLeft;
@@ -116,19 +117,19 @@ function CustomDocumentViewer(_ref) {
116
117
  container.scrollLeft = scrollLeft - (e.pageX - startX);
117
118
  container.scrollTop = scrollTop - (e.pageY - startY);
118
119
  };
119
- const onMouseUp = () => {
120
+ const onMouseUp = function onMouseUp() {
120
121
  isDragging = false;
121
- container.style.cursor = scale > 1.0 ? "grab" : "auto";
122
+ container.style.cursor = scale > 1.0 ? 'grab' : 'auto';
122
123
  };
123
- container.addEventListener("mousedown", onMouseDown);
124
- container.addEventListener("mousemove", onMouseMove);
125
- container.addEventListener("mouseup", onMouseUp);
126
- container.addEventListener("mouseleave", onMouseUp);
124
+ container.addEventListener('mousedown', onMouseDown);
125
+ container.addEventListener('mousemove', onMouseMove);
126
+ container.addEventListener('mouseup', onMouseUp);
127
+ container.addEventListener('mouseleave', onMouseUp);
127
128
  return () => {
128
- container.removeEventListener("mousedown", onMouseDown);
129
- container.removeEventListener("mousemove", onMouseMove);
130
- container.removeEventListener("mouseup", onMouseUp);
131
- container.removeEventListener("mouseleave", onMouseUp);
129
+ container.removeEventListener('mousedown', onMouseDown);
130
+ container.removeEventListener('mousemove', onMouseMove);
131
+ container.removeEventListener('mouseup', onMouseUp);
132
+ container.removeEventListener('mouseleave', onMouseUp);
132
133
  };
133
134
  }, [scale]);
134
135
 
@@ -159,17 +160,17 @@ function CustomDocumentViewer(_ref) {
159
160
  ref: containerRef,
160
161
  className: "customDocumentViewerOverlay",
161
162
  style: {
162
- cursor: scale > 1.0 ? "grab" : "auto"
163
+ cursor: scale > 1.0 ? 'grab' : 'auto'
163
164
  },
164
165
  onScroll: handleScroll
165
166
  }, /*#__PURE__*/_react.default.createElement("div", {
166
167
  className: "customDocumentViewerOverlayHeader"
167
- }, fileType === "pdf" && !hidePageNumber ? /*#__PURE__*/_react.default.createElement("div", {
168
+ }, fileType === 'pdf' && !hidePageNumber ? /*#__PURE__*/_react.default.createElement("div", {
168
169
  className: "pageNumber"
169
170
  }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
170
171
  className: "type-button-500",
171
172
  color: "primary-background"
172
- }, "Page ", currentPage, " of ", totalPages)) : fileType === "image" && !hideRotate ? /*#__PURE__*/_react.default.createElement("div", {
173
+ }, "Page", ' ', currentPage, ' ', "of", ' ', totalPages)) : fileType === 'image' && !hideRotate ? /*#__PURE__*/_react.default.createElement("div", {
173
174
  className: "pageNumber"
174
175
  }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
175
176
  color: "primary-background",
@@ -177,7 +178,7 @@ function CustomDocumentViewer(_ref) {
177
178
  icon: _RotateRight.default,
178
179
  onClick: handleRotate,
179
180
  style: {
180
- cursor: "pointer"
181
+ cursor: 'pointer'
181
182
  }
182
183
  })) : null, !hideZoom && /*#__PURE__*/_react.default.createElement("div", {
183
184
  className: "customDocumentViewerOverlayHeaderIcons"
@@ -187,7 +188,7 @@ function CustomDocumentViewer(_ref) {
187
188
  icon: _icons.RemoveRounded,
188
189
  onClick: handleZoomOut,
189
190
  style: {
190
- cursor: scale === MIN_ZOOM ? "not-allowed" : "pointer"
191
+ cursor: scale === MIN_ZOOM ? 'not-allowed' : 'pointer'
191
192
  }
192
193
  }), /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
193
194
  color: "primary-background",
@@ -195,7 +196,7 @@ function CustomDocumentViewer(_ref) {
195
196
  icon: _icons.ZoomInRounded,
196
197
  onClick: handleResetZoom,
197
198
  style: {
198
- cursor: scale === 1.0 ? "not-allowed" : "pointer"
199
+ cursor: scale === 1.0 ? 'not-allowed' : 'pointer'
199
200
  }
200
201
  }), /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
201
202
  color: "primary-background",
@@ -203,7 +204,7 @@ function CustomDocumentViewer(_ref) {
203
204
  icon: _icons.AddRounded,
204
205
  onClick: handleZoomIn,
205
206
  style: {
206
- cursor: scale === MAX_ZOOM ? "not-allowed" : "pointer"
207
+ cursor: scale === MAX_ZOOM ? 'not-allowed' : 'pointer'
207
208
  }
208
209
  })), !hideDownload && /*#__PURE__*/_react.default.createElement("div", {
209
210
  className: "downloadIcon"
@@ -212,10 +213,10 @@ function CustomDocumentViewer(_ref) {
212
213
  size: 24,
213
214
  icon: _icons.GetAppRounded,
214
215
  onClick: handleDownload
215
- }))), fileType === "pdf" && /*#__PURE__*/_react.default.createElement("div", {
216
+ }))), fileType === 'pdf' && /*#__PURE__*/_react.default.createElement("div", {
216
217
  style: {
217
218
  transform: "scale(".concat(scale, ")"),
218
- transformOrigin: "top center"
219
+ transformOrigin: 'top center'
219
220
  }
220
221
  }, /*#__PURE__*/_react.default.createElement(_reactPdf.Document, {
221
222
  file: fileUrl,
@@ -226,25 +227,25 @@ function CustomDocumentViewer(_ref) {
226
227
  key: "page_".concat(index + 1),
227
228
  ref: el => pageRefs.current[index] = el,
228
229
  style: {
229
- marginBottom: "20px",
230
- display: "flex",
231
- justifyContent: "center"
230
+ marginBottom: '20px',
231
+ display: 'flex',
232
+ justifyContent: 'center'
232
233
  }
233
234
  }, /*#__PURE__*/_react.default.createElement(_reactPdf.Page, {
234
235
  pageNumber: index + 1,
235
236
  scale: 1.0
236
- }))))), fileType === "image" && /*#__PURE__*/_react.default.createElement("div", {
237
+ }))))), fileType === 'image' && /*#__PURE__*/_react.default.createElement("div", {
237
238
  style: {
238
239
  transform: "scale(".concat(scale, ") rotate(").concat(rotation, "deg)"),
239
- transformOrigin: "center center"
240
+ transformOrigin: 'center center'
240
241
  }
241
242
  }, /*#__PURE__*/_react.default.createElement("img", {
242
243
  src: fileUrl,
243
244
  alt: "document",
244
245
  style: {
245
- transition: "transform 0.3s ease-in-out",
246
- maxWidth: "100%",
247
- maxHeight: "80vh"
246
+ transition: 'transform 0.3s ease-in-out',
247
+ maxWidth: '100%',
248
+ maxHeight: '80vh'
248
249
  }
249
250
  })))));
250
251
  }
@@ -270,6 +271,6 @@ CustomDocumentViewer.defaultProps = {
270
271
  hideDownload: false,
271
272
  hidePageNumber: false,
272
273
  hideRotate: false,
273
- documentViewerOverlayHeight: "100vh"
274
+ documentViewerOverlayHeight: '100vh'
274
275
  };
275
276
  var _default = exports.default = CustomDocumentViewer;
@@ -14,6 +14,7 @@ var _CustomTag = _interopRequireDefault(require("../../components/oa-component-t
14
14
  var _CustomButton = _interopRequireDefault(require("../../components/oa-component-button/CustomButton"));
15
15
  var _styles = _interopRequireDefault(require("./styles"));
16
16
  const _excluded = ["title", "handleCloseDrawer", "documentConfig", "drawerWidth", "drawerButtonConfig", "drawerTagConfig"];
17
+ /* eslint-disable */
17
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18
19
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
19
20
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -46,9 +47,9 @@ function DocumentSideDrawer(_ref) {
46
47
  color: "primary-content"
47
48
  }, drawerTagConfig.heading), /*#__PURE__*/_react.default.createElement("div", {
48
49
  className: "margin-top-16 statusSec"
49
- }, drawerTagConfig.tag && (
50
+ }, drawerTagConfig.tag
50
51
  // Conditionally render CustomTag or Typography based on tag type
51
- drawerTagConfig.tag.type ? /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
52
+ && (drawerTagConfig.tag.type ? /*#__PURE__*/_react.default.createElement(_CustomTag.default, {
52
53
  label: drawerTagConfig.tag.label,
53
54
  type: drawerTagConfig.tag.type
54
55
  }) : /*#__PURE__*/_react.default.createElement(_Typography.default, {
@@ -76,7 +77,7 @@ DocumentSideDrawer.propTypes = {
76
77
 
77
78
  // Default props to provide fallback values for optional props
78
79
  DocumentSideDrawer.defaultProps = {
79
- title: "",
80
+ title: '',
80
81
  handleCloseDrawer: () => {},
81
82
  documentConfig: null,
82
83
  drawerWidth: null,
@@ -7,5 +7,5 @@ exports.default = void 0;
7
7
  var _styledComponents = require("styled-components");
8
8
  var _templateObject;
9
9
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
10
- const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n gap: 32px; /* Space between columns */\n}\n\n.tooltip-column {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n\n.multipleDocumentTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: max-content;\n border-radius: 12px;\n\n}\n .multipleDocumentTooltip .ant-tooltip-arrow:before{\n background: #fff;\n }\n .multipleDocumentTooltip li.tooltip-item{\n display: flex;\n gap: 8px;\n align-items: flex-start;\n color: #212121;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px; \n padding: 8px 0;\n }\n .multipleDocumentTooltip ul .headingName{\n color: #717171;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 16px; \n letter-spacing: 0.24px;\n text-transform: uppercase;\n padding: 0 0 16px;\n }\n .multipleDocumentTooltip .flexWrap{\n display: flex;\n flex-wrap: wrap;\n column-count: 1;\n column-gap: 8px;\n list-style: none;\n justify-content: space-between;\n }\n.ant-modal .ant-modal-content {\n padding: 24px 24px 32px;\n border-radius: 12px;\n }\n .ant-select-dropdown .ant-select-item{\n min-height: auto !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-message{\n margin-bottom: 0 !important;\n }\n .ant-notification .ant-notification-notice-wrapper{\n background: transparent;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-close{\n position: inherit !important;\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-closable .ant-notification-notice-message {\n padding-inline-end: 0px !important;\n}\n .ant-notification-notice-close > button{\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice {\n display: flex;\n align-items: center;\n gap: 12px;\n justify-content: space-between;\n }\n @media (max-width: 372px) {\n .ant-picker-date-panel .ant-picker-body{\n padding: 8px !important;\n }\n }\n@media (max-width: 600px) {\n .ant-drawer .ant-drawer-header,.ant-drawer .ant-drawer-body{\n padding: 16px !important;\n }\n .ant-drawer .ant-drawer-footer {\n padding: 12px 16px;\n }\n .ant-picker-dropdown .ant-picker-date-panel{\n width: 100%;\n }\n .ant-picker-dropdown .ant-picker-time-panel-column {\n overflow-y: auto;\n}\n.ant-picker-dropdown .ant-picker-time-panel-column::-webkit-scrollbar {\n width: 2px;\n }\n\n .ant-modal-root .ant-modal-wrap {\n position: fixed;\n overflow: inherit;\n }\n .ant-modal-root .ant-modal-centered .ant-modal{\n vertical-align: middle;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100% !important;\n max-width: 100%!important;\n // transform-origin: bottom !important;\n //animation-duration: 0s !important;\n animation-name: slideUp;\n animation-duration: 0.2s;\n transition: .3s ease-in-out;\n animation-timing-function: ease-in;\n }\n @keyframes slideUp {\n 0%,\n 50% {\n transform: translateY(100%);\n opacity: 0;\n }\n \n 60%,\n 100% {\n transform: translateY(0);\n opacity: 1;\n \n }\n }\n .ant-modal .ant-modal-content {\n bottom: -8px;\n left: 0;\n position: absolute;\n right: 0;\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n .ant-modal .ant-modal-body{\n max-height: calc(90vh - 126px);\n overflow: auto;\n padding-right: 16px;\n }\n .ant-modal-footer{\n padding-right: 16px !important;\n }\n .ant-modal .ant-modal-content{\n padding: 24px 16px 32px;\n padding-right: 0;\n }\n}\n\n.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{\n padding: 12px 24px;\n}\n.ant-dropdown-menu{\n min-width: 256px;\n top: 4px;\n}\n.ant-space-item span{\n line-height: 0 !important;\n display: flex;\n}\n.ant-select-dropdown{border-radius: 4px; padding:8px 0 !important;\n background: var(--color-primary-background) ;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);}\n\n.ant-select-dropdown .ant-select-item { \n min-height: auto;\n padding: 12px 16px;\n color: var(--color-primary-content) ;\n line-height: 20px;\n border-radius: 0px;\n}\n\n.label-date-dropdown {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n}\n\n.ant-select-dropdown .ant-select-item-option-active span{ color: var(--color-primary) !important;}\n.ant-picker-range {opacity: 0;}\n.ant-picker-dropdown-range { padding: 0; }\n\n.fadeImg{\n position: relative;\n width: 100%;\n max-height: 300px;\n overflow-x: auto;\n}\n.overLayImg{\n background: rgb(0 0 0 / 40%);\n border-radius: 12px 12px 0px 0px;\n overflow: hidden;\n}\n \n.OaTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: 348px;\n border-radius: 12px;\n}\n.OaTooltip .ant-tooltip-arrow:before{\n background: #fff !important;\n}\n.OaFooterBtn{\n display: flex;\n justify-content: end;\n}\n.OaTooltip{\n max-width: 348px !important;\n}\n.paddingBot .ant-drawer-body{\n padding-bottom: 100px !important;\n}\n.react-transform-component,.react-transform-wrapper,.react-transform-component > div{\n width: 100%;\n}\n.ascCollapse .ant-collapse-arrow{\n transform: rotate(90deg);\n color: var(--color-primary) !important;\n font-size: 14px !important;\n}\n.gappingIcons{\n display: flex;\n gap: 16px;\n}\n.imageZoom .ant-modal-body > div{\n height: 350px;\n overflow-y: auto;\n margin: 30px 0px 0px;\n padding: 0px 8px 0 0;;\n \n}\n/* width */\n.imageZoom ::-webkit-scrollbar {\n width: 8px;\n height: 100px;\n border-radius: 8px;\n}\n\n/* Track */\n.imageZoom ::-webkit-scrollbar-track {\n background: #f6f6f6; \n border-radius: 8px;\n}\n \n/* Handle */\n.imageZoom ::-webkit-scrollbar-thumb {\n background: #888; \n border-radius: 8px;\n height: 100px;\n}\n\n/* Handle on hover */\n.imageZoom ::-webkit-scrollbar-thumb:hover {\n background: #555; \n}\n .modalImg{\n width: 100%;\n }\n.overflowScroll{\n position: relative;\n}\n.ascCollapse .ant-collapse-header{\n border-radius: 4px !important;\n background: var(--color-secondary-background);\n}\n.ascCollapse,.ant-collapse{\n overflow: hidden;\n}\n.ascCollapse .totalVal{\n display: flex;\n gap: 12px;\n}\n.ascCollapse.ant-collapse-item-active .ant-collapse-arrow{\n transform: rotate(180deg) !important;\n}.mobilesIcons li.ant-dropdown-menu-item > svg {\n display: none\n}\n .ant-notification-notice-close svg{\n font-size: 24px !important;\n height: auto;\n }\n @media only screen and (max-width: 574px) {\n .ant-steps-item-tail{\n inset-inline-start: 78px !important;\n \n }\n}\n @media only screen and (max-width: 480px) {\n .ant-steps-item-tail{\n inset-inline-start: 60px !important;\n \n }\n}\n@media only screen and (max-width: 600px) {\n \n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-body {\n padding: 8px;\n }\n .ant-picker-dropdown { width: 100%; left: 0 !important; }\n .mobilesIcons li.ant-dropdown-menu-item > svg {\n display: block;\n}\n.imageZoom .ant-modal-body>div{\n height: auto;\n overflow-y: auto;\n}\n.imageZoom .ant-modal-footer{\n padding-right: 16px !important;\n}\n .fadeImg{\n max-height: auto;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {\n width: 24px; font-size: 12px; font-weight: bold; }\n\n .ant-picker-dropdown .ant-picker-content th {\n height: 24px;\n }\n .ant-picker-dropdown .ant-picker-content td {\n font-size: 12px;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {\n width: 100%;\n }\n\n}\n.ant-picker .ant-picker-clear{\n font-size: 20px;\n}\n\n"])));
10
+ const CommonStyles = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n.tooltip-grid {\n display: flex;\n gap: 32px; /* Space between columns */\n}\n\n.tooltip-column {\n display: flex;\n flex-direction: column;\n width: 100%;\n}\n\n\n.multipleDocumentTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: max-content;\n border-radius: 12px;\n min-width: 300px;\n\n}\n .multipleDocumentTooltip .ant-tooltip-arrow:before{\n background: #fff;\n }\n .multipleDocumentTooltip li.tooltip-item{\n display: flex;\n gap: 8px;\n align-items: flex-start;\n color: #212121;\n font-size: 14px;\n font-weight: 400;\n line-height: 20px; \n padding: 8px 0;\n width: max-content;\n }\n .multipleDocumentTooltip ul .headingName{\n color: #717171;\n font-size: 12px;\n font-style: normal;\n font-weight: 700;\n line-height: 16px; \n letter-spacing: 0.24px;\n text-transform: uppercase;\n padding: 0 0 16px;\n }\n .multipleDocumentTooltip .flexWrap{\n display: flex;\n flex-wrap: wrap;\n column-count: 1;\n column-gap: 8px;\n list-style: none;\n justify-content: space-between;\n }\n.ant-modal .ant-modal-content {\n padding: 24px 24px 32px;\n border-radius: 12px;\n }\n .ant-select-dropdown .ant-select-item{\n min-height: auto !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-message{\n margin-bottom: 0 !important;\n }\n .ant-notification .ant-notification-notice-wrapper{\n background: transparent;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-close{\n position: inherit !important;\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice-closable .ant-notification-notice-message {\n padding-inline-end: 0px !important;\n}\n .ant-notification-notice-close > button{\n width: 24px !important;\n height: 24px !important;\n }\n .ant-notification .ant-notification-notice-wrapper .ant-notification-notice {\n display: flex;\n align-items: center;\n gap: 12px;\n justify-content: space-between;\n }\n @media (max-width: 372px) {\n .ant-picker-date-panel .ant-picker-body{\n padding: 8px !important;\n }\n }\n@media (max-width: 600px) {\n .ant-drawer .ant-drawer-header,.ant-drawer .ant-drawer-body{\n padding: 16px !important;\n }\n .ant-drawer .ant-drawer-footer {\n padding: 12px 16px;\n }\n .ant-picker-dropdown .ant-picker-date-panel{\n width: 100%;\n }\n .ant-picker-dropdown .ant-picker-time-panel-column {\n overflow-y: auto;\n}\n.ant-picker-dropdown .ant-picker-time-panel-column::-webkit-scrollbar {\n width: 2px;\n }\n\n .ant-modal-root .ant-modal-wrap {\n position: fixed;\n overflow: inherit;\n }\n .ant-modal-root .ant-modal-centered .ant-modal{\n vertical-align: middle;\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100% !important;\n max-width: 100%!important;\n // transform-origin: bottom !important;\n //animation-duration: 0s !important;\n animation-name: slideUp;\n animation-duration: 0.2s;\n transition: .3s ease-in-out;\n animation-timing-function: ease-in;\n }\n @keyframes slideUp {\n 0%,\n 50% {\n transform: translateY(100%);\n opacity: 0;\n }\n \n 60%,\n 100% {\n transform: translateY(0);\n opacity: 1;\n \n }\n }\n .ant-modal .ant-modal-content {\n bottom: -8px;\n left: 0;\n position: absolute;\n right: 0;\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n }\n .ant-modal .ant-modal-body{\n max-height: calc(90vh - 126px);\n overflow: auto;\n padding-right: 16px;\n }\n .ant-modal-footer{\n padding-right: 16px !important;\n }\n .ant-modal .ant-modal-content{\n padding: 24px 16px 32px;\n padding-right: 0;\n }\n}\n\n.ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item{\n padding: 12px 24px;\n}\n.ant-dropdown-menu{\n min-width: 256px;\n top: 4px;\n}\n.ant-space-item span{\n line-height: 0 !important;\n display: flex;\n}\n.ant-select-dropdown{border-radius: 4px; padding:8px 0 !important;\n background: var(--color-primary-background) ;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);}\n\n.ant-select-dropdown .ant-select-item { \n min-height: auto;\n padding: 12px 16px;\n color: var(--color-primary-content) ;\n line-height: 20px;\n border-radius: 0px;\n}\n\n.label-date-dropdown {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n gap: 16px;\n}\n\n.ant-select-dropdown .ant-select-item-option-active span{ color: var(--color-primary) !important;}\n.ant-picker-range {opacity: 0;}\n.ant-picker-dropdown-range { padding: 0; }\n\n.fadeImg{\n position: relative;\n width: 100%;\n max-height: 300px;\n overflow-x: auto;\n}\n.overLayImg{\n background: rgb(0 0 0 / 40%);\n border-radius: 12px 12px 0px 0px;\n overflow: hidden;\n}\n \n.OaTooltip .ant-tooltip-inner{\n padding: 24px 16px;\n background: #fff;\n color: #212121;\n box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n width: 348px;\n border-radius: 12px;\n}\n.OaTooltip .ant-tooltip-arrow:before{\n background: #fff !important;\n}\n.OaFooterBtn{\n display: flex;\n justify-content: end;\n}\n.OaTooltip{\n max-width: 348px !important;\n}\n.paddingBot .ant-drawer-body{\n padding-bottom: 100px !important;\n}\n.react-transform-component,.react-transform-wrapper,.react-transform-component > div{\n width: 100%;\n}\n.ascCollapse .ant-collapse-arrow{\n transform: rotate(90deg);\n color: var(--color-primary) !important;\n font-size: 14px !important;\n}\n.gappingIcons{\n display: flex;\n gap: 16px;\n}\n.imageZoom .ant-modal-body > div{\n height: 350px;\n overflow-y: auto;\n margin: 30px 0px 0px;\n padding: 0px 8px 0 0;;\n \n}\n/* width */\n.imageZoom ::-webkit-scrollbar {\n width: 8px;\n height: 100px;\n border-radius: 8px;\n}\n\n/* Track */\n.imageZoom ::-webkit-scrollbar-track {\n background: #f6f6f6; \n border-radius: 8px;\n}\n \n/* Handle */\n.imageZoom ::-webkit-scrollbar-thumb {\n background: #888; \n border-radius: 8px;\n height: 100px;\n}\n\n/* Handle on hover */\n.imageZoom ::-webkit-scrollbar-thumb:hover {\n background: #555; \n}\n .modalImg{\n width: 100%;\n }\n.overflowScroll{\n position: relative;\n}\n.ascCollapse .ant-collapse-header{\n border-radius: 4px !important;\n background: var(--color-secondary-background);\n}\n.ascCollapse,.ant-collapse{\n overflow: hidden;\n}\n.ascCollapse .totalVal{\n display: flex;\n gap: 12px;\n}\n.ascCollapse.ant-collapse-item-active .ant-collapse-arrow{\n transform: rotate(180deg) !important;\n}.mobilesIcons li.ant-dropdown-menu-item > svg {\n display: none\n}\n .ant-notification-notice-close svg{\n font-size: 24px !important;\n height: auto;\n }\n @media only screen and (max-width: 574px) {\n .ant-steps-item-tail{\n inset-inline-start: 78px !important;\n \n }\n}\n @media only screen and (max-width: 480px) {\n .ant-steps-item-tail{\n inset-inline-start: 60px !important;\n \n }\n}\n@media only screen and (max-width: 600px) {\n \n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-body {\n padding: 8px;\n }\n .ant-picker-dropdown { width: 100%; left: 0 !important; }\n .mobilesIcons li.ant-dropdown-menu-item > svg {\n display: block;\n}\n.imageZoom .ant-modal-body>div{\n height: auto;\n overflow-y: auto;\n}\n.imageZoom .ant-modal-footer{\n padding-right: 16px !important;\n}\n .fadeImg{\n max-height: auto;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content th {\n width: 24px; font-size: 12px; font-weight: bold; }\n\n .ant-picker-dropdown .ant-picker-content th {\n height: 24px;\n }\n .ant-picker-dropdown .ant-picker-content td {\n font-size: 12px;\n }\n .ant-picker-dropdown .ant-picker-date-panel .ant-picker-content {\n width: 100%;\n }\n\n}\n.ant-picker .ant-picker-clear{\n font-size: 20px;\n}\n\n"])));
11
11
  var _default = exports.default = CommonStyles;
@@ -23,6 +23,7 @@ var _MaterialIcon = _interopRequireDefault(require("../../components/oa-componen
23
23
  var _CustomTag = _interopRequireDefault(require("../../components/oa-component-tag/CustomTag"));
24
24
  var _CustomTooltip = _interopRequireDefault(require("../../components/oa-component-tooltip/CustomTooltip"));
25
25
  const _excluded = ["children", "description", "docDetails", "approvalForm", "isMandatory", "hasDivider", "isQuestionStyleWidget", "questionId", "title", "viewOnClick", "actionRenderType", "actionContent", "systemStatus", "documentTitle", "descriptionTitle", "data-test"];
26
+ /* eslint-disable */
26
27
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
27
28
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
28
29
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -70,7 +71,7 @@ function ApprovalWidget(_ref) {
70
71
  systemStatus,
71
72
  documentTitle,
72
73
  descriptionTitle,
73
- "data-test": dataTest
74
+ 'data-test': dataTest
74
75
  } = _ref,
75
76
  props = _objectWithoutProperties(_ref, _excluded);
76
77
  const getInitialValue = isApproved => {
@@ -88,11 +89,11 @@ function ApprovalWidget(_ref) {
88
89
  return /*#__PURE__*/_react.default.createElement(_styles.StyledContainer, null, /*#__PURE__*/_react.default.createElement("div", {
89
90
  className: "row"
90
91
  }, /*#__PURE__*/_react.default.createElement("div", {
91
- className: approvalForm.hidden ? "col-sm-12 col-md-12 col-lg-12" : "col-sm-12 col-md-7 col-lg-7 gutter"
92
+ className: approvalForm.hidden ? 'col-sm-12 col-md-12 col-lg-12' : 'col-sm-12 col-md-7 col-lg-7 gutter'
92
93
  }, /*#__PURE__*/_react.default.createElement("div", {
93
94
  className: "row"
94
95
  }, /*#__PURE__*/_react.default.createElement("div", {
95
- className: isQuestionStyleWidget ? "col-sm-12 col-md-12 col-lg-12" : "col-sm-12 col-md-9 col-lg-9 gutter flexCol12"
96
+ className: isQuestionStyleWidget ? 'col-sm-12 col-md-12 col-lg-12' : 'col-sm-12 col-md-9 col-lg-9 gutter flexCol12'
96
97
  }, title && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h4", {
97
98
  className: "type-b2-400"
98
99
  }, title, isMandatory && /*#__PURE__*/_react.default.createElement(_styles.RedText, null, "*"))), description && /*#__PURE__*/_react.default.createElement(_styles.Styledescription, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
@@ -106,7 +107,7 @@ function ApprovalWidget(_ref) {
106
107
  }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
107
108
  typography: "type-b2-400",
108
109
  color: "secondary-content"
109
- }, documentTitle, " \xA0"), /*#__PURE__*/_react.default.createElement(_UploadDownloadWidget.default, _extends({
110
+ }, documentTitle, ' ', "\xA0"), /*#__PURE__*/_react.default.createElement(_UploadDownloadWidget.default, _extends({
110
111
  disabled: (_approvalForm$disable = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.disabled) !== null && _approvalForm$disable !== void 0 ? _approvalForm$disable : false,
111
112
  "data-test": dataTest ? "".concat(dataTest, "--upload-download-widget") : undefined
112
113
  }, docDetails, {
@@ -116,51 +117,49 @@ function ApprovalWidget(_ref) {
116
117
  "data-test": dataTest ? "".concat(dataTest, "--view-button") : undefined,
117
118
  onClick: () => viewOnClick(questionId),
118
119
  type: "text-only",
119
- label: isQuestionStyleWidget ? "View Previous Description" : "View History"
120
+ label: isQuestionStyleWidget ? 'View Previous Description' : 'View History'
120
121
  }), children)), !isQuestionStyleWidget && /*#__PURE__*/_react.default.createElement("div", {
121
122
  className: "col-sm-12 col-md-3 col-lg-3 flexCol8"
122
- }, systemStatus === null || systemStatus === void 0 ? void 0 : systemStatus.map(status => /*#__PURE__*/_react.default.createElement("div", null, status.renderType === "text" && /*#__PURE__*/_react.default.createElement(_Typography.default, {
123
- typography: "type-b2-400",
124
- color: "secondary-content"
125
- }, status.label), status.renderType === "tag" && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_CustomTag.default, status)), status.renderType === "toolTip" && /*#__PURE__*/_react.default.createElement(_CustomTooltip.default, {
126
- overlayClassName: "multipleDocumentTooltip",
127
- isDisplayed: true,
128
- title: /*#__PURE__*/_react.default.createElement("div", {
129
- className: "tooltip-grid"
130
- }, /*#__PURE__*/_react.default.createElement("div", {
131
- className: "tooltip-column"
132
- }, [...Array(6)].map((_, index) => /*#__PURE__*/_react.default.createElement("li", {
133
- key: "col-1-".concat(index),
134
- className: "tooltip-item"
135
- }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
136
- size: 20,
137
- icon: _Close.default,
138
- color: "negative"
139
- }), " ", status.title, " - Col 1"))), /*#__PURE__*/_react.default.createElement("div", {
140
- className: "tooltip-column"
141
- }, [...Array(6)].map((_, index) => /*#__PURE__*/_react.default.createElement("li", {
142
- key: "col-2-".concat(index),
143
- className: "tooltip-item"
144
- }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
145
- size: 20,
146
- icon: _Check.default,
147
- color: "positive"
148
- }), " ", status.title, " - Col 2"))), /*#__PURE__*/_react.default.createElement("div", {
149
- className: "tooltip-column"
150
- }, [...Array(6)].map((_, index) => /*#__PURE__*/_react.default.createElement("li", {
151
- key: "col-3-".concat(index),
152
- className: "tooltip-item"
153
- }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
154
- size: 20,
155
- icon: _Close.default,
156
- color: "negative"
157
- }), " ", status.title, " - Col 3"))))
158
- }, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
159
- type: "text-only",
160
- label: status.label
161
- }))))))), approvalForm.invisible && /*#__PURE__*/_react.default.createElement("div", {
123
+ }, systemStatus === null || systemStatus === void 0 ? void 0 : systemStatus.map(status => {
124
+ var _status$items;
125
+ return /*#__PURE__*/_react.default.createElement("div", null, status.renderType === 'text' && /*#__PURE__*/_react.default.createElement(_Typography.default, {
126
+ typography: "type-b2-400",
127
+ color: "secondary-content"
128
+ }, status.label), status.renderType === 'tag' && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_CustomTag.default, status)), status.renderType === 'toolTip' && ((_status$items = status.items) === null || _status$items === void 0 ? void 0 : _status$items.length) > 0 && /*#__PURE__*/_react.default.createElement(_CustomTooltip.default, {
129
+ overlayClassName: "multipleDocumentTooltip",
130
+ isDisplayed: true,
131
+ title: (() => {
132
+ const maxItemsPerColumn = 6; // Maximum 6 <li> per column
133
+ const columns = [];
134
+
135
+ // Splitting items into columns of max 6 items each
136
+ for (let i = 0; i < status.items.length; i += maxItemsPerColumn) {
137
+ columns.push(status.items.slice(i, i + maxItemsPerColumn));
138
+ }
139
+ return /*#__PURE__*/_react.default.createElement("div", {
140
+ className: "tooltip-grid"
141
+ }, columns.map(columnItems => {
142
+ var _columnItems$;
143
+ return /*#__PURE__*/_react.default.createElement("div", {
144
+ key: "col-".concat((_columnItems$ = columnItems[0]) === null || _columnItems$ === void 0 ? void 0 : _columnItems$.title),
145
+ className: "tooltip-column"
146
+ }, columnItems.map(item => /*#__PURE__*/_react.default.createElement("li", {
147
+ key: item.title,
148
+ className: "tooltip-item"
149
+ }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
150
+ size: 20,
151
+ icon: item.type === 'positive' ? _Check.default : _Close.default,
152
+ color: item.type === 'positive' ? 'positive' : 'negative'
153
+ }), item.title)));
154
+ }));
155
+ })()
156
+ }, /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
157
+ type: "text-only",
158
+ label: status.label
159
+ })));
160
+ })))), approvalForm.invisible && /*#__PURE__*/_react.default.createElement("div", {
162
161
  className: "col-sm-12 col-md-5 col-lg-5"
163
- }) || !approvalForm.hidden && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, actionRenderType === "text" && /*#__PURE__*/_react.default.createElement("div", {
162
+ }) || !approvalForm.hidden && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, actionRenderType === 'text' && /*#__PURE__*/_react.default.createElement("div", {
164
163
  className: "oaActionText"
165
164
  }, /*#__PURE__*/_react.default.createElement(_MaterialIcon.default, {
166
165
  icon: _CheckCircle.default,
@@ -168,7 +167,7 @@ function ApprovalWidget(_ref) {
168
167
  }), /*#__PURE__*/_react.default.createElement(_Typography.default, {
169
168
  typography: "type-b2-400",
170
169
  color: "secondary-content"
171
- }, (_actionContent$label = actionContent === null || actionContent === void 0 ? void 0 : actionContent.label) !== null && _actionContent$label !== void 0 ? _actionContent$label : "-")), actionRenderType === "button" && /*#__PURE__*/_react.default.createElement(_CustomButton.default, actionContent), actionRenderType === "radio" && /*#__PURE__*/_react.default.createElement("div", {
170
+ }, (_actionContent$label = actionContent === null || actionContent === void 0 ? void 0 : actionContent.label) !== null && _actionContent$label !== void 0 ? _actionContent$label : '-')), actionRenderType === 'button' && /*#__PURE__*/_react.default.createElement(_CustomButton.default, actionContent), actionRenderType === 'radio' && /*#__PURE__*/_react.default.createElement("div", {
172
171
  className: "col-sm-12 col-md-5 col-lg-5"
173
172
  }, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
174
173
  name: "isApproved-".concat(questionId),
@@ -178,7 +177,7 @@ function ApprovalWidget(_ref) {
178
177
  required: true,
179
178
  message: dataTest ? /*#__PURE__*/_react.default.createElement("span", {
180
179
  "data-test": "".concat(dataTest, "--is-approved-validation-message")
181
- }, "Approval status needs to be selected.") : "Approval status needs to be selected."
180
+ }, "Approval status needs to be selected.") : 'Approval status needs to be selected.'
182
181
  }]
183
182
  }, /*#__PURE__*/_react.default.createElement(_CustomRadio.default.Group, {
184
183
  "data-test": dataTest ? "".concat(dataTest, "--is-approved-radio-group") : undefined,
@@ -198,12 +197,12 @@ function ApprovalWidget(_ref) {
198
197
  className: "type-b2-400"
199
198
  }, "Remarks"), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
200
199
  name: "remarks-".concat(questionId),
201
- initialValue: (_approvalForm$remarks = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.remarks) !== null && _approvalForm$remarks !== void 0 ? _approvalForm$remarks : "",
200
+ initialValue: (_approvalForm$remarks = approvalForm === null || approvalForm === void 0 ? void 0 : approvalForm.remarks) !== null && _approvalForm$remarks !== void 0 ? _approvalForm$remarks : '',
202
201
  rules: [{
203
202
  required: true,
204
203
  message: dataTest ? /*#__PURE__*/_react.default.createElement("span", {
205
204
  "data-test": "".concat(dataTest, "--remarks-validation-message")
206
- }, "Remarks cannot be empty.") : "Remarks cannot be empty."
205
+ }, "Remarks cannot be empty.") : 'Remarks cannot be empty.'
207
206
  }]
208
207
  }, /*#__PURE__*/_react.default.createElement(_antd.Input.TextArea, {
209
208
  "data-test": dataTest ? "".concat(dataTest, "--remarks") : undefined,
@@ -212,7 +211,7 @@ function ApprovalWidget(_ref) {
212
211
  }
213
212
  ApprovalWidget.propTypes = {
214
213
  children: _propTypes.default.node,
215
- "data-test": _propTypes.default.string,
214
+ 'data-test': _propTypes.default.string,
216
215
  description: _propTypes.default.string,
217
216
  // Leave description optional
218
217
  docDetails: _propTypes.default.shape({
@@ -253,8 +252,8 @@ ApprovalWidget.propTypes = {
253
252
  };
254
253
  ApprovalWidget.defaultProps = {
255
254
  children: null,
256
- "data-test": undefined,
257
- description: "",
255
+ 'data-test': undefined,
256
+ description: '',
258
257
  docDetails: {},
259
258
  approvalForm: {},
260
259
  isMandatory: false,
@@ -264,7 +263,7 @@ ApprovalWidget.defaultProps = {
264
263
  actionRenderType: undefined,
265
264
  actionContent: {},
266
265
  systemStatus: [],
267
- documentTitle: "",
268
- descriptionTitle: ""
266
+ documentTitle: '',
267
+ descriptionTitle: ''
269
268
  };
270
269
  var _default = exports.default = ApprovalWidget;
@@ -44,9 +44,9 @@ const getBase64 = file => new Promise((resolve, reject) => {
44
44
  * @returns {undefined}
45
45
  */
46
46
  const downloadFile = (base64String, fileName) => {
47
- const link = document.createElement("a");
47
+ const link = document.createElement('a');
48
48
  link.href = base64String;
49
- link.download = fileName || "download";
49
+ link.download = fileName || 'download';
50
50
  link.click();
51
51
  };
52
52
 
@@ -80,7 +80,7 @@ function DocumentUpload(props) {
80
80
  } = props;
81
81
  const [previewOpen, setPreviewOpen] = (0, _react.useState)(false);
82
82
  const [previewImage, setPreviewImage] = (0, _react.useState)(null);
83
- const [previewTitle, setPreviewTitle] = (0, _react.useState)("");
83
+ const [previewTitle, setPreviewTitle] = (0, _react.useState)('');
84
84
  const [loading, setLoading] = (0, _react.useState)(false);
85
85
  const [fileList, setFileList] = (0, _react.useState)(uploadedDocuments);
86
86
  const handleCancel = () => setPreviewOpen(false);
@@ -91,10 +91,10 @@ function DocumentUpload(props) {
91
91
  function isImageFile(fileName) {
92
92
  var _fileName$split;
93
93
  // Extract the file extension from the file name
94
- const fileExtension = fileName === null || fileName === void 0 || (_fileName$split = fileName.split(".")) === null || _fileName$split === void 0 || (_fileName$split = _fileName$split.pop()) === null || _fileName$split === void 0 ? void 0 : _fileName$split.toLowerCase();
94
+ const fileExtension = fileName === null || fileName === void 0 || (_fileName$split = fileName.split('.')) === null || _fileName$split === void 0 || (_fileName$split = _fileName$split.pop()) === null || _fileName$split === void 0 ? void 0 : _fileName$split.toLowerCase();
95
95
 
96
96
  // Define an array of image file extensions
97
- const imageFileExtensions = ["jpg", "jpeg", "png", "gif", "bmp", "tiff", "svg"];
97
+ const imageFileExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'tiff', 'svg'];
98
98
 
99
99
  // Check if the file extension is in the array of image file extensions
100
100
  if (imageFileExtensions.indexOf(fileExtension) !== -1) {
@@ -143,15 +143,15 @@ function DocumentUpload(props) {
143
143
  fileList: newFileList,
144
144
  file
145
145
  } = _ref;
146
- if (file.status === "removed") {
147
- onChange(null, "removed");
146
+ if (file.status === 'removed') {
147
+ onChange(null, 'removed');
148
148
  }
149
149
  const modifiedList = await Promise.all(newFileList.map(async files => {
150
150
  let modifiedFile = files;
151
151
  setLoading(true);
152
152
  try {
153
153
  await onChange(files);
154
- modifiedFile.status = "done";
154
+ modifiedFile.status = 'done';
155
155
  if (!isImageFile(file === null || file === void 0 ? void 0 : file.name)) {
156
156
  var _modifiedFile, _modifiedFile2;
157
157
  modifiedFile.url = _PdfSampleImage.default;
@@ -170,7 +170,7 @@ function DocumentUpload(props) {
170
170
  const uploadButton = /*#__PURE__*/_react.default.createElement("button", {
171
171
  style: {
172
172
  border: 0,
173
- background: "none"
173
+ background: 'none'
174
174
  },
175
175
  type: "button"
176
176
  }, loading ? /*#__PURE__*/_react.default.createElement(_icons.LoadingOutlined, null) : /*#__PURE__*/_react.default.createElement(_CustomIcon.default, {
@@ -187,7 +187,7 @@ function DocumentUpload(props) {
187
187
  color: "negative"
188
188
  }, " *"))), subText && /*#__PURE__*/_react.default.createElement("div", {
189
189
  style: {
190
- whiteSpace: "pre-line"
190
+ whiteSpace: 'pre-line'
191
191
  }
192
192
  }, /*#__PURE__*/_react.default.createElement(_Typography.default, {
193
193
  color: "secondary-content",
@@ -200,12 +200,12 @@ function DocumentUpload(props) {
200
200
  }, multipleDoc > 0 && /*#__PURE__*/_react.default.createElement("em", null, multipleDoc), /*#__PURE__*/_react.default.createElement(_antd.ConfigProvider, {
201
201
  theme: {
202
202
  token: {
203
- colorBorder: _ColorVariablesMap.default["--color-primary"],
203
+ colorBorder: _ColorVariablesMap.default['--color-primary'],
204
204
  borderRadiusLG: 4,
205
- colorPrimaryBorder: _ColorVariablesMap.default["--color-divider"],
206
- colorFillAlter: _ColorVariablesMap.default["--color-secondary-background"],
207
- colorError: _ColorVariablesMap.default["--color-negative"],
208
- colorText: _ColorVariablesMap.default["--color-primary"]
205
+ colorPrimaryBorder: _ColorVariablesMap.default['--color-divider'],
206
+ colorFillAlter: _ColorVariablesMap.default['--color-secondary-background'],
207
+ colorError: _ColorVariablesMap.default['--color-negative'],
208
+ colorText: _ColorVariablesMap.default['--color-primary']
209
209
  }
210
210
  }
211
211
  }, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
@@ -229,12 +229,12 @@ function DocumentUpload(props) {
229
229
  onCancel: handleCancel
230
230
  }, /*#__PURE__*/_react.default.createElement("div", {
231
231
  style: {
232
- textAlign: "center"
232
+ textAlign: 'center'
233
233
  }
234
- }, " ", previewImage ? /*#__PURE__*/_react.default.createElement("img", {
234
+ }, ' ', previewImage ? /*#__PURE__*/_react.default.createElement("img", {
235
235
  alt: "example",
236
236
  style: {
237
- width: "100%"
237
+ width: '100%'
238
238
  },
239
239
  src: previewImage
240
240
  }) : /*#__PURE__*/_react.default.createElement(_CustomLoader.default, null))));
@@ -255,10 +255,10 @@ DocumentUpload.propTypes = {
255
255
  DocumentUpload.defaultProps = {
256
256
  uploadedDocuments: [],
257
257
  onChange: () => {},
258
- subText: "",
259
- heading: "",
260
- formName: "",
261
- infoText: "",
258
+ subText: '',
259
+ heading: '',
260
+ formName: '',
261
+ infoText: '',
262
262
  multipleDoc: 0,
263
263
  showDelete: true,
264
264
  getPreview: () => {},
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oa-componentbook",
3
- "version": "1.0.1-stage.54",
3
+ "version": "1.0.1-stage.55",
4
4
  "private": false,
5
5
  "description": "Reusable components",
6
6
  "main": "build/index.js",