@copart/ops-tool-kit 1.12.0-alpha.19 → 1.12.0-alpha.20

package/dist/ops-tool-kit.js

@@ -32,7 +32,7 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 
 const name$r = "@copart/ops-tool-kit";
-const version$7 = "1.12.0-alpha.19";
+const version$7 = "1.12.0-alpha.20";
 const main$1 = "dist/ops-tool-kit.js";
 const style = "dist/ops-tool-kit.css";
 const files = [
@@ -24851,7 +24851,7 @@ var SettingsView = /*#__PURE__*/function (_React$Component) {
   return SettingsView;
 }(React__default["default"].Component);
 
-var css_248z$7 = ".utilities_ops-announcements_Banner--appBarContentBox {\n  word-break: break-all;\n  white-space: pre-wrap;\n  font-weight: 600;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContent {\n  padding: 0px 5px;\n  font-size: 13px;\n  width: 95%;\n  display: flex;\n  align-items: end;\n  grid-gap: 20px;\n  gap: 20px\n}\n\n.utilities_ops-announcements_Banner--tabNotificationInfoBox {\n  display: flex;\n  color: #6c7a89;\n  grid-gap: 8px;\n  gap: 8px;\n  width: 90%;\n  font-size: 12px;\n}\n\n.utilities_ops-announcements_Banner--tabNotificationInfoBox b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  overflow: hidden;\n  font-weight: 600;\n  /* autoprefixer: off */\n  -webkit-box-orient: vertical;\n  /* autoprefixer: on */\n  font-size: 12px;\n  color: #201F1E;\n  cursor: default;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox *{\n  display: inline;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox a{\n  text-decoration: underline;\n}\n\n.utilities_ops-announcements_Banner--tabNotificationBarContentBox {\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  overflow: hidden;\n  width: 95%;\n  font-weight: 600;\n  /* autoprefixer: off */\n  -webkit-box-orient: vertical;\n  /* autoprefixer: on */\n  font-size: 12px;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox {\n  display: flex;\n  color: #6c7a89;\n  grid-gap: 6px;\n  gap: 6px;\n  font-size: 12px;\n  margin-bottom: 5px;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox i{\n  font-size: 16px !important;\n}\n\n.utilities_ops-announcements_Banner--navBtnContainer {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  grid-gap: 5px;\n  gap: 5px;\n  font-size: 12px;\n}\n\n.utilities_ops-announcements_Banner--navBtnContainer .utilities_ops-announcements_Banner--notificationLeftBtn i{\n  position: relative;\n  right: -4px;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer {\n  display: flex;\n  flex-direction: row;\n  padding: 10px 10px;\n  grid-gap: 5px;\n  gap: 5px;\n  min-height: 40px;\n  width: 100%;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer i{\n  font-size: 20px;\n}\n\n.utilities_ops-announcements_Banner--navBtnContainer i{\n  font-size: 16px;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer.utilities_ops-announcements_Banner--tabNotificationBar {\n  flex-direction: column;\n}\n\n.utilities_ops-announcements_Banner--arrowTipContainer {\n  width: 0px;\n  height: 0px;\n  border-left: 8px solid transparent;\n  border-right: 8px solid transparent;\n  border-bottom: 13px solid white;\n  position: absolute;\n  top: 51px;\n  right: 50px;\n}\n\n.utilities_ops-announcements_Banner--appBarContentWrapper {\n  padding: 0px 5px;\n  font-size: 12px;\n  flex: 1 1 0%;\n  display: flex;\n  flex-direction: column;\n  grid-gap: 4px;\n  gap: 4px;\n}\n\n.utilities_ops-announcements_Banner--appBarContentWrapper b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--feedUrl {\n  text-decoration: none !important;\n}\n\n.utilities_ops-announcements_Banner--feedUrl i {\n  font-size: 14px;\n  cursor: pointer;\n  color: #1d5ab9;\n  left: 2px;\n  position: relative;\n  top: 2px;\n  margin-right: 3px;\n}\n";
+var css_248z$7 = ".utilities_ops-announcements_Banner--appBarContentBox {\n  word-break: break-all;\n  white-space: pre-wrap;\n  font-weight: 600;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContent {\n  padding: 10px 10px;\n  font-size: 13px;\n  width: 95%;\n  display: flex;\n  align-items: center;\n  grid-gap: 20px;\n  gap: 20px;\n}\n\n.utilities_ops-announcements_Banner--tabNotificationInfoBox {\n  display: flex;\n  color: #6c7a89;\n  grid-gap: 8px;\n  gap: 8px;\n  width: 90%;\n  font-size: 12px;\n}\n\n.utilities_ops-announcements_Banner--tabNotificationInfoBox b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  overflow: hidden;\n  /* font-weight: 600; */\n  /* autoprefixer: off */\n  -webkit-box-orient: vertical;\n  /* autoprefixer: on */\n  font-size: 12px;\n  color: #201F1E;\n  cursor: default;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox *{\n  display: inline;\n}\n\n.utilities_ops-announcements_Banner--notificationBarContentBox a{\n  text-decoration: underline;\n}\n\n.utilities_ops-announcements_Banner--tabNotificationBarContentBox {\n  display: -webkit-box;\n  -webkit-line-clamp: 3;\n  overflow: hidden;\n  width: 95%;\n  font-weight: 600;\n  /* autoprefixer: off */\n  -webkit-box-orient: vertical;\n  /* autoprefixer: on */\n  font-size: 12px;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox i{\n  font-size: 16px !important;\n}\n\n.utilities_ops-announcements_Banner--notificationBtnContainer {\n  display: flex;\n  flex-direction: row;\n  justify-content: center;\n  grid-gap: 10px;\n  gap: 10px;\n  font-size: 12px;\n  align-items: center;\n  padding: 0px 10px;\n}\n\n.utilities_ops-announcements_Banner--notificationBtnContainer .utilities_ops-announcements_Banner--notificationLeftBtn i{\n  position: relative;\n  right: -4px;\n}\n\n.utilities_ops-announcements_Banner--notificationBtnContainer .utilities_ops-announcements_Banner--notificationCountContainer {\n  width: 50px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer {\n  display: flex;\n  flex-direction: row;\n  /* padding: 10px 10px; */\n  grid-gap: 5px;\n  gap: 5px;\n  min-height: 40px;\n  width: 100%;\n}\n\n.utilities_ops-announcements_Banner--notificationInfoBox {\n  color: white;\n  width: 52px;\n  min-height: 52px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.utilities_ops-announcements_Banner--notificationBarBtn {\n  width: 52px;\n  min-height: 52px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer i{\n  font-size: 20px;\n}\n\n.utilities_ops-announcements_Banner--notificationBtnContainer i{\n  font-size: 22px;\n}\n\n.utilities_ops-announcements_Banner--notificationContainer.utilities_ops-announcements_Banner--tabNotificationBar {\n  flex-direction: column;\n  padding: 10px 10px;\n}\n\n.utilities_ops-announcements_Banner--arrowTipContainer {\n  width: 0px;\n  height: 0px;\n  border-left: 8px solid transparent;\n  border-right: 8px solid transparent;\n  border-bottom: 13px solid white;\n  position: absolute;\n  top: 51px;\n  right: 50px;\n}\n\n.utilities_ops-announcements_Banner--appBarContentWrapper {\n  padding: 0px 5px;\n  font-size: 12px;\n  flex: 1 1 0%;\n  display: flex;\n  flex-direction: column;\n  grid-gap: 4px;\n  gap: 4px;\n}\n\n.utilities_ops-announcements_Banner--appBarContentWrapper b{\n  color: #171717;\n}\n\n.utilities_ops-announcements_Banner--feedUrl {\n  text-decoration: none !important;\n}\n\n.utilities_ops-announcements_Banner--feedUrl i {\n  font-size: 14px;\n  cursor: pointer;\n  color: #1d5ab9;\n  left: 2px;\n  position: relative;\n  top: 2px;\n  margin-right: 3px;\n}\n";
 styleInject(css_248z$7);
 
 var _nodeResolve_empty = {};
@@ -31220,10 +31220,10 @@ var alertInfoColorMapping = {
   success: 'rgb(50 179 55)'
 };
 var alertToIconMapping = {
-  alert: 'ErrorBadge',
-  warning: 'Warning',
-  information: 'Info',
-  success: 'Accept'
+  alert: 'circle-exclamation',
+  warning: 'triangle-exclamation',
+  information: 'circle-info',
+  success: 'circle-check'
 };
 var Actions = function Actions(_ref) {
   var onLeftButtonClick = _ref.onLeftButtonClick,
@@ -31231,34 +31231,27 @@ var Actions = function Actions(_ref) {
     current = _ref.current,
     onRightButtonClick = _ref.onRightButtonClick;
   return /*#__PURE__*/React__default["default"].createElement("div", {
-    style: {}
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "utilities_ops-announcements_Banner--navBtnContainer"
+    className: "utilities_ops-announcements_Banner--notificationBtnContainer"
   }, /*#__PURE__*/React__default["default"].createElement("span", {
-    onClick: onLeftButtonClick,
+    onClick: current > 1 ? onLeftButtonClick : null,
     className: "utilities_ops-announcements_Banner--notificationLeftBtn"
-  }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
-    name: "arrow_back_ios",
-    variant: "material",
+  }, /*#__PURE__*/React__default["default"].createElement(coreComponents.IconV2, {
+    disabled: current === 1,
+    name: "circle-chevron-left",
     style: {
-      fontSize: '16px',
       cursor: 'pointer'
     }
-  })), count > 1 && /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("span", {
-    style: {
-      position: 'relative',
-      top: '1px'
-    }
-  }, "".concat(current, "/").concat(count))), /*#__PURE__*/React__default["default"].createElement("span", {
-    onClick: onRightButtonClick
-  }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
-    name: "arrow_forward_ios",
-    variant: "material",
+  })), count > 1 && /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "utilities_ops-announcements_Banner--notificationCountContainer"
+  }, /*#__PURE__*/React__default["default"].createElement("span", null, "".concat(current, "/").concat(count))), /*#__PURE__*/React__default["default"].createElement("span", {
+    onClick: current < count ? onRightButtonClick : null
+  }, /*#__PURE__*/React__default["default"].createElement(coreComponents.IconV2, {
+    disabled: current === count,
+    name: "circle-chevron-right",
     style: {
-      fontSize: '16px',
       cursor: 'pointer'
     }
-  }))));
+  })));
 };
 var Banner = function Banner(props) {
   var count = props.count,
@@ -31307,12 +31300,17 @@ var Banner = function Banner(props) {
       style: {
         backgroundColor: alertBackgroundColorMapping[categoryDescription.toLowerCase()]
       }
-    }, showNavButtons && /*#__PURE__*/React__default["default"].createElement(Actions, {
-      onLeftButtonClick: onLeftButtonClick,
-      count: count,
-      current: current,
-      onRightButtonClick: onRightButtonClick
-    }), /*#__PURE__*/React__default["default"].createElement("div", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "utilities_ops-announcements_Banner--notificationInfoBox",
+      style: {
+        backgroundColor: alertInfoColorMapping[categoryDescription.toLowerCase()]
+      }
+    }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(coreComponents.IconV2, {
+      name: alertToIconMapping[categoryDescription.toLowerCase()],
+      style: {
+        fontSize: '19px'
+      }
+    }))), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "utilities_ops-announcements_Banner--notificationBarContent",
       style: expanded ? {
         flexDirection: 'column',
@@ -31321,20 +31319,12 @@ var Banner = function Banner(props) {
         flexDirection: 'row'
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
-      className: "utilities_ops-announcements_Banner--notificationInfoBox"
-    }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
-      name: alertToIconMapping[categoryDescription.toLowerCase()],
-      style: {
-        fontSize: '19px',
-        color: alertInfoColorMapping[categoryDescription.toLowerCase()]
-      }
-    })), /*#__PURE__*/React__default["default"].createElement("div", null, sourceApplication && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("b", null, sourceApplication), " -"), " ", timeDiff)), /*#__PURE__*/React__default["default"].createElement("div", {
       className: "utilities_ops-announcements_Banner--notificationBarContentBox",
       ref: contentBarRef,
       style: _objectSpread2({}, expanded && {
         WebkitLineClamp: 'unset'
       })
-    }, /*#__PURE__*/React__default["default"].createElement("span", {
+    }, /*#__PURE__*/React__default["default"].createElement("div", null, sourceApplication && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("b", null, sourceApplication), " -"), " ", timeDiff), /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, " : "), /*#__PURE__*/React__default["default"].createElement("span", {
       onClick: function onClick() {
         return isContentOverFlow && setExpanded(!expanded);
       },
@@ -31352,25 +31342,35 @@ var Banner = function Banner(props) {
       notification: notification,
       saveActionComponentState: saveActionComponentState
     })), isContentOverFlow && /*#__PURE__*/React__default["default"].createElement("div", {
-      style: {
-        cursor: 'pointer'
-      },
+      className: "utilities_ops-announcements_Banner--notificationBarBtn",
       onClick: function onClick() {
         return setExpanded(!expanded);
       }
     }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
-      name: expanded ? 'keyboard_double_arrow_up' : 'keyboard_double_arrow_down',
-      variant: "material"
-    })), (dismissibleFlag === true || dismissibleFlag === "true") && /*#__PURE__*/React__default["default"].createElement("div", {
       style: {
-        cursor: 'pointer',
-        marginLeft: 'auto'
+        cursor: 'pointer'
       },
+      name: expanded ? 'keyboard_double_arrow_up' : 'keyboard_double_arrow_down',
+      variant: "material"
+    })), showNavButtons && /*#__PURE__*/React__default["default"].createElement(Actions, {
+      onLeftButtonClick: onLeftButtonClick,
+      count: count,
+      current: current,
+      onRightButtonClick: onRightButtonClick
+    }), /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "utilities_ops-announcements_Banner--notificationBarBtn",
+      style: dismissibleFlag === true || dismissibleFlag === "true" ? {
+        borderLeft: '2px solid rgb(204, 204, 204)'
+      } : {}
+    }, (dismissibleFlag === true || dismissibleFlag === "true") && /*#__PURE__*/React__default["default"].createElement("div", {
       onClick: onDismiss
     }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
+      style: {
+        cursor: 'pointer'
+      },
       name: "close",
       variant: "material"
-    })));
+    }))));
   };
   var sideNotificationBar = function sideNotificationBar() {
     return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -31382,7 +31382,7 @@ var Banner = function Banner(props) {
       style: {
         marginTop: '3px'
       }
-    }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
+    }, /*#__PURE__*/React__default["default"].createElement(coreComponents.IconV2, {
       name: alertToIconMapping[categoryDescription.toLowerCase()],
       style: {
         fontSize: '16px',
@@ -31439,10 +31439,10 @@ var Banner = function Banner(props) {
       }
     }, /*#__PURE__*/React__default["default"].createElement("div", {
       className: "utilities_ops-announcements_Banner--tabNotificationInfoBox"
-    }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
+    }, /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(coreComponents.IconV2, {
       name: alertToIconMapping[categoryDescription.toLowerCase()],
       style: {
-        fontSize: '16px',
+        fontSize: '12px',
         color: alertInfoColorMapping[categoryDescription.toLowerCase()]
       }
     })), /*#__PURE__*/React__default["default"].createElement("div", null, sourceApplication && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("b", null, sourceApplication), " -"), " ", timeDiff)), /*#__PURE__*/React__default["default"].createElement("div", null, showNavButtons && /*#__PURE__*/React__default["default"].createElement(Actions, {
@@ -31472,7 +31472,7 @@ var Banner = function Banner(props) {
       style: {
         cursor: 'pointer',
         marginLeft: 'auto',
-        marginTop: '3px'
+        marginTop: '2px'
       },
       onClick: onDismiss
     }, /*#__PURE__*/React__default["default"].createElement(coreComponents.Icon, {
@@ -35062,7 +35062,12 @@ var AppBar = function AppBar(_ref) {
       phoneStatus: '',
       phoneStatusProcessing: false
     } : _storage$chromePlugin;
-  return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(AppBar$1, {
+  return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement(Notifications, {
+    notifications: notifications || [],
+    onDismiss: dismissNotification,
+    ActionComponent: ActionComponent,
+    saveActionComponentState: saveActionComponentState
+  }), /*#__PURE__*/React__default["default"].createElement(AppBar$1, {
     moduleName: "OPS PORTAL",
     isLoggedOn: storage$1.isAuthenticated,
     config: APP_BAR_CONFIGS[STACK],
@@ -35101,11 +35106,6 @@ var AppBar = function AppBar(_ref) {
     showMihelpDot: showMihelpDot,
     setShowMihelpTooltip: setShowMihelpTooltip,
     showMihelpTooltip: showMihelpTooltip
-  }), /*#__PURE__*/React__default["default"].createElement(Notifications, {
-    notifications: notifications || [],
-    onDismiss: dismissNotification,
-    ActionComponent: ActionComponent,
-    saveActionComponentState: saveActionComponentState
   }), latestRelease && /*#__PURE__*/React__default["default"].createElement(LatestReleaseDialog, {
     release: latestRelease,
     handleClose: handleReleaseClose,