@nysds/components 1.4.5 → 1.5.0

package/dist/nysds.es.js

@@ -2,7 +2,7 @@ import { css as g, LitElement as u, html as a } from "lit";
 import { property as r, state as O } from "lit/decorators.js";
 import { ifDefined as h } from "lit/directives/if-defined.js";
 /*!
-   * New York State Design System (v1.4.0)
+   * New York State Design System (v1.5.0)
    * Description: A design system for New York State's digital products.
    * Repository: https://github.com/its-hcd/nysds
    * License: MIT
@@ -660,17 +660,17 @@ const k1 = class k1 extends u {
   }
 };
 k1.styles = Y1;
-let c1 = k1;
+let l1 = k1;
 m1([
   r({ type: String })
-], c1.prototype, "position");
+], l1.prototype, "position");
 m1([
   r({ type: Boolean, reflect: !0 })
-], c1.prototype, "visible");
+], l1.prototype, "visible");
 m1([
   O()
-], c1.prototype, "isMobile");
-customElements.get("nys-backtotop") || customElements.define("nys-backtotop", c1);
+], l1.prototype, "isMobile");
+customElements.get("nys-backtotop") || customElements.define("nys-backtotop", l1);
 const K1 = g`
   :host {
     /* Anything that can be overridden should be defined here */
@@ -1729,7 +1729,7 @@ const A = (j = class extends u {
           if (Array.from(
             this.querySelectorAll("nys-checkbox")
           ).filter(
-            ($) => $.checked
+            (S) => S.checked
           ).length === 0)
             return c;
         } else
@@ -1834,7 +1834,7 @@ T([
 ], A.prototype, "size", 1);
 let re = A;
 customElements.get("nys-checkboxgroup") || customElements.define("nys-checkboxgroup", re);
-var ne = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, M = (l, e, t, o) => {
+var ne = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, V = (l, e, t, o) => {
   for (var s = o > 1 ? void 0 : o ? ie(e, t) : e, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = (o ? i(e, t, s) : i(s)) || s);
   return o && s && ne(e, t, s), s;
@@ -1999,43 +1999,43 @@ const L = (G = class extends u {
     `;
   }
 }, G.VALID_SIZES = ["sm", "md"], G.styles = H1, G.formAssociated = !0, G);
-M([
+V([
   r({ type: Boolean, reflect: !0 })
 ], L.prototype, "checked", 2);
-M([
+V([
   r({ type: Boolean, reflect: !0 })
 ], L.prototype, "disabled", 2);
-M([
+V([
   r({ type: Boolean, reflect: !0 })
 ], L.prototype, "required", 2);
-M([
+V([
   r({ type: String })
 ], L.prototype, "label", 2);
-M([
+V([
   r({ type: String })
 ], L.prototype, "description", 2);
-M([
+V([
   r({ type: String })
 ], L.prototype, "id", 2);
-M([
+V([
   r({ type: String, reflect: !0 })
 ], L.prototype, "name", 2);
-M([
+V([
   r({ type: String })
 ], L.prototype, "value", 2);
-M([
+V([
   r({ type: Boolean, reflect: !0 })
 ], L.prototype, "showError", 2);
-M([
+V([
   r({ type: String })
 ], L.prototype, "errorMessage", 2);
-M([
+V([
   r({ type: Boolean })
 ], L.prototype, "groupExist", 2);
-M([
+V([
   r({ type: Boolean, reflect: !0 })
 ], L.prototype, "tile", 2);
-M([
+V([
   r({ reflect: !0 })
 ], L.prototype, "size", 1);
 let le = L;
@@ -2111,17 +2111,17 @@ const f1 = class f1 extends u {
   }
 };
 f1.styles = ce, f1.formAssociated = !0;
-let d1 = f1;
+let c1 = f1;
 x1([
   r({ type: Boolean })
-], d1.prototype, "showError");
+], c1.prototype, "showError");
 x1([
   r({ type: String })
-], d1.prototype, "errorMessage");
+], c1.prototype, "errorMessage");
 x1([
   r({ type: Boolean, reflect: !0 })
-], d1.prototype, "showDivider");
-customElements.get("nys-errormessage") || customElements.define("nys-errormessage", d1);
+], c1.prototype, "showDivider");
+customElements.get("nys-errormessage") || customElements.define("nys-errormessage", c1);
 async function he(l, e) {
   if (!e || e.trim() === "") return !0;
   const t = e.toLowerCase().split(",").map((n) => n.trim()), o = l.name.toLowerCase(), s = o.includes(".") ? o.split(".").pop() : "";
@@ -2465,21 +2465,21 @@ const L1 = class L1 extends u {
   }
 };
 L1.styles = ue;
-let r1 = L1;
+let o1 = L1;
 v1([
   r({ type: String })
-], r1.prototype, "filename");
+], o1.prototype, "filename");
 v1([
   r({ type: String })
-], r1.prototype, "status");
+], o1.prototype, "status");
 v1([
   r({ type: Number })
-], r1.prototype, "progress");
+], o1.prototype, "progress");
 v1([
   r({ type: String })
-], r1.prototype, "errorMessage");
-customElements.define("nys-fileitem", r1);
-var ge = Object.defineProperty, V = (l, e, t, o) => {
+], o1.prototype, "errorMessage");
+customElements.define("nys-fileitem", o1);
+var ge = Object.defineProperty, M = (l, e, t, o) => {
   for (var s = void 0, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && ge(e, t, s), s;
@@ -2779,43 +2779,43 @@ const C1 = class C1 extends u {
 };
 C1.styles = ye, C1.formAssociated = !0;
 let x = C1;
-V([
+M([
   r({ type: String })
 ], x.prototype, "id");
-V([
+M([
   r({ type: String, reflect: !0 })
 ], x.prototype, "name");
-V([
+M([
   r({ type: String })
 ], x.prototype, "label");
-V([
+M([
   r({ type: String })
 ], x.prototype, "description");
-V([
+M([
   r({ type: Boolean })
 ], x.prototype, "multiple");
-V([
+M([
   r({ type: String })
 ], x.prototype, "accept");
-V([
+M([
   r({ type: Boolean, reflect: !0 })
 ], x.prototype, "disabled");
-V([
+M([
   r({ type: Boolean, reflect: !0 })
 ], x.prototype, "required");
-V([
+M([
   r({ type: Boolean, reflect: !0 })
 ], x.prototype, "optional");
-V([
+M([
   r({ type: Boolean, reflect: !0 })
 ], x.prototype, "showError");
-V([
+M([
   r({ type: String })
 ], x.prototype, "errorMessage");
-V([
+M([
   r({ type: Boolean })
 ], x.prototype, "dropzone");
-V([
+M([
   r({ type: String, reflect: !0 })
 ], x.prototype, "width");
 customElements.get("nys-fileinput") || customElements.define("nys-fileinput", x);
@@ -3452,14 +3452,14 @@ const Ce = {
     transform: scale(-1, -1);
   }
 `;
-var be = Object.defineProperty, _e = Object.getOwnPropertyDescriptor, i1 = (l, e, t, o) => {
+var be = Object.defineProperty, _e = Object.getOwnPropertyDescriptor, h1 = (l, e, t, o) => {
   for (var s = o > 1 ? void 0 : o ? _e(e, t) : e, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = (o ? i(e, t, s) : i(s)) || s);
   return o && s && be(e, t, s), s;
 }, t1;
-const o1 = (t1 = class extends u {
+const n1 = (t1 = class extends u {
   constructor() {
-    super(...arguments), this.name = "", this.label = "", this.ariaDescription = "", this.rotate = "0", this.flip = "", this.color = "", this._size = "sm";
+    super(...arguments), this.name = "", this.ariaLabel = "", this.rotate = "0", this.flip = "", this.color = "", this._size = "sm";
   }
   get size() {
     return this._size;
@@ -3473,7 +3473,7 @@ const o1 = (t1 = class extends u {
     const e = Ce[this.name];
     if (!e) return null;
     const s = new DOMParser().parseFromString(e, "image/svg+xml").documentElement;
-    return s instanceof SVGElement ? (s.setAttribute("role", "img"), this.label ? (s.setAttribute("aria-label", this.label), s.removeAttribute("aria-hidden")) : (s.setAttribute("aria-hidden", "true"), s.removeAttribute("aria-label")), this.ariaDescription && s.setAttribute("aria-description", this.ariaDescription), s.style.rotate = `${this.rotate}deg`, s.style.color = this.color || "currentcolor", s.classList.add(`nys-icon--${this.size}`), s.classList.add("nys-icon--svg"), this.flip && s.classList.add(`nys-icon--flip-${this.flip}`), s) : null;
+    return s instanceof SVGElement ? (s.setAttribute("role", "img"), this.ariaLabel ? (s.setAttribute("aria-label", this.ariaLabel), s.removeAttribute("aria-hidden")) : (s.setAttribute("aria-hidden", "true"), s.removeAttribute("aria-label")), s.style.rotate = `${this.rotate}deg`, s.style.color = this.color || "currentcolor", s.classList.add(`nys-icon--${this.size}`), s.classList.add("nys-icon--svg"), this.flip && s.classList.add(`nys-icon--flip-${this.flip}`), s) : null;
   }
   render() {
     const e = this.getIcon();
@@ -3497,28 +3497,25 @@ const o1 = (t1 = class extends u {
   "48",
   "64"
 ], t1);
-i1([
+h1([
   r({ type: String, reflect: !0 })
-], o1.prototype, "name", 2);
-i1([
+], n1.prototype, "name", 2);
+h1([
   r({ type: String })
-], o1.prototype, "label", 2);
-i1([
+], n1.prototype, "ariaLabel", 2);
+h1([
   r({ type: String })
-], o1.prototype, "ariaDescription", 2);
-i1([
+], n1.prototype, "rotate", 2);
+h1([
   r({ type: String })
-], o1.prototype, "rotate", 2);
-i1([
+], n1.prototype, "flip", 2);
+h1([
   r({ type: String })
-], o1.prototype, "flip", 2);
-i1([
-  r({ type: String })
-], o1.prototype, "color", 2);
-i1([
+], n1.prototype, "color", 2);
+h1([
   r({ reflect: !0 })
-], o1.prototype, "size", 1);
-let me = o1;
+], n1.prototype, "size", 1);
+let me = n1;
 customElements.get("nys-icon") || customElements.define("nys-icon", me);
 const xe = g`
   :host {
@@ -3599,7 +3596,7 @@ var we = Object.defineProperty, b1 = (l, e, t, o) => {
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && we(e, t, s), s;
 };
-const S1 = class S1 extends u {
+const $1 = class $1 extends u {
   constructor() {
     super(...arguments), this.id = "", this.label = "", this.description = "", this.flag = "";
   }
@@ -3618,21 +3615,21 @@ const S1 = class S1 extends u {
     `;
   }
 };
-S1.styles = xe;
-let n1 = S1;
+$1.styles = xe;
+let r1 = $1;
 b1([
   r({ type: String })
-], n1.prototype, "id");
+], r1.prototype, "id");
 b1([
   r({ type: String })
-], n1.prototype, "label");
+], r1.prototype, "label");
 b1([
   r({ type: String })
-], n1.prototype, "description");
+], r1.prototype, "description");
 b1([
   r({ type: String })
-], n1.prototype, "flag");
-customElements.get("nys-label") || customElements.define("nys-label", n1);
+], r1.prototype, "flag");
+customElements.get("nys-label") || customElements.define("nys-label", r1);
 const Z1 = g`
   :host {
     /* Global Radiobutton Styles */
@@ -3991,7 +3988,7 @@ var ke = Object.defineProperty, Le = Object.getOwnPropertyDescriptor, B = (l, e,
     (i = l[n]) && (s = (o ? i(e, t, s) : i(s)) || s);
   return o && s && ke(e, t, s), s;
 };
-let Se = 0;
+let $e = 0;
 var Y;
 const E = (Y = class extends u {
   // allows use of elementInternals' API
@@ -4008,7 +4005,7 @@ const E = (Y = class extends u {
   }
   // Generate a unique ID if one is not provided
   connectedCallback() {
-    super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${Se++}`), this.addEventListener("nys-change", this._handleRadioButtonChange), this.addEventListener("invalid", this._handleInvalid);
+    super.connectedCallback(), this.id || (this.id = `nys-radiogroup-${Date.now()}-${$e++}`), this.addEventListener("nys-change", this._handleRadioButtonChange), this.addEventListener("invalid", this._handleInvalid);
   }
   disconnectedCallback() {
     super.disconnectedCallback(), this.removeEventListener("nys-change", this._handleRadioButtonChange), this.removeEventListener("invalid", this._handleInvalid);
@@ -4145,14 +4142,14 @@ B([
 B([
   r({ type: Boolean, reflect: !0 })
 ], E.prototype, "tile", 2);
-let $e = E;
-customElements.get("nys-radiogroup") || customElements.define("nys-radiogroup", $e);
-var De = Object.defineProperty, Me = Object.getOwnPropertyDescriptor, F = (l, e, t, o) => {
-  for (var s = o > 1 ? void 0 : o ? Me(e, t) : e, n = l.length - 1, i; n >= 0; n--)
+let Se = E;
+customElements.get("nys-radiogroup") || customElements.define("nys-radiogroup", Se);
+var De = Object.defineProperty, Ve = Object.getOwnPropertyDescriptor, F = (l, e, t, o) => {
+  for (var s = o > 1 ? void 0 : o ? Ve(e, t) : e, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = (o ? i(e, t, s) : i(s)) || s);
   return o && s && De(e, t, s), s;
 };
-let Ve = 0;
+let Me = 0;
 var y;
 const q = (y = class extends u {
   constructor() {
@@ -4177,7 +4174,7 @@ const q = (y = class extends u {
   /********************** Lifecycle updates **********************/
   // Generate a unique ID if one is not provided
   connectedCallback() {
-    super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${Ve++}`), this.checked && (y.buttonGroup[this.name] && (y.buttonGroup[this.name].checked = !1, y.buttonGroup[this.name].requestUpdate()), y.buttonGroup[this.name] = this);
+    super.connectedCallback(), this.id || (this.id = `nys-radiobutton-${Date.now()}-${Me++}`), this.checked && (y.buttonGroup[this.name] && (y.buttonGroup[this.name].checked = !1, y.buttonGroup[this.name].requestUpdate()), y.buttonGroup[this.name] = this);
   }
   updated(e) {
     e.has("checked") && this.checked && y.buttonGroup[this.name] !== this && (y.buttonGroup[this.name] && (y.buttonGroup[this.name].checked = !1, y.buttonGroup[this.name].requestUpdate()), y.buttonGroup[this.name] = this);
@@ -4438,7 +4435,7 @@ var He = Object.defineProperty, p1 = (l, e, t, o) => {
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && He(e, t, s), s;
 };
-class a1 extends u {
+class i1 extends u {
   constructor() {
     super(...arguments), this.disabled = !1, this.selected = !1, this.value = "", this.label = "", this.hidden = !1;
   }
@@ -4467,20 +4464,20 @@ class a1 extends u {
 }
 p1([
   r({ type: Boolean, reflect: !0 })
-], a1.prototype, "disabled");
+], i1.prototype, "disabled");
 p1([
   r({ type: Boolean, reflect: !0 })
-], a1.prototype, "selected");
+], i1.prototype, "selected");
 p1([
   r({ type: String })
-], a1.prototype, "value");
+], i1.prototype, "value");
 p1([
   r({ type: String })
-], a1.prototype, "label");
+], i1.prototype, "label");
 p1([
   r({ type: Boolean, reflect: !0 })
-], a1.prototype, "hidden");
-customElements.define("nys-option", a1);
+], i1.prototype, "hidden");
+customElements.define("nys-option", i1);
 var Ze = Object.defineProperty, Ie = Object.getOwnPropertyDescriptor, H = (l, e, t, o) => {
   for (var s = o > 1 ? void 0 : o ? Ie(e, t) : e, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = (o ? i(e, t, s) : i(s)) || s);
@@ -4523,7 +4520,7 @@ const z = (W = class extends u {
     if (!e || !t) return;
     t.querySelectorAll("option:not([hidden])").forEach((i) => i.remove()), e.assignedElements({ flatten: !0 }).forEach((i) => {
       var c;
-      if (i instanceof a1) {
+      if (i instanceof i1) {
         const d = document.createElement("option");
         d.value = i.value, d.textContent = i.label || ((c = i.textContent) == null ? void 0 : c.trim()) || "", d.disabled = i.disabled, d.selected = i.selected, t.appendChild(d);
       }
@@ -4763,7 +4760,7 @@ var Ue = Object.defineProperty, I1 = (l, e, t, o) => {
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && Ue(e, t, s), s;
 };
-const $1 = class $1 extends u {
+const S1 = class S1 extends u {
   constructor() {
     super(), this.id = "", this.href = "";
   }
@@ -4804,8 +4801,8 @@ const $1 = class $1 extends u {
     `;
   }
 };
-$1.styles = qe;
-let u1 = $1;
+S1.styles = qe;
+let u1 = S1;
 I1([
   r({ type: String })
 ], u1.prototype, "id");
@@ -6290,7 +6287,7 @@ const D1 = class D1 extends u {
   updated(e) {
     super.updated(e);
     const t = this._firstAssignedEl;
-    t && e.has("text") && this._passAriaDescription(t);
+    t && e.has("text") && this._passAria(t);
   }
   // Listen to window scroll so a focus tooltip can auto position even when user move across the page
   _addScrollListeners() {
@@ -6300,9 +6297,15 @@ const D1 = class D1 extends u {
     window.removeEventListener("scroll", this._handleScrollOrResize, !0), window.removeEventListener("resize", this._handleScrollOrResize);
   }
   /******************** Functions ********************/
-  // We need to pass `ariaDescription` to the nys-components so they can announce both their label and the tooltip's text
-  _passAriaDescription(e) {
-    e.tagName.toLowerCase().startsWith("nys-") && e.setAttribute("ariaDescription", this.text);
+  // We need to pass `ariaLabel` or `ariaDescription` to the nys-components so they can announce both their label and the tooltip's text
+  _passAria(e) {
+    const t = e.tagName.toLowerCase();
+    if (t.startsWith("nys-"))
+      if (t === "nys-icon") {
+        const o = e.getAttribute("ariaLabel") || "", s = o ? `${o}, ${this.text}` : this.text;
+        e.setAttribute("ariaLabel", s);
+      } else
+        e.setAttribute("ariaDescription", this.text);
   }
   async _applyFocusBehavior(e) {
     var o;
@@ -6316,8 +6319,8 @@ const D1 = class D1 extends u {
   }
   // Checks if user's set position fit with current viewport (Does not account for overflow texts at this moment)
   _doesPositionFit(e) {
-    var S, $;
-    const t = (S = this.shadowRoot) == null ? void 0 : S.querySelector(".nys-tooltip__wrapper"), o = ($ = this.shadowRoot) == null ? void 0 : $.querySelector(".nys-tooltip__content");
+    var $, S;
+    const t = ($ = this.shadowRoot) == null ? void 0 : $.querySelector(".nys-tooltip__wrapper"), o = (S = this.shadowRoot) == null ? void 0 : S.querySelector(".nys-tooltip__content");
     if (!t || !o || e == null) return;
     const s = t.getBoundingClientRect(), n = o.getBoundingClientRect(), i = 8, c = {
       top: s.top - i,
@@ -6334,10 +6337,10 @@ const D1 = class D1 extends u {
   }
   // Calculates the best placement based on available space (flips placement if it doesn't fit)
   async autoPositionTooltip() {
-    var S, $;
-    const e = (S = this.shadowRoot) == null ? void 0 : S.querySelector(
+    var $, S;
+    const e = ($ = this.shadowRoot) == null ? void 0 : $.querySelector(
       ".nys-tooltip__wrapper"
-    ), t = ($ = this.shadowRoot) == null ? void 0 : $.querySelector(
+    ), t = (S = this.shadowRoot) == null ? void 0 : S.querySelector(
       ".nys-tooltip__content"
     );
     if (!e || !t) return;
@@ -6378,8 +6381,8 @@ const D1 = class D1 extends u {
       ".nys-tooltip__wrapper"
     )).getBoundingClientRect(), s = e.getBoundingClientRect(), n = o.left + o.width / 2, i = s.left < 0, c = s.right > window.innerWidth;
     this._resetTooltipPositioningStyles(e), i ? (e.style.left = "0px", e.style.transform = "none") : c && (e.style.right = "0px", e.style.left = "auto", e.style.transform = "none");
-    const d = e.getBoundingClientRect(), S = (n - d.left) / d.width, $ = Math.max(0, Math.min(1, S)) * 100;
-    e.style.setProperty("--arrow-offset-x", `${$}%`);
+    const d = e.getBoundingClientRect(), $ = (n - d.left) / d.width, S = Math.max(0, Math.min(1, $)) * 100;
+    e.style.setProperty("--arrow-offset-x", `${S}%`);
   }
   // Reposition tooltip back to original set position (e.g. top, left, bottom, right) to avoid positioning issue base on last position
   _resetTooltipPositioningStyles(e) {
@@ -6799,12 +6802,12 @@ const nt = g`
   <path d="M67.6348 51.8019C67.6348 51.8019 67.6173 51.782 67.6173 51.7303C67.6173 51.6787 67.6348 51.6588 67.6348 51.6588H68.5564C68.5564 51.6588 68.5749 51.6806 68.5749 51.7303C68.5749 51.78 68.5564 51.8019 68.5564 51.8019H68.1932V52.9205C68.1932 52.9205 68.1659 52.9404 68.0976 52.9404C68.0292 52.9404 67.998 52.9205 67.998 52.9205V51.8019H67.6348Z" fill="#154973"/>
   <path d="M69.4282 52.8659C69.4135 52.8748 69.3891 52.8858 69.3471 52.8858C69.3178 52.8858 69.2837 52.8798 69.27 52.8659L68.9889 52.1476C68.9723 52.1088 68.9459 52.0323 68.944 52.0214C68.944 52.0264 68.9371 52.1277 68.9332 52.1565L68.8815 52.9205C68.8815 52.9205 68.8561 52.9404 68.7858 52.9404C68.7155 52.9404 68.6862 52.9205 68.6862 52.9205L68.7839 51.6787C68.7839 51.6787 68.8112 51.6588 68.8776 51.6588C68.9518 51.6588 68.9781 51.6787 68.9781 51.6787L69.3042 52.5162L69.3471 52.6533C69.3481 52.6473 69.3774 52.5559 69.392 52.5162L69.7181 51.6787C69.7181 51.6787 69.7464 51.6588 69.8206 51.6588C69.886 51.6588 69.9124 51.6787 69.9124 51.6787L70.01 52.9205C70.01 52.9205 69.9807 52.9404 69.9104 52.9404C69.8401 52.9404 69.8167 52.9205 69.8167 52.9205L69.763 52.1546L69.7523 52.0194C69.7523 52.0194 69.722 52.1148 69.7093 52.1456L69.4282 52.8659Z" fill="#154973"/>
 </svg>`;
-var at = Object.defineProperty, l1 = (l, e, t, o) => {
+var at = Object.defineProperty, a1 = (l, e, t, o) => {
   for (var s = void 0, n = l.length - 1, i; n >= 0; n--)
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && at(e, t, s), s;
 };
-const M1 = class M1 extends u {
+const V1 = class V1 extends u {
   constructor() {
     super(...arguments), this.trustbarVisible = !1, this.searchDropdownVisible = !1, this.languageVisible = !1, this.isSearchFocused = !1, this.hideTranslate = !1, this.hideSearch = !1, this.languages = [
       ["English", ""],
@@ -6882,6 +6885,7 @@ const M1 = class M1 extends u {
               <nys-button
                 id="nys-unavheader__know"
                 label="Here's how you know"
+                ariaLabel=${this.trustbarVisible ? "Here's how you know expanded" : "Here's how you know collapsed"}
                 variant="ghost"
                 size="sm"
                 suffixIcon="slotted"
@@ -6923,7 +6927,7 @@ const M1 = class M1 extends u {
               circle
               icon="close"
               size="sm"
-              ariaLabel="Close trustbar"
+              ariaLabel="Close this notice"
               .onClick="${() => this._toggleTrustbar()}"
             ></nys-button>
           </div>
@@ -6934,7 +6938,7 @@ const M1 = class M1 extends u {
               <a
                 href="https://www.ny.gov"
                 id="nys-unavheader__logolink"
-                aria-label="logo of New York State"
+                aria-label="Visit the NY.gov homepage"
               >
                 <div class="nys-unavheader__logo">${this._getNysLogo()}</div></a
               >
@@ -6948,6 +6952,7 @@ const M1 = class M1 extends u {
                   <nys-button
                     id="nys-unavheader__know"
                     label="Here's how you know"
+                    ariaLabel=${this.trustbarVisible ? "Here's how you know expanded" : "Here's how you know collapsed"}
                     variant="ghost"
                     size="sm"
                     suffixIcon="slotted"
@@ -6971,7 +6976,7 @@ const M1 = class M1 extends u {
                         variant="ghost"
                         circle
                         icon="slotted"
-                        ariaLabel="Translate"
+                        ariaLabel=${this.languageVisible ? "Translate expanded" : "Translate collapsed"}
                         id="nys-unavheader__translate"
                         class="nys-unavheader__iconbutton"
                         .onClick="${() => this._toggleLanguageList()}"
@@ -6989,7 +6994,7 @@ const M1 = class M1 extends u {
                             label="Translate"
                             prefixIcon="language_filled"
                             suffixIcon=${this.languageVisible ? "chevron_up" : "chevron_down"}
-                            ariaLabel="Translate"
+                            ariaLabel=${this.languageVisible ? "Translate expanded" : "Translate collapsed"}
                             id="nys-unavheader__translate"
                             .onClick="${() => this._toggleLanguageList()}"
                           ></nys-button>
@@ -7014,7 +7019,7 @@ const M1 = class M1 extends u {
                         variant="ghost"
                         circle
                         icon="search"
-                        ariaLabel="Search"
+                        ariaLabel=${this.searchDropdownVisible ? "Search expanded" : "Search collapsed"}
                         id="nys-unavheader__searchbutton"
                         class="nys-unavheader__iconbutton"
                         .onClick="${() => this._toggleSearchDropdown()}"
@@ -7040,7 +7045,7 @@ const M1 = class M1 extends u {
                           slot="endButton"
                           type="submit"
                           prefixIcon="search"
-                          ariaLabel="Search"
+                          ariaLabel="Search Button"
                           .onClick="${() => this._handleSearchButton(
       "nys-unavheader__searchbar"
     )}"
@@ -7067,7 +7072,7 @@ const M1 = class M1 extends u {
                 slot="endButton"
                 type="submit"
                 prefixIcon="search"
-                ariaLabel="Search"
+                ariaLabel="Search Button"
                 .onClick="${() => this._handleSearchButton(
       "nys-unavheader__searchbardropdown"
     )}"
@@ -7079,27 +7084,27 @@ const M1 = class M1 extends u {
     `;
   }
 };
-M1.styles = nt;
-let P = M1;
-l1([
+V1.styles = nt;
+let P = V1;
+a1([
   r({ type: Boolean })
 ], P.prototype, "trustbarVisible");
-l1([
+a1([
   r({ type: Boolean })
 ], P.prototype, "searchDropdownVisible");
-l1([
+a1([
   r({ type: Boolean })
 ], P.prototype, "languageVisible");
-l1([
+a1([
   r({ type: Boolean })
 ], P.prototype, "isSearchFocused");
-l1([
+a1([
   r({ type: Boolean })
 ], P.prototype, "hideTranslate");
-l1([
+a1([
   r({ type: Boolean })
 ], P.prototype, "hideSearch");
-l1([
+a1([
   r({ type: String, reflect: !0 })
 ], P.prototype, "languages");
 customElements.get("nys-unavheader") || customElements.define("nys-unavheader", P);
@@ -7389,7 +7394,7 @@ var ct = Object.defineProperty, g1 = (l, e, t, o) => {
     (i = l[n]) && (s = i(e, t, s) || s);
   return s && ct(e, t, s), s;
 };
-const V1 = class V1 extends u {
+const M1 = class M1 extends u {
   constructor() {
     super(...arguments), this.appName = "", this.agencyName = "", this.homepageLink = "", this.slotHasContent = !0, this.isMobileMenuOpen = !1;
   }
@@ -7414,10 +7419,10 @@ const V1 = class V1 extends u {
     );
     o && s && (o.innerHTML = "", s.innerHTML = "", t.forEach((d) => {
       if (d.nodeType === Node.ELEMENT_NODE) {
-        const S = d.cloneNode(!0), $ = d.cloneNode(!0);
+        const $ = d.cloneNode(!0), S = d.cloneNode(!0);
         ["script", "iframe", "object", "embed, img"].forEach((A1) => {
-          S.querySelectorAll(A1).forEach((B1) => B1.remove());
-        }), o.appendChild(S), s.appendChild($), d.remove();
+          $.querySelectorAll(A1).forEach((B1) => B1.remove());
+        }), o.appendChild($), s.appendChild(S), d.remove();
       }
     }));
   }
@@ -7488,8 +7493,8 @@ const V1 = class V1 extends u {
     `;
   }
 };
-V1.styles = lt;
-let s1 = V1;
+M1.styles = lt;
+let s1 = M1;
 g1([
   r({ type: String })
 ], s1.prototype, "appName");
@@ -7693,8 +7698,8 @@ const z1 = class z1 extends u {
     o && (o.classList.toggle("columns", s), o.classList.toggle("small", !s), o.innerHTML = "", t.forEach((c) => {
       if (c.nodeType === Node.ELEMENT_NODE) {
         const d = c.cloneNode(!0);
-        ["script", "iframe", "object", "embed", "img"].forEach(($) => {
-          d.querySelectorAll($).forEach((_) => _.remove());
+        ["script", "iframe", "object", "embed", "img"].forEach((S) => {
+          d.querySelectorAll(S).forEach((_) => _.remove());
         }), o.appendChild(d), c.remove();
       }
     }));
@@ -7719,17 +7724,17 @@ const z1 = class z1 extends u {
   }
 };
 z1.styles = dt;
-let h1 = z1;
+let d1 = z1;
 w1([
   r({ type: String })
-], h1.prototype, "agencyName");
+], d1.prototype, "agencyName");
 w1([
   r({ type: String })
-], h1.prototype, "homepageLink");
+], d1.prototype, "homepageLink");
 w1([
   O()
-], h1.prototype, "slotHasContent");
-customElements.get("nys-globalfooter") || customElements.define("nys-globalfooter", h1);
+], d1.prototype, "slotHasContent");
+customElements.get("nys-globalfooter") || customElements.define("nys-globalfooter", d1);
 const yt = g`
   :host {
     /* Global Footer Styles */
@@ -7945,19 +7950,19 @@ customElements.get("nys-unavfooter") || customElements.define("nys-unavfooter",
 export {
   R1 as NysAlert,
   G1 as NysAvatar,
-  c1 as NysBacktotop,
+  l1 as NysBacktotop,
   ee as NysButton,
   le as NysCheckbox,
   re as NysCheckboxgroup,
-  d1 as NysErrorMessage,
+  c1 as NysErrorMessage,
   x as NysFileinput,
-  h1 as NysGlobalFooter,
+  d1 as NysGlobalFooter,
   s1 as NysGlobalHeader,
   me as NysIcon,
-  n1 as NysLabel,
-  a1 as NysOption,
+  r1 as NysLabel,
+  i1 as NysOption,
   ze as NysRadiobutton,
-  $e as NysRadiogroup,
+  Se as NysRadiogroup,
   Be as NysSelect,
   u1 as NysSkipnav,
   Fe as NysTextarea,