@zealsolutions/zeal-ui 1.0.0-alpha.362 → 1.0.0-alpha.364

package/dist/components/header/index.js

@@ -1,33 +1,33 @@
-import { openBlock as a, createElementBlock as u, createVNode as T, createElementVNode as r, createTextVNode as j, mergeModels as ne, useModel as ke, getCurrentInstance as ce, ref as k, computed as $, watch as K, nextTick as oe, onMounted as ge, onBeforeUnmount as we, createBlock as I, Teleport as Ce, withModifiers as N, withDirectives as G, vModelText as $e, createCommentVNode as v, normalizeClass as M, toDisplayString as b, Fragment as H, renderList as P, normalizeStyle as q, pushScopeId as Se, popScopeId as _e, Transition as ue, withCtx as F, resolveDynamicComponent as de, unref as Q, vShow as pe, renderSlot as R } from "vue";
-import Me from "../../HouseIcon-BxmNyxvv.js";
-import Te from "../../ArrowLeftIcon-Cgsy08pY.js";
-import { _ as Ae } from "../../Tooltip-CQjz2EXM.js";
-import fe from "../../MagnifyingGlassIcon-ChYNIA-H.js";
-import { _ as Ie } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
-import { o as xe } from "../../index-D9ihCfA2.js";
-import ae from "../../BellIcon-lK5EZXNf.js";
-import Ee from "../../CircleCheckIcon-CA15yXgI.js";
-import Ne from "../../XMarkIcon-DKJ_--uA.js";
-const He = /* @__PURE__ */ r("span", { class: "hidden whitespace-nowrap sm:inline" }, "Search", -1), Oe = /* @__PURE__ */ r("kbd", { class: "zui-search-kbd hidden items-center gap-px rounded border-[1px] border-proclusteal-300 dark:border-line bg-proclusteal-100 dark:bg-surface px-[5px] py-0.5 font-sans text-[11px] font-bold leading-none text-proclusteal-500 dark:text-content-muted sm:inline-flex" }, [
+import { openBlock as a, createElementBlock as i, createVNode as I, createElementVNode as r, createTextVNode as B, mergeModels as le, useModel as _e, getCurrentInstance as fe, ref as k, computed as C, watch as q, nextTick as se, onMounted as Se, onBeforeUnmount as Me, createBlock as T, Teleport as Ie, withModifiers as E, withDirectives as Y, vModelText as Ae, createCommentVNode as m, normalizeClass as M, toDisplayString as b, Fragment as N, renderList as L, unref as W, normalizeStyle as G, pushScopeId as Te, popScopeId as Ne, Transition as xe, withCtx as J, resolveDynamicComponent as he, vShow as ye, renderSlot as V } from "vue";
+import ze from "../../HouseIcon-BxmNyxvv.js";
+import Ee from "../../ArrowLeftIcon-Cgsy08pY.js";
+import { _ as He } from "../../Tooltip-CQjz2EXM.js";
+import ve from "../../MagnifyingGlassIcon-ChYNIA-H.js";
+import { _ as Oe } from "../../_plugin-vue_export-helper-CHgC5LLL.js";
+import { o as me } from "../../index-D9ihCfA2.js";
+import ie from "../../BellIcon-lK5EZXNf.js";
+import Le from "../../CircleCheckIcon-CA15yXgI.js";
+import je from "../../XMarkIcon-DKJ_--uA.js";
+const De = /* @__PURE__ */ r("span", { class: "hidden whitespace-nowrap sm:inline" }, "Search", -1), Pe = /* @__PURE__ */ r("kbd", { class: "zui-search-kbd hidden items-center gap-px rounded border-[1px] border-surface-raised/40 bg-surface-raised/15 px-[5px] py-0.5 font-sans text-[11px] font-bold leading-none text-surface-raised/90 sm:inline-flex" }, [
   /* @__PURE__ */ r("span", null, "⌘"),
-  /* @__PURE__ */ j("K ")
-], -1), Le = {
+  /* @__PURE__ */ B("K ")
+], -1), Ue = {
   __name: "GlobalSearchPill",
   emits: ["click"],
   setup(e) {
-    return (i, o) => (a(), u("button", {
+    return (l, n) => (a(), i("button", {
       type: "button",
-      class: "zui-search-pill inline-flex h-[34px] cursor-pointer items-center justify-center gap-[7px] rounded-lg border-[1px] border-solid border-proclusteal-300 dark:border-line bg-surface-raised pl-[11px] pr-[9px] font-sans text-[13px] font-semibold text-proclusteal-600 dark:text-content-muted transition-[border-color,color,box-shadow] duration-150 hover:border-proclusteal-950 dark:hover:border-focus hover:text-proclusteal-800 dark:hover:text-content hover:shadow-[0_1px_3px_rgba(20,40,45,0.08)] focus:border-proclusteal-950 dark:focus:border-focus focus:text-proclusteal-800 dark:focus:text-content focus:outline-none",
+      class: "zui-search-pill inline-flex h-[34px] cursor-pointer items-center justify-center gap-[7px] rounded-lg border-[1px] border-solid border-content bg-content pl-[11px] pr-[9px] font-sans text-[13px] font-semibold text-surface-raised transition-[background-color,border-color,box-shadow] duration-150 hover:border-content-muted hover:bg-content-muted hover:shadow-[0_1px_3px_rgba(20,40,45,0.18)] focus:border-content-muted focus:bg-content-muted focus:outline-none",
       title: "Search (Ctrl K)",
       "aria-label": "Search (Ctrl K)",
-      onClick: o[0] || (o[0] = (y) => i.$emit("click"))
+      onClick: n[0] || (n[0] = (h) => l.$emit("click"))
     }, [
-      T(fe, { class: "!h-[15px] !w-[15px] flex-none text-proclusteal-950 dark:text-focus" }),
-      He,
-      Oe
+      I(ve, { class: "!h-[15px] !w-[15px] flex-none text-surface-raised" }),
+      De,
+      Pe
     ]));
   }
-}, D = {
+}, U = {
   Contact: { label: "Contacts", colour: "#1a8a7d", icon: '<path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/>' },
   Incident: { label: "Incidents", colour: "#cd5c5c", icon: '<path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/>' },
   Asset: { label: "Assets", colour: "#8b4789", icon: '<path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/>' },
@@ -35,65 +35,125 @@ const He = /* @__PURE__ */ r("span", { class: "hidden whitespace-nowrap sm:inlin
   Change: { label: "Change", colour: "#8b008b", icon: '<polyline points="17 1 21 5 17 9"/><path d="M3 11V9a4 4 0 0 1 4-4h14"/><polyline points="7 23 3 19 7 15"/><path d="M21 13v2a4 4 0 0 1-4 4H3"/>' },
   Safety: { label: "Safety", colour: "#7cb342", icon: '<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>' },
   LID: { label: "Lessons", colour: "#ff8c00", icon: '<path d="M9 18h6"/><path d="M10 22h4"/><path d="M15.09 14c.18-.98.65-1.74 1.41-2.5A4.65 4.65 0 0 0 18 8 6 6 0 1 0 6 8c0 1 .21 2.24 1.5 3.5.76.76 1.23 1.52 1.41 2.5"/>' },
-  RefLib: { label: "Reference Library", colour: "#4a90b8", icon: '<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>' },
-  ActionCard: { label: "Action Cards", colour: "#8b0000", icon: '<rect x="1" y="4" width="22" height="16" rx="2" ry="2"/><line x1="1" y1="10" x2="23" y2="10"/>' },
+  RefLib: { newWindow: !0, label: "Reference Library", colour: "#4a90b8", icon: '<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>' },
+  ActionCard: { newWindow: !0, label: "Action Cards", colour: "#8b0000", icon: '<rect x="1" y="4" width="22" height="16" rx="2" ry="2"/><line x1="1" y1="10" x2="23" y2="10"/>' },
   EDS: { label: "Equipment Data", colour: "#708090", icon: '<path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2"/><rect x="8" y="2" width="8" height="4" rx="1" ry="1"/><line x1="8" y1="12" x2="16" y2="12"/><line x1="8" y1="16" x2="14" y2="16"/>' },
   TIS: { label: "Training Sheets", colour: "#4682b4", icon: '<line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/><line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>' },
   Training: { label: "Training", colour: "#3f7cac", icon: '<path d="M22 10 12 5 2 10l10 5 10-5z"/><path d="M6 12v5c0 1 2.7 3 6 3s6-2 6-3v-5"/>' }
-}, ze = {
+}, Be = {
   colour: "#9aa4ad",
   icon: '<circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.65" y2="16.65"/>'
 };
-function De(e, i = {}) {
-  const o = { ...D, ...i };
-  return Object.prototype.hasOwnProperty.call(o, e) ? o[e] : { ...ze, label: e };
+function Re(e, l = {}) {
+  const n = { ...U, ...l };
+  return Object.prototype.hasOwnProperty.call(n, e) ? n[e] : { ...Be, label: e };
 }
-function je(e) {
-  return (e == null ? "" : String(e)).replace(/[&<>"']/g, (i) => ({
+function Ve(e) {
+  return (e == null ? "" : String(e)).replace(/[&<>"']/g, (l) => ({
     "&": "&amp;",
     "<": "&lt;",
     ">": "&gt;",
     '"': "&quot;",
     "'": "&#39;"
-  })[i]);
+  })[l]);
 }
-function he(e) {
+function be(e) {
   if (!e)
     return "";
-  const i = String(e).trim();
-  return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(i) || /^(rgb|rgba|hsl|hsla)\([0-9.,%\s/]+\)$/i.test(i) || /^[a-z]{3,20}$/i.test(i) ? i : "";
+  const l = String(e).trim();
+  return /^#([0-9a-f]{3}|[0-9a-f]{6}|[0-9a-f]{8})$/i.test(l) || /^(rgb|rgba|hsl|hsla)\([0-9.,%\s/]+\)$/i.test(l) || /^[a-z]{3,20}$/i.test(l) ? l : "";
 }
-function O(e) {
+function j(e) {
   if (!e)
     return "";
-  const i = String(e).trim();
-  if (i.includes("\\"))
+  const l = String(e).trim();
+  if (l.includes("\\"))
     return "";
-  let o;
+  let n;
   try {
-    o = new URL(i, "https://url-check.invalid/");
+    n = new URL(l, "https://url-check.invalid/");
   } catch {
     return "";
   }
-  return o.protocol === "http:" || o.protocol === "https:" ? i : "";
+  return n.protocol === "http:" || n.protocol === "https:" ? l : "";
 }
-function Pe(e) {
-  return String(e || "").toLowerCase().split(/\s+/).filter((i) => i.length >= 2);
+function Ke(e) {
+  return String(e || "").toLowerCase().split(/\s+/).filter((l) => l.length >= 2);
 }
-function re(e, i) {
-  const o = je(e);
-  if (!i || !i.length)
-    return o;
-  const y = new RegExp(`(${i.map((p) => p.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|")})`, "ig");
-  return o.replace(y, "<mark>$1</mark>");
+function ce(e, l) {
+  const n = Ve(e);
+  if (!l || !l.length)
+    return n;
+  const h = new RegExp(`(${l.map((f) => f.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")).join("|")})`, "ig");
+  return n.replace(h, "<mark>$1</mark>");
 }
-const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-search-field flex items-center gap-2.5 border-b-[1px] border-proclusteal-200 dark:border-line px-4 py-3.5" }, Re = ["placeholder"], Ve = {
+const We = {
+  video: '<polygon points="23 7 16 12 23 17 23 7"/><rect x="1" y="5" width="15" height="14" rx="2" ry="2"/>',
+  image: '<rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/>',
+  pdf: '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="9" y1="15" x2="15" y2="15"/>',
+  word: '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><polyline points="8 13 9.5 18 12 14 14.5 18 16 13"/>',
+  excel: '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="9" y1="13" x2="15" y2="19"/><line x1="15" y1="13" x2="9" y2="19"/>',
+  presentation: '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><rect x="8" y="12" width="8" height="5" rx="1"/>',
+  document: '<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/>'
+};
+function qe(e, l) {
+  return typeof e != "string" ? l : We[e.toLowerCase()] || l;
+}
+const Q = "zui.search.recent", ke = 5;
+function F() {
+  try {
+    const e = window.localStorage.getItem(Q);
+    if (!e)
+      return [];
+    const l = JSON.parse(e);
+    return Array.isArray(l) ? l.filter((n) => typeof n == "string" && n.trim().length > 0).slice(0, ke) : [];
+  } catch {
+    return [];
+  }
+}
+function Ge(e) {
+  const l = typeof e == "string" ? e.trim() : "";
+  if (!l)
+    return F();
+  const n = [l, ...F().filter((h) => h.toLowerCase() !== l.toLowerCase())].slice(0, ke);
+  try {
+    window.localStorage.setItem(Q, JSON.stringify(n));
+  } catch {
+  }
+  return n;
+}
+function Fe() {
+  try {
+    window.localStorage.removeItem(Q);
+  } catch {
+  }
+  return [];
+}
+const X = (e) => (Te("data-v-24311187"), e = e(), Ne(), e), Ye = { class: "zui-search-field flex items-center gap-2.5 border-b-[1px] border-proclusteal-200 dark:border-line px-4 py-3.5" }, Je = ["placeholder"], Qe = {
   key: 0,
   class: "px-[18px] pb-0.5 pt-3.5 text-[15px] font-extrabold text-[#1e262c] dark:text-content"
-}, Ke = {
+}, Xe = {
   key: 1,
   class: "border-b-[1px] border-proclusteal-200 dark:border-line px-[18px] pb-3 pt-2.5"
-}, qe = ["onClick"], Ge = { class: "zui-search-group sticky top-0 z-[1] border-t-[1px] border-proclusteal-200 dark:border-line bg-proclusteal-150 dark:bg-surface px-[18px] py-2 text-[12px] font-extrabold tracking-[0.3px] text-proclusteal-700 dark:text-content" }, Fe = { class: "ml-0.5 text-[#667079] dark:text-content-muted" }, Qe = ["href", "data-row-idx", "onClick", "onMouseenter"], Ye = ["innerHTML"], Xe = { class: "min-w-0 flex-1" }, Je = ["innerHTML"], We = ["innerHTML"], Ze = /* @__PURE__ */ Ue(() => /* @__PURE__ */ r("svg", {
+}, Ze = ["onClick"], et = {
+  key: 0,
+  class: "zui-search-recent py-1.5"
+}, tt = { class: "flex items-center justify-between px-[18px] py-2" }, nt = /* @__PURE__ */ X(() => /* @__PURE__ */ r("span", { class: "text-[12px] font-extrabold tracking-[0.3px] text-proclusteal-700 dark:text-content" }, "Recent searches", -1)), ot = ["onClick"], at = /* @__PURE__ */ X(() => /* @__PURE__ */ r("svg", {
+  class: "h-4 w-4 flex-none text-[#9aa4ad]",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "2",
+  "stroke-linecap": "round",
+  "stroke-linejoin": "round"
+}, [
+  /* @__PURE__ */ r("circle", {
+    cx: "12",
+    cy: "12",
+    r: "10"
+  }),
+  /* @__PURE__ */ r("polyline", { points: "12 6 12 12 16 14" })
+], -1)), rt = { class: "min-w-0 flex-1 truncate" }, lt = { class: "zui-search-group sticky top-0 z-[1] border-t-[1px] border-proclusteal-200 dark:border-line bg-proclusteal-150 dark:bg-surface px-[18px] py-2 text-[12px] font-extrabold tracking-[0.3px] text-proclusteal-700 dark:text-content" }, st = { class: "ml-0.5 text-[#667079] dark:text-content-muted" }, it = ["href", "target", "rel", "data-row-idx", "onClick", "onMouseenter"], ct = ["innerHTML"], ut = { class: "min-w-0 flex-1" }, dt = ["innerHTML"], pt = ["innerHTML"], ft = /* @__PURE__ */ X(() => /* @__PURE__ */ r("svg", {
   class: "h-4 w-4 flex-none text-[#c2cad1] dark:text-content-muted",
   viewBox: "0 0 24 24",
   fill: "none",
@@ -103,9 +163,9 @@ const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-
   "stroke-linejoin": "round"
 }, [
   /* @__PURE__ */ r("polyline", { points: "9 18 15 12 9 6" })
-], -1)), le = "zui-search-chip mb-2 mr-2 inline-flex cursor-pointer items-center gap-[7px] rounded-[20px] border-[1px] border-[#dde3e8] dark:border-line bg-[#f4f6f8] dark:bg-surface px-3.5 py-1.5 text-[13px] font-bold text-proclusteal-700 dark:text-content hover:border-proclusteal-950 dark:hover:border-focus", se = "!border-proclusteal-950 !bg-proclusteal-950 !text-white", V = "zui-search-state px-5 py-[26px] text-center text-[13px] font-medium text-[#667079] dark:text-content-muted", et = {
+], -1)), ue = "zui-search-chip mb-2 mr-2 inline-flex cursor-pointer items-center gap-[7px] rounded-[20px] border-[1px] border-[#dde3e8] dark:border-line bg-[#f4f6f8] dark:bg-surface px-3.5 py-1.5 text-[13px] font-bold text-proclusteal-700 dark:text-content hover:border-proclusteal-950 dark:hover:border-focus", de = "!border-proclusteal-950 !bg-proclusteal-950 !text-white", K = "zui-search-state px-5 py-[26px] text-center text-[13px] font-medium text-[#667079] dark:text-content-muted", xt = {
   __name: "GlobalSearchModal",
-  props: /* @__PURE__ */ ne({
+  props: /* @__PURE__ */ le({
     searchProvider: {
       type: Function,
       required: !0
@@ -130,137 +190,150 @@ const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-
     open: { type: Boolean, default: !1 },
     openModifiers: {}
   }),
-  emits: /* @__PURE__ */ ne(["navigate"], ["update:open"]),
-  setup(e, { emit: i }) {
-    const o = e, y = i, p = ke(e, "open"), x = ce(), w = k(null), _ = k(null), A = k(null), g = k(""), S = k(""), m = k([]), f = k("all"), n = k("zero"), c = k(-1);
-    let d = null, C = 0, L = null, E = null;
-    const Y = $(() => Pe(S.value)), X = (t) => De(t, o.types), J = $(() => {
+  emits: /* @__PURE__ */ le(["navigate"], ["update:open"]),
+  setup(e, { emit: l }) {
+    const n = e, h = l, f = _e(e, "open"), y = fe(), w = k(null), _ = k(null), A = k(null), g = k(""), $ = k(""), v = k([]), x = k("all"), o = k("zero"), u = k(-1), p = k([]);
+    let S = null, H = 0, D = null, z = null;
+    const Z = C(() => Ke($.value)), ee = (t) => Re(t, n.types), te = C(() => {
       let t = 0;
-      return m.value.filter((s) => f.value === "all" || s.type === f.value).map((s) => {
-        const l = X(s.type);
+      return v.value.filter((c) => x.value === "all" || c.type === x.value).map((c) => {
+        const s = ee(c.type);
         return {
-          type: s.type,
-          label: l.label,
-          items: s.items.map((h) => ({
-            url: O(h.Url),
-            titleHtml: re(h.Title, Y.value),
-            subtitleHtml: re(h.Subtitle, Y.value),
-            tileColour: he(h.Colour) || l.colour,
-            tileIcon: l.icon,
+          type: c.type,
+          label: s.label,
+          items: c.items.map((d) => ({
+            url: j(d.Url),
+            titleHtml: ce(d.Title, Z.value),
+            subtitleHtml: ce(d.Subtitle, Z.value),
+            tileColour: be(d.Colour) || s.colour,
+            // #518: the item's own kind wins, the group's icon is the fallback.
+            tileIcon: qe(d.Kind, s.icon),
+            // #519: a file opens in a new tab so the search - and whatever the user was
+            // doing behind it - is still there when they close the document. The ITEM may
+            // override its group, because one group can hold both files and pages.
+            newWindow: d.NewWindow === !0 || d.NewWindow !== !1 && s.newWindow === !0,
             flatIdx: t++
           }))
         };
       });
-    }), W = $(() => J.value.flatMap((t) => t.items)), ye = $(() => m.value.reduce((t, s) => t + s.items.length, 0));
-    function U(t) {
-      const s = W.value;
-      if (!s.length) {
-        c.value = -1;
+    }), ne = C(() => te.value.flatMap((t) => t.items)), ge = C(() => v.value.reduce((t, c) => t + c.items.length, 0));
+    function R(t) {
+      const c = ne.value;
+      if (!c.length) {
+        u.value = -1;
         return;
       }
-      c.value = Math.min(Math.max(t, 0), s.length - 1), oe(() => {
-        var h;
-        const l = (h = A.value) == null ? void 0 : h.querySelector(`[data-row-idx="${c.value}"]`);
-        l == null || l.scrollIntoView({ block: "nearest" });
+      u.value = Math.min(Math.max(t, 0), c.length - 1), se(() => {
+        var d;
+        const s = (d = A.value) == null ? void 0 : d.querySelector(`[data-row-idx="${u.value}"]`);
+        s == null || s.scrollIntoView({ block: "nearest" });
       });
     }
-    function Z(t) {
-      var s;
-      f.value = t, U(0), (s = w.value) == null || s.focus();
+    function oe(t) {
+      var c;
+      x.value = t, R(0), (c = w.value) == null || c.focus();
     }
-    function ee(t) {
-      var s, l;
-      t && (y("navigate", t), (l = (s = x == null ? void 0 : x.vnode) == null ? void 0 : s.props) != null && l.onNavigate || (window.location.href = t), z());
+    function ae(t, c = !1) {
+      var s, d;
+      if (t) {
+        if (c) {
+          window.open(t, "_blank", "noopener"), O();
+          return;
+        }
+        h("navigate", t), (d = (s = y == null ? void 0 : y.vnode) == null ? void 0 : s.props) != null && d.onNavigate || (window.location.href = t), O();
+      }
     }
-    function z() {
-      p.value = !1;
+    function O() {
+      f.value = !1;
     }
-    async function me(t) {
-      const s = ++C;
-      S.value = t;
+    async function we(t) {
+      const c = ++H;
+      $.value = t;
       try {
-        const l = await o.searchProvider(t);
-        if (s !== C || !p.value)
+        const s = await n.searchProvider(t);
+        if (c !== H || !f.value)
           return;
-        m.value = l && l.groups || [], f.value = "all", n.value = m.value.length ? "results" : "empty", U(0);
+        v.value = s && s.groups || [], x.value = "all", o.value = v.value.length ? "results" : "empty", v.value.length && (p.value = Ge(t)), R(0);
       } catch {
-        if (s !== C || !p.value)
+        if (c !== H || !f.value)
           return;
-        m.value = [], n.value = "error", c.value = -1;
+        v.value = [], o.value = "error", u.value = -1;
       }
     }
-    K(g, (t) => {
-      clearTimeout(d);
-      const s = t.trim();
-      if (s.length < o.minChars) {
-        C++, m.value = [], n.value = s.length ? "hint" : "zero", c.value = -1;
+    q(g, (t) => {
+      clearTimeout(S);
+      const c = t.trim();
+      if (c.length < n.minChars) {
+        H++, v.value = [], o.value = c.length ? "hint" : "zero", u.value = -1;
         return;
       }
-      d = setTimeout(() => me(s), o.debounce);
-    }), K(p, (t) => {
-      t ? (L = document.activeElement, g.value = "", S.value = "", m.value = [], f.value = "all", n.value = "zero", c.value = -1, E = document.body.style.overflow, document.body.style.overflow = "hidden", oe(() => {
-        var s;
-        return (s = w.value) == null ? void 0 : s.focus();
-      })) : (clearTimeout(d), C++, E !== null && (document.body.style.overflow = E, E = null), L != null && L.focus && L.focus());
+      S = setTimeout(() => we(c), n.debounce);
+    }), q(f, (t) => {
+      t ? (D = document.activeElement, p.value = F(), g.value = "", $.value = "", v.value = [], x.value = "all", o.value = "zero", u.value = -1, z = document.body.style.overflow, document.body.style.overflow = "hidden", se(() => {
+        var c;
+        return (c = w.value) == null ? void 0 : c.focus();
+      })) : (clearTimeout(S), H++, z !== null && (document.body.style.overflow = z, z = null), D != null && D.focus && D.focus());
     }, { immediate: !0 });
-    function ve(t) {
-      var s;
+    function Ce(t) {
+      var c;
       if (t.key === "Escape") {
-        t.preventDefault(), z();
+        t.preventDefault(), O();
         return;
       }
       if (t.key === "ArrowDown") {
-        t.preventDefault(), U(c.value + 1);
+        t.preventDefault(), R(u.value + 1);
         return;
       }
       if (t.key === "ArrowUp") {
-        t.preventDefault(), U(c.value - 1);
+        t.preventDefault(), R(u.value - 1);
         return;
       }
       if (t.key === "Enter") {
         if (t.isComposing)
           return;
-        const l = W.value;
-        if (!l.length)
+        const s = ne.value;
+        if (!s.length)
           return;
-        t.preventDefault(), ee(l[c.value >= 0 ? c.value : 0].url);
+        t.preventDefault();
+        const d = s[u.value >= 0 ? u.value : 0];
+        ae(d.url, d.newWindow);
         return;
       }
       if (t.key === "Tab") {
-        const l = (s = _.value) == null ? void 0 : s.querySelectorAll('input, button, a[href], [tabindex]:not([tabindex="-1"])');
-        if (!(l != null && l.length))
+        const s = (c = _.value) == null ? void 0 : c.querySelectorAll('input, button, a[href], [tabindex]:not([tabindex="-1"])');
+        if (!(s != null && s.length))
           return;
-        const h = l[0], B = l[l.length - 1];
-        t.shiftKey && document.activeElement === h ? (t.preventDefault(), B.focus()) : !t.shiftKey && document.activeElement === B && (t.preventDefault(), h.focus());
+        const d = s[0], P = s[s.length - 1];
+        t.shiftKey && document.activeElement === d ? (t.preventDefault(), P.focus()) : !t.shiftKey && document.activeElement === P && (t.preventDefault(), d.focus());
       }
     }
-    function be(t) {
+    function $e(t) {
       if (!t)
         return !1;
-      const s = (t.tagName || "").toLowerCase();
-      return s === "input" || s === "textarea" || s === "select" || t.isContentEditable;
+      const c = (t.tagName || "").toLowerCase();
+      return c === "input" || c === "textarea" || c === "select" || t.isContentEditable;
     }
-    function te(t) {
-      if (t.key === "Escape" && p.value) {
-        t.preventDefault(), z();
+    function re(t) {
+      if (t.key === "Escape" && f.value) {
+        t.preventDefault(), O();
         return;
       }
       if ((t.ctrlKey || t.metaKey) && (t.key === "k" || t.key === "K")) {
-        t.preventDefault(), p.value = !p.value;
+        t.preventDefault(), f.value = !f.value;
         return;
       }
-      t.key === "/" && !p.value && !be(document.activeElement) && (t.preventDefault(), p.value = !0);
+      t.key === "/" && !f.value && !$e(document.activeElement) && (t.preventDefault(), f.value = !0);
     }
-    return ge(() => {
-      document.addEventListener("keydown", te);
-    }), we(() => {
-      document.removeEventListener("keydown", te), clearTimeout(d), C++, E !== null && (document.body.style.overflow = E, E = null);
-    }), (t, s) => (a(), I(Ce, { to: "body" }, [
-      p.value ? (a(), u("div", {
+    return Se(() => {
+      document.addEventListener("keydown", re);
+    }), Me(() => {
+      document.removeEventListener("keydown", re), clearTimeout(S), H++, z !== null && (document.body.style.overflow = z, z = null);
+    }), (t, c) => (a(), T(Ie, { to: "body" }, [
+      f.value ? (a(), i("div", {
         key: 0,
         class: "zui-search-overlay fixed inset-0 z-[20000] flex items-start justify-center bg-[#11181c]/45",
-        onMousedown: N(z, ["self"]),
-        onKeydown: ve
+        onMousedown: E(O, ["self"]),
+        onKeydown: Ce
       }, [
         r("div", {
           ref_key: "panelEl",
@@ -270,88 +343,110 @@ const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-
           "aria-modal": "true",
           "aria-label": "Search"
         }, [
-          r("div", Be, [
-            T(fe, { class: "!h-[18px] !w-[18px] flex-none text-proclusteal-400 dark:text-content-muted" }),
-            G(r("input", {
+          r("div", Ye, [
+            I(ve, { class: "!h-[18px] !w-[18px] flex-none text-proclusteal-400 dark:text-content-muted" }),
+            Y(r("input", {
               ref_key: "inputEl",
               ref: w,
-              "onUpdate:modelValue": s[0] || (s[0] = (l) => g.value = l),
+              "onUpdate:modelValue": c[0] || (c[0] = (s) => g.value = s),
               type: "text",
               autocomplete: "off",
               placeholder: e.placeholder,
               class: "zui-search-input flex-1 border-0 bg-[transparent] p-0 text-[16px] text-[#1e262c] dark:text-content outline-none placeholder:text-proclusteal-400 dark:placeholder:text-content-muted focus:ring-0"
-            }, null, 8, Re), [
-              [$e, g.value]
+            }, null, 8, Je), [
+              [Ae, g.value]
             ]),
             r("button", {
               type: "button",
               class: "cursor-pointer border-0 bg-[transparent] px-1 text-[22px] leading-none text-proclusteal-400 dark:text-content-muted hover:text-proclusteal-700 dark:hover:text-content",
               "aria-label": "Close search",
               title: "Close (Esc)",
-              onClick: z
+              onClick: O
             }, "×")
           ]),
-          n.value === "results" ? (a(), u("div", Ve, " Search results ")) : v("", !0),
-          n.value === "results" ? (a(), u("div", Ke, [
+          o.value === "results" ? (a(), i("div", Qe, " Search results ")) : m("", !0),
+          o.value === "results" ? (a(), i("div", Xe, [
             r("button", {
               type: "button",
-              class: M([le, f.value === "all" ? se : ""]),
-              onClick: s[1] || (s[1] = (l) => Z("all"))
+              class: M([ue, x.value === "all" ? de : ""]),
+              onClick: c[1] || (c[1] = (s) => oe("all"))
             }, [
-              j(" All "),
+              B(" All "),
               r("span", {
-                class: M(["font-bold", f.value === "all" ? "opacity-85" : "opacity-60"])
-              }, "(" + b(ye.value) + ")", 3)
+                class: M(["font-bold", x.value === "all" ? "opacity-85" : "opacity-60"])
+              }, "(" + b(ge.value) + ")", 3)
             ], 2),
-            (a(!0), u(H, null, P(m.value, (l) => (a(), u("button", {
-              key: l.type,
+            (a(!0), i(N, null, L(v.value, (s) => (a(), i("button", {
+              key: s.type,
               type: "button",
-              class: M([le, f.value === l.type ? se : ""]),
-              onClick: (h) => Z(l.type)
+              class: M([ue, x.value === s.type ? de : ""]),
+              onClick: (d) => oe(s.type)
             }, [
-              j(b(X(l.type).label) + " ", 1),
+              B(b(ee(s.type).label) + " ", 1),
               r("span", {
-                class: M(["font-bold", f.value === l.type ? "opacity-85" : "opacity-60"])
-              }, "(" + b(l.items.length) + ")", 3)
-            ], 10, qe))), 128))
-          ])) : v("", !0),
+                class: M(["font-bold", x.value === s.type ? "opacity-85" : "opacity-60"])
+              }, "(" + b(s.items.length) + ")", 3)
+            ], 10, Ze))), 128))
+          ])) : m("", !0),
           r("div", {
             ref_key: "resultsEl",
             ref: A,
             class: "zui-search-results overflow-y-auto pb-2.5"
           }, [
-            n.value === "zero" ? (a(), u("div", {
-              key: 0,
-              class: M(V)
-            }, " Search across SOPs, incidents, assets, people and more — you only ever see what you have access to. ")) : n.value === "hint" ? (a(), u("div", {
+            o.value === "zero" && p.value.length ? (a(), i("div", et, [
+              r("div", tt, [
+                nt,
+                r("button", {
+                  type: "button",
+                  class: "cursor-pointer border-0 bg-[transparent] p-0 text-[12px] font-semibold text-[#667079] dark:text-content-muted hover:text-proclusteal-950 dark:hover:text-focus",
+                  "data-test": "search-recent-clear",
+                  onClick: c[2] || (c[2] = (s) => p.value = W(Fe)())
+                }, "Clear")
+              ]),
+              (a(!0), i(N, null, L(p.value, (s, d) => (a(), i("button", {
+                key: s,
+                type: "button",
+                "data-test": "search-recent-item",
+                class: "zui-search-recent-row flex w-full cursor-pointer items-center gap-[13px] border-0 bg-[transparent] px-[18px] py-[9px] text-left text-[14px] text-[#1e262c] dark:text-content hover:bg-proclusteal-50 dark:hover:bg-surface-hover",
+                onClick: (P) => g.value = s
+              }, [
+                at,
+                r("span", rt, b(s), 1)
+              ], 8, ot))), 128))
+            ])) : o.value === "zero" ? (a(), i("div", {
               key: 1,
-              class: M(V)
-            }, " Keep typing… enter at least " + b(e.minChars) + " characters to search. ", 1)) : n.value === "empty" ? (a(), u("div", {
+              class: M(K)
+            }, " Search across SOPs, incidents, assets, people and more — you only ever see what you have access to. ")) : o.value === "hint" ? (a(), i("div", {
               key: 2,
-              class: M(V)
-            }, " No results for “" + b(S.value) + "” — try a broader term or a code. ", 1)) : n.value === "error" ? (a(), u("div", {
+              class: M(K)
+            }, " Keep typing… enter at least " + b(e.minChars) + " characters to search. ", 1)) : o.value === "empty" ? (a(), i("div", {
               key: 3,
-              class: M(V)
-            }, " Search is temporarily unavailable. ")) : (a(!0), u(H, { key: 4 }, P(J.value, (l) => (a(), u("div", {
-              key: l.type
+              class: M(K)
+            }, " No results for “" + b($.value) + "” — try a broader term or a code. ", 1)) : o.value === "error" ? (a(), i("div", {
+              key: 4,
+              class: M(K)
+            }, " Search is temporarily unavailable. ")) : (a(!0), i(N, { key: 5 }, L(te.value, (s) => (a(), i("div", {
+              key: s.type
             }, [
-              r("div", Ge, [
-                j(b(l.label) + " ", 1),
-                r("span", Fe, "(" + b(l.items.length) + ")", 1)
+              r("div", lt, [
+                B(b(s.label) + " ", 1),
+                r("span", st, "(" + b(s.items.length) + ")", 1)
               ]),
-              (a(!0), u(H, null, P(l.items, (h) => (a(), u("a", {
-                key: h.flatIdx,
-                href: h.url || null,
-                class: M(["zui-search-row flex items-center gap-[13px] px-[18px] py-[11px] text-[#1e262c] dark:text-content no-underline", { "bg-proclusteal-50 dark:bg-surface-hover": h.flatIdx === c.value }]),
-                "data-row-idx": h.flatIdx,
-                onClick: N((B) => ee(h.url), ["exact", "prevent"]),
-                onMouseenter: (B) => c.value = h.flatIdx
+              (a(!0), i(N, null, L(s.items, (d) => (a(), i("a", {
+                key: d.flatIdx,
+                href: d.url || null,
+                target: d.newWindow ? "_blank" : null,
+                rel: d.newWindow ? "noopener noreferrer" : null,
+                class: M(["zui-search-row flex items-center gap-[13px] px-[18px] py-[11px] text-[#1e262c] dark:text-content no-underline", { "bg-proclusteal-50 dark:bg-surface-hover": d.flatIdx === u.value }]),
+                "data-row-idx": d.flatIdx,
+                onClick: E((P) => ae(d.url, d.newWindow), ["exact", "prevent"]),
+                onMouseenter: (P) => u.value = d.flatIdx
               }, [
                 r("span", {
                   class: "inline-flex h-[42px] w-[42px] flex-none items-center justify-center rounded-[10px] text-white",
-                  style: q({ background: h.tileColour })
+                  style: G({ background: d.tileColour })
                 }, [
-                  (a(), u("svg", {
+                  (a(), i("svg", {
                     class: "h-5 w-5",
                     viewBox: "0 0 24 24",
                     fill: "none",
@@ -359,28 +454,28 @@ const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-
                     "stroke-width": "2",
                     "stroke-linecap": "round",
                     "stroke-linejoin": "round",
-                    innerHTML: h.tileIcon
-                  }, null, 8, Ye))
+                    innerHTML: d.tileIcon
+                  }, null, 8, ct))
                 ], 4),
-                r("span", Xe, [
+                r("span", ut, [
                   r("span", {
                     class: "gs-marked block truncate text-[14px] font-bold",
-                    innerHTML: h.titleHtml
-                  }, null, 8, Je),
+                    innerHTML: d.titleHtml
+                  }, null, 8, dt),
                   r("span", {
                     class: "gs-marked mt-0.5 block truncate text-[12.5px] text-[#5b6570] dark:text-content-muted",
-                    innerHTML: h.subtitleHtml
-                  }, null, 8, We)
+                    innerHTML: d.subtitleHtml
+                  }, null, 8, pt)
                 ]),
-                Ze
-              ], 42, Qe))), 128))
+                ft
+              ], 42, it))), 128))
             ]))), 128))
           ], 512)
         ], 512)
-      ], 32)) : v("", !0)
+      ], 32)) : m("", !0)
     ]));
   }
-}, tt = /* @__PURE__ */ Ie(et, [["__scopeId", "data-v-80fd510b"]]), ie = {
+}, ht = /* @__PURE__ */ Oe(xt, [["__scopeId", "data-v-24311187"]]), pe = {
   "reference library": "RefLib",
   reflib: "RefLib",
   repository: "RefLib",
@@ -398,42 +493,42 @@ const Ue = (e) => (Se("data-v-80fd510b"), e = e(), _e(), e), Be = { class: "zui-
   directory: "Contact",
   "telephone directory": "Contact"
 };
-function nt(e) {
+function yt(e) {
   if (!e)
     return "";
-  const i = String(e).trim();
-  if (!i)
+  const l = String(e).trim();
+  if (!l)
     return "";
-  let o = null;
-  if (Object.prototype.hasOwnProperty.call(D, i))
-    o = i;
+  let n = null;
+  if (Object.prototype.hasOwnProperty.call(U, l))
+    n = l;
   else {
-    const y = i.toLowerCase(), p = Object.keys(D).find((x) => x.toLowerCase() === y);
-    p ? o = p : Object.prototype.hasOwnProperty.call(ie, y) && (o = ie[y]);
+    const h = l.toLowerCase(), f = Object.keys(U).find((y) => y.toLowerCase() === h);
+    f ? n = f : Object.prototype.hasOwnProperty.call(pe, h) && (n = pe[h]);
   }
-  return !o || !Object.prototype.hasOwnProperty.call(D, o) ? "" : D[o].icon || "";
+  return !n || !Object.prototype.hasOwnProperty.call(U, n) ? "" : U[n].icon || "";
 }
-function ot(e) {
+function vt(e) {
   if (!e)
     return "";
   if (e.dateText)
     return String(e.dateText);
-  const i = e.notifyday != null ? String(e.notifyday).replace(/^0/, "") : "", o = e.notifymonthname ? String(e.notifymonthname) : "", y = e.notifyyear != null ? String(e.notifyyear) : "";
-  return [i, o, y].filter(Boolean).join(" ");
+  const l = e.notifyday != null ? String(e.notifyday).replace(/^0/, "") : "", n = e.notifymonthname ? String(e.notifymonthname) : "", h = e.notifyyear != null ? String(e.notifyyear) : "";
+  return [l, n, h].filter(Boolean).join(" ");
 }
-const at = {
+const mt = {
   key: 0,
   class: "absolute -right-[3px] -top-[3px] h-2 w-2 rounded-full bg-[#dd3730] ring-2 ring-white dark:ring-surface-raised"
-}, rt = { class: "absolute right-0 top-full z-30 mt-2 w-[400px] max-w-[90vw] origin-top-right overflow-hidden rounded-[10px] border-[1px] border-proclusteal-300 dark:border-line bg-surface-raised shadow-zeal-md" }, lt = { class: "max-h-[420px] overflow-y-auto" }, st = {
+}, bt = { class: "absolute right-0 top-full z-30 mt-2 w-[400px] max-w-[90vw] origin-top-right overflow-hidden rounded-[10px] border-[1px] border-proclusteal-300 dark:border-line bg-surface-raised shadow-zeal-md" }, kt = { class: "max-h-[420px] overflow-y-auto" }, gt = {
   key: 0,
   class: "px-5 py-[26px] text-center text-[13px] font-medium text-[#667079] dark:text-content-muted"
-}, it = {
+}, wt = {
   key: 1,
   class: "px-5 py-[26px] text-center text-[13px] font-medium text-[#667079] dark:text-content-muted"
-}, ct = ["onClick"], ut = { class: "inline-flex h-[42px] w-[42px] flex-none items-center justify-center rounded-[10px] bg-proclusteal-950 text-white" }, dt = ["innerHTML"], pt = { class: "min-w-0 flex-1" }, ft = { class: "block truncate text-[14px] font-bold text-[#1e262c] dark:text-content" }, xt = { class: "block truncate text-[12.5px] text-[#5b6570] dark:text-content-muted" }, ht = {
+}, Ct = ["onClick"], $t = { class: "inline-flex h-[42px] w-[42px] flex-none items-center justify-center rounded-[10px] bg-proclusteal-950 text-white" }, _t = ["innerHTML"], St = { class: "min-w-0 flex-1" }, Mt = { class: "block truncate text-[14px] font-bold text-[#1e262c] dark:text-content" }, It = { class: "block truncate text-[12.5px] text-[#5b6570] dark:text-content-muted" }, At = {
   key: 0,
   class: "mt-0.5 block text-[12px] text-proclusteal-500 dark:text-content-muted"
-}, yt = { class: "flex flex-none flex-col items-center gap-2 pt-0.5 text-proclusteal-600 dark:text-content-muted" }, mt = ["onClick"], vt = ["onClick"], bt = ["href"], kt = {
+}, Tt = { class: "flex flex-none flex-col items-center gap-2 pt-0.5 text-proclusteal-600 dark:text-content-muted" }, Nt = ["onClick"], zt = ["onClick"], Et = ["href"], Ht = {
   __name: "HeaderNotificationDropdown",
   props: {
     // The feed as /personal/GetNotifications.ashx returns it: { data: [...] }. Null means
@@ -461,41 +556,41 @@ const at = {
     }
   },
   emits: ["markAsRead", "deleteNotification", "navigate", "open"],
-  setup(e, { emit: i }) {
-    const o = e, y = i, p = k(null), x = k(!1), w = $(() => {
-      var n;
-      return ((n = o.notifications) == null ? void 0 : n.data) || [];
-    }), _ = $(() => o.unreadCount !== null && o.unreadCount !== void 0 ? o.unreadCount > 0 : w.value.some((n) => n.ClassRead === "unread"));
-    xe(p, () => {
-      x.value = !1;
+  setup(e, { emit: l }) {
+    const n = e, h = l, f = k(null), y = k(!1), w = C(() => {
+      var o;
+      return ((o = n.notifications) == null ? void 0 : o.data) || [];
+    }), _ = C(() => n.unreadCount !== null && n.unreadCount !== void 0 ? n.unreadCount > 0 : w.value.some((o) => o.ClassRead === "unread"));
+    me(f, () => {
+      y.value = !1;
     });
     function A() {
-      x.value = !x.value, x.value && y("open");
+      y.value = !y.value, y.value && h("open");
     }
-    function g(n) {
-      return n && Object.prototype.hasOwnProperty.call(o.iconMap, n) && o.iconMap[n] || null;
+    function g(o) {
+      return o && Object.prototype.hasOwnProperty.call(n.iconMap, o) && n.iconMap[o] || null;
     }
-    function S(n) {
-      const c = g(n.VueAppTypeIcon) || g(n.AppTypeName);
-      if (c)
-        return { component: c, path: "" };
-      const d = nt(n.AppTypeName);
-      return d ? { component: null, path: d } : { component: ae, path: "" };
+    function $(o) {
+      const u = g(o.VueAppTypeIcon) || g(o.AppTypeName);
+      if (u)
+        return { component: u, path: "" };
+      const p = yt(o.AppTypeName);
+      return p ? { component: null, path: p } : { component: ie, path: "" };
     }
-    const m = $(() => w.value.map((n) => ({
-      item: n,
-      icon: S(n),
-      date: ot(n),
-      unread: n.ClassRead === "unread"
+    const v = C(() => w.value.map((o) => ({
+      item: o,
+      icon: $(o),
+      date: vt(o),
+      unread: o.ClassRead === "unread"
     })));
-    function f(n) {
-      x.value = !1;
-      const c = O(n);
-      c && y("navigate", c);
+    function x(o) {
+      y.value = !1;
+      const u = j(o);
+      u && h("navigate", u);
     }
-    return (n, c) => (a(), u("div", {
+    return (o, u) => (a(), i("div", {
       ref_key: "rootEl",
-      ref: p,
+      ref: f,
       class: "relative font-sans"
     }, [
       r("button", {
@@ -505,10 +600,10 @@ const at = {
         "aria-label": "View Notifications",
         onClick: A
       }, [
-        T(ae, { class: "!h-[21px] !w-[21px]" }),
-        _.value ? (a(), u("span", at)) : v("", !0)
+        I(ie, { class: "!h-[21px] !w-[21px]" }),
+        _.value ? (a(), i("span", mt)) : m("", !0)
       ]),
-      T(ue, {
+      I(xe, {
         "enter-active-class": "transition-all ease-out duration-75",
         "enter-from-class": "scale-95 opacity-0",
         "enter-to-class": "scale-100 opacity-100",
@@ -516,20 +611,20 @@ const at = {
         "leave-from-class": "scale-100 opacity-100",
         "leave-to-class": "scale-95 opacity-0"
       }, {
-        default: F(() => [
-          G(r("div", rt, [
-            r("div", lt, [
-              e.notifications ? w.value.length ? v("", !0) : (a(), u("div", it, " No notifications. ")) : (a(), u("div", st, " Loading notifications… ")),
-              (a(!0), u(H, null, P(m.value, (d) => (a(), u("div", {
-                key: d.item.NotifyID,
-                class: M(["flex cursor-pointer items-start gap-3 border-b-[1px] border-proclusteal-200 dark:border-line px-4 py-3", d.unread ? "bg-proclusteal-50 dark:bg-surface-hover" : "bg-surface-raised"]),
-                onClick: (C) => f(d.item.url)
+        default: J(() => [
+          Y(r("div", bt, [
+            r("div", kt, [
+              e.notifications ? w.value.length ? m("", !0) : (a(), i("div", wt, " No notifications. ")) : (a(), i("div", gt, " Loading notifications… ")),
+              (a(!0), i(N, null, L(v.value, (p) => (a(), i("div", {
+                key: p.item.NotifyID,
+                class: M(["flex cursor-pointer items-start gap-3 border-b-[1px] border-proclusteal-200 dark:border-line px-4 py-3", p.unread ? "bg-proclusteal-50 dark:bg-surface-hover" : "bg-surface-raised"]),
+                onClick: (S) => x(p.item.url)
               }, [
-                r("span", ut, [
-                  d.icon.component ? (a(), I(de(d.icon.component), {
+                r("span", $t, [
+                  p.icon.component ? (a(), T(he(p.icon.component), {
                     key: 0,
                     class: "!h-5 !w-5"
-                  })) : (a(), u("svg", {
+                  })) : (a(), i("svg", {
                     key: 1,
                     class: "h-5 w-5",
                     viewBox: "0 0 24 24",
@@ -538,57 +633,57 @@ const at = {
                     "stroke-width": "2",
                     "stroke-linecap": "round",
                     "stroke-linejoin": "round",
-                    innerHTML: d.icon.path
-                  }, null, 8, dt))
+                    innerHTML: p.icon.path
+                  }, null, 8, _t))
                 ]),
-                r("span", pt, [
-                  r("span", ft, b(d.item.notifyname), 1),
-                  r("span", xt, b(d.item.summary), 1),
-                  d.date ? (a(), u("span", ht, b(d.date), 1)) : v("", !0)
+                r("span", St, [
+                  r("span", Mt, b(p.item.notifyname), 1),
+                  r("span", It, b(p.item.summary), 1),
+                  p.date ? (a(), i("span", At, b(p.date), 1)) : m("", !0)
                 ]),
-                r("span", yt, [
-                  d.unread ? (a(), u("button", {
+                r("span", Tt, [
+                  p.unread ? (a(), i("button", {
                     key: 0,
                     type: "button",
                     class: "hover:text-proclusteal-900 dark:hover:text-focus",
                     title: "Mark notification as read",
                     "aria-label": "Mark notification as read",
-                    onClick: N((C) => n.$emit("markAsRead", d.item.NotifyID), ["stop"])
+                    onClick: E((S) => o.$emit("markAsRead", p.item.NotifyID), ["stop"])
                   }, [
-                    T(Ee, { class: "!h-4 !w-4" })
-                  ], 8, mt)) : v("", !0),
+                    I(Le, { class: "!h-4 !w-4" })
+                  ], 8, Nt)) : m("", !0),
                   r("button", {
                     type: "button",
                     class: "hover:text-[#dd3730]",
                     title: "Delete notification",
                     "aria-label": "Delete notification",
-                    onClick: N((C) => n.$emit("deleteNotification", d.item.NotifyID), ["stop"])
+                    onClick: E((S) => o.$emit("deleteNotification", p.item.NotifyID), ["stop"])
                   }, [
-                    T(Ne, { class: "!w-3" })
-                  ], 8, vt)
+                    I(je, { class: "!w-3" })
+                  ], 8, zt)
                 ])
-              ], 10, ct))), 128))
+              ], 10, Ct))), 128))
             ]),
             r("a", {
-              href: Q(O)(e.notificationsUrl) || null,
+              href: W(j)(e.notificationsUrl) || null,
               class: "block border-t-[1px] border-proclusteal-200 dark:border-line px-4 py-2.5 text-center text-[13px] font-bold text-proclusteal-700 dark:text-content no-underline hover:bg-proclusteal-50 dark:hover:bg-surface-hover hover:text-proclusteal-900 dark:hover:text-focus",
-              onClick: c[0] || (c[0] = N((d) => f(e.notificationsUrl), ["exact", "prevent"]))
-            }, " See all notifications ", 8, bt)
+              onClick: u[0] || (u[0] = E((p) => x(e.notificationsUrl), ["exact", "prevent"]))
+            }, " See all notifications ", 8, Et)
           ], 512), [
-            [pe, x.value]
+            [ye, y.value]
           ])
         ]),
         _: 1
       })
     ], 512));
   }
-}, gt = ["src"], wt = {
+}, Ot = ["src"], Lt = {
   key: 1,
   class: "inline-flex h-[34px] w-[34px] items-center justify-center rounded-full bg-proclusteal-900 text-[13px] font-bold uppercase leading-none tracking-[0.5px] text-white"
-}, Ct = { class: "absolute right-0 top-full z-30 mt-2 w-[260px] origin-top-right rounded-[10px] border-[1px] border-proclusteal-300 dark:border-line bg-surface-raised py-1 shadow-zeal-md" }, $t = { class: "flex max-w-[260px] flex-col gap-0.5 whitespace-normal px-[18px] pb-2.5 pt-3" }, St = { class: "block text-[14px] font-bold text-proclusteal-800 dark:text-content" }, _t = /* @__PURE__ */ r("span", { class: "my-1.5 block h-0.5 w-8 flex-none rounded-[1px] bg-[#cdd4da] dark:bg-line-strong" }, null, -1), Mt = { class: "block break-words text-[12px] leading-[1.3] text-proclusteal-600 dark:text-content-muted" }, Tt = /* @__PURE__ */ r("div", { class: "h-px bg-proclusteal-200 dark:bg-line" }, null, -1), At = {
+}, jt = { class: "absolute right-0 top-full z-30 mt-2 w-[260px] origin-top-right rounded-[10px] border-[1px] border-proclusteal-300 dark:border-line bg-surface-raised py-1 shadow-zeal-md" }, Dt = { class: "flex max-w-[260px] flex-col gap-0.5 whitespace-normal px-[18px] pb-2.5 pt-3" }, Pt = { class: "block text-[14px] font-bold text-proclusteal-800 dark:text-content" }, Ut = /* @__PURE__ */ r("span", { class: "my-1.5 block h-0.5 w-8 flex-none rounded-[1px] bg-[#cdd4da] dark:bg-line-strong" }, null, -1), Bt = { class: "block break-words text-[12px] leading-[1.3] text-proclusteal-600 dark:text-content-muted" }, Rt = /* @__PURE__ */ r("div", { class: "h-px bg-proclusteal-200 dark:bg-line" }, null, -1), Vt = {
   key: 0,
   class: "my-1 h-px bg-proclusteal-200 dark:bg-line"
-}, It = ["href", "onClick"], Et = {
+}, Kt = ["href", "onClick"], Wt = {
   __name: "HeaderUserMenu",
   props: {
     user: {
@@ -601,21 +696,21 @@ const at = {
     }
   },
   emits: ["select"],
-  setup(e, { emit: i }) {
-    const o = e, y = i, p = k(null), x = k(!1), w = k(!1);
-    K(() => o.user.avatarUrl, () => {
+  setup(e, { emit: l }) {
+    const n = e, h = l, f = k(null), y = k(!1), w = k(!1);
+    q(() => n.user.avatarUrl, () => {
       w.value = !1;
     });
-    const _ = $(() => `${o.user.firstName || ""} ${o.user.surname || ""}`.trim()), A = $(() => `${(o.user.firstName || "").charAt(0)}${(o.user.surname || "").charAt(0)}`.toUpperCase());
-    xe(p, () => {
-      x.value = !1;
+    const _ = C(() => `${n.user.firstName || ""} ${n.user.surname || ""}`.trim()), A = C(() => `${(n.user.firstName || "").charAt(0)}${(n.user.surname || "").charAt(0)}`.toUpperCase());
+    me(f, () => {
+      y.value = !1;
     });
-    function g(S) {
-      x.value = !1, y("select", S);
+    function g($) {
+      y.value = !1, h("select", $);
     }
-    return (S, m) => (a(), u("div", {
+    return ($, v) => (a(), i("div", {
       ref_key: "rootEl",
-      ref: p,
+      ref: f,
       class: "relative font-sans"
     }, [
       r("button", {
@@ -623,17 +718,17 @@ const at = {
         class: "flex cursor-pointer items-center justify-center",
         title: "View Menu Options",
         "aria-label": "View Menu Options",
-        onClick: m[1] || (m[1] = (f) => x.value = !x.value)
+        onClick: v[1] || (v[1] = (x) => y.value = !y.value)
       }, [
-        e.user.avatarUrl && !w.value ? (a(), u("img", {
+        e.user.avatarUrl && !w.value ? (a(), i("img", {
           key: 0,
           src: e.user.avatarUrl,
           alt: "",
           class: "h-[34px] w-[34px] rounded-full object-cover",
-          onError: m[0] || (m[0] = (f) => w.value = !0)
-        }, null, 40, gt)) : (a(), u("span", wt, b(A.value), 1))
+          onError: v[0] || (v[0] = (x) => w.value = !0)
+        }, null, 40, Ot)) : (a(), i("span", Lt, b(A.value), 1))
       ]),
-      T(ue, {
+      I(xe, {
         "enter-active-class": "transition-all ease-out duration-75",
         "enter-from-class": "scale-95 opacity-0",
         "enter-to-class": "scale-100 opacity-100",
@@ -641,43 +736,43 @@ const at = {
         "leave-from-class": "scale-100 opacity-100",
         "leave-to-class": "scale-95 opacity-0"
       }, {
-        default: F(() => [
-          G(r("div", Ct, [
-            r("div", $t, [
-              r("span", St, b(_.value), 1),
-              _t,
-              r("span", Mt, b(e.user.orgName), 1)
+        default: J(() => [
+          Y(r("div", jt, [
+            r("div", Dt, [
+              r("span", Pt, b(_.value), 1),
+              Ut,
+              r("span", Bt, b(e.user.orgName), 1)
             ]),
-            Tt,
-            (a(!0), u(H, null, P(e.menuItems, (f, n) => (a(), u(H, { key: n }, [
-              f.divider ? (a(), u("div", At)) : (a(), u("a", {
+            Rt,
+            (a(!0), i(N, null, L(e.menuItems, (x, o) => (a(), i(N, { key: o }, [
+              x.divider ? (a(), i("div", Vt)) : (a(), i("a", {
                 key: 1,
-                href: f.href && Q(O)(f.href) || null,
+                href: x.href && W(j)(x.href) || null,
                 class: "flex items-center gap-2.5 px-[18px] py-2 text-[13px] font-semibold text-proclusteal-700 dark:text-content no-underline hover:bg-proclusteal-50 dark:hover:bg-surface-hover hover:text-proclusteal-900 dark:hover:text-focus",
-                onClick: N((c) => g(f), ["exact", "prevent"])
+                onClick: E((u) => g(x), ["exact", "prevent"])
               }, [
-                f.icon ? (a(), I(de(f.icon), {
+                x.icon ? (a(), T(he(x.icon), {
                   key: 0,
                   class: "!h-4 !w-4 flex-none"
-                })) : v("", !0),
-                r("span", null, b(f.label), 1)
-              ], 8, It))
+                })) : m("", !0),
+                r("span", null, b(x.label), 1)
+              ], 8, Kt))
             ], 64))), 128))
           ], 512), [
-            [pe, x.value]
+            [ye, y.value]
           ])
         ]),
         _: 1
       })
     ], 512));
   }
-}, Nt = { class: "flex h-[70px] shrink-0 items-center justify-between border-b-[1px] border-proclusteal-300 dark:border-line bg-surface-raised px-[15px] font-sans shadow-[0_1px_3px_rgba(20,40,45,0.05)] sm:px-[25px]" }, Ht = { class: "flex min-w-0 items-center gap-[18px]" }, Ot = {
+}, qt = { class: "flex h-[70px] shrink-0 items-center justify-between border-b-[1px] border-proclusteal-300 dark:border-line bg-surface-raised px-[15px] font-sans shadow-[0_1px_3px_rgba(20,40,45,0.05)] sm:px-[25px]" }, Gt = { class: "flex min-w-0 items-center gap-[18px]" }, Ft = {
   key: 0,
   class: "hidden whitespace-nowrap text-[18px] font-semibold text-proclusteal-800 dark:text-content sm:inline"
-}, Lt = {
+}, Yt = {
   key: 0,
   class: "font-normal text-black-800 dark:text-content-muted"
-}, zt = ["href", "aria-label"], Dt = { class: "flex items-center gap-[18px] sm:gap-[25px]" }, Qt = {
+}, Jt = ["href", "aria-label"], Qt = { class: "flex items-center gap-[18px] sm:gap-[25px]" }, cn = {
   __name: "AppHeader",
   props: {
     title: {
@@ -744,6 +839,13 @@ const at = {
     searchTypes: {
       type: Object,
       default: () => ({})
+    },
+    // #479: gate for the three top-right icons (search pill, bell, profile). Default true so
+    // existing consumers are unaffected; an app that loads its header data asynchronously passes
+    // false until user + notifications + search have all settled, then true to reveal all at once.
+    ready: {
+      type: Boolean,
+      default: !0
     }
   },
   emits: [
@@ -754,114 +856,116 @@ const at = {
     "deleteNotification",
     "notifications-open"
   ],
-  setup(e, { emit: i }) {
-    const o = e, y = i, p = ce(), x = k(!1), w = $(() => !!o.notifications || o.unreadCount !== null && o.unreadCount !== void 0), _ = $(() => he(o.accentColour)), A = $(() => _.value || "#1c6f63");
-    function g(n) {
-      var d, C;
-      if (!n)
+  setup(e, { emit: l }) {
+    const n = e, h = l, f = fe(), y = k(!1), w = C(() => !!n.notifications || n.unreadCount !== null && n.unreadCount !== void 0), _ = C(() => be(n.accentColour)), A = C(() => _.value || "#1c6f63");
+    function g(o) {
+      var p, S;
+      if (!o)
         return;
-      const c = O(n);
-      c && (y("navigate", c), (C = (d = p == null ? void 0 : p.vnode) == null ? void 0 : d.props) != null && C.onNavigate || (window.location.href = c));
+      const u = j(o);
+      u && (h("navigate", u), (S = (p = f == null ? void 0 : f.vnode) == null ? void 0 : p.props) != null && S.onNavigate || (window.location.href = u));
     }
-    function S() {
-      y("home"), g(o.homeUrl);
+    function $() {
+      h("home"), g(n.homeUrl);
     }
-    function m() {
+    function v() {
       window.history.back();
     }
-    function f(n) {
-      y("menu-select", n), n.href && g(n.href);
+    function x(o) {
+      h("menu-select", o), o.href && g(o.href);
     }
-    return (n, c) => (a(), u("header", Nt, [
-      r("div", Ht, [
-        R(n.$slots, "logo"),
-        e.title ? (a(), u("span", Ot, [
-          j(b(e.title), 1),
-          e.subtitle ? (a(), u("span", Lt, " " + b(e.subtitle), 1)) : v("", !0)
-        ])) : v("", !0),
-        _.value ? (a(), u("span", {
+    return (o, u) => (a(), i("header", qt, [
+      r("div", Gt, [
+        V(o.$slots, "logo"),
+        e.title ? (a(), i("span", Ft, [
+          B(b(e.title), 1),
+          e.subtitle ? (a(), i("span", Yt, " " + b(e.subtitle), 1)) : m("", !0)
+        ])) : m("", !0),
+        _.value ? (a(), i("span", {
           key: 1,
           class: "h-[45px] w-[2px] shrink-0",
-          style: q({ background: _.value }),
+          style: G({ background: _.value }),
           "aria-hidden": "true"
-        }, null, 4)) : v("", !0),
+        }, null, 4)) : m("", !0),
         r("nav", {
           class: "flex items-center gap-7 text-proclusteal-600 dark:text-content-muted",
-          style: q({ "--hdr-accent": A.value })
+          style: G({ "--hdr-accent": A.value })
         }, [
-          e.homeUrl ? (a(), I(Ae, {
+          e.homeUrl ? (a(), T(He, {
             key: 0,
             text: e.homeTooltip,
             position: "bottom"
           }, {
-            default: F(() => [
+            default: J(() => [
               r("a", {
-                href: Q(O)(e.homeUrl) || null,
+                href: W(j)(e.homeUrl) || null,
                 class: "hover:text-[var(--hdr-accent)]",
                 "aria-label": e.homeTooltip,
-                onClick: N(S, ["exact", "prevent"])
+                onClick: E($, ["exact", "prevent"])
               }, [
-                T(Me, { class: "!h-[22px] !w-[22px]" })
-              ], 8, zt)
+                I(ze, { class: "!h-[22px] !w-[22px]" })
+              ], 8, Jt)
             ]),
             _: 1
-          }, 8, ["text"])) : v("", !0),
-          e.showBack ? (a(), u("button", {
+          }, 8, ["text"])) : m("", !0),
+          e.showBack ? (a(), i("button", {
             key: 1,
             type: "button",
             class: "cursor-pointer hover:text-[var(--hdr-accent)]",
             title: "Go Back",
             "aria-label": "Go Back",
-            onClick: m
+            onClick: v
           }, [
-            T(Te, { class: "!h-[22px] !w-[22px]" })
-          ])) : v("", !0),
-          R(n.$slots, "nav-extra")
+            I(Ee, { class: "!h-[22px] !w-[22px]" })
+          ])) : m("", !0),
+          V(o.$slots, "nav-extra")
         ], 4),
-        R(n.$slots, "left")
+        V(o.$slots, "left")
       ]),
-      r("div", Dt, [
-        R(n.$slots, "right"),
-        e.searchProvider ? (a(), I(Le, {
-          key: 0,
-          onClick: c[0] || (c[0] = (d) => x.value = !0)
-        })) : v("", !0),
-        w.value ? (a(), I(kt, {
-          key: 1,
-          notifications: e.notifications,
-          "unread-count": e.unreadCount,
-          "notifications-url": e.notificationsUrl,
-          "icon-map": e.notificationIconMap,
-          onMarkAsRead: c[1] || (c[1] = (d) => n.$emit("markAsRead", d)),
-          onDeleteNotification: c[2] || (c[2] = (d) => n.$emit("deleteNotification", d)),
-          onOpen: c[3] || (c[3] = (d) => n.$emit("notifications-open")),
-          onNavigate: g
-        }, null, 8, ["notifications", "unread-count", "notifications-url", "icon-map"])) : v("", !0),
-        e.user ? (a(), I(Et, {
-          key: 2,
-          user: e.user,
-          "menu-items": e.menuItems,
-          onSelect: f
-        }, null, 8, ["user", "menu-items"])) : v("", !0)
+      r("div", Qt, [
+        V(o.$slots, "right"),
+        e.ready ? (a(), i(N, { key: 0 }, [
+          e.searchProvider ? (a(), T(Ue, {
+            key: 0,
+            onClick: u[0] || (u[0] = (p) => y.value = !0)
+          })) : m("", !0),
+          w.value ? (a(), T(Ht, {
+            key: 1,
+            notifications: e.notifications,
+            "unread-count": e.unreadCount,
+            "notifications-url": e.notificationsUrl,
+            "icon-map": e.notificationIconMap,
+            onMarkAsRead: u[1] || (u[1] = (p) => o.$emit("markAsRead", p)),
+            onDeleteNotification: u[2] || (u[2] = (p) => o.$emit("deleteNotification", p)),
+            onOpen: u[3] || (u[3] = (p) => o.$emit("notifications-open")),
+            onNavigate: g
+          }, null, 8, ["notifications", "unread-count", "notifications-url", "icon-map"])) : m("", !0),
+          e.user ? (a(), T(Wt, {
+            key: 2,
+            user: e.user,
+            "menu-items": e.menuItems,
+            onSelect: x
+          }, null, 8, ["user", "menu-items"])) : m("", !0)
+        ], 64)) : m("", !0)
       ]),
-      e.searchProvider ? (a(), I(tt, {
+      e.searchProvider ? (a(), T(ht, {
         key: 0,
-        open: x.value,
-        "onUpdate:open": c[4] || (c[4] = (d) => x.value = d),
+        open: y.value,
+        "onUpdate:open": u[4] || (u[4] = (p) => y.value = p),
         "search-provider": e.searchProvider,
         placeholder: e.searchPlaceholder,
         types: e.searchTypes,
         onNavigate: g
-      }, null, 8, ["open", "search-provider", "placeholder", "types"])) : v("", !0)
+      }, null, 8, ["open", "search-provider", "placeholder", "types"])) : m("", !0)
     ]));
   }
 };
 export {
-  Qt as AppHeader,
-  D as DEFAULT_SEARCH_TYPES,
-  tt as GlobalSearchModal,
-  Le as GlobalSearchPill,
-  kt as HeaderNotificationDropdown,
-  Et as HeaderUserMenu,
-  O as safeUrl
+  cn as AppHeader,
+  U as DEFAULT_SEARCH_TYPES,
+  ht as GlobalSearchModal,
+  Ue as GlobalSearchPill,
+  Ht as HeaderNotificationDropdown,
+  Wt as HeaderUserMenu,
+  j as safeUrl
 };