@atlaskit/top-layer 6.2.0 → 6.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/use-arrow-navigation/use-arrow-navigation.js +2 -4
  3. package/dist/es2019/use-arrow-navigation/use-arrow-navigation.js +2 -4
  4. package/dist/esm/use-arrow-navigation/use-arrow-navigation.js +2 -4
  5. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/top-layer
2
2
 
3
+ ## 6.2.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`26ee4b1f57a30`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/26ee4b1f57a30) -
8
+ Fix nested-menu detection and read arrow-navigation focus from the container's document.
9
+
3
10
  ## 6.2.0
4
11
 
5
12
  ### Minor Changes
package/dist/cjs/use-arrow-navigation/use-arrow-navigation.js CHANGED
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useArrowNavigation = useArrowNavigation;
7
7
  var _react = require("react");
8
8
  var _bindEventListener = require("bind-event-listener");
9
- var _browserApis = require("@atlaskit/browser-apis");
10
9
  var _keycodes = require("@atlaskit/ds-lib/keycodes");
11
10
  var _getFirstFocusable2 = require("../focus/get-first-focusable");
12
11
  var _getLastFocusable2 = require("../focus/get-last-focusable");
@@ -73,7 +72,6 @@ function useArrowNavigation(_ref) {
73
72
  isEnabled = _ref$isEnabled === void 0 ? true : _ref$isEnabled,
74
73
  filter = _ref.filter;
75
74
  var handleKeyDown = (0, _react.useCallback)(function (event) {
76
- var _getDocument;
77
75
  var container = containerRef.current;
78
76
  if (!container) {
79
77
  return;
@@ -84,7 +82,7 @@ function useArrowNavigation(_ref) {
84
82
  // [role="menu"] must be this container (not a nested sub-menu).
85
83
  // When no filter is provided, fall back to the closest-menu check
86
84
  // if the container has role="menu".
87
- var focused = (_getDocument = (0, _browserApis.getDocument)()) === null || _getDocument === void 0 ? void 0 : _getDocument.activeElement;
85
+ var focused = container.ownerDocument.activeElement;
88
86
  if (focused instanceof HTMLElement) {
89
87
  if (filter) {
90
88
  if (!filter(focused, container)) {
@@ -161,7 +159,7 @@ function useArrowNavigation(_ref) {
161
159
  // Only close if this container is inside another role="menu"
162
160
  // (i.e. it is a submenu, not the top-level menu).
163
161
  // Walk up from the parent to avoid matching the container itself.
164
- var isNested = ((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope)) !== null;
162
+ var isNested = Boolean((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope));
165
163
  if (isNested) {
166
164
  event.preventDefault();
167
165
  onNestedClose();
package/dist/es2019/use-arrow-navigation/use-arrow-navigation.js CHANGED
@@ -1,6 +1,5 @@
1
1
  import { useCallback, useEffect } from 'react';
2
2
  import { bind } from 'bind-event-listener';
3
- import { getDocument } from '@atlaskit/browser-apis';
4
3
  import { KEY_DOWN, KEY_END, KEY_HOME, KEY_TAB, KEY_UP } from '@atlaskit/ds-lib/keycodes';
5
4
  import { getFirstFocusable } from '../focus/get-first-focusable';
6
5
  import { getLastFocusable } from '../focus/get-last-focusable';
@@ -67,7 +66,6 @@ export function useArrowNavigation({
67
66
  filter
68
67
  }) {
69
68
  const handleKeyDown = useCallback(event => {
70
- var _getDocument;
71
69
  const container = containerRef.current;
72
70
  if (!container) {
73
71
  return;
@@ -78,7 +76,7 @@ export function useArrowNavigation({
78
76
  // [role="menu"] must be this container (not a nested sub-menu).
79
77
  // When no filter is provided, fall back to the closest-menu check
80
78
  // if the container has role="menu".
81
- const focused = (_getDocument = getDocument()) === null || _getDocument === void 0 ? void 0 : _getDocument.activeElement;
79
+ const focused = container.ownerDocument.activeElement;
82
80
  if (focused instanceof HTMLElement) {
83
81
  if (filter) {
84
82
  if (!filter(focused, container)) {
@@ -155,7 +153,7 @@ export function useArrowNavigation({
155
153
  // Only close if this container is inside another role="menu"
156
154
  // (i.e. it is a submenu, not the top-level menu).
157
155
  // Walk up from the parent to avoid matching the container itself.
158
- const isNested = ((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope)) !== null;
156
+ const isNested = Boolean((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope));
159
157
  if (isNested) {
160
158
  event.preventDefault();
161
159
  onNestedClose();
package/dist/esm/use-arrow-navigation/use-arrow-navigation.js CHANGED
@@ -1,6 +1,5 @@
1
1
  import { useCallback, useEffect } from 'react';
2
2
  import { bind } from 'bind-event-listener';
3
- import { getDocument } from '@atlaskit/browser-apis';
4
3
  import { KEY_DOWN, KEY_END, KEY_HOME, KEY_TAB, KEY_UP } from '@atlaskit/ds-lib/keycodes';
5
4
  import { getFirstFocusable } from '../focus/get-first-focusable';
6
5
  import { getLastFocusable } from '../focus/get-last-focusable';
@@ -67,7 +66,6 @@ export function useArrowNavigation(_ref) {
67
66
  isEnabled = _ref$isEnabled === void 0 ? true : _ref$isEnabled,
68
67
  filter = _ref.filter;
69
68
  var handleKeyDown = useCallback(function (event) {
70
- var _getDocument;
71
69
  var container = containerRef.current;
72
70
  if (!container) {
73
71
  return;
@@ -78,7 +76,7 @@ export function useArrowNavigation(_ref) {
78
76
  // [role="menu"] must be this container (not a nested sub-menu).
79
77
  // When no filter is provided, fall back to the closest-menu check
80
78
  // if the container has role="menu".
81
- var focused = (_getDocument = getDocument()) === null || _getDocument === void 0 ? void 0 : _getDocument.activeElement;
79
+ var focused = container.ownerDocument.activeElement;
82
80
  if (focused instanceof HTMLElement) {
83
81
  if (filter) {
84
82
  if (!filter(focused, container)) {
@@ -155,7 +153,7 @@ export function useArrowNavigation(_ref) {
155
153
  // Only close if this container is inside another role="menu"
156
154
  // (i.e. it is a submenu, not the top-level menu).
157
155
  // Walk up from the parent to avoid matching the container itself.
158
- var isNested = ((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope)) !== null;
156
+ var isNested = Boolean((_container$parentElem = container.parentElement) === null || _container$parentElem === void 0 ? void 0 : _container$parentElem.closest(menuScope));
159
157
  if (isNested) {
160
158
  event.preventDefault();
161
159
  onNestedClose();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/top-layer",
3
- "version": "6.2.0",
3
+ "version": "6.2.1",
4
4
  "description": "Low-level layering primitives based on popover and dialog",
5
5
  "homepage": "https://atlassian.design/components/top-layer",
6
6
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",