@compa11y/web 0.1.6 → 0.1.9

package/dist/compa11y.js

@@ -1,8 +1,8 @@
-import { generateId as at, announce as v, announcePolite as p, createTypeAhead as q, announceAssertive as O, prefersDarkMode as rt, prefersHighContrast as ot, prefersReducedMotion as lt, isBrowser as nt, hasAccessibleName as ht, buildAriaProps as dt, aria as ct, KeyboardPatterns as ut, createKeyboardManager as bt, createRovingTabindex as pt, createFocusScope as mt, createFocusTrap as gt, initFocusVisible as H, announceError as vt, announceStatus as ft, initAnnouncer as B } from "@compa11y/core";
-import { KeyboardPatterns as jt, announce as Ut, announceAssertive as Yt, announceError as Gt, announcePolite as Vt, announceStatus as Xt, aria as Wt, buildAriaProps as Jt, createFocusScope as Qt, createFocusTrap as Zt, createKeyboardManager as te, createRovingTabindex as ee, createTypeAhead as ie, hasAccessibleName as se, initAnnouncer as ae, initFocusVisible as re, isBrowser as oe, prefersDarkMode as le, prefersHighContrast as ne, prefersReducedMotion as he } from "@compa11y/core";
-class d extends HTMLElement {
+import { generateId as dt, announce as v, announcePolite as p, createTypeAhead as q, announceAssertive as O, createComponentWarnings as N, prefersDarkMode as ct, prefersHighContrast as ut, prefersReducedMotion as bt, isBrowser as pt, hasAccessibleName as mt, buildAriaProps as gt, aria as vt, KeyboardPatterns as ft, createKeyboardManager as _t, createRovingTabindex as yt, createFocusScope as xt, createFocusTrap as Et, initFocusVisible as H, announceError as At, announceStatus as kt, initAnnouncer as B } from "@compa11y/core";
+import { KeyboardPatterns as Zt, announce as te, announceAssertive as ee, announceError as ie, announcePolite as se, announceStatus as ae, aria as re, buildAriaProps as oe, createFocusScope as le, createFocusTrap as ne, createKeyboardManager as he, createRovingTabindex as de, createTypeAhead as ce, hasAccessibleName as ue, initAnnouncer as be, initFocusVisible as pe, isBrowser as me, prefersDarkMode as ge, prefersHighContrast as ve, prefersReducedMotion as fe } from "@compa11y/core";
+class h extends HTMLElement {
   constructor() {
-    super(), this._internals = null, this._id = at(this.tagName.toLowerCase().replace("a11y-", "")), "attachInternals" in this && (this._internals = this.attachInternals());
+    super(), this._internals = null, this._id = dt(this.tagName.toLowerCase().replace("a11y-", "")), "attachInternals" in this && (this._internals = this.attachInternals());
   }
   /**
    * Standard observed attributes
@@ -74,10 +74,20 @@ class d extends HTMLElement {
     return (i == null ? void 0 : i.assignedElements()) ?? [];
   }
 }
-function c(n, t) {
+function d(n, t) {
   customElements.get(n) || customElements.define(n, t);
 }
-const T = `
+const F = `
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+`, T = `
   appearance: none;
   background: none;
   border: none;
@@ -86,7 +96,7 @@ const T = `
   font: inherit;
   color: inherit;
   cursor: pointer;
-`, _t = `
+`, wt = `
   :host(:focus-visible),
   :focus-visible {
     outline: 2px solid var(--compa11y-focus-color, #0066cc);
@@ -108,8 +118,8 @@ const T = `
     box-sizing: inherit;
   }
 
-  ${_t}
-`, yt = `
+  ${wt}
+`, $t = `
   ${u}
 
   :host {
@@ -148,7 +158,7 @@ const T = `
     margin: 0 0 1rem 0;
     color: var(--compa11y-dialog-description-color, #666);
   }
-`, xt = `
+`, Lt = `
   ${u}
 
   :host {
@@ -200,7 +210,7 @@ const T = `
     margin: 0.25rem 0;
     background: var(--compa11y-menu-separator-color, #e0e0e0);
   }
-`, Et = `
+`, St = `
   ${u}
 
   .tablist {
@@ -246,7 +256,7 @@ const T = `
   ::slotted([role="tabpanel"][hidden]) {
     display: none;
   }
-`, At = `
+`, It = `
   ${u}
 
   :host {
@@ -387,7 +397,7 @@ const T = `
   .options-source {
     display: none;
   }
-`, kt = `
+`, Ct = `
   ${u}
 
   :host {
@@ -517,7 +527,7 @@ const T = `
   .options-source {
     display: none;
   }
-`, wt = `
+`, Tt = `
   ${u}
 
   :host {
@@ -621,7 +631,7 @@ const T = `
     opacity: 0.5;
     cursor: not-allowed;
   }
-`, $t = `
+`, zt = `
   ${u}
 
   :host {
@@ -700,7 +710,7 @@ const T = `
     color: var(--compa11y-input-error-color, #ef4444);
     font-size: var(--compa11y-input-error-size, 0.8125rem);
   }
-`, Lt = `
+`, Dt = `
   ${u}
 
   :host {
@@ -781,7 +791,7 @@ const T = `
     color: var(--compa11y-textarea-error-color, #ef4444);
     font-size: var(--compa11y-textarea-error-size, 0.8125rem);
   }
-`, St = `
+`, qt = `
   ${u}
 
   :host {
@@ -896,7 +906,7 @@ const T = `
     border-radius: 50%;
     animation: compa11y-spin 0.6s linear infinite;
   }
-`, It = `
+`, Ot = `
   ${u}
 
   :host {
@@ -930,7 +940,7 @@ const T = `
     max-height: none;
     overflow-y: visible;
   }
-`, Ct = `
+`, Rt = `
   ${u}
 
   :host {
@@ -979,7 +989,7 @@ const T = `
   :host([aria-selected="true"]) .check-mark {
     visibility: visible;
   }
-`, Tt = `
+`, Ht = `
   ${u}
 
   :host {
@@ -998,7 +1008,7 @@ const T = `
   :host([disabled]) {
     opacity: 0.5;
   }
-`, zt = `
+`, Bt = `
   ${u}
 
   :host {
@@ -1161,7 +1171,7 @@ const T = `
       color: HighlightText;
     }
   }
-`, Dt = `
+`, Mt = `
   ${u}
 
   :host {
@@ -1203,7 +1213,7 @@ const T = `
   :host([disabled]) {
     opacity: 0.5;
   }
-`, qt = `
+`, Kt = `
   ${u}
 
   :host {
@@ -1256,7 +1266,7 @@ const T = `
   :host([disabled]) {
     opacity: 0.5;
   }
-`, Ot = `
+`, Nt = `
   ${u}
 
   :host {
@@ -1376,7 +1386,7 @@ const T = `
       background: HighlightText;
     }
   }
-`, Rt = `
+`, Ft = `
   ${u}
 
   :host {
@@ -1486,14 +1496,14 @@ const T = `
     outline-offset: 2px;
   }
 `, M = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
-let L = 0, K = "";
-function Ht() {
-  L === 0 && (K = document.body.style.overflow, document.body.style.overflow = "hidden"), L++;
+let L = 0, P = "";
+function Pt() {
+  L === 0 && (P = document.body.style.overflow, document.body.style.overflow = "hidden"), L++;
 }
-function Bt() {
-  L--, L <= 0 && (L = 0, document.body.style.overflow = K);
+function jt() {
+  L--, L <= 0 && (L = 0, document.body.style.overflow = P);
 }
-class N extends d {
+class j extends h {
   constructor() {
     super(...arguments), this._open = !1, this._previouslyFocused = null, this._triggerElement = null, this.handleTriggerClick = () => {
       this.open = !0;
@@ -1538,7 +1548,7 @@ class N extends d {
   render() {
     const t = this.attachShadow({ mode: "open" }), e = `${this._id}-title`, i = `${this._id}-desc`;
     t.innerHTML = `
-      <style>${yt}</style>
+      <style>${$t}</style>
       <div class="overlay" part="overlay"></div>
       <div
         class="dialog"
@@ -1602,11 +1612,11 @@ class N extends d {
     this._previouslyFocused = document.activeElement, this.style.display = "flex", requestAnimationFrame(() => {
       const e = this.getFocusableElements()[0];
       e && e.focus();
-    }), Ht(), v("Dialog opened", { politeness: "polite" }), this.emit("a11y-dialog-open");
+    }), Pt(), v("Dialog opened", { politeness: "polite" }), this.emit("a11y-dialog-open");
   }
   hideDialog() {
     var t;
-    this.style.display = "none", Bt(), (t = this._previouslyFocused) == null || t.focus(), this._previouslyFocused = null, v("Dialog closed", { politeness: "polite" }), this.emit("a11y-dialog-close");
+    this.style.display = "none", jt(), (t = this._previouslyFocused) == null || t.focus(), this._previouslyFocused = null, v("Dialog closed", { politeness: "polite" }), this.emit("a11y-dialog-close");
   }
   /**
    * Programmatic open
@@ -1621,8 +1631,8 @@ class N extends d {
     this.open = !1;
   }
 }
-c("a11y-dialog", N);
-class F extends d {
+d("a11y-dialog", j);
+class Y extends h {
   constructor() {
     super(...arguments), this._open = !1, this._highlightedIndex = -1, this._menuItems = [], this._triggerEl = null, this._triggerSlotEl = null, this._defaultSlotEl = null, this.updateMenuItems = () => {
       this._menuItems = Array.from(
@@ -1712,7 +1722,7 @@ class F extends d {
   render() {
     const t = this.attachShadow({ mode: "open" });
     t.innerHTML = `
-      <style>${xt}</style>
+      <style>${Lt}</style>
       <slot name="trigger"></slot>
       <div
         class="menu-content"
@@ -1787,8 +1797,8 @@ class F extends d {
     this.open = !this._open;
   }
 }
-c("a11y-menu", F);
-class P extends d {
+d("a11y-menu", Y);
+class U extends h {
   constructor() {
     super(...arguments), this._tabs = [], this._panels = [], this._selectedIndex = 0, this._focusedIndex = 0, this._tabSlotEl = null, this._panelSlotEl = null, this._defaultSlotEl = null, this.updateTabsAndPanels = () => {
       this._tabs = Array.from(
@@ -1854,7 +1864,7 @@ class P extends d {
   render() {
     const t = this.attachShadow({ mode: "open" });
     t.innerHTML = `
-      <style>${Et}</style>
+      <style>${St}</style>
       <div class="tablist" role="tablist" aria-orientation="${this.orientation}" part="tablist">
         <slot name="tab"></slot>
       </div>
@@ -1920,8 +1930,8 @@ class P extends d {
     );
   }
 }
-c("a11y-tabs", P);
-class j extends d {
+d("a11y-tabs", U);
+class V extends h {
   constructor() {
     super(...arguments), this._open = !1, this._highlightedIndex = -1, this._options = [], this._filteredOptions = [], this._inputValue = "", this._selectedValue = null, this._inputElement = null, this._listboxElement = null, this.updateOptions = () => {
       const t = Array.from(this.querySelectorAll("option"));
@@ -2013,7 +2023,7 @@ class j extends d {
   render() {
     const t = this.attachShadow({ mode: "open" }), e = `${this._id}-input`, i = `${this._id}-listbox`, s = this.getAttribute("placeholder") || "Search...", a = this.hasAttribute("clearable");
     t.innerHTML = `
-      <style>${At}</style>
+      <style>${It}</style>
       <div class="combobox-wrapper" part="wrapper">
         <div class="input-wrapper" part="input-wrapper">
           <input
@@ -2146,8 +2156,8 @@ class j extends d {
     this.handleClear();
   }
 }
-c("a11y-combobox", j);
-class U extends d {
+d("a11y-combobox", V);
+class G extends h {
   constructor() {
     super(...arguments), this._checked = !1, this._button = null, this._label = null, this.handleClick = () => {
       this.toggle();
@@ -2209,7 +2219,7 @@ class U extends d {
   render() {
     const t = this.attachShadow({ mode: "open" }), e = `${this._id}-label`, i = !!this.label, s = this.getAttribute("aria-label"), a = i ? "" : s ? `aria-label="${s}"` : "", r = i ? `aria-labelledby="${e}"` : "";
     t.innerHTML = `
-      <style>${wt}</style>
+      <style>${Tt}</style>
       <div class="switch-wrapper size-${this.size}" part="wrapper">
         <button
           type="button"
@@ -2289,8 +2299,8 @@ class U extends d {
     this.checked = t;
   }
 }
-c("a11y-switch", U);
-class Y extends d {
+d("a11y-switch", G);
+class X extends h {
   constructor() {
     super(...arguments), this._open = !1, this._highlightedIndex = -1, this._options = [], this._selectedValue = null, this._triggerElement = null, this._listboxElement = null, this._typeAhead = null, this.updateOptions = () => {
       const t = Array.from(this.querySelectorAll("option"));
@@ -2390,7 +2400,7 @@ class Y extends d {
   render() {
     const t = this.attachShadow({ mode: "open" }), e = `${this._id}-trigger`, i = `${this._id}-listbox`, s = this.getAttribute("placeholder") || "Select an option...", a = this.getAttribute("aria-label") || "", r = this.getAttribute("aria-labelledby") || "";
     t.innerHTML = `
-      <style>${kt}</style>
+      <style>${Ct}</style>
       <div class="select-wrapper" part="wrapper">
         <button
           id="${e}"
@@ -2541,8 +2551,8 @@ class Y extends d {
     this.open = !1;
   }
 }
-c("a11y-select", Y);
-class G extends d {
+d("a11y-select", X);
+class W extends h {
   constructor() {
     super(...arguments), this._value = "", this._inputEl = null, this._labelEl = null, this._hintEl = null, this._errorEl = null, this.handleInput = (t) => {
       const e = t.target;
@@ -2622,11 +2632,11 @@ class G extends d {
     ));
   }
   render() {
-    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-field`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = this.getAttribute("label") || "", l = this.getAttribute("hint") || "", o = this.getAttribute("error") || "", b = this.getAttribute("type") || "text", h = this.getAttribute("placeholder") || "", m = this.getAttribute("name") || "", g = this.getAttribute("autocomplete") || "", f = this.getAttribute("maxlength"), _ = this.getAttribute("minlength"), k = this.getAttribute("pattern"), w = this.getAttribute("inputmode"), S = this.getAttribute("aria-label") || "", I = this.getAttribute("aria-labelledby") || "", C = this.disabled, x = this.readOnly, y = this.required, E = !!o, A = [];
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-field`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = this.getAttribute("label") || "", l = this.getAttribute("hint") || "", o = this.getAttribute("error") || "", b = this.getAttribute("type") || "text", c = this.getAttribute("placeholder") || "", m = this.getAttribute("name") || "", g = this.getAttribute("autocomplete") || "", f = this.getAttribute("maxlength"), _ = this.getAttribute("minlength"), k = this.getAttribute("pattern"), w = this.getAttribute("inputmode"), S = this.getAttribute("aria-label") || "", I = this.getAttribute("aria-labelledby") || "", C = this.disabled, x = this.readOnly, y = this.required, E = !!o, A = [];
     l && A.push(s), E && A.push(a);
-    const z = A.length ? `aria-describedby="${A.join(" ")}"` : "", $ = !r && S ? `aria-label="${S}"` : "", st = !r && I ? `aria-labelledby="${I}"` : r ? `aria-labelledby="${i}"` : "";
+    const z = A.length ? `aria-describedby="${A.join(" ")}"` : "", $ = !r && S ? `aria-label="${S}"` : "", ht = !r && I ? `aria-labelledby="${I}"` : r ? `aria-labelledby="${i}"` : "";
     this.setAttribute("data-error", E ? "true" : "false"), t.innerHTML = `
-      <style>${$t}</style>
+      <style>${zt}</style>
       <div class="input-wrapper" part="wrapper">
         ${r ? `<label id="${i}" for="${e}" class="input-label" part="label">
                 ${r}${y ? '<span class="input-required" aria-hidden="true" part="required">*</span>' : ""}
@@ -2635,7 +2645,7 @@ class G extends d {
           id="${e}"
           type="${b}"
           value="${this._value}"
-          ${h ? `placeholder="${h}"` : ""}
+          ${c ? `placeholder="${c}"` : ""}
           ${m ? `name="${m}"` : ""}
           ${g ? `autocomplete="${g}"` : ""}
           ${f ? `maxlength="${f}"` : ""}
@@ -2643,7 +2653,7 @@ class G extends d {
           ${k ? `pattern="${k}"` : ""}
           ${w ? `inputmode="${w}"` : ""}
           ${$}
-          ${st}
+          ${ht}
           ${z}
           ${E ? 'aria-invalid="true"' : ""}
           ${y ? 'aria-required="true"' : ""}
@@ -2783,8 +2793,8 @@ class G extends d {
     (t = this._inputEl) == null || t.select();
   }
 }
-c("a11y-input", G);
-class V extends d {
+d("a11y-input", W);
+class J extends h {
   constructor() {
     super(...arguments), this._value = "", this._textareaEl = null, this._labelEl = null, this._hintEl = null, this._errorEl = null, this.handleInput = (t) => {
       const e = t.target;
@@ -2863,11 +2873,11 @@ class V extends d {
     ));
   }
   render() {
-    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-field`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = this.getAttribute("label") || "", l = this.getAttribute("hint") || "", o = this.getAttribute("error") || "", b = this.getAttribute("rows") || "3", h = this.getAttribute("placeholder") || "", m = this.getAttribute("name") || "", g = this.getAttribute("autocomplete") || "", f = this.getAttribute("maxlength"), _ = this.getAttribute("minlength"), k = this.getAttribute("aria-label") || "", w = this.getAttribute("aria-labelledby") || "", S = this.disabled, I = this.readOnly, C = this.required, x = !!o, y = [];
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-field`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = this.getAttribute("label") || "", l = this.getAttribute("hint") || "", o = this.getAttribute("error") || "", b = this.getAttribute("rows") || "3", c = this.getAttribute("placeholder") || "", m = this.getAttribute("name") || "", g = this.getAttribute("autocomplete") || "", f = this.getAttribute("maxlength"), _ = this.getAttribute("minlength"), k = this.getAttribute("aria-label") || "", w = this.getAttribute("aria-labelledby") || "", S = this.disabled, I = this.readOnly, C = this.required, x = !!o, y = [];
     l && y.push(s), x && y.push(a);
     const E = y.length ? `aria-describedby="${y.join(" ")}"` : "", A = !r && k ? `aria-label="${k}"` : "", z = !r && w ? `aria-labelledby="${w}"` : r ? `aria-labelledby="${i}"` : "";
     this.setAttribute("data-error", x ? "true" : "false"), t.innerHTML = `
-      <style>${Lt}</style>
+      <style>${Dt}</style>
       <div class="textarea-wrapper" part="wrapper">
         ${r ? `<label id="${i}" for="${e}" class="textarea-label" part="label">
                 ${r}${C ? '<span class="textarea-required" aria-hidden="true" part="required">*</span>' : ""}
@@ -2875,7 +2885,7 @@ class V extends d {
         <textarea
           id="${e}"
           rows="${b}"
-          ${h ? `placeholder="${h}"` : ""}
+          ${c ? `placeholder="${c}"` : ""}
           ${m ? `name="${m}"` : ""}
           ${g ? `autocomplete="${g}"` : ""}
           ${f ? `maxlength="${f}"` : ""}
@@ -3018,8 +3028,8 @@ class V extends d {
     (t = this._textareaEl) == null || t.select();
   }
 }
-c("a11y-textarea", V);
-class X extends d {
+d("a11y-textarea", J);
+class Q extends h {
   constructor() {
     super(...arguments), this._buttonEl = null, this.handleClick = (t) => {
       if (this.disabled || this.loading) {
@@ -3084,13 +3094,13 @@ class X extends d {
     ));
   }
   render() {
-    const t = this.attachShadow({ mode: "open" }), e = this.variant, i = this.size, s = this.getAttribute("type") || "button", a = this.getAttribute("aria-label") || "", r = this.disabled, l = this.discoverable, o = this.loading, b = r || o, h = r && !l;
+    const t = this.attachShadow({ mode: "open" }), e = this.variant, i = this.size, s = this.getAttribute("type") || "button", a = this.getAttribute("aria-label") || "", r = this.disabled, l = this.discoverable, o = this.loading, b = r || o, c = r && !l;
     t.innerHTML = `
-      <style>${St}</style>
+      <style>${qt}</style>
       <button
         class="variant-${e} size-${i}"
         type="${s}"
-        ${h ? "disabled" : ""}
+        ${c ? "disabled" : ""}
         ${b ? 'aria-disabled="true"' : ""}
         ${o ? 'aria-busy="true"' : ""}
         ${a ? `aria-label="${a}"` : ""}
@@ -3175,8 +3185,8 @@ class X extends d {
     (t = this._buttonEl) == null || t.click();
   }
 }
-c("a11y-button", X);
-class W extends d {
+d("a11y-button", Q);
+class Z extends h {
   constructor() {
     super(...arguments), this._label = "", this._disabled = !1;
   }
@@ -3203,7 +3213,7 @@ class W extends d {
     this.shadowRoot || this.attachShadow({ mode: "open" });
     const t = `${this._id}-label`;
     this.shadowRoot.innerHTML = `
-      <style>${Tt}</style>
+      <style>${Ht}</style>
       <div class="optgroup-wrapper" part="group">
         <div class="optgroup-label" part="label" id="${t}" role="presentation">
           ${this._label}
@@ -3234,7 +3244,7 @@ class W extends d {
     }
   }
 }
-class J extends d {
+class tt extends h {
   constructor() {
     super(...arguments), this._value = "", this._disabled = !1, this._selected = !1, this._discoverable = !0, this.handleClick = (t) => {
       if (this.effectivelyDisabled) {
@@ -3294,7 +3304,7 @@ class J extends d {
   }
   render() {
     this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = `
-      <style>${Ct}</style>
+      <style>${Rt}</style>
       <div class="option-wrapper" part="option">
         <span class="option-content" part="content"><slot></slot></span>
         <span class="check-mark" part="check" aria-hidden="true">&#10003;</span>
@@ -3321,7 +3331,7 @@ class J extends d {
     }
   }
 }
-class Q extends d {
+class et extends h {
   constructor() {
     super(...arguments), this._value = null, this._values = /* @__PURE__ */ new Set(), this._multiple = !1, this._disabled = !1, this._discoverable = !0, this._orientation = "vertical", this._focusedIndex = -1, this._typeAhead = null, this.handleFocus = () => {
       if (this._focusedIndex >= 0) return;
@@ -3380,9 +3390,9 @@ class Q extends d {
               const o = (a = this._typeAhead) == null ? void 0 : a.type(t.key);
               if (o) {
                 const b = e.findIndex(
-                  (h) => {
+                  (c) => {
                     var m;
-                    return (((m = h.textContent) == null ? void 0 : m.trim()) || "") === o && !h.effectivelyDisabled;
+                    return (((m = c.textContent) == null ? void 0 : m.trim()) || "") === o && !c.effectivelyDisabled;
                   }
                 );
                 b >= 0 && (i = b, s = !0);
@@ -3409,9 +3419,9 @@ class Q extends d {
               const o = (r = this._typeAhead) == null ? void 0 : r.type(t.key);
               if (o) {
                 const b = e.findIndex(
-                  (h) => {
+                  (c) => {
                     var m;
-                    return (((m = h.textContent) == null ? void 0 : m.trim()) || "") === o && !h.effectivelyDisabled;
+                    return (((m = c.textContent) == null ? void 0 : m.trim()) || "") === o && !c.effectivelyDisabled;
                   }
                 );
                 b >= 0 && (i = b, s = !0);
@@ -3425,8 +3435,8 @@ class Q extends d {
         if (!this._multiple && o)
           this.selectSingle(o);
         else if (o) {
-          const b = ((l = o.textContent) == null ? void 0 : l.trim()) || o.value, h = this._values.has(o.value);
-          p(`${b}${h ? ", selected" : ""}`);
+          const b = ((l = o.textContent) == null ? void 0 : l.trim()) || o.value, c = this._values.has(o.value);
+          p(`${b}${c ? ", selected" : ""}`);
         }
       }
     };
@@ -3496,7 +3506,7 @@ class Q extends d {
   }
   render() {
     this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = `
-      <style>${It}</style>
+      <style>${Ot}</style>
       <div class="listbox-wrapper" part="wrapper">
         <slot></slot>
       </div>
@@ -3628,15 +3638,15 @@ class Q extends d {
     }
   }
 }
-c("a11y-optgroup", W);
-c("a11y-option", J);
-c("a11y-listbox", Q);
-const Mt = `<svg class="checkbox-check" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true">
+d("a11y-optgroup", Z);
+d("a11y-option", tt);
+d("a11y-listbox", et);
+const Yt = `<svg class="checkbox-check" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true">
   <path d="M2.5 6L5 8.5L9.5 3.5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>`, Kt = `<svg class="checkbox-dash" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true">
+</svg>`, Ut = `<svg class="checkbox-dash" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true">
   <path d="M3 6H9" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
 </svg>`;
-class R extends d {
+class R extends h {
   constructor() {
     super(...arguments), this._checked = !1, this._indeterminate = !1, this._input = null, this.handleChange = () => {
       if (!this._input) return;
@@ -3753,18 +3763,18 @@ class R extends d {
     );
   }
   render() {
-    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-input`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = !!this.label, l = !!this.hint, o = !!this.error, b = this.getAttribute("aria-label"), h = this.getAttribute("name") || "", m = this.getAttribute("aria-describedby") || "", g = [];
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-input`, i = `${this._id}-label`, s = `${this._id}-hint`, a = `${this._id}-error`, r = !!this.label, l = !!this.hint, o = !!this.error, b = this.getAttribute("aria-label"), c = this.getAttribute("name") || "", m = this.getAttribute("aria-describedby") || "", g = [];
     m && g.push(m), l && g.push(s), o && g.push(a);
     const f = g.length ? `aria-describedby="${g.join(" ")}"` : "", _ = !r && b ? `aria-label="${b}"` : "";
     t.innerHTML = `
-      <style>${zt}</style>
+      <style>${Bt}</style>
       <div class="checkbox-wrapper size-${this.size}" part="wrapper">
         <div class="checkbox-control">
           <input
             type="checkbox"
             class="checkbox-input"
             id="${e}"
-            ${h ? `name="${h}"` : ""}
+            ${c ? `name="${c}"` : ""}
             ${this.value ? `value="${this.value}"` : ""}
             ${this._checked ? "checked" : ""}
             ${this.disabled ? "disabled" : ""}
@@ -3775,8 +3785,8 @@ class R extends d {
             part="input"
           />
           <div class="checkbox-indicator" part="indicator" aria-hidden="true">
-            ${Mt}
-            ${Kt}
+            ${Yt}
+            ${Ut}
           </div>
         </div>
         ${r || l || o ? `<div class="checkbox-content">
@@ -3856,7 +3866,7 @@ class R extends d {
     this.checked = t;
   }
 }
-class Z extends d {
+class it extends h {
   constructor() {
     super(...arguments), this._value = [], this.handleChildChange = (t) => {
       const e = t.target;
@@ -3930,7 +3940,7 @@ class Z extends d {
   render() {
     const t = this.attachShadow({ mode: "open" }), e = `${this._id}-error`, i = !!this.legend, s = !!this.error, a = this.getAttribute("aria-label"), r = this.getAttribute("aria-labelledby");
     t.innerHTML = `
-      <style>${Dt}</style>
+      <style>${Mt}</style>
       <fieldset
         part="fieldset"
         ${a ? `aria-label="${a}"` : ""}
@@ -3996,9 +4006,9 @@ class Z extends d {
     t && (this.disabled ? t.setAttribute("disabled", "") : t.removeAttribute("disabled"));
   }
 }
-c("a11y-checkbox", R);
-c("a11y-checkbox-group", Z);
-class tt extends d {
+d("a11y-checkbox", R);
+d("a11y-checkbox-group", it);
+class st extends h {
   constructor() {
     super(...arguments), this._value = "", this._disabled = !1, this._discoverable = !0, this._orientation = "vertical", this._required = !1, this._name = "", this.handleRadioSelect = (t) => {
       var i;
@@ -4124,7 +4134,7 @@ class tt extends d {
     this.shadowRoot || this.attachShadow({ mode: "open" });
     const t = this.shadowRoot, e = this.getAttribute("legend") || "", i = this.getAttribute("hint") || "", s = this.getAttribute("error") || "", a = i ? `${this._id}-hint` : "", r = s ? `${this._id}-error` : "", l = [a, r].filter(Boolean).join(" ");
     l ? this.setAttribute("aria-describedby", l) : this.removeAttribute("aria-describedby"), t.innerHTML = `
-      <style>${qt}</style>
+      <style>${Kt}</style>
       <fieldset part="fieldset">
         ${e ? `<legend part="legend">${e}${this._required ? '<span class="radio-group-required" aria-hidden="true"> *</span>' : ""}</legend>` : ""}
         <div class="radio-group-items" part="items">
@@ -4203,7 +4213,7 @@ class tt extends d {
       }
   }
 }
-class et extends d {
+class at extends h {
   constructor() {
     super(...arguments), this._value = "", this._checked = !1, this._disabled = !1, this._discoverable = !0, this.handleClick = (t) => {
       if (this._disabled) {
@@ -4274,7 +4284,7 @@ class et extends d {
     this.shadowRoot || this.attachShadow({ mode: "open" });
     const t = this.shadowRoot, e = this.getAttribute("label") || "", i = this.getAttribute("hint") || "", s = e ? `${this._id}-label` : "", a = i ? `${this._id}-hint` : "";
     s && this.setAttribute("aria-labelledby", s), a && this.setAttribute("aria-describedby", a), t.innerHTML = `
-      <style>${Ot}</style>
+      <style>${Nt}</style>
       <div class="radio-wrapper" part="wrapper">
         <div class="radio-control" part="control">
           <input
@@ -4335,21 +4345,21 @@ class et extends d {
       }
   }
 }
-c("a11y-radio-group", tt);
-c("a11y-radio", et);
-class it extends d {
+d("a11y-radio-group", st);
+d("a11y-radio", at);
+class rt extends h {
   constructor() {
     super(...arguments), this._toasts = [], this._counter = 0, this._containerEl = null, this._maxToasts = 5, this._handleClick = (t) => {
       var a;
       const e = t.target, i = e.getAttribute("data-close-id");
       if (i) {
-        this.remove(i);
+        this.removeToast(i);
         return;
       }
       const s = e.getAttribute("data-action-id");
       if (s) {
         const r = this._toasts.find((l) => l.id === s);
-        (a = r == null ? void 0 : r.action) == null || a.onClick(), this.remove(s);
+        (a = r == null ? void 0 : r.action) == null || a.onClick(), this.removeToast(s);
       }
     };
   }
@@ -4375,7 +4385,7 @@ class it extends d {
   render() {
     const t = this.attachShadow({ mode: "open" });
     t.innerHTML = `
-      <style>${Rt}</style>
+      <style>${Ft}</style>
       <div
         class="toast-container"
         role="region"
@@ -4426,11 +4436,11 @@ class it extends d {
   /**
    * Remove a toast by ID.
    */
-  remove(t) {
+  removeToast(t) {
     const e = this._toasts.findIndex((s) => s.id === t);
     if (e === -1) return;
     const i = this._toasts[e];
-    i.timerId && clearTimeout(i.timerId), this._toasts.splice(e, 1), this._removeElement(t), this.emit("a11y-toast-remove", { id: t });
+    i && i.timerId && clearTimeout(i.timerId), this._toasts.splice(e, 1), this._removeElement(t), this.emit("a11y-toast-remove", { id: t });
   }
   /**
    * Remove all toasts.
@@ -4449,7 +4459,7 @@ class it extends d {
     i.className = "toast", i.setAttribute("data-toast-id", t.id), i.setAttribute("data-type", t.type), i.setAttribute("role", e ? "alert" : "status"), i.setAttribute("aria-atomic", "true"), i.setAttribute("tabindex", "0");
     let s = '<div class="toast-content">';
     t.title && (s += `<div class="toast-title">${this._escapeHtml(t.title)}</div>`), t.description && (s += `<div class="toast-description">${this._escapeHtml(t.description)}</div>`), t.action && (s += `<button type="button" class="toast-action" data-action-id="${t.id}" tabindex="0">${this._escapeHtml(t.action.label)}</button>`), s += "</div>", s += `<button type="button" class="toast-close" aria-label="Dismiss" data-close-id="${t.id}" tabindex="0">×</button>`, i.innerHTML = s, i.addEventListener("mouseenter", () => this._pauseTimer(t)), i.addEventListener("mouseleave", () => this._resumeTimer(t)), i.addEventListener("keydown", (a) => {
-      a.key === "Escape" && this.remove(t.id);
+      a.key === "Escape" && this.removeToast(t.id);
     }), this._containerEl.appendChild(i);
   }
   _removeElement(t) {
@@ -4461,7 +4471,7 @@ class it extends d {
   }
   _startTimer(t) {
     t.duration !== 0 && (t.startTime = Date.now(), t.timerId = setTimeout(() => {
-      this.remove(t.id);
+      this.removeToast(t.id);
     }, t.remaining));
   }
   _pauseTimer(t) {
@@ -4475,93 +4485,427 @@ class it extends d {
     return e.textContent = t, e.innerHTML;
   }
 }
-c("a11y-toast", it);
+d("a11y-toast", rt);
+class ot extends h {
+  static get observedAttributes() {
+    return ["focusable"];
+  }
+  setupAccessibility() {
+  }
+  render() {
+    this.shadowRoot || this.attachShadow({ mode: "open" }), this.shadowRoot.innerHTML = `
+      <style>
+        :host {
+          ${F}
+        }
+
+        :host([hidden]) {
+          display: none !important;
+        }
+
+        /* When focusable, become visible when a child receives focus */
+        :host([focusable]:focus-within) {
+          position: static;
+          width: auto;
+          height: auto;
+          padding: 0;
+          margin: 0;
+          overflow: visible;
+          clip: auto;
+          white-space: normal;
+          border: 0;
+        }
+      </style>
+      <slot></slot>
+    `;
+  }
+  setupEventListeners() {
+  }
+  cleanupEventListeners() {
+  }
+}
+d("a11y-visually-hidden", ot);
+const Vt = N("SkipLink");
+class lt extends h {
+  constructor() {
+    super(...arguments), this.handleClick = (t) => {
+      const e = this.getAttribute("target") || "#main-content", i = document.querySelector(e);
+      i && (t.preventDefault(), !i.hasAttribute("tabindex") && i.tabIndex < 0 && i.setAttribute("tabindex", "-1"), i.focus(), i.scrollIntoView({ behavior: "smooth", block: "start" }));
+    };
+  }
+  static get observedAttributes() {
+    return ["target", "label"];
+  }
+  setupAccessibility() {
+    this.getAttribute("target") || Vt.warning(
+      'Missing "target" attribute. Provide a CSS selector (e.g. target="#main-content") pointing to the skip destination.'
+    );
+  }
+  render() {
+    this.shadowRoot || this.attachShadow({ mode: "open" });
+    const t = this.getAttribute("target") || "#main-content", e = this.getAttribute("label");
+    this.shadowRoot.innerHTML = `
+      <style>
+        :host {
+          display: block;
+        }
+
+        :host([hidden]) {
+          display: none !important;
+        }
+
+        .skip-link {
+          ${F}
+          display: inline-block;
+          text-decoration: none;
+        }
+
+        .skip-link:focus {
+          position: fixed;
+          top: var(--compa11y-skip-link-top, 0.5rem);
+          left: var(--compa11y-skip-link-left, 0.5rem);
+          z-index: var(--compa11y-skip-link-z-index, 99999);
+          width: auto;
+          height: auto;
+          padding: var(--compa11y-skip-link-padding, 0.75rem 1.5rem);
+          margin: 0;
+          overflow: visible;
+          clip: auto;
+          white-space: normal;
+          background: var(--compa11y-skip-link-bg, #0066cc);
+          color: var(--compa11y-skip-link-color, white);
+          font-size: var(--compa11y-skip-link-font-size, 1rem);
+          font-weight: var(--compa11y-skip-link-font-weight, 600);
+          border-radius: var(--compa11y-skip-link-radius, 4px);
+          border: var(--compa11y-skip-link-border, 2px solid transparent);
+          box-shadow: var(--compa11y-skip-link-shadow, 0 2px 8px rgba(0, 0, 0, 0.2));
+          outline: 2px solid var(--compa11y-focus-color, #0066cc);
+          outline-offset: 2px;
+        }
+
+        @media (forced-colors: active) {
+          .skip-link:focus {
+            border: 2px solid ButtonText;
+            outline: 2px solid Highlight;
+          }
+        }
+      </style>
+      <a class="skip-link" href="${t}" part="link">
+        ${e || "<slot>Skip to main content</slot>"}
+      </a>
+    `;
+  }
+  setupEventListeners() {
+    this.addEventListener("click", this.handleClick);
+  }
+  cleanupEventListeners() {
+    this.removeEventListener("click", this.handleClick);
+  }
+  onAttributeChange(t, e, i) {
+    (t === "target" || t === "label") && this.render();
+  }
+}
+d("a11y-skip-link", lt);
+const Gt = N("Alert"), Xt = `
+  :host {
+    display: block;
+    box-sizing: border-box;
+  }
+
+  :host([hidden]) {
+    display: none !important;
+  }
+
+  *,
+  *::before,
+  *::after {
+    box-sizing: inherit;
+  }
+
+  .alert {
+    display: flex;
+    align-items: flex-start;
+    gap: 0.75rem;
+    padding: var(--compa11y-alert-padding, 0.75rem 1rem);
+    background: var(--compa11y-alert-bg, white);
+    border: var(--compa11y-alert-border, 1px solid #e0e0e0);
+    border-radius: var(--compa11y-alert-radius, 6px);
+  }
+
+  /* Type variants — left border accent */
+  :host([type="info"]) .alert,
+  :host(:not([type])) .alert {
+    border-left: 4px solid var(--compa11y-alert-info-color, #3b82f6);
+  }
+
+  :host([type="success"]) .alert {
+    border-left: 4px solid var(--compa11y-alert-success-color, #22c55e);
+  }
+
+  :host([type="warning"]) .alert {
+    border-left: 4px solid var(--compa11y-alert-warning-color, #f59e0b);
+  }
+
+  :host([type="error"]) .alert {
+    border-left: 4px solid var(--compa11y-alert-error-color, #ef4444);
+  }
+
+  .alert-icon {
+    flex-shrink: 0;
+    font-size: 1.25rem;
+    line-height: 1;
+    margin-top: 0.125rem;
+  }
+
+  :host([type="info"]) .alert-icon,
+  :host(:not([type])) .alert-icon {
+    color: var(--compa11y-alert-info-color, #3b82f6);
+  }
+
+  :host([type="success"]) .alert-icon {
+    color: var(--compa11y-alert-success-color, #22c55e);
+  }
+
+  :host([type="warning"]) .alert-icon {
+    color: var(--compa11y-alert-warning-color, #f59e0b);
+  }
+
+  :host([type="error"]) .alert-icon {
+    color: var(--compa11y-alert-error-color, #ef4444);
+  }
+
+  .alert-content {
+    flex: 1;
+    min-width: 0;
+  }
+
+  .alert-title {
+    font-weight: var(--compa11y-alert-title-weight, 600);
+    font-size: var(--compa11y-alert-title-size, 0.875rem);
+    margin-bottom: 0.125rem;
+  }
+
+  .alert-description {
+    color: var(--compa11y-alert-description-color, #555);
+    font-size: var(--compa11y-alert-description-size, 0.8125rem);
+  }
+
+  .alert-close {
+    appearance: none;
+    background: none;
+    border: none;
+    padding: 0;
+    margin: 0;
+    font: inherit;
+    color: inherit;
+    cursor: pointer;
+    flex-shrink: 0;
+    width: 1.5rem;
+    height: 1.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--compa11y-alert-close-radius, 4px);
+    color: var(--compa11y-alert-close-color, #999);
+    font-size: 1.125rem;
+    line-height: 1;
+  }
+
+  .alert-close:hover {
+    background: var(--compa11y-alert-close-hover-bg, rgba(0, 0, 0, 0.05));
+    color: var(--compa11y-alert-close-hover-color, #333);
+  }
+
+  .alert-close:focus-visible {
+    outline: 2px solid var(--compa11y-focus-color, #0066cc);
+    outline-offset: 2px;
+  }
+
+  /* Forced colors / high contrast mode */
+  @media (forced-colors: active) {
+    .alert {
+      border: 2px solid ButtonText;
+    }
+
+    .alert-close:focus-visible {
+      outline: 2px solid Highlight;
+    }
+  }
+`, K = {
+  info: "ℹ️",
+  // ℹ️
+  success: "✅",
+  // ✅
+  warning: "⚠️",
+  // ⚠️
+  error: "❌"
+  // ❌
+};
+class nt extends h {
+  constructor() {
+    super(...arguments), this._closeButton = null, this.handleDismiss = () => {
+      this.emit("dismiss", { type: this.alertType }), this.remove();
+    };
+  }
+  static get observedAttributes() {
+    return ["type", "title", "dismissible"];
+  }
+  get alertType() {
+    return this.getAttribute("type") || "info";
+  }
+  /**
+   * Determine the ARIA role based on alert type.
+   * error/warning → role="alert" (assertive)
+   * info/success → role="status" (polite)
+   */
+  get alertRole() {
+    const t = this.alertType;
+    return t === "error" || t === "warning" ? "alert" : "status";
+  }
+  setupAccessibility() {
+    const t = ["info", "success", "warning", "error"], e = this.getAttribute("type");
+    e && !t.includes(e) && Gt.warning(
+      `Invalid type="${e}". Use one of: ${t.join(", ")}.`
+    );
+  }
+  render() {
+    this.shadowRoot || this.attachShadow({ mode: "open" });
+    const t = this.getAttribute("title"), e = this.hasAttribute("dismissible"), i = K[this.alertType] || K.info;
+    this.shadowRoot.innerHTML = `
+      <style>${Xt}</style>
+      <div
+        class="alert"
+        role="${this.alertRole}"
+        aria-live="${this.alertRole === "alert" ? "assertive" : "polite"}"
+        part="alert"
+      >
+        <span class="alert-icon" part="icon" aria-hidden="true">${i}</span>
+        <div class="alert-content" part="content">
+          ${t ? `<div class="alert-title" part="title">${t}</div>` : ""}
+          <div class="alert-description" part="description">
+            <slot></slot>
+          </div>
+        </div>
+        ${e ? `<button
+                class="alert-close"
+                part="close"
+                aria-label="Dismiss alert"
+                type="button"
+              >&times;</button>` : ""}
+      </div>
+    `, this._closeButton = this.shadowRoot.querySelector(".alert-close");
+  }
+  setupEventListeners() {
+    var t;
+    (t = this._closeButton) == null || t.addEventListener("click", this.handleDismiss);
+  }
+  cleanupEventListeners() {
+    var t;
+    (t = this._closeButton) == null || t.removeEventListener("click", this.handleDismiss);
+  }
+  onAttributeChange(t, e, i) {
+    (t === "type" || t === "title" || t === "dismissible") && (this.render(), this.setupEventListeners());
+  }
+  /**
+   * Programmatically dismiss the alert
+   */
+  dismiss() {
+    this.handleDismiss();
+  }
+}
+d("a11y-alert", nt);
 if (typeof window < "u") {
   const n = () => {
     B(), H();
   };
   document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", n) : n(), window.compa11y = {
     // Components (classes)
-    A11yDialog: N,
-    A11yMenu: F,
-    A11yTabs: P,
-    A11yCombobox: j,
-    A11ySwitch: U,
-    A11ySelect: Y,
-    A11yInput: G,
-    A11yTextarea: V,
-    A11yButton: X,
-    A11yListbox: Q,
-    A11yOption: J,
-    A11yOptgroup: W,
+    A11yDialog: j,
+    A11yMenu: Y,
+    A11yTabs: U,
+    A11yCombobox: V,
+    A11ySwitch: G,
+    A11ySelect: X,
+    A11yInput: W,
+    A11yTextarea: J,
+    A11yButton: Q,
+    A11yListbox: et,
+    A11yOption: tt,
+    A11yOptgroup: Z,
     A11yCheckbox: R,
-    A11yCheckboxGroup: Z,
-    A11yRadioGroup: tt,
-    A11yRadio: et,
-    A11yToast: it,
+    A11yCheckboxGroup: it,
+    A11yRadioGroup: st,
+    A11yRadio: at,
+    A11yToast: rt,
+    A11yVisuallyHidden: ot,
+    A11ySkipLink: lt,
+    A11yAlert: nt,
     // Announcer utilities
     initAnnouncer: B,
     announce: v,
     announcePolite: p,
     announceAssertive: O,
-    announceStatus: ft,
-    announceError: vt,
+    announceStatus: kt,
+    announceError: At,
     // Focus utilities
     initFocusVisible: H,
-    createFocusTrap: gt,
-    createFocusScope: mt,
-    createRovingTabindex: pt,
+    createFocusTrap: Et,
+    createFocusScope: xt,
+    createRovingTabindex: yt,
     // Keyboard utilities
-    createKeyboardManager: bt,
-    KeyboardPatterns: ut,
+    createKeyboardManager: _t,
+    KeyboardPatterns: ft,
     createTypeAhead: q,
     // ARIA utilities
-    aria: ct,
-    buildAriaProps: dt,
-    hasAccessibleName: ht,
+    aria: vt,
+    buildAriaProps: gt,
+    hasAccessibleName: mt,
     // Platform detection
-    isBrowser: nt,
-    prefersReducedMotion: lt,
-    prefersHighContrast: ot,
-    prefersDarkMode: rt
+    isBrowser: pt,
+    prefersReducedMotion: bt,
+    prefersHighContrast: ut,
+    prefersDarkMode: ct
   };
 }
 export {
-  X as A11yButton,
+  nt as A11yAlert,
+  Q as A11yButton,
   R as A11yCheckbox,
-  Z as A11yCheckboxGroup,
-  j as A11yCombobox,
-  N as A11yDialog,
-  G as A11yInput,
-  Q as A11yListbox,
-  F as A11yMenu,
-  W as A11yOptgroup,
-  J as A11yOption,
-  et as A11yRadio,
-  tt as A11yRadioGroup,
-  Y as A11ySelect,
-  U as A11ySwitch,
-  P as A11yTabs,
-  V as A11yTextarea,
-  it as A11yToast,
-  jt as KeyboardPatterns,
-  Ut as announce,
-  Yt as announceAssertive,
-  Gt as announceError,
-  Vt as announcePolite,
-  Xt as announceStatus,
-  Wt as aria,
-  Jt as buildAriaProps,
-  Qt as createFocusScope,
-  Zt as createFocusTrap,
-  te as createKeyboardManager,
-  ee as createRovingTabindex,
-  ie as createTypeAhead,
-  se as hasAccessibleName,
-  ae as initAnnouncer,
-  re as initFocusVisible,
-  oe as isBrowser,
-  le as prefersDarkMode,
-  ne as prefersHighContrast,
-  he as prefersReducedMotion
+  it as A11yCheckboxGroup,
+  V as A11yCombobox,
+  j as A11yDialog,
+  W as A11yInput,
+  et as A11yListbox,
+  Y as A11yMenu,
+  Z as A11yOptgroup,
+  tt as A11yOption,
+  at as A11yRadio,
+  st as A11yRadioGroup,
+  X as A11ySelect,
+  lt as A11ySkipLink,
+  G as A11ySwitch,
+  U as A11yTabs,
+  J as A11yTextarea,
+  rt as A11yToast,
+  ot as A11yVisuallyHidden,
+  Zt as KeyboardPatterns,
+  te as announce,
+  ee as announceAssertive,
+  ie as announceError,
+  se as announcePolite,
+  ae as announceStatus,
+  re as aria,
+  oe as buildAriaProps,
+  le as createFocusScope,
+  ne as createFocusTrap,
+  he as createKeyboardManager,
+  de as createRovingTabindex,
+  ce as createTypeAhead,
+  ue as hasAccessibleName,
+  be as initAnnouncer,
+  pe as initFocusVisible,
+  me as isBrowser,
+  ge as prefersDarkMode,
+  ve as prefersHighContrast,
+  fe as prefersReducedMotion
 };