@copart/ops-tool-kit 1.13.0-beta.13 → 1.13.0-beta.15

package/dist/ops-tool-kit.js

@@ -6,7 +6,7 @@ var React = require('react');
 var ReactDOM = require('react-dom');
 var frontEndUtils = require('@copart/front-end-utils');
 var coreComponents = require('@copart/core-components');
-var reactRouterDom = require('react-router-dom');
+var ReactRouterDOM = require('react-router-dom');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -46,9 +46,10 @@ function _mergeNamespaces(n, m) {
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
+var ReactRouterDOM__namespace = /*#__PURE__*/_interopNamespace(ReactRouterDOM);
 
 const name$1 = "@copart/ops-tool-kit";
-const version$3 = "1.13.0-beta.13";
+const version$3 = "1.13.0-beta.15";
 const main$1 = "dist/ops-tool-kit.js";
 const style = "dist/ops-tool-kit.css";
 const files = [
@@ -109,7 +110,7 @@ const devDependencies$1 = {
 const peerDependencies = {
   "@copart/core-components": "2.3.0-alpha.filters.6",
   react: "*",
-  "react-router-dom": "^5.0.0"
+  "react-router-dom": "^5.0.0 || ^6.0.0"
 };
 const dependencies$1 = {
   "@reacting/purist": "0.1.0",
@@ -63583,6 +63584,47 @@ var formatNumber = function formatNumber(number) {
   return sign * Math.abs(number) + unitlist[unit];
 };
 
+/**
+ * Default badge color thresholds used by many portal apps (e.g. MiOrg open tasks).
+ * Matches legacy getStatus(count) logic: >1000 → 1, >500 → 2, >0 → 3.
+ */
+var STANDARD_NAV_COUNT_THRESHOLDS = [{
+  above: 1000,
+  status: 1
+}, {
+  above: 500,
+  status: 2
+}, {
+  above: 0,
+  status: 3
+}];
+
+/**
+ * Resolve badge status from a count using getStatus (in-app) or countStatusThresholds (iframe shell).
+ *
+ * @param {number|string|null|undefined} count
+ * @param {{ getStatus?: (n: number) => number, countStatusThresholds?: Array<{ above?: number, min?: number, status: number }> }} navItem
+ * @returns {number|undefined}
+ */
+function resolveCountStatus(count) {
+  var navItem = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  if (count == null || count === '') return undefined;
+  var num = Number(count);
+  if (Number.isNaN(num)) return undefined;
+  if (typeof navItem.getStatus === 'function') {
+    return navItem.getStatus(num);
+  }
+  var thresholds = navItem.countStatusThresholds;
+  if (!Array.isArray(thresholds) || thresholds.length === 0) return undefined;
+  for (var i = 0; i < thresholds.length; i += 1) {
+    var threshold = thresholds[i];
+    if (!threshold || threshold.status == null) continue;
+    if (threshold.above != null && num > threshold.above) return threshold.status;
+    if (threshold.min != null && num >= threshold.min) return threshold.status;
+  }
+  return undefined;
+}
+
 var css_248z$2 = ".utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer {\r\n  display: flex;\r\n  flex-direction: column;\r\n  position: absolute;\r\n  background: #3A4454;\r\n  min-width: 50px;\r\n  max-width: 50px;\r\n  height: 100%;\r\n  color: #ffffff;\r\n  font-size: 14px;\r\n  z-index: 101;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu {\r\n  min-width: 70px;\r\n  max-width: 70px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--withCounts {\r\n  min-width: 100px;\r\n  max-width: 100px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader {\r\n  min-width: 0px;\r\n  max-width: 0px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen {\r\n  max-width: 500px;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: none;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton.utilities_ops-app-frame_NavigationBar_NavigationBar--showExpandIcons{\r\n  min-width: auto;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton{\r\n  min-width: auto;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu {\r\n  flex: 1;\r\n  overflow-y: auto;\r\n  -ms-overflow-style: none;\r\n  scrollbar-width: none;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenu::-webkit-scrollbar { \r\n  display: none;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\r\n  display: flex;\r\n  width: 100%;\r\n  padding: 6px 12px 6px 12px;\r\n  border-radius: 5px;\r\n  cursor: pointer;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--disabled {\r\n  cursor: default;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelected {\r\n  color: #323130;\r\n  background-color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelectedStatus {\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  margin-left: auto;\r\n  margin-right: 10px;\r\n  min-width: none;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--withCounts:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--countsAvailable .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: 70px;\r\n  text-align: right;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--countsAvailable:not(:hover) .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: auto;\r\n  text-align: auto;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: 70px !important;\r\n  text-align: right !important;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--expandedMenu {\r\n  background-color: #73A6FF;\r\n  transition: background-color 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i {\r\n  margin-left: auto;\r\n  font-size: 12px;\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--selected .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  color: #323130;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemCount {\r\n  margin: 0 10px 0 auto;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\r\n  min-width: 20px;\r\n  display: flex;\r\n  justify-content: center;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon i {\r\n  font-size: 14px;\r\n  /* width: 20px; */\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--disabled .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon i {\r\n  color: #A19F9D;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelected .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon i{\r\n  color: #323130;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelectedStatus .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon i{\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelected .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  color: #323130;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemSelectedStatus .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1NoHover .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  margin-right: 6px !important;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--disabled .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i {\r\n  color: #A19F9D;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  font-size: 0px;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton.utilities_ops-app-frame_NavigationBar_NavigationBar--showExpandIcons i, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  font-size: 12px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  font-size: 12px;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  max-width: 0;\r\n  overflow: hidden;\r\n  white-space: nowrap;\r\n  margin-top: 2px;\r\n  font-weight: 100;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  max-width: 100%;\r\n  margin: 2px 10px 0 10px;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--disabled .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  color: #A19F9D;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  max-width: 100%;\r\n  margin: 0 5px 0 0;\r\n  font-weight: 600;\r\n  margin-left: 0px;\r\n  cursor: auto;\r\n  cursor: initial;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  cursor: pointer;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName {\r\n  margin: 0;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\r\n  margin-right: 0px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\r\n  padding-left: 12px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemName > span {\r\n  display: inline;\r\n  display: initial;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  margin-left: auto;\r\n  margin-right: 10px;\r\n  min-width: none;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu.utilities_ops-app-frame_NavigationBar_NavigationBar--withCounts:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu.utilities_ops-app-frame_NavigationBar_NavigationBar--countsAvailable .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: 70px;\r\n  text-align: right;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu.utilities_ops-app-frame_NavigationBar_NavigationBar--countsAvailable:not(:hover) .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: auto;\r\n  text-align: auto;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton {\r\n  min-width: 70px !important;\r\n  text-align: right !important;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i {\r\n  margin-left: auto;\r\n  font-size: 12px;\r\n  color: #fff;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem.utilities_ops-app-frame_NavigationBar_NavigationBar--selected .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  color: #323130;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton.utilities_ops-app-frame_NavigationBar_NavigationBar--showExpandIcons i{\r\n  font-size: 12px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 > .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--expandButton i{\r\n  font-size: 12px;\r\n  transition-delay: 0.25s;\r\n}\r\n\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--level3Menu .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel2 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItemIcon {\r\n  margin-right: 6px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3 {\r\n  display: flex;\r\n  position: relative;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel3 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem {\r\n  padding: 6px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--statusColor {\r\n  position: absolute;\r\n  width: 10px;\r\n  height: 95%;\r\n  left: -13px;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--level1NavItem {\r\n  width: 13px;\r\n  margin-left: 1px;\r\n  transition: all 0.5s ease-in-out;\r\n}\r\n\r\n.utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer:not(.utilities_ops-app-frame_NavigationBar_NavigationBar--showNavIconInHeader):hover .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--level1NavItem, .utilities_ops-app-frame_NavigationBar_NavigationBar--NavBarContainer.utilities_ops-app-frame_NavigationBar_NavigationBar--navBarOpen .utilities_ops-app-frame_NavigationBar_NavigationBar--NavMenuLevel1 .utilities_ops-app-frame_NavigationBar_NavigationBar--NavItem .utilities_ops-app-frame_NavigationBar_NavigationBar--level1NavItem {\r\n  width: 100%;\r\n  margin-left: 1px;\r\n  transition-delay: 0.25s;\r\n}";
 styleInject(css_248z$2);
 
@@ -64329,9 +64371,9 @@ var NavigationMenuLevel3 = function NavigationMenuLevel3(_ref6) {
   var isHoverEnabled = showNavIconInHeader || isHover;
   var countText = !isHoverEnabled ? formatNumber(count) : count;
   var status, statusColor;
-  if (countText && navItem.getStatus && navItem.getStatus) {
-    status = navItem.getStatus(count);
-    statusColor = statusColors[status];
+  if (countText != null && countText !== '') {
+    status = resolveCountStatus(count, navItem);
+    if (status != null) statusColor = statusColors[status];
   }
   var position = (navItem === null || navItem === void 0 ? void 0 : navItem.statusColorPosition) || '';
   var isDisabled = typeof navItem.disabled === 'function' ? navItem.disabled() : navItem.disabled;
@@ -68335,6 +68377,19 @@ function postNavConfig(navItems) {
     navItems: navItems
   });
 }
+
+/**
+ * Push nav badge counts to the shell.
+ * @param {Record<string, Record<string, number>>} countsByMenu
+ *   Top-level menu route/name → sub-route counts, e.g.
+ *   { tasks: { 'open-tasks': 5 }, admin: { 'staged-users': 2 } }
+ */
+function postNavCounts(countsByMenu) {
+  if (!countsByMenu || _typeof$1(countsByMenu) !== 'object') return;
+  post('UPDATE_NAV_COUNTS', {
+    countsByMenu: countsByMenu
+  });
+}
 function postAppEnv(toolkitEnv, mihelpAgentProps) {
   post('SET_APP_ENV', {
     toolkitEnv: toolkitEnv,
@@ -69600,6 +69655,7 @@ var iframeFacade = {
     postUpdateUri: postUpdateUri,
     postUpdateCrumbs: postUpdateCrumbs,
     postNavConfig: postNavConfig,
+    postNavCounts: postNavCounts,
     postAppEnv: postAppEnv,
     addMessageListener: addMessageListener,
     getInitData: getInitData,
@@ -69617,6 +69673,20 @@ function normalizeIframePath(uri) {
   return uri.startsWith('/') ? uri : "/".concat(uri);
 }
 
+function serializeCountStatusThresholds(thresholds) {
+  if (!Array.isArray(thresholds)) return undefined;
+  var serialized = thresholds.filter(function (t) {
+    return t && t.status != null && (t.above != null || t.min != null);
+  }).map(function (t) {
+    var entry = {
+      status: t.status
+    };
+    if (t.above != null) entry.above = t.above;
+    if (t.min != null) entry.min = t.min;
+    return entry;
+  });
+  return serialized.length > 0 ? serialized : undefined;
+}
 function serializeNavItems(items) {
   if (!Array.isArray(items)) return [];
   return items.map(function (item) {
@@ -69644,6 +69714,11 @@ function serializeNavItems(items) {
       serialized.hidden = item.hidden;
     }
     if (item.isLandingPage) serialized.isLandingPage = true;
+    if (typeof item.statusColorPosition === 'string') {
+      serialized.statusColorPosition = item.statusColorPosition;
+    }
+    var thresholds = serializeCountStatusThresholds(item.countStatusThresholds);
+    if (thresholds) serialized.countStatusThresholds = thresholds;
     if (item.subMenuItems && item.subMenuItems.length > 0) {
       serialized.subMenuItems = serializeNavItems(item.subMenuItems);
     }
@@ -69651,13 +69726,68 @@ function serializeNavItems(items) {
   });
 }
 
+/**
+ * True when the host app uses react-router-dom v6+ (`useNavigate` present, `useHistory` removed).
+ */
+var IS_REACT_ROUTER_V6 = typeof ReactRouterDOM__namespace.useNavigate === 'function' && typeof ReactRouterDOM__namespace.useHistory !== 'function';
+function normalizeNavigateTarget(to) {
+  if (typeof to === 'string') return normalizeIframePath(to);
+  return to;
+}
+function useRouterNavigationV5() {
+  var history = ReactRouterDOM__namespace.useHistory();
+  var location = ReactRouterDOM__namespace.useLocation();
+  var navigate = React.useCallback(function (to, options) {
+    if (typeof to === 'number') {
+      history.go(to);
+      return;
+    }
+    var target = normalizeNavigateTarget(to);
+    if ((options === null || options === void 0 ? void 0 : options.state) != null) history.push(target, options.state);else if (options !== null && options !== void 0 && options.replace) history.replace(target);else history.push(target);
+  }, [history]);
+  return {
+    navigate: navigate,
+    location: location
+  };
+}
+function useRouterNavigationV6() {
+  var navigateFn = ReactRouterDOM__namespace.useNavigate();
+  var location = ReactRouterDOM__namespace.useLocation();
+  var navigate = React.useCallback(function (to, options) {
+    if (typeof to === 'number') {
+      navigateFn(to);
+      return;
+    }
+    var target = normalizeNavigateTarget(to);
+    if ((options === null || options === void 0 ? void 0 : options.state) != null || options !== null && options !== void 0 && options.replace) {
+      navigateFn(target, {
+        state: options === null || options === void 0 ? void 0 : options.state,
+        replace: options === null || options === void 0 ? void 0 : options.replace
+      });
+    } else {
+      navigateFn(target);
+    }
+  }, [navigateFn]);
+  return {
+    navigate: navigate,
+    location: location
+  };
+}
+
+/**
+ * Router-agnostic navigation for iframe shell components.
+ * Uses `useHistory` on react-router-dom v5 and `useNavigate` on v6.
+ */
+var useRouterNavigation = IS_REACT_ROUTER_V6 ? useRouterNavigationV6 : useRouterNavigationV5;
+
 function IframeRouteSync(_ref) {
   var _ref$updateUriIsPath = _ref.updateUriIsPath,
     updateUriIsPath = _ref$updateUriIsPath === void 0 ? false : _ref$updateUriIsPath,
     _ref$suppressEcho = _ref.suppressEcho,
     suppressEcho = _ref$suppressEcho === void 0 ? true : _ref$suppressEcho;
-  var history = reactRouterDom.useHistory();
-  var location = reactRouterDom.useLocation();
+  var _useRouterNavigation = useRouterNavigation(),
+    navigate = _useRouterNavigation.navigate,
+    location = _useRouterNavigation.location;
   var initialRef = React.useRef(true);
   var suppressUpdateUriRef = React.useRef(false);
   React.useEffect(function () {
@@ -69665,11 +69795,11 @@ function IframeRouteSync(_ref) {
       if (data.eventType === 'LOAD_URI' && data.eventProps) {
         var path = normalizeIframePath(data.eventProps.uri);
         if (suppressEcho) suppressUpdateUriRef.current = true;
-        history.push(path);
+        navigate(path);
       }
     });
     return remove;
-  }, [history, suppressEcho]);
+  }, [navigate, suppressEcho]);
   React.useEffect(function () {
     if (initialRef.current) {
       initialRef.current = false;
@@ -69727,6 +69857,70 @@ function NavConfigSender(_ref) {
   return null;
 }
 
+var DEFAULT_POLL_INTERVAL_MS = 60000;
+function resolveCountsLoader(mod) {
+  if (!mod) return null;
+  if (typeof mod === 'function') return mod;
+  if (typeof mod.default === 'function') return mod.default;
+  if (typeof mod.getNavCounts === 'function') return mod.getNavCounts;
+  return null;
+}
+
+/**
+ * Polls nav badge counts inside the iframe and pushes them to the shell via UPDATE_NAV_COUNTS.
+ *
+ * @param {Object} props
+ * @param {() => Promise<{ default?: Function, getNavCounts?: Function } | Function>} props.countsLoader
+ *   Dynamic import returning a function that resolves to countsByMenu, e.g.
+ *   { tasks: { 'open-tasks': 5 }, admin: { 'staged-users': 2 } }
+ * @param {number} [props.pollIntervalMs=60000] Set to 0 to post once on mount only.
+ * @param {(err: Error) => void} [props.onError]
+ */
+function NavCountsSender(_ref) {
+  var countsLoader = _ref.countsLoader,
+    _ref$pollIntervalMs = _ref.pollIntervalMs,
+    pollIntervalMs = _ref$pollIntervalMs === void 0 ? DEFAULT_POLL_INTERVAL_MS : _ref$pollIntervalMs,
+    onError = _ref.onError;
+  var mountedRef = React.useRef(true);
+  React.useEffect(function () {
+    mountedRef.current = true;
+    if (!countsLoader) return undefined;
+    var intervalId;
+    var fetchAndPost = function fetchAndPost() {
+      Promise.resolve().then(function () {
+        return countsLoader();
+      }).then(function (mod) {
+        var loader = resolveCountsLoader(mod);
+        if (!loader) {
+          throw new Error('[NavCountsSender] countsLoader must export a function');
+        }
+        return loader();
+      }).then(function (countsByMenu) {
+        if (!mountedRef.current) return;
+        if (countsByMenu && _typeof$1(countsByMenu) === 'object') {
+          postNavCounts(countsByMenu);
+        }
+      }).catch(function (err) {
+        if (!mountedRef.current) return;
+        if (onError) {
+          onError(err);
+        } else {
+          console.warn('[NavCountsSender] Failed to load/post nav counts:', err);
+        }
+      });
+    };
+    fetchAndPost();
+    if (pollIntervalMs > 0) {
+      intervalId = setInterval(fetchAndPost, pollIntervalMs);
+    }
+    return function () {
+      mountedRef.current = false;
+      if (intervalId) clearInterval(intervalId);
+    };
+  }, [countsLoader, pollIntervalMs, onError]);
+  return null;
+}
+
 var defaultContentStyle = {
   height: '100%',
   display: 'flex',
@@ -69740,13 +69934,15 @@ function IframeAppRootInner(_ref) {
     mihelpAgentProps = _ref.mihelpAgentProps,
     navItemsLoader = _ref.navItemsLoader,
     navConfigOnError = _ref.navConfigOnError,
+    navCountsLoader = _ref.navCountsLoader,
+    navCountsPollIntervalMs = _ref.navCountsPollIntervalMs,
+    navCountsOnError = _ref.navCountsOnError,
     updateUriIsPath = _ref.updateUriIsPath,
     suppressRouteSyncEcho = _ref.suppressRouteSyncEcho;
-  var history = reactRouterDom.useHistory();
+  var _useRouterNavigation = useRouterNavigation(),
+    navigate = _useRouterNavigation.navigate;
   return /*#__PURE__*/React__default["default"].createElement(CrumbProvider, {
-    navigate: function navigate(path) {
-      return history.push(path);
-    }
+    navigate: navigate
   }, /*#__PURE__*/React__default["default"].createElement(AppEnvSender, {
     toolkitEnv: toolkitEnv,
     mihelpAgentProps: mihelpAgentProps
@@ -69756,6 +69952,10 @@ function IframeAppRootInner(_ref) {
   }), navItemsLoader ? /*#__PURE__*/React__default["default"].createElement(NavConfigSender, {
     navItemsLoader: navItemsLoader,
     onError: navConfigOnError
+  }) : null, navCountsLoader ? /*#__PURE__*/React__default["default"].createElement(NavCountsSender, {
+    countsLoader: navCountsLoader,
+    pollIntervalMs: navCountsPollIntervalMs,
+    onError: navCountsOnError
   }) : null, /*#__PURE__*/React__default["default"].createElement("div", {
     style: contentStyle || defaultContentStyle
   }, children));
@@ -69770,12 +69970,15 @@ function IframeAppRoot(_ref2) {
     mihelpAgentProps = _ref2$mihelpAgentProp === void 0 ? null : _ref2$mihelpAgentProp,
     navItemsLoader = _ref2.navItemsLoader,
     navConfigOnError = _ref2.navConfigOnError,
+    navCountsLoader = _ref2.navCountsLoader,
+    navCountsPollIntervalMs = _ref2.navCountsPollIntervalMs,
+    navCountsOnError = _ref2.navCountsOnError,
     _ref2$updateUriIsPath = _ref2.updateUriIsPath,
     updateUriIsPath = _ref2$updateUriIsPath === void 0 ? false : _ref2$updateUriIsPath,
     _ref2$suppressRouteSy = _ref2.suppressRouteSyncEcho,
     suppressRouteSyncEcho = _ref2$suppressRouteSy === void 0 ? true : _ref2$suppressRouteSy;
   var initialPath = normalizeIframePath(initialUri);
-  return /*#__PURE__*/React__default["default"].createElement(reactRouterDom.MemoryRouter, {
+  return /*#__PURE__*/React__default["default"].createElement(ReactRouterDOM.MemoryRouter, {
     initialEntries: [initialPath],
     initialIndex: 0
   }, /*#__PURE__*/React__default["default"].createElement(IframeAppRootInner, {
@@ -69784,6 +69987,9 @@ function IframeAppRoot(_ref2) {
     mihelpAgentProps: mihelpAgentProps,
     navItemsLoader: navItemsLoader,
     navConfigOnError: navConfigOnError,
+    navCountsLoader: navCountsLoader,
+    navCountsPollIntervalMs: navCountsPollIntervalMs,
+    navCountsOnError: navCountsOnError,
     updateUriIsPath: updateUriIsPath,
     suppressRouteSyncEcho: suppressRouteSyncEcho
   }, children));
@@ -81628,15 +81834,20 @@ exports.AutoRefresh = AutoRefresh;
 exports.CallLogger = CallLogger;
 exports.ContextualHelp = ContextualHelp;
 exports.Crumb = Crumb$1;
+exports.IS_REACT_ROUTER_V6 = IS_REACT_ROUTER_V6;
 exports.IframeAppRoot = IframeAppRoot;
 exports.IframeRouteSync = IframeRouteSync;
 exports.NavConfigSender = NavConfigSender;
+exports.NavCountsSender = NavCountsSender;
+exports.STANDARD_NAV_COUNT_THRESHOLDS = STANDARD_NAV_COUNT_THRESHOLDS;
 exports.accessHelpers = accessHelpers$1;
 exports.bootstrapIframeApp = bootstrapIframeApp;
 exports.fetcher = fetcher$1;
 exports.iframeFacade = iframeFacade;
 exports.normalizeIframePath = normalizeIframePath;
 exports.registerEarlyLoadUriListener = registerEarlyLoadUriListener;
+exports.resolveCountStatus = resolveCountStatus;
 exports.serializeNavItems = serializeNavItems;
 exports.storage = storage$2;
+exports.useRouterNavigation = useRouterNavigation;
 //# sourceMappingURL=ops-tool-kit.js.map