@universal-material/web 3.0.118 → 3.0.120

package/shared/menu-field/menu-field-navigation-controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-field-navigation-controller.js","sourceRoot":"","sources":["../../../src/shared/menu-field/menu-field-navigation-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import { UmMenuItem } from '../../menu/menu-item.js';\nimport { UmMenuField } from './menu-field.js';\n\nexport class MenuFieldNavigationController<TField extends UmMenuField, TMenuItem extends UmMenuItem> {\n  #element: HTMLElement | null = null;\n  protected focusedMenu: TMenuItem | null = null;\n  protected readonly host: TField;\n\n  private readonly bindHandleKeyDown: (event: KeyboardEvent) => void;\n\n  constructor(host: TField) {\n    this.host = host;\n    this.bindHandleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  attach(element: HTMLElement) {\n    this.detach();\n\n    element?.addEventListener('keydown', this.bindHandleKeyDown, { capture: true });\n    this.host._menu?.addEventListener('close', this.#handleMenuClose);\n    this.#element = element;\n  }\n\n  detach() {\n    this.#element?.removeEventListener('keydown', this.bindHandleKeyDown);\n    this.host._menu?.removeEventListener('close', this.#handleMenuClose);\n    this.#element = null;\n  }\n\n  #handleMenuClose = () => this.blurMenu();\n\n  protected handleKeyDown(event: KeyboardEvent): boolean {\n    if (this.host._menu?.open !== true) {\n      return false;\n    }\n\n    const isEscape = event.key === 'Escape';\n\n    if (isEscape) {\n      this.host._menu.close();\n    }\n\n    if (event.key === 'Home') {\n      this.navigateTo(event, <TMenuItem>this.host._menuItems[0]);\n      return true;\n    }\n\n    if (event.key === 'End') {\n      this.navigateTo(event, <TMenuItem>this.host._menuItems[this.host._menuItems.length - 1]);\n      return true;\n    }\n\n    const isDown = event.key === 'ArrowDown';\n    const isUp = event.key === 'ArrowUp';\n\n    if (isDown || isUp) {\n      this.navigate(event, isDown);\n      return true;\n    }\n\n    const isEnter = event.key === 'Enter';\n    const isTab = event.key === 'Tab';\n\n    if (isEnter || isTab) {\n      this.selectActiveItem(event);\n      return true;\n    }\n\n    return false;\n  }\n\n  private navigate(event: KeyboardEvent, forwards: boolean) {\n    const menuItems = this.host._menuItems;\n\n    if (!menuItems.length) {\n      return;\n    }\n\n    event.preventDefault();\n\n    const activeMenu = this.focusedMenu;\n\n    const nextMenu = forwards\n      ? <TMenuItem>activeMenu?.nextElementSibling ?? menuItems[0]\n      : <TMenuItem>activeMenu?.previousElementSibling ?? menuItems[menuItems.length - 1];\n\n    if (!nextMenu) {\n      return;\n    }\n\n    this.navigateTo(event, nextMenu);\n  }\n\n  protected navigateTo(event: KeyboardEvent, menu: TMenuItem | undefined) {\n    event.preventDefault();\n\n    this.blurMenu();\n\n    if (!menu) {\n      return;\n    }\n\n    this.focusMenu(menu);\n  }\n\n  focusMenu(menu: TMenuItem, active = true, scroll = true) {\n    this.focusedMenu = menu;\n    menu.active = active;\n\n    if (scroll) {\n      menu.scrollIntoView({ block: 'nearest' });\n    }\n\n    this.afterFocus(menu);\n  }\n\n  blurMenu() {\n    if (!this.focusedMenu) {\n      return;\n    }\n\n    this.focusedMenu.active = false;\n    this.focusedMenu = null;\n    this.afterBlur();\n  }\n\n  private selectActiveItem(event: KeyboardEvent) {\n    if (!this.focusedMenu) {\n      return;\n    }\n\n    event.preventDefault();\n    this.focusedMenu.click();\n  }\n\n  protected afterFocus(_: TMenuItem) {}\n\n  protected afterBlur() {}\n}\n"]}
+{"version":3,"file":"menu-field-navigation-controller.js","sourceRoot":"","sources":["../../../src/shared/menu-field/menu-field-navigation-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import { UmMenuItem } from '../../menu/menu-item.js';\nimport { UmMenuField } from './menu-field.js';\n\nexport class MenuFieldNavigationController<TField extends UmMenuField, TMenuItem extends UmMenuItem> {\n  #element: HTMLElement | null = null;\n  protected focusedMenu: TMenuItem | null = null;\n  protected readonly host: TField;\n\n  private readonly bindHandleKeyDown: (event: KeyboardEvent) => void;\n\n  constructor(host: TField) {\n    this.host = host;\n    this.bindHandleKeyDown = this.handleKeyDown.bind(this);\n  }\n\n  attach(element: HTMLElement) {\n    this.detach();\n\n    element?.addEventListener('keydown', this.bindHandleKeyDown, { capture: true });\n    this.host._menu?.addEventListener('close', this.#handleMenuClose);\n    this.#element = element;\n  }\n\n  detach() {\n    this.#element?.removeEventListener('keydown', this.bindHandleKeyDown);\n    this.host._menu?.removeEventListener('close', this.#handleMenuClose);\n    this.#element = null;\n  }\n\n  #handleMenuClose = () => this.blurMenu();\n\n  protected handleKeyDown(event: KeyboardEvent): boolean {\n    if (this.host._menu?.open !== true) {\n      return false;\n    }\n\n    const isEscape = event.key === 'Escape';\n\n    if (isEscape) {\n      this.host._menu.close();\n    }\n\n    if (event.key === 'Home') {\n      this.navigateTo(event, <TMenuItem>this.host._menuItems[0], 0);\n      return true;\n    }\n\n    if (event.key === 'End') {\n      this.navigateTo(\n        event,\n        <TMenuItem>this.host._menuItems[this.host._menuItems.length - 1],\n        this.host._menuItems.length - 1,\n      );\n      return true;\n    }\n\n    const isDown = event.key === 'ArrowDown';\n    const isUp = event.key === 'ArrowUp';\n\n    if (isDown || isUp) {\n      this.navigate(event, isDown);\n      return true;\n    }\n\n    const isEnter = event.key === 'Enter';\n    const isTab = event.key === 'Tab';\n\n    if (isEnter || isTab) {\n      this.selectActiveItem(event);\n      return true;\n    }\n\n    return false;\n  }\n\n  private navigate(event: KeyboardEvent, forwards: boolean) {\n    const menuItems = this.host._menuItems;\n\n    if (!menuItems.length) {\n      return;\n    }\n\n    event.preventDefault();\n\n    const activeMenu = this.focusedMenu;\n\n    const activeMenuIndex = menuItems.indexOf(<TMenuItem>activeMenu);\n\n    const nextMenu = forwards\n      ? <TMenuItem>menuItems[activeMenuIndex + 1] ?? menuItems[0]\n      : <TMenuItem>menuItems[activeMenuIndex - 1] ?? menuItems[menuItems.length - 1];\n\n    if (!nextMenu) {\n      return;\n    }\n\n    this.navigateTo(event, nextMenu, menuItems.indexOf(<TMenuItem>nextMenu));\n  }\n\n  protected navigateTo(event: KeyboardEvent, menu: TMenuItem | undefined, index: number) {\n    event.preventDefault();\n\n    this.blurMenu();\n\n    if (!menu) {\n      return;\n    }\n\n    this.focusMenu(menu, index);\n  }\n\n  focusMenu(menu: TMenuItem, index: number, active = true, scroll = true) {\n    this.focusedMenu = menu;\n    menu.active = active;\n\n    if (scroll) {\n      menu.scrollIntoView({ block: 'nearest' });\n    }\n\n    this.afterFocus(menu, index);\n  }\n\n  blurMenu() {\n    if (!this.focusedMenu) {\n      return;\n    }\n\n    this.focusedMenu.active = false;\n    this.focusedMenu = null;\n    this.afterBlur();\n  }\n\n  private selectActiveItem(event: KeyboardEvent) {\n    if (!this.focusedMenu) {\n      return;\n    }\n\n    event.preventDefault();\n    this.focusedMenu.click();\n  }\n\n  protected afterFocus(_: TMenuItem, __: number) {}\n\n  protected afterBlur() {}\n}\n"]}