@phila/phila-ui-app-header 0.2.3-beta.0 → 0.3.0-beta.2

package/dist/index.mjs

@@ -1,219 +1,223 @@
-import { defineComponent as x, useSlots as I, computed as U, createElementBlock as h, openBlock as o, Fragment as y, createElementVNode as a, createCommentVNode as f, unref as t, createTextVNode as g, createVNode as v, renderSlot as m, createBlock as c, withCtx as b, resolveDynamicComponent as C, normalizeClass as w, renderList as A, toDisplayString as _, withKeys as G, useTemplateRef as H, ref as N, watch as O, onMounted as j, onUnmounted as D, normalizeStyle as V, normalizeProps as Q, mergeProps as K } from "vue";
-import { FontAwesomeIcon as p } from "@fortawesome/vue-fontawesome";
-import { useCollapse as z, debounce as F } from "@phila/phila-ui-core";
-import { CollapsePanel as $ } from "@phila/phila-ui-collapse-panel";
-import { Logo as R } from "@phila/phila-ui-logo";
-import './index.css';var q = {
+import { defineComponent as h, useSlots as re, computed as k, createElementBlock as u, openBlock as o, Fragment as N, createElementVNode as s, createCommentVNode as m, unref as n, createTextVNode as _, createVNode as p, renderSlot as f, createBlock as v, withCtx as b, resolveDynamicComponent as S, normalizeClass as z, renderList as j, toDisplayString as g, withKeys as ce, mergeProps as C, useId as de, ref as B, onUnmounted as K, withModifiers as ue, normalizeStyle as W, normalizeProps as A, guardReactiveProps as L, useTemplateRef as fe, watch as ve, onMounted as me, createSlots as be } from "vue";
+import { FontAwesomeIcon as $ } from "@fortawesome/vue-fontawesome";
+import { useCollapse as q, cn as E, BaseLink as Y, ActionContent as T, debounce as pe, Icon as he } from "@phila/phila-ui-core";
+import { CollapsePanel as D } from "@phila/phila-ui-collapse-panel";
+import { Logo as ye } from "@phila/phila-ui-logo";
+import './index.css';var ge = {
   prefix: "fas",
   iconName: "magnifying-glass",
   icon: [512, 512, [128269, "search"], "f002", "M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"]
-}, W = q, M = {
+}, ke = ge, xe = {
+  prefix: "fas",
+  iconName: "circle-exclamation",
+  icon: [512, 512, ["exclamation-circle"], "f06a", "M256 512a256 256 0 1 1 0-512 256 256 0 1 1 0 512zm0-192a32 32 0 1 0 0 64 32 32 0 1 0 0-64zm0-192c-18.2 0-32.7 15.5-31.4 33.7l7.4 104c.9 12.6 11.4 22.3 23.9 22.3 12.6 0 23-9.7 23.9-22.3l7.4-104c1.3-18.2-13.1-33.7-31.4-33.7z"]
+}, Z = {
   prefix: "fas",
   iconName: "xmark",
   icon: [384, 512, [128473, 10005, 10006, 10060, 215, "close", "multiply", "remove", "times"], "f00d", "M55.1 73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L147.2 256 9.9 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192.5 301.3 329.9 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.8 256 375.1 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192.5 210.7 55.1 73.4z"]
-}, X = M, S = M, Y = {
+}, _e = Z, X = Z, $e = {
   prefix: "fas",
   iconName: "lock",
   icon: [384, 512, [128274], "f023", "M128 96l0 64 128 0 0-64c0-35.3-28.7-64-64-64s-64 28.7-64 64zM64 160l0-64C64 25.3 121.3-32 192-32S320 25.3 320 96l0 64c35.3 0 64 28.7 64 64l0 224c0 35.3-28.7 64-64 64L64 512c-35.3 0-64-28.7-64-64L0 224c0-35.3 28.7-64 64-64z"]
-}, T = {
+}, J = {
   prefix: "fas",
   iconName: "caret-up",
   icon: [320, 512, [], "f0d8", "M140.3 135.2c12.6-10.3 31.1-9.5 42.8 2.2l128 128c9.2 9.2 11.9 22.9 6.9 34.9S301.4 320 288.5 320l-256 0c-12.9 0-24.6-7.8-29.6-19.8S.7 274.5 9.9 265.4l128-128 2.4-2.2z"]
-}, E = {
+}, P = {
   prefix: "fas",
   iconName: "caret-down",
   icon: [320, 512, [], "f0d7", "M140.3 376.8c12.6 10.2 31.1 9.5 42.8-2.2l128-128c9.2-9.2 11.9-22.9 6.9-34.9S301.4 192 288.5 192l-256 0c-12.9 0-24.6 7.8-29.6 19.8S.7 237.5 9.9 246.6l128 128 2.4 2.2z"]
-}, Z = {
+}, Ce = {
   prefix: "fas",
   iconName: "building-columns",
   icon: [512, 512, ["bank", "institution", "museum", "university"], "f19c", "M271.9 20.2c-9.8-5.6-21.9-5.6-31.8 0l-224 128c-12.6 7.2-18.8 22-15.1 36S17.5 208 32 208l32 0 0 208 0 0-51.2 38.4C4.7 460.4 0 469.9 0 480 0 497.7 14.3 512 32 512l448 0c17.7 0 32-14.3 32-32 0-10.1-4.7-19.6-12.8-25.6l-51.2-38.4 0-208 32 0c14.5 0 27.2-9.8 30.9-23.8s-2.5-28.8-15.1-36l-224-128zM400 208l0 208-64 0 0-208 64 0zm-112 0l0 208-64 0 0-208 64 0zm-112 0l0 208-64 0 0-208 64 0zM256 96a32 32 0 1 1 0 64 32 32 0 1 1 0-64z"]
-}, J = {
+}, we = {
   prefix: "fas",
   iconName: "bars",
   icon: [448, 512, ["navicon"], "f0c9", "M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"]
-}, P = {
+}, Be = {
   prefix: "fas",
   iconName: "circle-info",
   icon: [512, 512, ["info-circle"], "f05a", "M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512zM224 160a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm-8 64l48 0c13.3 0 24 10.7 24 24l0 88 8 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l24 0 0-64-24 0c-13.3 0-24-10.7-24-24s10.7-24 24-24z"]
-}, ee = P;
-const ae = "data:image/svg+xml,%3csvg%20width='16'%20height='11'%20viewBox='0%200%2016%2011'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3crect%20width='16'%20height='11'%20fill='url(%23pattern0_61022_1867)'/%3e%3cdefs%3e%3cpattern%20id='pattern0_61022_1867'%20patternContentUnits='objectBoundingBox'%20width='1'%20height='1'%3e%3cuse%20xlink:href='%23image0_61022_1867'%20transform='scale(0.0625%200.0909091)'/%3e%3c/pattern%3e%3cimage%20id='image0_61022_1867'%20width='16'%20height='11'%20preserveAspectRatio='none'%20xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAMAAABBPP0LAAAAG1BMVEUdM7EeNLIeM7HgQCDaPh/bPh/bPx/////bPyBEby41AAAAUElEQVQI123MNw4CABDEwD3jC/9/MQ1BQrgeOSkIqYe2o2FZtthXgQLgbHVMZdlsfUQFQnHtjP1+8BUhBDKOqtmfot6ojqPzR7TjdU+f6vkED+IDPhTBcMAAAAAASUVORK5CYII='/%3e%3c/defs%3e%3c/svg%3e", ne = {
+}, ee = Be;
+const Ne = "data:image/svg+xml,%3csvg%20width='16'%20height='11'%20viewBox='0%200%2016%2011'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3crect%20width='16'%20height='11'%20fill='url(%23pattern0_61022_1867)'/%3e%3cdefs%3e%3cpattern%20id='pattern0_61022_1867'%20patternContentUnits='objectBoundingBox'%20width='1'%20height='1'%3e%3cuse%20xlink:href='%23image0_61022_1867'%20transform='scale(0.0625%200.0909091)'/%3e%3c/pattern%3e%3cimage%20id='image0_61022_1867'%20width='16'%20height='11'%20preserveAspectRatio='none'%20xlink:href='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAALCAMAAABBPP0LAAAAG1BMVEUdM7EeNLIeM7HgQCDaPh/bPh/bPx/////bPyBEby41AAAAUElEQVQI123MNw4CABDEwD3jC/9/MQ1BQrgeOSkIqYe2o2FZtthXgQLgbHVMZdlsfUQFQnHtjP1+8BUhBDKOqtmfot6ojqPzR7TjdU+f6vkED+IDPhTBcMAAAAAASUVORK5CYII='/%3e%3c/defs%3e%3c/svg%3e", ze = {
   id: "trusted-site",
   class: "has-background-ghost-gray is-flex is-justify-space-between"
-}, te = { class: "trusted-wrap" }, ie = { class: "hidden-tablet trusted-toggle is-flex is-align-center" }, se = ["src"], oe = ["aria-label", "aria-expanded"], le = {
+}, Me = { class: "trusted-wrap" }, Ae = { class: "hidden-tablet trusted-toggle is-flex is-align-center" }, Le = ["src"], Te = ["aria-label", "aria-expanded"], Se = {
   class: "icon",
   "aria-hidden": "true"
-}, re = { class: "hidden-desktop trusted-toggle is-flex is-align-center" }, ce = ["aria-label", "aria-expanded"], de = {
+}, Ee = { class: "hidden-desktop trusted-toggle is-flex is-align-center" }, Ie = ["aria-label", "aria-expanded"], Oe = {
   class: "icon",
   "aria-hidden": "true"
-}, ue = {
+}, De = {
   key: 0,
   class: "trusted-translation is-flex is-align-center"
-}, he = ["hidden"], fe = { class: "trusted-site-info-content content has-text-body-small is-flex is-justify-space-between" }, ve = { class: "info-item-wrap is-flex" }, me = { class: "info-item is-flex is-12-mobile is-align-flex-start is-flex-1 my-4" }, pe = { class: "trusted-icon is-flex is-flex-column has-text-center" }, be = { class: "icon circle-icon p-3 mb-2" }, xe = { class: "info-item is-flex is-12-mobile is-align-flex-start is-flex-1 my-4" }, ke = { class: "trusted-icon is-flex is-flex-column has-text-center" }, ge = { class: "icon circle-icon p-3 mb-2" }, ye = { class: "info-content-close mt-4" }, _e = /* @__PURE__ */ x({
+}, Re = ["hidden"], He = { class: "trusted-site-info-content content has-text-body-small is-flex is-justify-space-between" }, Ue = { class: "info-item-wrap is-flex" }, Ge = { class: "info-item is-flex is-12-mobile is-align-flex-start is-flex-1 my-4" }, je = { class: "trusted-icon is-flex is-flex-column has-text-center" }, Fe = { class: "icon circle-icon p-3 mb-2" }, Ve = { class: "info-item is-flex is-12-mobile is-align-flex-start is-flex-1 my-4" }, Qe = { class: "trusted-icon is-flex is-flex-column has-text-center" }, Ke = { class: "icon circle-icon p-3 mb-2" }, We = { class: "info-content-close mt-4" }, qe = /* @__PURE__ */ h({
   __name: "TrustedSite",
-  setup(e) {
-    const l = I(), { isCollapsed: d, onClickToggle: n } = z({
+  setup(t) {
+    const e = re(), { isCollapsed: r, onClickToggle: a } = q({
       id: "trusted-site-info",
       escapeKeyClose: !0
-    }), u = U(() => d("trusted-site-info"));
-    return (r, i) => (o(), h(y, null, [
-      a("div", ne, [
-        a("div", te, [
-          a("div", ie, [
-            a("img", {
-              src: t(ae),
+    }), c = k(() => r("trusted-site-info"));
+    return (d, i) => (o(), u(N, null, [
+      s("div", ze, [
+        s("div", Me, [
+          s("div", Ae, [
+            s("img", {
+              src: n(Ne),
               alt: "",
               class: "icon"
-            }, null, 8, se),
-            i[4] || (i[4] = a("div", { class: "content mx-2" }, "An official website of the City of Philadelphia government", -1)),
-            a("button", {
+            }, null, 8, Le),
+            i[4] || (i[4] = s("div", { class: "content mx-2" }, "An official website of the City of Philadelphia government", -1)),
+            s("button", {
               class: "phila-button is-extra-small",
-              "aria-label": `${u.value ? "Close" : "Open"} Trusted Site information panel`,
+              "aria-label": `${c.value ? "Close" : "Open"} Trusted Site information panel`,
               "aria-controls": "trusted-site-info",
-              "aria-expanded": u.value,
+              "aria-expanded": c.value,
               onClick: i[0] || (i[0] = //@ts-ignore
-              (...s) => t(n) && t(n)(...s))
+              (...l) => n(a) && n(a)(...l))
             }, [
-              i[3] || (i[3] = g(" Here's how you know ", -1)),
-              a("span", le, [
-                v(t(p), {
-                  icon: u.value ? t(T) : t(E)
+              i[3] || (i[3] = _(" Here's how you know ", -1)),
+              s("span", Se, [
+                p(n($), {
+                  icon: c.value ? n(J) : n(P)
                 }, null, 8, ["icon"])
               ])
-            ], 8, oe)
+            ], 8, Te)
           ]),
-          a("div", re, [
-            a("button", {
+          s("div", Ee, [
+            s("button", {
               class: "phila-button is-extra-small",
-              "aria-label": `${u.value ? "Close" : "Open"} Trusted Site information panel`,
+              "aria-label": `${c.value ? "Close" : "Open"} Trusted Site information panel`,
               "aria-controls": "trusted-site-info",
-              "aria-expanded": u.value,
+              "aria-expanded": c.value,
               onClick: i[1] || (i[1] = //@ts-ignore
-              (...s) => t(n) && t(n)(...s))
+              (...l) => n(a) && n(a)(...l))
             }, [
-              i[5] || (i[5] = g(" An official website ", -1)),
-              a("span", de, [
-                v(t(p), { icon: t(ee) }, null, 8, ["icon"])
+              i[5] || (i[5] = _(" An official website ", -1)),
+              s("span", Oe, [
+                p(n($), { icon: n(ee) }, null, 8, ["icon"])
               ])
-            ], 8, ce)
+            ], 8, Ie)
           ])
         ]),
-        t(l).translation ? (o(), h("div", ue, [
-          m(r.$slots, "translation", {}, void 0, !0)
-        ])) : f("", !0)
+        n(e).translation ? (o(), u("div", De, [
+          f(d.$slots, "translation", {}, void 0, !0)
+        ])) : m("", !0)
       ]),
-      a("div", {
+      s("div", {
         id: "trusted-site-info",
         class: "has-background-secondary px-6",
-        hidden: !u.value
+        hidden: !c.value
       }, [
-        a("div", fe, [
-          a("div", ve, [
-            a("div", me, [
-              a("div", pe, [
-                a("div", be, [
-                  v(t(p), { icon: t(Y) }, null, 8, ["icon"])
+        s("div", He, [
+          s("div", Ue, [
+            s("div", Ge, [
+              s("div", je, [
+                s("div", Fe, [
+                  p(n($), { icon: n($e) }, null, 8, ["icon"])
                 ]),
-                i[6] || (i[6] = a("span", { class: "has-text-bold" }, "https://", -1))
+                i[6] || (i[6] = s("span", { class: "has-text-bold" }, "https://", -1))
               ]),
-              i[7] || (i[7] = a("div", { class: "trusted-text m-4" }, [
-                g(" The "),
-                a("strong", null, "https://"),
-                g(" in the address bar means your information is encrypted and can not be accessed by anyone else ")
+              i[7] || (i[7] = s("div", { class: "trusted-text m-4" }, [
+                _(" The "),
+                s("strong", null, "https://"),
+                _(" in the address bar means your information is encrypted and can not be accessed by anyone else ")
               ], -1))
             ]),
-            a("div", xe, [
-              a("div", ke, [
-                a("span", ge, [
-                  v(t(p), { icon: t(Z) }, null, 8, ["icon"])
+            s("div", Ve, [
+              s("div", Qe, [
+                s("span", Ke, [
+                  p(n($), { icon: n(Ce) }, null, 8, ["icon"])
                 ]),
-                i[8] || (i[8] = a("span", { class: "has-text-bold" }, ".gov", -1))
+                i[8] || (i[8] = s("span", { class: "has-text-bold" }, ".gov", -1))
               ]),
-              i[9] || (i[9] = a("div", { class: "trusted-text m-4" }, "Only government entities in the U.S. can end in .gov", -1))
+              i[9] || (i[9] = s("div", { class: "trusted-text m-4" }, "Only government entities in the U.S. can end in .gov", -1))
             ])
           ]),
-          a("div", ye, [
-            a("button", {
+          s("div", We, [
+            s("button", {
               class: "phila-button phila-button--primary icon-button is-extra-small",
               "aria-label": "Close Trusted Site information panel",
               onClick: i[2] || (i[2] = //@ts-ignore
-              (...s) => t(n) && t(n)(...s))
+              (...l) => n(a) && n(a)(...l))
             }, [
-              v(t(p), { icon: t(X) }, null, 8, ["icon"])
+              p(n($), { icon: n(_e) }, null, 8, ["icon"])
             ])
           ])
         ])
-      ], 8, he)
+      ], 8, Re)
     ], 64));
   }
-}), B = (e, l) => {
-  const d = e.__vccOpts || e;
-  for (const [n, u] of l)
-    d[n] = u;
-  return d;
-}, Ce = /* @__PURE__ */ B(_e, [["__scopeId", "data-v-117bdb56"]]), we = ["aria-controls", "aria-expanded", "aria-label", "onClick"], $e = { class: "icon" }, Be = ["id", "hidden"], Ae = /* @__PURE__ */ x({
+}), I = (t, e) => {
+  const r = t.__vccOpts || t;
+  for (const [a, c] of e)
+    r[a] = c;
+  return r;
+}, Ye = /* @__PURE__ */ I(qe, [["__scopeId", "data-v-117bdb56"]]), Ze = ["aria-controls", "aria-expanded", "aria-label", "onClick"], Xe = { class: "icon" }, Je = ["id", "hidden"], Pe = /* @__PURE__ */ h({
   __name: "NavbarBurger",
   props: {
     mobileNav: {},
     collapseGroup: {}
   },
-  setup(e) {
-    return (l, d) => (o(), c(t($), {
+  setup(t) {
+    return (e, r) => (o(), v(n(D), {
       id: "mobile-nav",
-      group: e.collapseGroup,
+      group: t.collapseGroup,
       "outside-click-close": "",
       "escape-key-close": "",
       "blur-close": "",
       "open-single": ""
     }, {
-      toggle: b((n) => [
-        a("button", {
-          class: w(["phila-navbar-burger phila-button icon-button", { "phila-navbar-item-flyout-active": n.open }]),
-          "aria-controls": n.ariaControls,
-          "aria-expanded": n.open,
-          "aria-label": `${n.open ? "Close" : "Open"} mobile navigation panel`,
-          onClick: n.onClick
+      toggle: b((a) => [
+        s("button", {
+          class: z(["phila-navbar-burger phila-button icon-button", { "phila-navbar-item-flyout-active": a.open }]),
+          "aria-controls": a.ariaControls,
+          "aria-expanded": a.open,
+          "aria-label": `${a.open ? "Close" : "Open"} mobile navigation panel`,
+          onClick: a.onClick
         }, [
-          a("span", $e, [
-            v(t(p), {
-              icon: n.open ? t(S) : t(J)
+          s("span", Xe, [
+            p(n($), {
+              icon: a.open ? n(X) : n(we)
             }, null, 8, ["icon"])
           ])
-        ], 10, we)
+        ], 10, Ze)
       ]),
-      default: b((n) => [
-        a("div", {
-          id: n.id,
+      default: b((a) => [
+        s("div", {
+          id: a.id,
           class: "phila-mobile-nav",
-          hidden: !n.open
+          hidden: !a.open
         }, [
-          m(l.$slots, "mobile-nav", {}, () => [
-            (o(), c(C(e.mobileNav)))
+          f(e.$slots, "mobile-nav", {}, () => [
+            (o(), v(S(t.mobileNav)))
           ])
-        ], 8, Be)
+        ], 8, Je)
       ]),
       _: 3
     }, 8, ["group"]));
   }
-}), Ne = ["href"], Le = ["href", "aria-controls", "aria-expanded", "onKeypress", "onTouchend", "onClick"], ze = ["id", "hidden"], Me = {
+}), et = ["href"], tt = ["href", "aria-controls", "aria-expanded", "onKeypress", "onTouchend", "onClick"], at = ["id", "hidden"], it = {
   key: 0,
   class: "content nav-flyout has-background-ghost-gray px-6 py-4",
   tabindex: "-1"
-}, Se = {
+}, nt = {
   class: "is-flex is-flex-column is-flex-wrap-wrap",
   style: { gap: "var(--spacing-4xl)" }
-}, Te = ["href"], Ee = /* @__PURE__ */ x({
+}, st = ["href"], ot = /* @__PURE__ */ h({
   __name: "NavbarLinks",
   props: {
     links: {},
     collapseGroup: {}
   },
-  setup(e) {
-    const l = (n) => !!(n.subLinks || n.subNav), d = (n) => `main-nav-${n.text.split(" ").join("-").toLowerCase().replace(/[^a-z0-9-]/g, "")}`;
-    return (n, u) => (o(!0), h(y, null, A(e.links, (r, i) => (o(), h(y, null, [
-      l(r) ? (o(), c(t($), {
-        id: d(r),
+  setup(t) {
+    const e = (a) => !!(a.subLinks || a.subNav), r = (a) => `main-nav-${a.text.split(" ").join("-").toLowerCase().replace(/[^a-z0-9-]/g, "")}`;
+    return (a, c) => (o(!0), u(N, null, j(t.links, (d, i) => (o(), u(N, null, [
+      e(d) ? (o(), v(n(D), {
+        id: r(d),
         key: `collapse-${i}`,
-        group: e.collapseGroup,
+        group: t.collapseGroup,
         "outside-click-close": "",
         "escape-key-close": "",
         "blur-close": "",
@@ -221,127 +225,473 @@ const ae = "data:image/svg+xml,%3csvg%20width='16'%20height='11'%20viewBox='0%20
         "open-single": "",
         class: "phila-navbar-link-list-item"
       }, {
-        toggle: b((s) => [
-          a("a", {
-            href: r.href,
-            class: w(["phila-navbar-link px-4", { "phila-navbar-item-flyout-active": s.open }]),
-            "aria-controls": s.ariaControls,
-            "aria-expanded": s.open,
+        toggle: b((l) => [
+          s("a", {
+            href: d.href,
+            class: z(["phila-navbar-link px-4", { "phila-navbar-item-flyout-active": l.open }]),
+            "aria-controls": l.ariaControls,
+            "aria-expanded": l.open,
             tabindex: "0",
-            onKeypress: G(s.onClick, ["enter"]),
-            onTouchend: s.onClick,
-            onClick: s.onClick
+            onKeypress: ce(l.onClick, ["enter"]),
+            onTouchend: l.onClick,
+            onClick: l.onClick
           }, [
-            g(_(r.text) + " ", 1),
-            v(t(p), {
+            _(g(d.text) + " ", 1),
+            p(n($), {
               class: "ml-1",
-              icon: s.open ? t(T) : t(E)
+              icon: l.open ? n(J) : n(P)
             }, null, 8, ["icon"])
-          ], 42, Le)
+          ], 42, tt)
         ]),
-        default: b((s) => [
-          (o(), h("div", {
-            id: s.id,
-            key: r.text,
-            hidden: !s.open
+        default: b((l) => [
+          (o(), u("div", {
+            id: l.id,
+            key: d.text,
+            hidden: !l.open
           }, [
-            r.subLinks ? (o(), h("div", Me, [
-              a("ul", Se, [
-                (o(!0), h(y, null, A(r.subLinks, (k) => (o(), h("li", {
-                  key: k.text,
+            d.subLinks ? (o(), u("div", it, [
+              s("ul", nt, [
+                (o(!0), u(N, null, j(d.subLinks, (x) => (o(), u("li", {
+                  key: x.text,
                   class: "sub-nav-link is-flex is-align-center",
                   style: { width: "150px" }
                 }, [
-                  a("a", {
-                    href: k.href,
+                  s("a", {
+                    href: x.href,
                     class: "has-text-link has-text-weight-medium",
                     tabindex: "0"
-                  }, _(k.text), 9, Te)
+                  }, g(x.text), 9, st)
                 ]))), 128))
               ])
-            ])) : (o(), c(C(r.subNav), { key: 1 }))
-          ], 8, ze))
+            ])) : (o(), v(S(d.subNav), { key: 1 }))
+          ], 8, at))
         ]),
         _: 2
-      }, 1032, ["id", "group"])) : (o(), h("div", {
+      }, 1032, ["id", "group"])) : (o(), u("div", {
         key: `link-${i}`,
         class: "phila-navbar-link-list-item"
       }, [
-        a("a", {
-          href: r.href,
+        s("a", {
+          href: d.href,
           class: "phila-navbar-link px-4",
           tabindex: "0"
-        }, _(r.text), 9, Ne)
+        }, g(d.text), 9, et)
       ]))
     ], 64))), 256));
   }
-}), Ie = /* @__PURE__ */ x({
+}), lt = /* @__PURE__ */ h({
   __name: "NavbarBrandLogo",
   props: {
+    logo: {},
     src: {},
-    href: { default: "/" },
+    href: {},
     altText: {}
   },
-  setup(e) {
-    const l = e;
-    return (d, n) => (o(), c(t(R), {
-      href: l.href,
+  setup(t) {
+    const e = t, r = k(() => ({
       variant: "city",
       layout: "stacked",
-      "color-scheme": "on-primary",
-      class: "phila-navbar-logo"
-    }, null, 8, ["href"]));
+      colorScheme: "on-primary",
+      href: e.href,
+      ...e.logo
+    }));
+    return (a, c) => (o(), v(n(ye), C(r.value, { class: "phila-navbar-logo" }), null, 16));
   }
-}), Ue = /* @__PURE__ */ B(Ie, [["__scopeId", "data-v-7dabdf6b"]]), Ge = { class: "pr-4" }, He = ["aria-controls", "aria-expanded", "aria-label", "onClick"], Oe = { class: "icon" }, je = ["id", "hidden"], De = /* @__PURE__ */ x({
+}), rt = /* @__PURE__ */ I(lt, [["__scopeId", "data-v-3011c249"]]), ct = { class: "pr-4" }, dt = ["aria-controls", "aria-expanded", "aria-label", "onClick"], ut = { class: "icon" }, ft = ["id", "hidden"], vt = /* @__PURE__ */ h({
   __name: "NavbarSearch",
   props: {
     search: {},
     collapseGroup: {}
   },
-  setup(e) {
-    return (l, d) => (o(), c(t($), {
+  setup(t) {
+    return (e, r) => (o(), v(n(D), {
       id: "navbar-search",
-      group: e.collapseGroup,
+      group: t.collapseGroup,
       "outside-click-close": "",
       "escape-key-close": "",
       "blur-close": "",
       "open-single": ""
     }, {
-      toggle: b((n) => [
-        a("div", Ge, [
-          a("button", {
-            class: w(["phila-button phila-button--primary icon-button is-small", { "phila-navbar-item-flyout-active": n.open }]),
-            "aria-controls": n.ariaControls,
-            "aria-expanded": n.open,
-            "aria-label": `${n.open ? "Close" : "Open"} search panel`,
-            onClick: n.onClick
+      toggle: b((a) => [
+        s("div", ct, [
+          s("button", {
+            class: z(["phila-button phila-button--primary icon-button is-small", { "phila-navbar-item-flyout-active": a.open }]),
+            "aria-controls": a.ariaControls,
+            "aria-expanded": a.open,
+            "aria-label": `${a.open ? "Close" : "Open"} search panel`,
+            onClick: a.onClick
           }, [
-            a("span", Oe, [
-              v(t(p), {
-                icon: n.open ? t(S) : t(W)
+            s("span", ut, [
+              p(n($), {
+                icon: a.open ? n(X) : n(ke)
               }, null, 8, ["icon"])
             ])
-          ], 10, He)
+          ], 10, dt)
         ])
       ]),
-      default: b((n) => [
-        a("div", {
-          id: n.id,
+      default: b((a) => [
+        s("div", {
+          id: a.id,
           class: "nav-flyout is-12",
-          hidden: !n.open
+          hidden: !a.open
         }, [
-          m(l.$slots, "default", {}, () => [
-            e.search && n.open ? (o(), c(C(e.search), { key: 0 })) : f("", !0)
+          f(e.$slots, "default", {}, () => [
+            t.search && a.open ? (o(), v(S(t.search), { key: 0 })) : m("", !0)
           ])
-        ], 8, je)
+        ], 8, ft)
       ]),
       _: 3
     }, 8, ["group"]));
   }
-}), Ve = { class: "phila-navbar-brand" }, Qe = { class: "phila-navbar-item phila-navbar-brand-link hidden-tablet" }, Ke = {
+}), mt = ["disabled"], F = /* @__PURE__ */ h({
+  inheritAttrs: !1,
+  __name: "PhlButton",
+  props: {
+    href: {},
+    to: {},
+    target: {},
+    rel: {},
+    disabled: { type: Boolean, default: !1 },
+    clickTarget: {},
+    variant: { default: "primary" },
+    size: { default: "medium" },
+    iconOnly: { type: Boolean, default: !1 },
+    iconRight: { type: Boolean },
+    text: {},
+    className: {},
+    iconDefinition: {},
+    iconClass: {},
+    src: {},
+    svgRaw: {}
+  },
+  setup(t) {
+    const e = t, r = (i) => "href" in i && i.href !== void 0 || "to" in i && i.to !== void 0, a = k(() => E(
+      "phila-button",
+      `phila-button--${e.variant}`,
+      e.size && `is-${e.size}`,
+      e.iconOnly && "icon-button",
+      e.iconOnly && e.variant === "standard" && "icon-button--standard",
+      e.className
+    )), c = k(() => r(e) ? "to" in e && e.to !== void 0 ? {
+      to: e.to,
+      disabled: e.disabled,
+      className: a.value
+    } : {
+      href: e.href,
+      target: e.target,
+      rel: e.rel,
+      disabled: e.disabled,
+      className: a.value
+    } : {}), d = k(
+      () => ({
+        iconDefinition: e.iconDefinition,
+        iconClass: e.iconClass,
+        src: e.src,
+        iconRight: e.iconRight,
+        iconOnly: e.iconOnly,
+        text: e.text,
+        size: e.size
+      })
+    );
+    return (i, l) => r(e) ? (o(), v(n(Y), C({ key: 0 }, { ...c.value, ...i.$attrs }, { role: "button" }), {
+      default: b(() => [
+        p(n(T), A(L(d.value)), {
+          default: b(() => [
+            f(i.$slots, "default", {}, () => [
+              _(g(e.text), 1)
+            ])
+          ]),
+          _: 3
+        }, 16)
+      ]),
+      _: 3
+    }, 16)) : (o(), u("button", C({
+      key: 1,
+      type: "button",
+      disabled: e.disabled,
+      class: a.value
+    }, i.$attrs), [
+      p(n(T), A(L(d.value)), {
+        default: b(() => [
+          f(i.$slots, "default", {}, () => [
+            _(g(e.text), 1)
+          ])
+        ]),
+        _: 3
+      }, 16)
+    ], 16, mt));
+  }
+});
+var V = {
+  prefix: "fas",
+  iconName: "xmark",
+  icon: [384, 512, [128473, 10005, 10006, 10060, 215, "close", "multiply", "remove", "times"], "f00d", "M55.1 73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L147.2 256 9.9 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192.5 301.3 329.9 438.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.8 256 375.1 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192.5 210.7 55.1 73.4z"]
+};
+const bt = ["id"], pt = {
+  key: 0,
+  class: "tooltip__tail",
+  "aria-hidden": "true"
+}, ht = {
+  key: 1,
+  class: "tooltip__plain-row has-text-body-small"
+}, yt = {
+  key: 0,
+  class: "tooltip__title-row"
+}, gt = { key: 0 }, kt = /* @__PURE__ */ h({
+  __name: "TooltipBubble",
+  props: {
+    id: {},
+    type: { default: "plain" },
+    color: { default: "default" },
+    tail: { type: Boolean, default: !1 },
+    placement: { default: "top-center" },
+    title: {},
+    dismissable: { type: Boolean, default: !1 },
+    className: {}
+  },
+  emits: ["dismiss"],
+  setup(t) {
+    const e = t, r = k(
+      () => E(
+        "tooltip",
+        "content",
+        "resets-link-colors",
+        `tooltip--${e.type}`,
+        `tooltip--${e.color}`,
+        e.tail && `tooltip--${e.placement}`,
+        e.className
+      )
+    );
+    return (a, c) => (o(), u("div", {
+      id: t.id,
+      class: z(r.value),
+      role: "tooltip"
+    }, [
+      t.tail ? (o(), u("div", pt)) : m("", !0),
+      t.type === "plain" ? (o(), u("div", ht, [
+        f(a.$slots, "default", {}, void 0, !0),
+        t.dismissable ? (o(), v(n(F), {
+          key: 0,
+          class: "tooltip__dismiss",
+          variant: "standard",
+          size: "extra-small",
+          "icon-only": !0,
+          "icon-definition": n(V),
+          "aria-label": "Dismiss tooltip",
+          onClick: c[0] || (c[0] = (d) => a.$emit("dismiss"))
+        }, null, 8, ["icon-definition"])) : m("", !0)
+      ])) : (o(), u(N, { key: 2 }, [
+        t.title || t.dismissable ? (o(), u("div", yt, [
+          t.title ? (o(), u("h6", gt, g(t.title), 1)) : m("", !0),
+          t.dismissable ? (o(), v(n(F), {
+            key: 1,
+            class: "tooltip__dismiss",
+            variant: "standard",
+            size: "extra-small",
+            "icon-only": !0,
+            "icon-definition": n(V),
+            "aria-label": "Dismiss tooltip",
+            onClick: c[1] || (c[1] = (d) => a.$emit("dismiss"))
+          }, null, 8, ["icon-definition"])) : m("", !0)
+        ])) : m("", !0),
+        f(a.$slots, "default", {}, void 0, !0)
+      ], 64))
+    ], 10, bt));
+  }
+}), te = (t, e) => {
+  const r = t.__vccOpts || t;
+  for (const [a, c] of e)
+    r[a] = c;
+  return r;
+}, xt = /* @__PURE__ */ te(kt, [["__scopeId", "data-v-0155bbdd"]]), _t = /* @__PURE__ */ h({
+  __name: "Tooltip",
+  props: {
+    trigger: { default: "hover" },
+    type: { default: "plain" },
+    color: { default: "default" },
+    tail: { type: Boolean, default: !1 },
+    placement: { default: "auto" },
+    title: {},
+    dismissable: { type: Boolean },
+    className: {}
+  },
+  setup(t) {
+    const e = t, r = de(), a = B(!1), c = B(null), d = B(null), i = B("top-center"), l = () => {
+      const y = c.value?.getBoundingClientRect();
+      if (!y) return "top-center";
+      const { innerWidth: M, innerHeight: ne } = window, H = y.top, se = ne - y.bottom, U = d.value?.firstElementChild?.getBoundingClientRect().height ?? 0, oe = (U > 0 ? H >= U : H >= se) ? "top" : "bottom", G = y.left + y.width / 2, le = G < M / 3 ? "left" : G > M * 2 / 3 ? "right" : "center";
+      return `${oe}-${le}`;
+    }, x = (y) => {
+      y.key === "Escape" && w();
+    }, R = (y) => {
+      c.value && !c.value.contains(y.target) && w();
+    }, O = () => {
+      e.placement === "auto" ? i.value = l() : i.value = e.placement, a.value = !0, document.addEventListener("keydown", x), e.trigger === "click" && document.addEventListener("click", R);
+    }, w = () => {
+      a.value = !1, document.removeEventListener("keydown", x), document.removeEventListener("click", R);
+    }, ae = () => {
+      a.value ? w() : O();
+    };
+    K(w);
+    const ie = k(() => ({
+      type: e.type,
+      color: e.color,
+      tail: e.tail,
+      placement: i.value,
+      title: e.title,
+      dismissable: e.dismissable
+    }));
+    return (y, M) => (o(), u("span", C(
+      {
+        ref_key: "wrapperEl",
+        ref: c,
+        class: n(E)("tooltip-trigger", e.className)
+      },
+      t.trigger === "click" ? { onClick: ae } : { onMouseenter: O, onMouseleave: w, onFocusin: O, onFocusout: w }
+    ), [
+      f(y.$slots, "default", { tooltipId: n(r) }, void 0, !0),
+      s("span", {
+        ref_key: "positionerEl",
+        ref: d,
+        class: z(["tooltip-trigger__positioner", `tooltip-trigger__positioner--${i.value}`]),
+        style: W({
+          visibility: a.value ? "visible" : "hidden",
+          "--positioner-gap": t.tail ? "var(--spacing-l)" : "0.5rem"
+        }),
+        onClick: M[0] || (M[0] = ue(() => {
+        }, ["stop"]))
+      }, [
+        p(xt, C(ie.value, {
+          id: n(r),
+          onDismiss: w
+        }), {
+          default: b(() => [
+            f(y.$slots, "body", {}, void 0, !0)
+          ]),
+          _: 3
+        }, 16, ["id"])
+      ], 6)
+    ], 16));
+  }
+}), $t = /* @__PURE__ */ te(_t, [["__scopeId", "data-v-5dcd06cf"]]), Ct = ["disabled"], wt = /* @__PURE__ */ h({
+  inheritAttrs: !1,
+  __name: "PhlButton",
+  props: {
+    href: {},
+    to: {},
+    target: {},
+    rel: {},
+    disabled: { type: Boolean, default: !1 },
+    clickTarget: {},
+    variant: { default: "primary" },
+    size: { default: "medium" },
+    iconOnly: { type: Boolean, default: !1 },
+    iconRight: { type: Boolean },
+    text: {},
+    className: {},
+    iconDefinition: {},
+    iconClass: {},
+    src: {},
+    svgRaw: {}
+  },
+  setup(t) {
+    const e = t, r = (i) => "href" in i && i.href !== void 0 || "to" in i && i.to !== void 0, a = k(() => E(
+      "phila-button",
+      `phila-button--${e.variant}`,
+      e.size && `is-${e.size}`,
+      e.iconOnly && "icon-button",
+      e.iconOnly && e.variant === "standard" && "icon-button--standard",
+      e.className
+    )), c = k(() => r(e) ? "to" in e && e.to !== void 0 ? {
+      to: e.to,
+      disabled: e.disabled,
+      className: a.value
+    } : {
+      href: e.href,
+      target: e.target,
+      rel: e.rel,
+      disabled: e.disabled,
+      className: a.value
+    } : {}), d = k(
+      () => ({
+        iconDefinition: e.iconDefinition,
+        iconClass: e.iconClass,
+        src: e.src,
+        iconRight: e.iconRight,
+        iconOnly: e.iconOnly,
+        text: e.text,
+        size: e.size
+      })
+    );
+    return (i, l) => r(e) ? (o(), v(n(Y), C({ key: 0 }, { ...c.value, ...i.$attrs }, { role: "button" }), {
+      default: b(() => [
+        p(n(T), A(L(d.value)), {
+          default: b(() => [
+            f(i.$slots, "default", {}, () => [
+              _(g(e.text), 1)
+            ])
+          ]),
+          _: 3
+        }, 16)
+      ]),
+      _: 3
+    }, 16)) : (o(), u("button", C({
+      key: 1,
+      type: "button",
+      disabled: e.disabled,
+      class: a.value
+    }, i.$attrs), [
+      p(n(T), A(L(d.value)), {
+        default: b(() => [
+          f(i.$slots, "default", {}, () => [
+            _(g(e.text), 1)
+          ])
+        ]),
+        _: 3
+      }, 16)
+    ], 16, Ct));
+  }
+}), Bt = { class: "navbar-info" }, Nt = { class: "has-text-body-small" }, zt = /* @__PURE__ */ h({
+  __name: "NavbarInfo",
+  props: {
+    infoTitle: {},
+    infoMessage: {}
+  },
+  setup(t) {
+    return (e, r) => (o(), u("div", Bt, [
+      p(n($t), {
+        type: "rich",
+        title: t.infoTitle,
+        trigger: "click",
+        dismissable: !0
+      }, {
+        default: b(({ tooltipId: a }) => [
+          p(n(wt), {
+            class: "navbar-info__trigger",
+            variant: "standard",
+            size: "small",
+            "icon-only": !0,
+            "icon-definition": n(ee),
+            "aria-label": "More information",
+            "aria-describedby": a
+          }, null, 8, ["icon-definition", "aria-describedby"])
+        ]),
+        body: b(() => [
+          f(e.$slots, "default", {}, () => [
+            s("div", Nt, g(t.infoMessage), 1)
+          ], !0)
+        ]),
+        _: 3
+      }, 8, ["title"])
+    ]));
+  }
+}), Mt = /* @__PURE__ */ I(zt, [["__scopeId", "data-v-56b79838"]]), At = { class: "phila-navbar-brand" }, Lt = {
+  key: 0,
+  class: "phila-navbar-item phila-navbar-brand-link hidden-tablet"
+}, Tt = {
   key: 0,
   class: "content"
-}, Fe = ["href"], Re = { class: "phila-navbar-item phila-navbar-list is-flex is-align-center is-justify-space-between content has-text-label-default hidden-tablet" }, qe = { class: "phila-navbar-search" }, L = "5rem", We = /* @__PURE__ */ x({
+}, St = ["href"], Et = { class: "phila-navbar-item phila-navbar-list is-flex is-align-center is-justify-space-between content has-text-label-default hidden-tablet" }, It = { class: "phila-navbar-search" }, Q = "5rem", Ot = /* @__PURE__ */ h({
   __name: "index",
   props: {
     id: {},
@@ -350,68 +700,104 @@ const ae = "data:image/svg+xml,%3csvg%20width='16'%20height='11'%20viewBox='0%20
     mobileNav: {},
     collapseGroup: {},
     search: {},
-    links: { default: () => [{ text: "Home", href: "#" }] }
+    links: { default: () => [{ text: "Home", href: "#" }] },
+    infoTitle: {},
+    infoMessage: {}
   },
-  setup(e) {
-    const l = e, { state: d } = z(), n = H("navBarElement"), u = N(L), r = N(0), i = F(() => {
-      const s = (n.value?.offsetTop || 0) + (n.value?.offsetHeight || 0), k = typeof window < "u" ? window.innerWidth : 1024;
-      u.value = !l.sticky || k < 1024 ? s + "px" : L, r.value = s;
+  setup(t) {
+    const e = t, { state: r } = q(), a = fe("navBarElement"), c = B(Q), d = B(0), i = pe(() => {
+      const l = (a.value?.offsetTop || 0) + (a.value?.offsetHeight || 0), x = typeof window < "u" ? window.innerWidth : 1024;
+      c.value = !e.sticky || x < 1024 ? l + "px" : Q, d.value = l;
     }, 100);
-    return O(() => d.value, i, { deep: !0, immediate: !0 }), j(() => {
+    return ve(() => r.value, i, { deep: !0, immediate: !0 }), me(() => {
       window.addEventListener("resize", i);
-    }), D(() => {
+    }), K(() => {
       window.removeEventListener("resize", i);
-    }), (s, k) => (o(), h("nav", {
+    }), (l, x) => (o(), u("nav", {
       ref_key: "navBarElement",
-      ref: n,
-      class: w(["phila-navbar has-background-primary", { "is-sticky-desktop": e.sticky }]),
+      ref: a,
+      class: z(["phila-navbar has-background-primary", { "is-sticky-desktop": t.sticky }]),
       "aria-label": "Main navigation",
-      style: V(`--nav-height:${u.value};--nav-bottom:${r.value}px`)
+      style: W(`--nav-height:${c.value};--nav-bottom:${d.value}px`)
     }, [
-      m(s.$slots, "navbar-burger", {}, () => [
-        e.mobileNav ? (o(), c(Ae, {
+      f(l.$slots, "navbar-burger", {}, () => [
+        t.mobileNav ? (o(), v(Pe, {
           key: 0,
-          "mobile-nav": e.mobileNav,
-          "collapse-group": e.id
-        }, null, 8, ["mobile-nav", "collapse-group"])) : f("", !0)
+          "mobile-nav": t.mobileNav,
+          "collapse-group": t.id
+        }, null, 8, ["mobile-nav", "collapse-group"])) : m("", !0)
       ], !0),
-      a("div", Ve, [
-        m(s.$slots, "navbar-logo", {}, () => [
-          e.navbarBrand?.brandingImage ? (o(), c(Ue, Q(K({ key: 0 }, e.navbarBrand.brandingImage)), null, 16)) : f("", !0)
+      s("div", At, [
+        f(l.$slots, "navbar-logo", {}, () => [
+          t.navbarBrand?.brandingImage ? (o(), v(rt, C({ key: 0 }, t.navbarBrand.brandingImage, {
+            logo: t.navbarBrand?.logo
+          }), null, 16, ["logo"])) : m("", !0)
         ], !0),
-        a("div", Qe, [
-          m(s.$slots, "navbar-brand-link", {}, () => [
-            e.navbarBrand?.brandingLink ? (o(), h("div", Ke, [
-              a("a", {
+        l.$slots["navbar-brand-link"] || t.navbarBrand?.brandingLink ? (o(), u("div", Lt, [
+          f(l.$slots, "navbar-brand-link", {}, () => [
+            t.navbarBrand?.brandingLink ? (o(), u("div", Tt, [
+              s("a", {
                 tabindex: "0",
-                href: e.navbarBrand.brandingLink.href,
+                href: t.navbarBrand.brandingLink.href,
                 class: "has-text-underline"
-              }, _(e.navbarBrand.brandingLink.text), 9, Fe)
-            ])) : f("", !0)
+              }, g(t.navbarBrand.brandingLink.text), 9, St)
+            ])) : m("", !0)
           ], !0)
-        ])
+        ])) : m("", !0),
+        t.infoTitle || t.infoMessage || l.$slots["info-body"] ? (o(), v(Mt, {
+          key: 1,
+          "info-title": t.infoTitle,
+          "info-message": t.infoMessage
+        }, {
+          default: b(() => [
+            l.$slots["info-body"] ? f(l.$slots, "info-body", { key: 0 }, void 0, !0) : m("", !0)
+          ]),
+          _: 3
+        }, 8, ["info-title", "info-message"])) : m("", !0)
       ]),
-      a("div", Re, [
-        m(s.$slots, "navbar-links", {}, () => [
-          e.links ? (o(), c(Ee, {
+      s("div", Et, [
+        f(l.$slots, "navbar-links", {}, () => [
+          t.links ? (o(), v(ot, {
             key: 0,
-            links: e.links,
-            "collapse-group": e.id
-          }, null, 8, ["links", "collapse-group"])) : f("", !0)
+            links: t.links,
+            "collapse-group": t.id
+          }, null, 8, ["links", "collapse-group"])) : m("", !0)
         ], !0)
       ]),
-      a("div", qe, [
-        m(s.$slots, "navbar-search", {}, () => [
-          e.search ? (o(), c(De, {
+      s("div", It, [
+        f(l.$slots, "navbar-search", {}, () => [
+          t.search ? (o(), v(vt, {
             key: 0,
-            search: e.search,
-            "collapse-group": e.id
-          }, null, 8, ["search", "collapse-group"])) : f("", !0)
+            search: t.search,
+            "collapse-group": t.id
+          }, null, 8, ["search", "collapse-group"])) : m("", !0)
         ], !0)
       ])
     ], 6));
   }
-}), Xe = /* @__PURE__ */ B(We, [["__scopeId", "data-v-26fd958d"]]), aa = /* @__PURE__ */ x({
+}), Dt = /* @__PURE__ */ I(Ot, [["__scopeId", "data-v-554e2ac4"]]), Rt = { class: "site-wide-alert content" }, Ht = { class: "alert-content" }, Ut = { class: "content-text" }, Gt = { class: "title" }, jt = { class: "body" }, Ft = /* @__PURE__ */ h({
+  __name: "AlertBanner",
+  props: {
+    bannerTitle: {},
+    bannerMessage: {}
+  },
+  setup(t) {
+    const e = t;
+    return (r, a) => (o(), u("div", Rt, [
+      s("div", Ht, [
+        p(n(he), {
+          "icon-definition": n(xe),
+          size: "small",
+          decorative: !0
+        }, null, 8, ["icon-definition"]),
+        s("div", Ut, [
+          s("h6", Gt, g(e.bannerTitle), 1),
+          s("div", jt, g(e.bannerMessage), 1)
+        ])
+      ])
+    ]));
+  }
+}), Yt = /* @__PURE__ */ h({
   __name: "AppHeader",
   props: {
     showTrustedSite: { type: Boolean, default: !0 },
@@ -423,29 +809,48 @@ const ae = "data:image/svg+xml,%3csvg%20width='16'%20height='11'%20viewBox='0%20
     mobileNav: { default: void 0 },
     collapseGroup: {},
     search: { default: void 0 },
-    links: { default: void 0 }
+    links: { default: void 0 },
+    infoTitle: { default: void 0 },
+    infoMessage: { default: void 0 },
+    bannerTitle: { default: void 0 },
+    bannerMessage: { default: void 0 }
   },
-  setup(e) {
-    return (l, d) => (o(), h(y, null, [
-      e.showTrustedSite ? (o(), c(Ce, { key: 0 }, {
+  setup(t) {
+    return (e, r) => (o(), u(N, null, [
+      t.showTrustedSite ? (o(), v(Ye, { key: 0 }, {
         translation: b(() => [
-          m(l.$slots, "translations", {}, () => [
-            e.translations ? (o(), c(C(e.translations), { key: 0 })) : f("", !0)
+          f(e.$slots, "translations", {}, () => [
+            t.translations ? (o(), v(S(t.translations), { key: 0 })) : m("", !0)
           ])
         ]),
         _: 3
-      })) : f("", !0),
-      v(Xe, {
-        id: e.id,
-        sticky: e.sticky,
-        "mobile-nav": e.mobileNav,
-        links: e.links,
-        "navbar-brand": e.navbarBrand,
-        search: e.search
-      }, null, 8, ["id", "sticky", "mobile-nav", "links", "navbar-brand", "search"])
+      })) : m("", !0),
+      p(Dt, {
+        id: t.id,
+        sticky: t.sticky,
+        "mobile-nav": t.mobileNav,
+        links: t.links,
+        "navbar-brand": t.navbarBrand,
+        search: t.search,
+        "info-title": t.infoTitle,
+        "info-message": t.infoMessage
+      }, be({ _: 2 }, [
+        e.$slots["info-body"] ? {
+          name: "info-body",
+          fn: b(() => [
+            f(e.$slots, "info-body")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1032, ["id", "sticky", "mobile-nav", "links", "navbar-brand", "search", "info-title", "info-message"]),
+      t.bannerTitle || t.bannerMessage ? (o(), v(Ft, {
+        key: 1,
+        "banner-title": t.bannerTitle,
+        "banner-message": t.bannerMessage
+      }, null, 8, ["banner-title", "banner-message"])) : m("", !0)
     ], 64));
   }
 });
 export {
-  aa as AppHeader
+  Yt as AppHeader
 };