@compa11y/web 0.1.0

package/dist/compa11y.js

@@ -0,0 +1,1352 @@
+import { generateId as E, announce as r, announcePolite as g, prefersDarkMode as k, prefersHighContrast as A, prefersReducedMotion as I, isBrowser as L, hasAccessibleName as S, buildAriaProps as C, aria as $, createTypeAhead as T, KeyboardPatterns as D, createKeyboardManager as O, createRovingTabindex as z, createFocusScope as q, createFocusTrap as M, initFocusVisible as p, announceError as R, announceStatus as H, announceAssertive as V, initAnnouncer as b } from "@compa11y/core";
+import { KeyboardPatterns as G, announce as W, announceAssertive as J, announceError as Q, announcePolite as Z, announceStatus as tt, aria as et, buildAriaProps as it, createFocusScope as st, createFocusTrap as ot, createKeyboardManager as at, createRovingTabindex as nt, createTypeAhead as lt, hasAccessibleName as rt, initAnnouncer as ht, initFocusVisible as dt, isBrowser as ct, prefersDarkMode as ut, prefersHighContrast as pt, prefersReducedMotion as bt } from "@compa11y/core";
+class h extends HTMLElement {
+  constructor() {
+    super(), this._internals = null, this._id = E(this.tagName.toLowerCase().replace("a11y-", "")), "attachInternals" in this && (this._internals = this.attachInternals());
+  }
+  /**
+   * Standard observed attributes
+   */
+  static get observedAttributes() {
+    return [];
+  }
+  /**
+   * Called when element is added to DOM
+   */
+  connectedCallback() {
+    this.setupAccessibility(), this.render(), this.setupEventListeners();
+  }
+  /**
+   * Called when element is removed from DOM
+   */
+  disconnectedCallback() {
+    this.cleanupEventListeners();
+  }
+  /**
+   * Called when observed attributes change
+   */
+  attributeChangedCallback(t, e, i) {
+    e !== i && this.onAttributeChange(t, e, i);
+  }
+  /**
+   * Set up event listeners
+   */
+  setupEventListeners() {
+  }
+  /**
+   * Clean up event listeners
+   */
+  cleanupEventListeners() {
+  }
+  /**
+   * Handle attribute changes
+   */
+  onAttributeChange(t, e, i) {
+  }
+  /**
+   * Emit a custom event
+   */
+  emit(t, e) {
+    return this.dispatchEvent(
+      new CustomEvent(t, {
+        detail: e,
+        bubbles: !0,
+        composed: !0,
+        cancelable: !0
+      })
+    );
+  }
+  /**
+   * Query a slot
+   */
+  getSlot(t) {
+    var e;
+    return ((e = this.shadowRoot) == null ? void 0 : e.querySelector(`slot[name="${t}"]`)) ?? null;
+  }
+  /**
+   * Get slotted elements
+   */
+  getSlottedElements(t) {
+    var s;
+    const e = t ? `slot[name="${t}"]` : "slot:not([name])", i = (s = this.shadowRoot) == null ? void 0 : s.querySelector(
+      e
+    );
+    return (i == null ? void 0 : i.assignedElements()) ?? [];
+  }
+}
+function d(n, t) {
+  customElements.get(n) || customElements.define(n, t);
+}
+const f = `
+  appearance: none;
+  background: none;
+  border: none;
+  padding: 0;
+  margin: 0;
+  font: inherit;
+  color: inherit;
+  cursor: pointer;
+`, K = `
+  :host(:focus-visible),
+  :focus-visible {
+    outline: 2px solid var(--compa11y-focus-color, #0066cc);
+    outline-offset: 2px;
+  }
+`, c = `
+  :host {
+    display: block;
+    box-sizing: border-box;
+  }
+
+  :host([hidden]) {
+    display: none !important;
+  }
+
+  *,
+  *::before,
+  *::after {
+    box-sizing: inherit;
+  }
+
+  ${K}
+`, B = `
+  ${c}
+
+  :host {
+    position: fixed;
+    inset: 0;
+    z-index: var(--compa11y-dialog-z-index, 9999);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .overlay {
+    position: absolute;
+    inset: 0;
+    background: var(--compa11y-dialog-overlay-bg, rgba(0, 0, 0, 0.5));
+  }
+
+  .dialog {
+    position: relative;
+    background: var(--compa11y-dialog-bg, white);
+    border-radius: var(--compa11y-dialog-radius, 8px);
+    padding: var(--compa11y-dialog-padding, 1.5rem);
+    max-width: var(--compa11y-dialog-max-width, 500px);
+    max-height: var(--compa11y-dialog-max-height, 85vh);
+    overflow: auto;
+    box-shadow: var(--compa11y-dialog-shadow, 0 25px 50px -12px rgba(0, 0, 0, 0.25));
+  }
+
+  ::slotted([slot="title"]) {
+    margin: 0 0 0.5rem 0;
+    font-size: 1.25rem;
+    font-weight: 600;
+  }
+
+  ::slotted([slot="description"]) {
+    margin: 0 0 1rem 0;
+    color: var(--compa11y-dialog-description-color, #666);
+  }
+`, F = `
+  ${c}
+
+  :host {
+    position: relative;
+    display: inline-block;
+  }
+
+  .menu-content {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    z-index: var(--compa11y-menu-z-index, 1000);
+    min-width: var(--compa11y-menu-min-width, 160px);
+    background: var(--compa11y-menu-bg, white);
+    border: var(--compa11y-menu-border, 1px solid #e0e0e0);
+    border-radius: var(--compa11y-menu-radius, 4px);
+    box-shadow: var(--compa11y-menu-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
+    padding: var(--compa11y-menu-padding, 0.25rem 0);
+    margin-top: var(--compa11y-menu-offset, 4px);
+  }
+
+  .menu-content[hidden] {
+    display: none;
+  }
+
+  ::slotted([role="menuitem"]) {
+    display: block;
+    width: 100%;
+    padding: 0.5rem 1rem;
+    text-align: left;
+    background: none;
+    border: none;
+    cursor: pointer;
+    font: inherit;
+  }
+
+  ::slotted([role="menuitem"]:hover),
+  ::slotted([role="menuitem"][data-highlighted="true"]) {
+    background: var(--compa11y-menu-item-hover-bg, #f5f5f5);
+  }
+
+  ::slotted([role="menuitem"][aria-disabled="true"]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  ::slotted([role="separator"]) {
+    height: 1px;
+    margin: 0.25rem 0;
+    background: var(--compa11y-menu-separator-color, #e0e0e0);
+  }
+`, P = `
+  ${c}
+
+  .tablist {
+    display: flex;
+    border-bottom: var(--compa11y-tabs-border, 1px solid #e0e0e0);
+    gap: var(--compa11y-tabs-gap, 0);
+  }
+
+  :host([orientation="vertical"]) .tablist {
+    flex-direction: column;
+    border-bottom: none;
+    border-right: var(--compa11y-tabs-border, 1px solid #e0e0e0);
+  }
+
+  ::slotted([role="tab"]) {
+    ${f}
+    padding: var(--compa11y-tab-padding, 0.75rem 1rem);
+    border-bottom: 2px solid transparent;
+    margin-bottom: -1px;
+    font-weight: 500;
+    color: var(--compa11y-tab-color, #666);
+    transition: all 0.15s ease;
+  }
+
+  ::slotted([role="tab"]:hover) {
+    color: var(--compa11y-tab-hover-color, #333);
+  }
+
+  ::slotted([role="tab"][aria-selected="true"]) {
+    color: var(--compa11y-tab-active-color, #0066cc);
+    border-bottom-color: currentColor;
+  }
+
+  ::slotted([role="tab"][aria-disabled="true"]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  ::slotted([role="tabpanel"]) {
+    padding: var(--compa11y-tabpanel-padding, 1rem 0);
+  }
+
+  ::slotted([role="tabpanel"][hidden]) {
+    display: none;
+  }
+`, N = `
+  ${c}
+
+  :host {
+    display: inline-block;
+    position: relative;
+    width: var(--compa11y-combobox-width, 250px);
+  }
+
+  .combobox-wrapper {
+    position: relative;
+  }
+
+  .input-wrapper {
+    position: relative;
+    display: flex;
+    align-items: center;
+  }
+
+  input {
+    width: 100%;
+    padding: var(--compa11y-combobox-input-padding, 0.5rem 2rem 0.5rem 0.75rem);
+    border: var(--compa11y-combobox-border, 1px solid #ccc);
+    border-radius: var(--compa11y-combobox-radius, 4px);
+    font: inherit;
+    background: var(--compa11y-combobox-bg, white);
+    color: var(--compa11y-combobox-color, inherit);
+  }
+
+  input:focus {
+    outline: 2px solid var(--compa11y-focus-color, #0066cc);
+    outline-offset: -1px;
+    border-color: var(--compa11y-focus-color, #0066cc);
+  }
+
+  input::placeholder {
+    color: var(--compa11y-combobox-placeholder-color, #999);
+  }
+
+  input:disabled {
+    background: var(--compa11y-combobox-disabled-bg, #f5f5f5);
+    cursor: not-allowed;
+    opacity: 0.7;
+  }
+
+  .chevron {
+    position: absolute;
+    right: 0.5rem;
+    pointer-events: none;
+    font-size: 0.75rem;
+    color: var(--compa11y-combobox-chevron-color, #666);
+    transition: transform 0.15s ease;
+  }
+
+  :host([open]) .chevron {
+    transform: rotate(180deg);
+  }
+
+  .clear-button {
+    ${f}
+    position: absolute;
+    right: 1.5rem;
+    width: 1.25rem;
+    height: 1.25rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: 50%;
+    font-size: 1rem;
+    color: var(--compa11y-combobox-clear-color, #666);
+  }
+
+  .clear-button:hover {
+    background: var(--compa11y-combobox-clear-hover-bg, rgba(0, 0, 0, 0.1));
+  }
+
+  .clear-button[hidden] {
+    display: none;
+  }
+
+  .listbox {
+    position: absolute;
+    top: 100%;
+    left: 0;
+    right: 0;
+    z-index: var(--compa11y-combobox-z-index, 1000);
+    max-height: var(--compa11y-combobox-max-height, 200px);
+    overflow-y: auto;
+    margin: 0;
+    padding: var(--compa11y-combobox-listbox-padding, 0.25rem 0);
+    background: var(--compa11y-combobox-listbox-bg, white);
+    border: var(--compa11y-combobox-listbox-border, 1px solid #e0e0e0);
+    border-radius: var(--compa11y-combobox-radius, 4px);
+    box-shadow: var(--compa11y-combobox-shadow, 0 4px 6px -1px rgba(0, 0, 0, 0.1));
+    list-style: none;
+  }
+
+  /* Flip chevron when listbox is positioned above */
+  :host([data-position="top"]) .chevron {
+    transform: rotate(180deg);
+  }
+
+  :host([data-position="top"][open]) .chevron {
+    transform: rotate(0deg);
+  }
+
+  .listbox[hidden] {
+    display: none;
+  }
+
+  .listbox li[role="option"] {
+    padding: var(--compa11y-combobox-option-padding, 0.5rem 0.75rem);
+    cursor: pointer;
+    transition: background 0.1s ease;
+  }
+
+  .listbox li[role="option"]:hover,
+  .listbox li[role="option"].highlighted {
+    background: var(--compa11y-combobox-option-hover-bg, #f5f5f5);
+  }
+
+  .listbox li[role="option"][aria-selected="true"] {
+    background: var(--compa11y-combobox-option-selected-bg, #e6f0ff);
+    font-weight: 500;
+  }
+
+  .listbox li[role="option"].disabled,
+  .listbox li[role="option"][aria-disabled="true"] {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .empty-message {
+    padding: var(--compa11y-combobox-option-padding, 0.5rem 0.75rem);
+    color: var(--compa11y-combobox-empty-color, #666);
+    font-style: italic;
+  }
+
+  .options-source {
+    display: none;
+  }
+`, U = `
+  ${c}
+
+  :host {
+    display: inline-block;
+  }
+
+  .switch-wrapper {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--compa11y-switch-gap, 0.5rem);
+  }
+
+  /* Size variants */
+  .switch-wrapper.size-sm .switch-track {
+    width: var(--compa11y-switch-width-sm, 32px);
+    height: var(--compa11y-switch-height-sm, 18px);
+  }
+
+  .switch-wrapper.size-sm .switch-thumb {
+    width: var(--compa11y-switch-thumb-sm, 14px);
+    height: var(--compa11y-switch-thumb-sm, 14px);
+  }
+
+  .switch-wrapper.size-sm .switch-track.checked .switch-thumb {
+    transform: translateX(14px);
+  }
+
+  .switch-wrapper.size-md .switch-track {
+    width: var(--compa11y-switch-width-md, 44px);
+    height: var(--compa11y-switch-height-md, 24px);
+  }
+
+  .switch-wrapper.size-md .switch-thumb {
+    width: var(--compa11y-switch-thumb-md, 20px);
+    height: var(--compa11y-switch-thumb-md, 20px);
+  }
+
+  .switch-wrapper.size-md .switch-track.checked .switch-thumb {
+    transform: translateX(20px);
+  }
+
+  .switch-wrapper.size-lg .switch-track {
+    width: var(--compa11y-switch-width-lg, 56px);
+    height: var(--compa11y-switch-height-lg, 30px);
+  }
+
+  .switch-wrapper.size-lg .switch-thumb {
+    width: var(--compa11y-switch-thumb-lg, 26px);
+    height: var(--compa11y-switch-thumb-lg, 26px);
+  }
+
+  .switch-wrapper.size-lg .switch-track.checked .switch-thumb {
+    transform: translateX(26px);
+  }
+
+  .switch-track {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    flex-shrink: 0;
+    padding: 2px;
+    border: none;
+    border-radius: var(--compa11y-switch-radius, 9999px);
+    background: var(--compa11y-switch-bg, #d1d5db);
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+    outline: none;
+  }
+
+  .switch-track:focus-visible {
+    outline: 2px solid var(--compa11y-focus-color, #0066cc);
+    outline-offset: 2px;
+  }
+
+  .switch-track.checked {
+    background: var(--compa11y-switch-checked-bg, #0066cc);
+  }
+
+  .switch-track:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .switch-thumb {
+    position: absolute;
+    left: 2px;
+    background: var(--compa11y-switch-thumb-bg, white);
+    border-radius: 50%;
+    box-shadow: var(--compa11y-switch-thumb-shadow, 0 1px 3px rgba(0, 0, 0, 0.2));
+    transition: transform 0.2s ease;
+    pointer-events: none;
+  }
+
+  .switch-label {
+    user-select: none;
+    cursor: pointer;
+    color: var(--compa11y-switch-label-color, inherit);
+  }
+
+  .switch-label.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+`, m = 'button:not([disabled]), [href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';
+class y extends h {
+  constructor() {
+    super(...arguments), this._open = !1, this._previouslyFocused = null, this._triggerElement = null, this.handleTriggerClick = () => {
+      this.open = !0;
+    }, this.handleClose = () => {
+      this.open = !1;
+    }, this.handleKeyDown = (t) => {
+      var e;
+      if (this._open) {
+        if (t.key === "Escape") {
+          this.getAttribute("close-on-escape") !== "false" && (t.preventDefault(), this.handleClose());
+          return;
+        }
+        if (t.key === "Tab") {
+          t.preventDefault();
+          const i = this.getFocusableElements();
+          if (i.length === 0) return;
+          const s = ((e = this.shadowRoot) == null ? void 0 : e.activeElement) || document.activeElement;
+          let o = i.findIndex(
+            (u) => u === s
+          );
+          o === -1 && (o = t.shiftKey ? 0 : i.length - 1);
+          let a;
+          t.shiftKey ? a = o === 0 ? i.length - 1 : o - 1 : a = o === i.length - 1 ? 0 : o + 1;
+          const l = i[a];
+          l && l.focus();
+        }
+      }
+    };
+  }
+  static get observedAttributes() {
+    return ["open", "trigger", "close-on-outside-click", "close-on-escape"];
+  }
+  get open() {
+    return this._open;
+  }
+  set open(t) {
+    const e = this._open;
+    this._open = t, t !== e && (t ? this.showDialog() : this.hideDialog()), this.toggleAttribute("open", t);
+  }
+  setupAccessibility() {
+  }
+  render() {
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-title`, i = `${this._id}-desc`;
+    t.innerHTML = `
+      <style>${B}</style>
+      <div class="overlay" part="overlay"></div>
+      <div
+        class="dialog"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="${e}"
+        aria-describedby="${i}"
+        part="dialog"
+      >
+        <div id="${e}" part="title">
+          <slot name="title"></slot>
+        </div>
+        <div id="${i}" part="description">
+          <slot name="description"></slot>
+        </div>
+        <div part="content">
+          <slot></slot>
+        </div>
+        <div part="actions">
+          <slot name="actions"></slot>
+        </div>
+      </div>
+    `, this._open || (this.style.display = "none");
+  }
+  setupEventListeners() {
+    var i;
+    const t = this.getAttribute("trigger");
+    if (t) {
+      const s = () => {
+        this._triggerElement = document.querySelector(t), this._triggerElement && (this._triggerElement.addEventListener(
+          "click",
+          this.handleTriggerClick
+        ), this._triggerElement.hasAttribute("tabindex") || this._triggerElement.setAttribute("tabindex", "0"));
+      };
+      s(), this._triggerElement || requestAnimationFrame(() => {
+        s(), this._triggerElement || setTimeout(s, 0);
+      });
+    }
+    const e = (i = this.shadowRoot) == null ? void 0 : i.querySelector(".overlay");
+    this.getAttribute("close-on-outside-click") !== "false" && (e == null || e.addEventListener("click", this.handleClose)), this.addEventListener("keydown", this.handleKeyDown);
+  }
+  cleanupEventListeners() {
+    var t;
+    (t = this._triggerElement) == null || t.removeEventListener("click", this.handleTriggerClick), this.removeEventListener("keydown", this.handleKeyDown);
+  }
+  onAttributeChange(t, e, i) {
+    t === "open" && (this.open = i !== null);
+  }
+  /**
+   * Get all focusable elements in the dialog (light DOM first, then shadow DOM)
+   * Per WAI-ARIA best practices: focus should go to dialog content first,
+   * close button should be last in tab order
+   */
+  getFocusableElements() {
+    const t = [];
+    return this.querySelectorAll(m).forEach((i) => t.push(i)), this.shadowRoot && this.shadowRoot.querySelectorAll(m).forEach((s) => {
+      s.classList.contains("overlay") || t.push(s);
+    }), t;
+  }
+  showDialog() {
+    this._previouslyFocused = document.activeElement, this.style.display = "flex", requestAnimationFrame(() => {
+      const e = this.getFocusableElements()[0];
+      e && e.focus();
+    }), document.body.style.overflow = "hidden", r("Dialog opened", { politeness: "polite" }), this.emit("a11y-dialog-open");
+  }
+  hideDialog() {
+    var t;
+    this.style.display = "none", document.body.style.overflow = "", (t = this._previouslyFocused) == null || t.focus(), this._previouslyFocused = null, r("Dialog closed", { politeness: "polite" }), this.emit("a11y-dialog-close");
+  }
+  /**
+   * Programmatic open
+   */
+  show() {
+    this.open = !0;
+  }
+  /**
+   * Programmatic close
+   */
+  close() {
+    this.open = !1;
+  }
+}
+d("a11y-dialog", y);
+class _ extends h {
+  constructor() {
+    super(...arguments), this._open = !1, this._highlightedIndex = -1, this._menuItems = [], this.updateMenuItems = () => {
+      this._menuItems = Array.from(
+        this.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')
+      ), this._menuItems.forEach((t, e) => {
+        t.id = t.id || `${this._id}-item-${e}`, t.setAttribute("tabindex", "-1");
+      });
+    }, this._lastClickTime = 0, this.handleTriggerClick = () => {
+      const t = Date.now();
+      t - this._lastClickTime < 50 || (this._lastClickTime = t, this.toggle());
+    }, this.handleTriggerKeyDown = (t) => {
+      switch (t.key) {
+        case "Enter":
+        case " ":
+          t.preventDefault(), this.toggle(), this._open && this.highlightItem(0);
+          break;
+        case "ArrowDown":
+          t.preventDefault(), this._open || this.show(), this.highlightItem(0);
+          break;
+        case "ArrowUp":
+          t.preventDefault(), this._open || this.show(), this.highlightItem(this._menuItems.length - 1);
+          break;
+      }
+    }, this.handleMenuKeyDown = (t) => {
+      if (!this._open) return;
+      const e = t.target;
+      if (!(!e.hasAttribute("role") || e.getAttribute("role") !== "menuitem"))
+        switch (t.key) {
+          case "ArrowDown":
+            t.preventDefault(), this.highlightItem(
+              (this._highlightedIndex + 1) % this._menuItems.length
+            );
+            break;
+          case "ArrowUp":
+            t.preventDefault(), this.highlightItem(
+              (this._highlightedIndex - 1 + this._menuItems.length) % this._menuItems.length
+            );
+            break;
+          case "Home":
+            t.preventDefault(), this.highlightItem(0);
+            break;
+          case "End":
+            t.preventDefault(), this.highlightItem(this._menuItems.length - 1);
+            break;
+          case "Enter":
+          case " ":
+            t.preventDefault(), this.selectItem(this._highlightedIndex);
+            break;
+          case "Escape":
+            t.preventDefault(), this.close();
+            break;
+          case "Tab":
+            this.close();
+            break;
+        }
+    }, this.handleItemClick = (t) => {
+      const e = t.target;
+      if (e.getAttribute("role") === "menuitem" && e.getAttribute("aria-disabled") !== "true") {
+        const i = this._menuItems.indexOf(e);
+        this.selectItem(i);
+      }
+    }, this.handleMouseOver = (t) => {
+      const e = t.target;
+      if (e.getAttribute("role") === "menuitem") {
+        const i = this._menuItems.indexOf(e);
+        i !== -1 && this.highlightItem(i, !1);
+      }
+    }, this.handleOutsideClick = (t) => {
+      if (!this._open) return;
+      t.composedPath().includes(this) || this.close();
+    };
+  }
+  static get observedAttributes() {
+    return ["open"];
+  }
+  get open() {
+    return this._open;
+  }
+  set open(t) {
+    const e = this._open;
+    this._open = t, t !== e && this.updateMenuVisibility(), this.toggleAttribute("open", t);
+  }
+  setupAccessibility() {
+    const t = this.querySelector('[slot="trigger"]');
+    t && (t.setAttribute("aria-haspopup", "menu"), t.setAttribute("aria-expanded", String(this._open)), t.id = t.id || `${this._id}-trigger`, t.hasAttribute("tabindex") || t.setAttribute("tabindex", "0"));
+  }
+  render() {
+    const t = this.attachShadow({ mode: "open" });
+    t.innerHTML = `
+      <style>${F}</style>
+      <slot name="trigger"></slot>
+      <div
+        class="menu-content"
+        role="menu"
+        aria-labelledby="${this._id}-trigger"
+        tabindex="-1"
+        hidden
+        part="menu"
+      >
+        <slot></slot>
+      </div>
+    `;
+  }
+  setupEventListeners() {
+    var s, o;
+    const t = this.querySelector('[slot="trigger"]');
+    t == null || t.addEventListener("click", this.handleTriggerClick), t == null || t.addEventListener(
+      "keydown",
+      this.handleTriggerKeyDown
+    );
+    const e = (s = this.shadowRoot) == null ? void 0 : s.querySelector('slot[name="trigger"]');
+    e == null || e.addEventListener("click", this.handleTriggerClick), this.addEventListener("click", this.handleItemClick), this.addEventListener("keydown", this.handleMenuKeyDown), this.addEventListener("mouseover", this.handleMouseOver), document.addEventListener("mousedown", this.handleOutsideClick);
+    const i = (o = this.shadowRoot) == null ? void 0 : o.querySelector("slot:not([name])");
+    i == null || i.addEventListener("slotchange", this.updateMenuItems), this.updateMenuItems();
+  }
+  cleanupEventListeners() {
+    document.removeEventListener("mousedown", this.handleOutsideClick);
+  }
+  onAttributeChange(t, e, i) {
+    t === "open" && (this.open = i !== null);
+  }
+  highlightItem(t, e = !0) {
+    var s;
+    if (this._highlightedIndex >= 0) {
+      const o = this._menuItems[this._highlightedIndex];
+      o == null || o.removeAttribute("data-highlighted");
+    }
+    this._highlightedIndex = t;
+    const i = this._menuItems[t];
+    if (i) {
+      i.setAttribute("data-highlighted", "true"), e && i.focus();
+      const o = (s = this.shadowRoot) == null ? void 0 : s.querySelector('[role="menu"]');
+      o == null || o.setAttribute("aria-activedescendant", i.id);
+    }
+  }
+  selectItem(t) {
+    const e = this._menuItems[t];
+    e && (this.emit("a11y-menu-select", { item: e, index: t }), e.click()), this.close();
+  }
+  updateMenuVisibility() {
+    var i;
+    const t = (i = this.shadowRoot) == null ? void 0 : i.querySelector(".menu-content"), e = this.querySelector('[slot="trigger"]');
+    this._open ? (t == null || t.removeAttribute("hidden"), e == null || e.setAttribute("aria-expanded", "true"), this.updateMenuItems(), this.emit("a11y-menu-open")) : (t == null || t.setAttribute("hidden", ""), e == null || e.setAttribute("aria-expanded", "false"), this._highlightedIndex = -1, this._menuItems.forEach((s) => {
+      s.removeAttribute("data-highlighted");
+    }), e == null || e.focus(), this.emit("a11y-menu-close"));
+  }
+  /**
+   * Show the menu
+   */
+  show() {
+    this.open = !0;
+  }
+  /**
+   * Hide the menu
+   */
+  close() {
+    this.open = !1;
+  }
+  /**
+   * Toggle the menu
+   */
+  toggle() {
+    this.open = !this._open;
+  }
+}
+d("a11y-menu", _);
+class x extends h {
+  constructor() {
+    super(...arguments), this._tabs = [], this._panels = [], this._selectedIndex = 0, this.updateTabsAndPanels = () => {
+      this._tabs = Array.from(
+        this.querySelectorAll('[role="tab"]')
+      ), this._panels = Array.from(
+        this.querySelectorAll('[role="tabpanel"]')
+      ), this._tabs.forEach((t, e) => {
+        const i = this._panels[e], s = t.id || `${this._id}-tab-${e}`, o = (i == null ? void 0 : i.id) || `${this._id}-panel-${e}`;
+        t.id = s, t.setAttribute("aria-controls", o), t.setAttribute("tabindex", e === this._selectedIndex ? "0" : "-1"), t.setAttribute("aria-selected", String(e === this._selectedIndex)), t.hasAttribute("slot") || t.setAttribute("slot", "tab"), i && (i.id = o, i.setAttribute("aria-labelledby", s), i.setAttribute("tabindex", "0"), i.hidden = e !== this._selectedIndex, i.hasAttribute("slot") || i.setAttribute("slot", "panel"));
+      }), this.updateSelection();
+    }, this.handleClick = (t) => {
+      const e = t.target;
+      if (e.getAttribute("role") === "tab") {
+        const i = this._tabs.indexOf(e);
+        i !== -1 && e.getAttribute("aria-disabled") !== "true" && this.selectTab(i);
+      }
+    }, this.handleKeyDown = (t) => {
+      var l;
+      if (t.target.getAttribute("role") !== "tab") return;
+      const i = this.orientation === "horizontal", s = i ? "ArrowRight" : "ArrowDown", o = i ? "ArrowLeft" : "ArrowUp";
+      let a = this._selectedIndex;
+      switch (t.key) {
+        case s:
+          t.preventDefault(), a = (this._selectedIndex + 1) % this._tabs.length;
+          break;
+        case o:
+          t.preventDefault(), a = (this._selectedIndex - 1 + this._tabs.length) % this._tabs.length;
+          break;
+        case "Home":
+          t.preventDefault(), a = 0;
+          break;
+        case "End":
+          t.preventDefault(), a = this._tabs.length - 1;
+          break;
+        default:
+          return;
+      }
+      (l = this._tabs[a]) == null || l.focus(), this.activationMode === "automatic" && this.selectTab(a);
+    };
+  }
+  static get observedAttributes() {
+    return ["orientation", "activation-mode", "selected-index"];
+  }
+  get selectedIndex() {
+    return this._selectedIndex;
+  }
+  set selectedIndex(t) {
+    t >= 0 && t < this._tabs.length && (this._selectedIndex = t, this.updateSelection());
+  }
+  get orientation() {
+    return this.getAttribute("orientation") || "horizontal";
+  }
+  get activationMode() {
+    return this.getAttribute("activation-mode") || "automatic";
+  }
+  setupAccessibility() {
+    this.updateTabsAndPanels();
+  }
+  render() {
+    const t = this.attachShadow({ mode: "open" });
+    t.innerHTML = `
+      <style>${P}</style>
+      <div class="tablist" role="tablist" aria-orientation="${this.orientation}" part="tablist">
+        <slot name="tab"></slot>
+      </div>
+      <div class="panels" part="panels">
+        <slot name="panel"></slot>
+      </div>
+      <slot></slot>
+    `;
+  }
+  setupEventListeners() {
+    var s, o, a;
+    this.addEventListener("click", this.handleClick), this.addEventListener("keydown", this.handleKeyDown);
+    const t = (s = this.shadowRoot) == null ? void 0 : s.querySelector('slot[name="tab"]'), e = (o = this.shadowRoot) == null ? void 0 : o.querySelector('slot[name="panel"]'), i = (a = this.shadowRoot) == null ? void 0 : a.querySelector("slot:not([name])");
+    t == null || t.addEventListener("slotchange", this.updateTabsAndPanels), e == null || e.addEventListener("slotchange", this.updateTabsAndPanels), i == null || i.addEventListener("slotchange", this.updateTabsAndPanels);
+  }
+  onAttributeChange(t, e, i) {
+    var s;
+    if (t === "orientation") {
+      const o = (s = this.shadowRoot) == null ? void 0 : s.querySelector('[role="tablist"]');
+      o == null || o.setAttribute("aria-orientation", i || "horizontal");
+    }
+    t === "selected-index" && i && (this.selectedIndex = parseInt(i, 10));
+  }
+  selectTab(t) {
+    const e = this._selectedIndex;
+    if (this._selectedIndex = t, this.updateSelection(), e !== t) {
+      const i = this._tabs[t];
+      r(`${(i == null ? void 0 : i.textContent) || "Tab"} selected`), this.emit("a11y-tabs-change", {
+        index: t,
+        tab: this._tabs[t],
+        panel: this._panels[t]
+      });
+    }
+  }
+  updateSelection() {
+    this._tabs.forEach((t, e) => {
+      const i = e === this._selectedIndex;
+      t.setAttribute("aria-selected", String(i)), t.setAttribute("tabindex", i ? "0" : "-1");
+    }), this._panels.forEach((t, e) => {
+      t.hidden = e !== this._selectedIndex;
+    });
+  }
+  /**
+   * Select a tab by index
+   */
+  select(t) {
+    this.selectTab(t);
+  }
+  /**
+   * Select next tab
+   */
+  next() {
+    this.selectTab((this._selectedIndex + 1) % this._tabs.length);
+  }
+  /**
+   * Select previous tab
+   */
+  previous() {
+    this.selectTab(
+      (this._selectedIndex - 1 + this._tabs.length) % this._tabs.length
+    );
+  }
+}
+d("a11y-tabs", x);
+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"));
+      this._options = t.map((e) => ({
+        value: e.getAttribute("value") || e.textContent || "",
+        label: e.textContent || "",
+        disabled: e.hasAttribute("disabled"),
+        element: e
+      })), this._filteredOptions = [...this._options], this.renderOptions();
+    }, this.handleInput = (t) => {
+      const e = t.target;
+      this._inputValue = e.value;
+      const i = this._inputValue.toLowerCase();
+      this._filteredOptions = i ? this._options.filter((o) => o.label.toLowerCase().includes(i)) : [...this._options], this.renderOptions(), this.open = !0, this._highlightedIndex = 0, this.updateHighlight(), this.updateClearButton();
+      const s = this._filteredOptions.length;
+      r(
+        s === 0 ? "No results" : `${s} result${s === 1 ? "" : "s"} available`
+      );
+    }, this.handleFocus = () => {
+      this.open = !0;
+    }, this.handleBlur = () => {
+      setTimeout(() => {
+        var t;
+        (t = this.shadowRoot) != null && t.activeElement || (this.open = !1);
+      }, 150);
+    }, this.handleKeyDown = (t) => {
+      switch (t.key) {
+        case "ArrowDown":
+          t.preventDefault(), this._open ? this._highlightedIndex = Math.min(
+            this._highlightedIndex + 1,
+            this._filteredOptions.length - 1
+          ) : (this.open = !0, this._highlightedIndex = 0), this.updateHighlight();
+          break;
+        case "ArrowUp":
+          t.preventDefault(), this._open ? this._highlightedIndex = Math.max(this._highlightedIndex - 1, 0) : (this.open = !0, this._highlightedIndex = this._filteredOptions.length - 1), this.updateHighlight();
+          break;
+        case "Enter":
+          if (t.preventDefault(), this._open && this._highlightedIndex >= 0) {
+            const e = this._filteredOptions[this._highlightedIndex];
+            e && !e.disabled && this.selectOption(e);
+          }
+          break;
+        case "Escape":
+          t.preventDefault(), this.open = !1, this._highlightedIndex = -1;
+          break;
+        case "Home":
+          this._open && (t.preventDefault(), this._highlightedIndex = 0, this.updateHighlight());
+          break;
+        case "End":
+          this._open && (t.preventDefault(), this._highlightedIndex = this._filteredOptions.length - 1, this.updateHighlight());
+          break;
+        case "Tab":
+          this._open && (this.open = !1, this._highlightedIndex = -1);
+          break;
+      }
+    }, this.handleOptionClick = (t) => {
+      const e = t.currentTarget, i = parseInt(e.dataset.index || "0", 10), s = this._filteredOptions[i];
+      s && !s.disabled && this.selectOption(s);
+    }, this.handleOptionHover = (t) => {
+      const e = t.currentTarget, i = parseInt(e.dataset.index || "0", 10), s = this._filteredOptions[i];
+      s && !s.disabled && (this._highlightedIndex = i, this.updateHighlight());
+    }, this.handleClear = () => {
+      this._inputValue = "", this._selectedValue = null, this._inputElement && (this._inputElement.value = "", this._inputElement.focus()), this._filteredOptions = [...this._options], this.renderOptions(), this.updateClearButton(), this.emit("a11y-combobox-clear"), this.emit("a11y-combobox-change", { value: null, label: null });
+    }, this.handleOutsideClick = (t) => {
+      if (!this._open) return;
+      t.composedPath().includes(this) || (this.open = !1);
+    };
+  }
+  static get observedAttributes() {
+    return ["open", "value", "placeholder", "disabled", "clearable"];
+  }
+  get open() {
+    return this._open;
+  }
+  set open(t) {
+    const e = this._open;
+    this._open = t, t !== e && this.updateListboxVisibility(), this.toggleAttribute("open", t);
+  }
+  get value() {
+    return this._selectedValue;
+  }
+  set value(t) {
+    this._selectedValue = t;
+    const e = this._options.find((i) => i.value === t);
+    e && (this._inputValue = e.label, this._inputElement && (this._inputElement.value = e.label)), this.setAttribute("value", t || "");
+  }
+  setupAccessibility() {
+  }
+  render() {
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-input`, i = `${this._id}-listbox`, s = this.getAttribute("placeholder") || "Search...", o = this.hasAttribute("clearable");
+    t.innerHTML = `
+      <style>${N}</style>
+      <div class="combobox-wrapper" part="wrapper">
+        <div class="input-wrapper" part="input-wrapper">
+          <input
+            id="${e}"
+            type="text"
+            role="combobox"
+            autocomplete="off"
+            aria-expanded="false"
+            aria-controls="${i}"
+            aria-haspopup="listbox"
+            aria-autocomplete="list"
+            placeholder="${s}"
+            part="input"
+          />
+          ${o ? `
+            <button
+              type="button"
+              class="clear-button"
+              aria-label="Clear selection"
+              tabindex="-1"
+              hidden
+              part="clear-button"
+            >×</button>
+          ` : ""}
+          <span class="chevron" aria-hidden="true" part="chevron">▼</span>
+        </div>
+        <ul
+          id="${i}"
+          role="listbox"
+          aria-labelledby="${e}"
+          class="listbox"
+          tabindex="-1"
+          hidden
+          part="listbox"
+        ></ul>
+      </div>
+      <div class="options-source" hidden>
+        <slot></slot>
+      </div>
+    `, this._inputElement = t.querySelector("input"), this._listboxElement = t.querySelector(".listbox");
+  }
+  setupEventListeners() {
+    var i, s, o, a, l, u;
+    (i = this._inputElement) == null || i.addEventListener("input", this.handleInput), (s = this._inputElement) == null || s.addEventListener("focus", this.handleFocus), (o = this._inputElement) == null || o.addEventListener("blur", this.handleBlur), (a = this._inputElement) == null || a.addEventListener("keydown", this.handleKeyDown);
+    const t = (l = this.shadowRoot) == null ? void 0 : l.querySelector(".clear-button");
+    t == null || t.addEventListener("click", this.handleClear), document.addEventListener("mousedown", this.handleOutsideClick);
+    const e = (u = this.shadowRoot) == null ? void 0 : u.querySelector("slot");
+    e == null || e.addEventListener("slotchange", this.updateOptions), this.updateOptions();
+  }
+  cleanupEventListeners() {
+    document.removeEventListener("mousedown", this.handleOutsideClick);
+  }
+  onAttributeChange(t, e, i) {
+    t === "open" && (this.open = i !== null), t === "value" && (this.value = i), t === "disabled" && this._inputElement && (this._inputElement.disabled = i !== null), t === "placeholder" && this._inputElement && (this._inputElement.placeholder = i || "Search...");
+  }
+  renderOptions() {
+    this._listboxElement && (this._listboxElement.innerHTML = this._filteredOptions.length === 0 ? '<li role="presentation" class="empty-message" part="empty">No results found</li>' : this._filteredOptions.map(
+      (t, e) => `
+          <li
+            id="${this._id}-option-${e}"
+            role="option"
+            aria-selected="${this._selectedValue === t.value}"
+            aria-disabled="${t.disabled}"
+            data-value="${t.value}"
+            data-index="${e}"
+            part="option"
+            ${t.disabled ? 'class="disabled"' : ""}
+          >${t.label}</li>
+        `
+    ).join(""), this._listboxElement.querySelectorAll('[role="option"]').forEach((t) => {
+      t.addEventListener("click", this.handleOptionClick), t.addEventListener("mouseenter", this.handleOptionHover);
+    }));
+  }
+  selectOption(t) {
+    this._selectedValue = t.value, this._inputValue = t.label, this._inputElement && (this._inputElement.value = t.label), this.open = !1, this._highlightedIndex = -1, this.renderOptions(), this.updateClearButton(), r(`${t.label} selected`), this.emit("a11y-combobox-select", {
+      value: t.value,
+      label: t.label
+    }), this.emit("a11y-combobox-change", {
+      value: t.value,
+      label: t.label
+    });
+  }
+  updateHighlight() {
+    var t, e, i, s;
+    if ((t = this._listboxElement) == null || t.querySelectorAll('[role="option"]').forEach((o, a) => {
+      o.classList.toggle("highlighted", a === this._highlightedIndex);
+    }), this._highlightedIndex >= 0) {
+      const o = `${this._id}-option-${this._highlightedIndex}`;
+      (e = this._inputElement) == null || e.setAttribute("aria-activedescendant", o);
+      const a = (i = this._listboxElement) == null ? void 0 : i.querySelector(`#${o}`);
+      a == null || a.scrollIntoView({ block: "nearest", behavior: "smooth" });
+    } else
+      (s = this._inputElement) == null || s.removeAttribute("aria-activedescendant");
+  }
+  updateListboxVisibility() {
+    !this._listboxElement || !this._inputElement || (this._open ? (this._listboxElement.hidden = !1, this._inputElement.setAttribute("aria-expanded", "true"), this.updateListboxPosition(), this.emit("a11y-combobox-open")) : (this._listboxElement.hidden = !0, this._inputElement.setAttribute("aria-expanded", "false"), this._highlightedIndex = -1, this.updateHighlight(), this._listboxElement.style.top = "", this._listboxElement.style.bottom = "", this.removeAttribute("data-position"), this.emit("a11y-combobox-close")));
+  }
+  updateListboxPosition() {
+    if (!this._listboxElement || !this._inputElement) return;
+    const t = this._inputElement.getBoundingClientRect(), e = window.innerHeight, i = Math.min(
+      this._listboxElement.scrollHeight,
+      200
+      // max-height from CSS
+    ), s = e - t.bottom, o = t.top;
+    s < i + 8 && o > s ? (this._listboxElement.style.top = "auto", this._listboxElement.style.bottom = "100%", this._listboxElement.style.marginTop = "0", this._listboxElement.style.marginBottom = "4px", this.setAttribute("data-position", "top")) : (this._listboxElement.style.top = "100%", this._listboxElement.style.bottom = "auto", this._listboxElement.style.marginTop = "4px", this._listboxElement.style.marginBottom = "0", this.setAttribute("data-position", "bottom"));
+  }
+  updateClearButton() {
+    var e;
+    const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(
+      ".clear-button"
+    );
+    t && (t.hidden = !this._inputValue);
+  }
+  /**
+   * Programmatic open
+   */
+  show() {
+    this.open = !0;
+  }
+  /**
+   * Programmatic close
+   */
+  close() {
+    this.open = !1;
+  }
+  /**
+   * Clear the selection
+   */
+  clear() {
+    this.handleClear();
+  }
+}
+d("a11y-combobox", v);
+class w extends h {
+  constructor() {
+    super(...arguments), this._checked = !1, this._button = null, this._label = null, this.handleClick = () => {
+      this.toggle();
+    }, this.handleKeyDown = (t) => {
+      this.disabled || (t.key === " " || t.key === "Enter") && (t.preventDefault(), this.toggle());
+    }, this.handleLabelClick = () => {
+      var t;
+      this.disabled || (this.toggle(), (t = this._button) == null || t.focus());
+    };
+  }
+  static get observedAttributes() {
+    return ["checked", "disabled", "label", "size", "aria-label"];
+  }
+  /**
+   * Get/set the checked state
+   */
+  get checked() {
+    return this._checked;
+  }
+  set checked(t) {
+    const e = this._checked;
+    this._checked = t, this.toggleAttribute("checked", t), t !== e && (this.updateVisualState(), this.emit("change", { checked: t }));
+  }
+  /**
+   * Get/set the disabled state
+   */
+  get disabled() {
+    return this.hasAttribute("disabled");
+  }
+  set disabled(t) {
+    this.toggleAttribute("disabled", t), this.updateDisabledState();
+  }
+  /**
+   * Get/set the visible label
+   */
+  get label() {
+    return this.getAttribute("label") || "";
+  }
+  set label(t) {
+    t ? this.setAttribute("label", t) : this.removeAttribute("label");
+  }
+  /**
+   * Get/set the size variant
+   */
+  get size() {
+    const t = this.getAttribute("size");
+    return t === "sm" || t === "lg" ? t : "md";
+  }
+  set size(t) {
+    this.setAttribute("size", t);
+  }
+  setupAccessibility() {
+    var t;
+    this.getAttribute("role"), typeof process < "u" && ((t = process.env) == null ? void 0 : t.NODE_ENV) !== "production" && !this.label && !this.getAttribute("aria-label") && console.warn(
+      `[compa11y/Switch] Switch has no accessible label. Add label="..." or aria-label="..." attribute.
+💡 Suggestion: <a11y-switch label="Enable feature"></a11y-switch>`
+    );
+  }
+  render() {
+    const t = this.attachShadow({ mode: "open" }), e = `${this._id}-label`, i = !!this.label, s = this.getAttribute("aria-label"), o = i ? "" : s ? `aria-label="${s}"` : "", a = i ? `aria-labelledby="${e}"` : "";
+    t.innerHTML = `
+      <style>${U}</style>
+      <div class="switch-wrapper size-${this.size}" part="wrapper">
+        <button
+          type="button"
+          role="switch"
+          aria-checked="${this._checked}"
+          ${o}
+          ${a}
+          ${this.disabled ? "disabled" : ""}
+          class="switch-track ${this._checked ? "checked" : ""}"
+          part="track"
+          tabindex="${this.disabled ? "-1" : "0"}"
+        >
+          <span class="switch-thumb" part="thumb" aria-hidden="true"></span>
+        </button>
+        ${i ? `<label id="${e}" class="switch-label ${this.disabled ? "disabled" : ""}" part="label">${this.label}</label>` : ""}
+      </div>
+    `, this._button = t.querySelector("button"), this._label = t.querySelector("label");
+  }
+  setupEventListeners() {
+    var t, e, i;
+    (t = this._button) == null || t.addEventListener("click", this.handleClick), (e = this._button) == null || e.addEventListener("keydown", this.handleKeyDown), (i = this._label) == null || i.addEventListener("click", this.handleLabelClick);
+  }
+  cleanupEventListeners() {
+    var t, e, i;
+    (t = this._button) == null || t.removeEventListener("click", this.handleClick), (e = this._button) == null || e.removeEventListener("keydown", this.handleKeyDown), (i = this._label) == null || i.removeEventListener("click", this.handleLabelClick);
+  }
+  onAttributeChange(t, e, i) {
+    switch (t) {
+      case "checked":
+        this._checked = i !== null, this.updateVisualState();
+        break;
+      case "disabled":
+        this.updateDisabledState();
+        break;
+      case "label":
+      case "aria-label":
+        this.shadowRoot && (this.shadowRoot.innerHTML = "", this.render(), this.setupEventListeners());
+        break;
+      case "size":
+        this.updateSizeClass();
+        break;
+    }
+  }
+  /**
+   * Update the visual state (checked class and aria-checked)
+   */
+  updateVisualState() {
+    this._button && (this._button.setAttribute("aria-checked", String(this._checked)), this._button.classList.toggle("checked", this._checked));
+  }
+  /**
+   * Update the disabled state
+   */
+  updateDisabledState() {
+    this._button && (this.disabled ? (this._button.setAttribute("disabled", ""), this._button.setAttribute("tabindex", "-1")) : (this._button.removeAttribute("disabled"), this._button.setAttribute("tabindex", "0"))), this._label && this._label.classList.toggle("disabled", this.disabled);
+  }
+  /**
+   * Update the size class
+   */
+  updateSizeClass() {
+    var e;
+    const t = (e = this.shadowRoot) == null ? void 0 : e.querySelector(".switch-wrapper");
+    t && (t.classList.remove("size-sm", "size-md", "size-lg"), t.classList.add(`size-${this.size}`));
+  }
+  /**
+   * Public method to toggle the switch programmatically
+   */
+  toggle() {
+    if (this.disabled) return;
+    this.checked = !this.checked;
+    const t = this.label || this.getAttribute("aria-label") || "Switch";
+    g(`${t} ${this.checked ? "on" : "off"}`);
+  }
+  /**
+   * Public method to open/close programmatically
+   */
+  setChecked(t) {
+    this.checked = t;
+  }
+}
+d("a11y-switch", w);
+if (typeof window < "u") {
+  const n = () => {
+    b(), p();
+  };
+  document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", n) : n(), window.compa11y = {
+    // Components (classes)
+    A11yDialog: y,
+    A11yMenu: _,
+    A11yTabs: x,
+    A11yCombobox: v,
+    A11ySwitch: w,
+    // Announcer utilities
+    initAnnouncer: b,
+    announce: r,
+    announcePolite: g,
+    announceAssertive: V,
+    announceStatus: H,
+    announceError: R,
+    // Focus utilities
+    initFocusVisible: p,
+    createFocusTrap: M,
+    createFocusScope: q,
+    createRovingTabindex: z,
+    // Keyboard utilities
+    createKeyboardManager: O,
+    KeyboardPatterns: D,
+    createTypeAhead: T,
+    // ARIA utilities
+    aria: $,
+    buildAriaProps: C,
+    hasAccessibleName: S,
+    // Platform detection
+    isBrowser: L,
+    prefersReducedMotion: I,
+    prefersHighContrast: A,
+    prefersDarkMode: k
+  };
+}
+export {
+  v as A11yCombobox,
+  y as A11yDialog,
+  _ as A11yMenu,
+  w as A11ySwitch,
+  x as A11yTabs,
+  G as KeyboardPatterns,
+  W as announce,
+  J as announceAssertive,
+  Q as announceError,
+  Z as announcePolite,
+  tt as announceStatus,
+  et as aria,
+  it as buildAriaProps,
+  st as createFocusScope,
+  ot as createFocusTrap,
+  at as createKeyboardManager,
+  nt as createRovingTabindex,
+  lt as createTypeAhead,
+  rt as hasAccessibleName,
+  ht as initAnnouncer,
+  dt as initFocusVisible,
+  ct as isBrowser,
+  ut as prefersDarkMode,
+  pt as prefersHighContrast,
+  bt as prefersReducedMotion
+};
+//# sourceMappingURL=compa11y.js.map