dap-design-system/dist/internal/keyboard-navigation.js

Official design system for the DÁP (dap.gov.hu)

var h = Object.defineProperty, l = Object.defineProperties;
var f = Object.getOwnPropertyDescriptors;
var u = Object.getOwnPropertySymbols;
var I = Object.prototype.hasOwnProperty, m = Object.prototype.propertyIsEnumerable;
var o = (s, t, e) => t in s ? h(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e, r = (s, t) => {
  for (var e in t || (t = {}))
    I.call(t, e) && o(s, e, t[e]);
  if (u)
    for (var e of u(t))
      m.call(t, e) && o(s, e, t[e]);
  return s;
}, d = (s, t) => l(s, f(t));
class _ {
  constructor(t, e) {
    this._cachedItems = null, this._cacheInvalidated = !0, this._focusedItem = null, this._focusedIndex = -1, this._container = t, this._options = e;
  }
  invalidateCache() {
    this._cachedItems = null, this._cacheInvalidated = !0;
  }
  getEnabledItems() {
    return (this._cacheInvalidated || !this._cachedItems) && (this._cachedItems = this._container.querySelectorAll(
      this._options.enabledSelector
    ), this._cacheInvalidated = !1), Array.from(this._cachedItems);
  }
  setFocusedItem(t) {
    var i, c;
    const e = this.getEnabledItems();
    this._focusedItem && (this._focusedItem.setAttribute("tabindex", "-1"), this._focusedItem.setAttribute("aria-selected", "false")), t < 0 ? t = e.length - 1 : t >= e.length && (t = 0), this._focusedIndex = t, this._focusedItem = e[t], this._focusedItem && (this._focusedItem.setAttribute("tabindex", "0"), this._focusedItem.setAttribute("aria-selected", "true"), this._focusedItem.focus(), (c = (i = this._options).onSelectionChange) == null || c.call(
      i,
      this._focusedItem,
      t + 1,
      e.length
    ));
  }
  initializeFocus(t) {
    const e = this.getEnabledItems();
    e.forEach((c) => {
      const n = c;
      n.setAttribute("tabindex", "-1"), n.setAttribute("role", "menuitem"), n.setAttribute("aria-selected", "false");
    });
    let i = 0;
    if (t) {
      const c = e.indexOf(t);
      c !== -1 && (i = c);
    }
    e.length > 0 && this.setFocusedItem(i);
  }
  handleKeyDown(t) {
    var e, i;
    switch (t.key) {
      case "ArrowDown":
        return t.preventDefault(), this.setFocusedItem(this._focusedIndex + 1), !0;
      case "ArrowUp":
        return t.preventDefault(), this.setFocusedItem(this._focusedIndex - 1), !0;
      case "Tab":
        return t.preventDefault(), t.shiftKey ? this.setFocusedItem(this._focusedIndex - 1) : this.setFocusedItem(this._focusedIndex + 1), !0;
      case "Home":
        return t.preventDefault(), this.setFocusedItem(0), !0;
      case "End":
        return t.preventDefault(), this.setFocusedItem(this.getEnabledItems().length - 1), !0;
      case "Enter":
      case " ":
        return t.preventDefault(), this._focusedItem && (this._focusedItem.click(), (i = (e = this._options).onItemClick) == null || i.call(e, this._focusedItem)), !0;
      default:
        return !1;
    }
  }
  reset() {
    this._focusedItem = null, this._focusedIndex = -1;
  }
  get focusedItem() {
    return this._focusedItem;
  }
  get focusedIndex() {
    return this._focusedIndex;
  }
}
function b(s, t) {
  let e = s.querySelector("[aria-live]");
  e || (e = document.createElement("div"), e.setAttribute("aria-live", "polite"), e.setAttribute("aria-atomic", "true"), e.style.position = "absolute", e.style.left = "-10000px", e.style.width = "1px", e.style.height = "1px", e.style.overflow = "hidden", s.appendChild(e)), e.textContent = t;
}
function g(s, t, e, i) {
  var a;
  const n = `${((a = t.textContent) == null ? void 0 : a.trim()) || ""}, ${e} of ${i}`;
  b(s, n);
}
function y(s, t) {
  const e = new _(s, d(r({}, t), {
    onSelectionChange: (i, c, n) => {
      var a;
      g(s, i, c, n), (a = t.onSelectionChange) == null || a.call(t, i, c, n);
    }
  }));
  return {
    manager: e,
    handleKeyDown: (i) => e.handleKeyDown(i),
    invalidateCache: () => e.invalidateCache(),
    initializeFocus: (i) => e.initializeFocus(i),
    reset: () => e.reset()
  };
}
export {
  _ as KeyboardNavigationManager,
  g as announceSelection,
  y as createKeyboardNavigationHandler,
  b as createOrUpdateLiveRegion
};
//# sourceMappingURL=keyboard-navigation.js.map