diff --git a/src/components/context_menu/context_menu_panel.tsx b/src/components/context_menu/context_menu_panel.tsx index 8cacaff10b1..1e6602b2c2c 100644 --- a/src/components/context_menu/context_menu_panel.tsx +++ b/src/components/context_menu/context_menu_panel.tsx @@ -19,7 +19,7 @@ import { tabbable, FocusableElement } from 'tabbable'; import { CommonProps, NoArgCallback, keysOf } from '../common'; import { EuiIcon } from '../icon'; import { EuiResizeObserver } from '../observer/resize_observer'; -import { cascadingMenuKeys } from '../../services'; +import { keys } from '../../services'; import { EuiContextMenuItem, EuiContextMenuItemProps, @@ -164,7 +164,7 @@ export class EuiContextMenuPanel extends Component { document.activeElement === this.backButton || document.activeElement === this.panel) ) { - if (event.key === cascadingMenuKeys.ARROW_LEFT) { + if (event.key === keys.ARROW_LEFT) { if (showPreviousPanel) { event.preventDefault(); event.stopPropagation(); @@ -179,7 +179,7 @@ export class EuiContextMenuPanel extends Component { if (items?.length) { switch (event.key) { - case cascadingMenuKeys.TAB: + case keys.TAB: requestAnimationFrame(() => { // NOTE: document.activeElement is stale if not wrapped in requestAnimationFrame const focusedItemIndex = this.state.menuItems.indexOf( @@ -197,7 +197,7 @@ export class EuiContextMenuPanel extends Component { }); break; - case cascadingMenuKeys.ARROW_UP: + case keys.ARROW_UP: event.preventDefault(); this.focusMenuItem('up'); @@ -206,7 +206,7 @@ export class EuiContextMenuPanel extends Component { } break; - case cascadingMenuKeys.ARROW_DOWN: + case keys.ARROW_DOWN: event.preventDefault(); this.focusMenuItem('down'); @@ -215,7 +215,7 @@ export class EuiContextMenuPanel extends Component { } break; - case cascadingMenuKeys.ARROW_RIGHT: + case keys.ARROW_RIGHT: if (this.props.showNextPanel) { event.preventDefault(); this.props.showNextPanel( diff --git a/src/components/popover/popover.tsx b/src/components/popover/popover.tsx index 0c8b797f79b..d8366f4a6e5 100644 --- a/src/components/popover/popover.tsx +++ b/src/components/popover/popover.tsx @@ -23,7 +23,7 @@ import { CommonProps, NoArgCallback } from '../common'; import { FocusTarget, EuiFocusTrap, EuiFocusTrapProps } from '../focus_trap'; import { - cascadingMenuKeys, + keys, getTransitionTimings, getWaitDuration, performOnFrame, @@ -383,7 +383,7 @@ export class EuiPopover extends Component { }; onKeyDown = (event: KeyboardEvent) => { - if (event.key === cascadingMenuKeys.ESCAPE) { + if (event.key === keys.ESCAPE) { this.onEscapeKey(event as unknown as Event); } }; diff --git a/src/services/accessibility/accessible_click_keys.ts b/src/services/accessibility/accessible_click_keys.ts deleted file mode 100644 index 77b7864e0a1..00000000000 --- a/src/services/accessibility/accessible_click_keys.ts +++ /dev/null @@ -1,15 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -import { ENTER, SPACE } from '../keys'; - -// These keys are used to execute click actions on interactive elements like buttons and links. -export const accessibleClickKeys = { - [ENTER]: 'enter', - [SPACE]: 'space', -}; diff --git a/src/services/accessibility/cascading_menu_keys.ts b/src/services/accessibility/cascading_menu_keys.ts deleted file mode 100644 index 92009245223..00000000000 --- a/src/services/accessibility/cascading_menu_keys.ts +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -/** - * These keys are used for navigating cascading menu UI components. - * - * ARROW_DOWN: Select the next item in the list. - * ARROW_LEFT: Show the previous menu. - * ARROW_RIGHT: Show the next menu for the selected item. - * ARROW_UP: Select the previous item in the list. - * ESC: Deselect the current selection and hide the list. - * TAB: Normal tabbing navigation is still supported. - */ - -import { - ARROW_DOWN, - ARROW_LEFT, - ARROW_RIGHT, - ARROW_UP, - ESCAPE, - TAB, -} from '../keys'; - -export const cascadingMenuKeys = { - ARROW_DOWN, - ARROW_LEFT, - ARROW_RIGHT, - ARROW_UP, - ESCAPE, - TAB, -}; diff --git a/src/services/accessibility/combo_box_keys.ts b/src/services/accessibility/combo_box_keys.ts deleted file mode 100644 index f638a645c95..00000000000 --- a/src/services/accessibility/combo_box_keys.ts +++ /dev/null @@ -1,26 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License - * 2.0 and the Server Side Public License, v 1; you may not use this file except - * in compliance with, at your election, the Elastic License 2.0 or the Server - * Side Public License, v 1. - */ - -/** - * These keys are used for navigating combobox UI components. - * - * ARROW_UP: Select the previous item in the list. - * ARROW_DOWN: Select the next item in the list. - * ENTER / TAB: Complete input with the current selection. - * ESC: Deselect the current selection and hide the list. - */ - -import { ARROW_DOWN, ENTER, ESCAPE, TAB, ARROW_UP } from '../keys'; - -export const comboBoxKeys = { - ARROW_DOWN, - ARROW_UP, - ENTER, - ESCAPE, - TAB, -}; diff --git a/src/services/accessibility/index.ts b/src/services/accessibility/index.ts index 987a02d1a91..390682faaa9 100644 --- a/src/services/accessibility/index.ts +++ b/src/services/accessibility/index.ts @@ -6,7 +6,4 @@ * Side Public License, v 1. */ -export { accessibleClickKeys } from './accessible_click_keys'; -export { cascadingMenuKeys } from './cascading_menu_keys'; -export { comboBoxKeys } from './combo_box_keys'; export { htmlIdGenerator, useGeneratedHtmlId } from './html_id_generator'; diff --git a/src/services/index.ts b/src/services/index.ts index 99ee327b329..42594a27d86 100644 --- a/src/services/index.ts +++ b/src/services/index.ts @@ -8,13 +8,7 @@ // Export all keys under a `keys` named variable import * as keys from './keys'; -export { - accessibleClickKeys, - cascadingMenuKeys, - comboBoxKeys, - htmlIdGenerator, - useGeneratedHtmlId, -} from './accessibility'; +export { htmlIdGenerator, useGeneratedHtmlId } from './accessibility'; export { CENTER_ALIGNMENT, LEFT_ALIGNMENT, RIGHT_ALIGNMENT } from './alignment'; export type { HorizontalAlignment } from './alignment'; export { diff --git a/upcoming_changelogs/7256.md b/upcoming_changelogs/7256.md new file mode 100644 index 00000000000..3159521b9e4 --- /dev/null +++ b/upcoming_changelogs/7256.md @@ -0,0 +1,3 @@ +**Breaking changes** + +- Removed exported `accessibleClickKeys`, `comboBoxKeys`, and `cascadingMenuKeys` services. Use the generic `keys` service instead