@allxsmith/bestax-bulma 5.29.0 → 5.31.0

package/dist/esm/helpers/useMenuKeys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuKeys.js","sources":["../../../src/helpers/useMenuKeys.ts"],"sourcesContent":["// INTERNAL: deliberately not exported from src/index.ts.\nimport { useEffect, useMemo, useRef } from 'react';\nimport type { KeyboardEvent } from 'react';\nimport { getActiveElementInTree } from './shadowDom';\n\n/**\n * Every menu-item role, so an item a caller gives `menuitemcheckbox` or\n * `menuitemradio` (a filter or sort menu) stays reachable.\n */\nexport const MENU_ITEM_SELECTOR =\n  '[role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"]';\n\n/**\n * Whether a menu item can be reached and activated: it isn't disabled, as a\n * native control or through `aria-disabled=\"true\"`.\n */\nexport function isEnabledMenuItem(item: Element): boolean {\n  return (\n    !item.hasAttribute('disabled') &&\n    item.getAttribute('aria-disabled') !== 'true'\n  );\n}\n\n/** Whether `node` is one of `menu`'s items, enabled or not. */\nconst isItemOf = (menu: Element, node: Element | null): boolean =>\n  Boolean(node && menu.contains(node) && node.matches(MENU_ITEM_SELECTOR));\n\n/** The items in `menu` the keys reach, in document order. */\nexport function enabledMenuItems(menu: Element): HTMLElement[] {\n  return Array.from(\n    menu.querySelectorAll<HTMLElement>(MENU_ITEM_SELECTOR)\n  ).filter(isEnabledMenuItem);\n}\n\n/** How long typed characters keep adding up to one search, in milliseconds. */\nexport const TYPEAHEAD_TIMEOUT = 500;\n\n/**\n * Whether the browser activates `item` on this key by itself: a `<button>`\n * answers Enter and Space, and a link with an `href` answers Enter.\n */\nfunction activatesItself(item: HTMLElement, key: string): boolean {\n  if (item.tagName === 'BUTTON') return true;\n  return key === 'Enter' && item.tagName === 'A' && item.hasAttribute('href');\n}\n\n/**\n * The text typing finds an item by: what it says, without what's hidden from\n * assistive technology, such as an icon whose glyph is a ligature's name.\n */\nfunction label(item: Element): string {\n  let text = '';\n  const read = (node: Node) => {\n    node.childNodes.forEach(child => {\n      if (child.nodeType === 3) text += child.textContent;\n      else if (\n        child.nodeType === 1 &&\n        (child as Element).getAttribute('aria-hidden') !== 'true'\n      ) {\n        read(child);\n      }\n    });\n  };\n  read(item);\n  return text.trim().toLowerCase();\n}\n\n/**\n * The item typing `search` moves to, or none. A single character looks from\n * the item after the focused one, so typing the same letter again cycles\n * through the items that start with it, and so does a run of one letter\n * (\"dd\"). A longer search looks from the focused item, so typing more of\n * its own text keeps it.\n */\nfunction typeaheadMatch(\n  items: HTMLElement[],\n  search: string,\n  current: number\n): HTMLElement | undefined {\n  const repeated = Array.from(search).every(char => char === search[0]);\n  const wanted = repeated ? search[0] : search;\n  const start = current < 0 ? 0 : current + (wanted.length === 1 ? 1 : 0);\n  for (let i = 0; i < items.length; i += 1) {\n    const item = items[(start + i) % items.length];\n    if (label(item).startsWith(wanted)) return item;\n  }\n  return undefined;\n}\n\n/** What `useMenuKeys` returns. */\nexport interface MenuKeys {\n  /** The `keydown` handler for the `role=\"menu\"` element. */\n  onKeyDown: (event: KeyboardEvent<HTMLElement>) => void;\n  /**\n   * Forgets what has been typed, so the next character starts a new search.\n   * Call it when the menu opens, so a search typed just before it last\n   * closed doesn't carry over.\n   */\n  reset: () => void;\n}\n\n/**\n * Moves through and activates the items of a `role=\"menu\"` element from the\n * keyboard. Put the `onKeyDown` it returns on that element. It reads the\n * items from the element each time, so items that come and go are found,\n * and it renders nothing.\n *\n * It acts only while focus is on the menu element itself or on one of its\n * items, so anything else focusable inside the menu, such as a filter\n * field, keeps its own keys.\n *\n * - Down and Up move to the next and previous enabled item, wrapping, and\n *   Home and End go to the first and last. From no item, Down goes to the\n *   first and Up to the last.\n * - Enter and Space activate the focused item. A `<button>`, and a link with\n *   an `href` for Enter, get the browser's own click, and anything else gets\n *   one from here, so its `onClick` runs either way. A key held down\n *   activates it once. A key handler on the item that called\n *   `preventDefault()` has claimed the key, and nothing else runs it.\n * - A printable character moves to the next enabled item whose text starts\n *   with what has been typed. Characters typed within `TYPEAHEAD_TIMEOUT` of\n *   each other add up to one search, until `reset` starts a new one.\n *\n * Items are `MENU_ITEM_SELECTOR` matches, and disabled ones are skipped by\n * all of the above. Escape and Tab are left to the menu's owner, since what\n * closing means is up to it, and so is any other key.\n *\n * @function useMenuKeys\n * @returns The `keydown` handler for the menu element, and a way to forget\n * what has been typed.\n */\nexport function useMenuKeys(): MenuKeys {\n  const typedRef = useRef<{\n    text: string;\n    timer?: ReturnType<typeof setTimeout>;\n  }>({ text: '' });\n\n  useEffect(() => {\n    const typed = typedRef.current;\n    return () => clearTimeout(typed.timer);\n  }, []);\n\n  return useMemo<MenuKeys>(() => {\n    const reset = () => {\n      const typed = typedRef.current;\n      clearTimeout(typed.timer);\n      typed.text = '';\n    };\n    const onKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n      const menu = event.currentTarget;\n      const focused = getActiveElementInTree(menu);\n      if (focused !== menu && !isItemOf(menu, focused)) return;\n      const items = enabledMenuItems(menu);\n      if (!items.length) return;\n      const current = items.indexOf(focused as HTMLElement);\n      switch (event.key) {\n        case 'ArrowDown':\n          event.preventDefault();\n          items[current >= 0 ? (current + 1) % items.length : 0].focus();\n          return;\n        case 'ArrowUp':\n          event.preventDefault();\n          items[\n            current >= 0\n              ? (current - 1 + items.length) % items.length\n              : items.length - 1\n          ].focus();\n          return;\n        case 'Home':\n          event.preventDefault();\n          items[0].focus();\n          return;\n        case 'End':\n          event.preventDefault();\n          items[items.length - 1].focus();\n          return;\n        case 'Enter':\n        case ' ': {\n          if (current < 0 || event.defaultPrevented) return;\n          const item = items[current];\n          if (activatesItself(item, event.key)) {\n            // The browser clicks on Enter's keydown, and a held key sends one\n            // per auto-repeat. Space clicks on keyup, once however long it's\n            // held.\n            if (event.repeat && event.key === 'Enter') event.preventDefault();\n            return;\n          }\n          // Space would scroll the page, and a held key repeats.\n          event.preventDefault();\n          if (!event.repeat) item.click();\n          return;\n        }\n        default:\n          break;\n      }\n\n      if (\n        event.key.length !== 1 ||\n        event.ctrlKey ||\n        event.metaKey ||\n        event.altKey ||\n        event.defaultPrevented\n      ) {\n        return;\n      }\n      event.preventDefault();\n      const typed = typedRef.current;\n      typed.text += event.key.toLowerCase();\n      clearTimeout(typed.timer);\n      typed.timer = setTimeout(reset, TYPEAHEAD_TIMEOUT);\n      typeaheadMatch(items, typed.text, current)?.focus();\n    };\n    return { onKeyDown, reset };\n  }, []);\n}\n"],"names":[],"mappings":"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"}