@atlaskit/editor-common 74.56.2 → 74.56.3

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 (16) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/cjs/monitoring/error.js +1 -1
  3. package/dist/cjs/quick-insert/assets/custom-panel.js +39 -12
  4. package/dist/cjs/ui/DropList/index.js +1 -1
  5. package/dist/cjs/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +4 -1
  6. package/dist/es2019/monitoring/error.js +1 -1
  7. package/dist/es2019/quick-insert/assets/custom-panel.js +40 -11
  8. package/dist/es2019/ui/DropList/index.js +1 -1
  9. package/dist/es2019/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +7 -1
  10. package/dist/esm/monitoring/error.js +1 -1
  11. package/dist/esm/quick-insert/assets/custom-panel.js +39 -11
  12. package/dist/esm/ui/DropList/index.js +1 -1
  13. package/dist/esm/ui-menu/ToolbarArrowKeyNavigationProvider/index.js +5 -1
  14. package/dist/types/ui-menu/ToolbarArrowKeyNavigationProvider/index.d.ts +6 -5
  15. package/dist/types-ts4.5/ui-menu/ToolbarArrowKeyNavigationProvider/index.d.ts +6 -5
  16. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 74.56.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`c4754a4e96f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c4754a4e96f) - Ignore invisible element for arrow key navigation to prevent focus loss
8
+ - [`3b7bf91daa5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3b7bf91daa5) - [ux] ED-19785 Add dark mode icon for custom panel and update light mode icon with new colours.
9
+
3
10
  ## 74.56.2
4
11
 
5
12
  ### Patch Changes
package/dist/cjs/monitoring/error.js CHANGED
@@ -16,7 +16,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
16
16
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
17
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
18
18
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
19
- var packageVersion = "74.56.2";
19
+ var packageVersion = "74.56.3";
20
20
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
21
21
  // Remove URL as it has UGC
22
22
  // TODO: Sanitise the URL instead of just removing it
package/dist/cjs/quick-insert/assets/custom-panel.js CHANGED
@@ -6,10 +6,10 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.default = IconCustomPanel;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- // TODO: https://product-fabric.atlassian.net/browse/DSP-4138
10
- /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
11
-
9
+ var _useIconThemed2 = require("../use-icon-themed");
12
10
  function IconCustomPanel() {
11
+ var _useIconThemed = (0, _useIconThemed2.useIconThemed)(),
12
+ iconThemed = _useIconThemed.iconThemed;
13
13
  return /*#__PURE__*/_react.default.createElement("svg", {
14
14
  width: "40",
15
15
  height: "40",
@@ -20,36 +20,63 @@ function IconCustomPanel() {
20
20
  }, /*#__PURE__*/_react.default.createElement("rect", {
21
21
  width: "40",
22
22
  height: "40",
23
- fill: "white"
23
+ fill: iconThemed({
24
+ light: '#fff',
25
+ dark: '#161A1D'
26
+ })
24
27
  }), /*#__PURE__*/_react.default.createElement("path", {
25
28
  d: "M8 13C8 12.4477 8.44772 12 9 12H40V28H9C8.44772 28 8 27.5523 8 27V13Z",
26
- fill: "#E6FCFF"
29
+ fill: iconThemed({
30
+ light: '#E3FAFC',
31
+ dark: '#1D474C'
32
+ })
27
33
  }), /*#__PURE__*/_react.default.createElement("g", {
28
34
  clipPath: "url(#clip0)"
29
35
  }, /*#__PURE__*/_react.default.createElement("path", {
30
36
  d: "M19.9999 16.2222C15.5817 16.2222 12.2222 19.5818 12.2222 24H16.0093C16.0093 21.7962 17.7964 20.0093 19.9999 20.0093V16.2222Z",
31
- fill: "#8767AC"
37
+ fill: iconThemed({
38
+ light: '#6E5DC6',
39
+ dark: '#9F8FEF'
40
+ })
32
41
  }), /*#__PURE__*/_react.default.createElement("path", {
33
42
  d: "M12 23.9998H12.676C12.676 19.9578 15.9502 16.6809 19.9909 16.676V16C15.5767 16.0051 12 19.5847 12 23.9998Z",
34
- fill: "#EB2027"
43
+ fill: iconThemed({
44
+ light: '#E34935',
45
+ dark: '#EF5C48'
46
+ })
35
47
  }), /*#__PURE__*/_react.default.createElement("path", {
36
48
  d: "M12.6851 24H13.3517C13.3517 20.3262 16.3273 17.3478 19.9999 17.3429V16.6762C15.9593 16.6811 12.6851 19.958 12.6851 24Z",
37
- fill: "#F19020"
49
+ fill: iconThemed({
50
+ light: '#D97008',
51
+ dark: '#F18D13'
52
+ })
38
53
  }), /*#__PURE__*/_react.default.createElement("path", {
39
54
  d: "M13.3518 24H14.0185C14.0185 20.6945 16.6956 18.0145 20 18.0096V17.3429C16.3274 17.3478 13.3518 20.3262 13.3518 24Z",
40
- fill: "#FFCB4C"
55
+ fill: iconThemed({
56
+ light: '#E2B203',
57
+ dark: '#E2B203'
58
+ })
41
59
  }), /*#__PURE__*/_react.default.createElement("path", {
42
60
  d: "M14.0184 24H14.6851C14.6851 21.0629 17.064 18.6811 20 18.6762V18.0096C16.6955 18.0144 14.0184 20.6944 14.0184 24Z",
43
- fill: "#5C903F"
61
+ fill: iconThemed({
62
+ light: '#6A9A23',
63
+ dark: '#82B536'
64
+ })
44
65
  }), /*#__PURE__*/_react.default.createElement("path", {
45
66
  d: "M14.6851 24H15.3517C15.3517 21.4311 17.4322 19.348 19.9999 19.3431V18.6762C17.0639 18.6811 14.6851 21.0629 14.6851 24Z",
46
- fill: "#226798"
67
+ fill: iconThemed({
68
+ light: '#0055CC',
69
+ dark: '#579DFF'
70
+ })
47
71
  })), /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("clipPath", {
48
72
  id: "clip0"
49
73
  }, /*#__PURE__*/_react.default.createElement("rect", {
50
74
  width: "8",
51
75
  height: "8",
52
- fill: "white",
76
+ fill: iconThemed({
77
+ light: '#fff',
78
+ dark: '#fff'
79
+ }),
53
80
  transform: "translate(12 16)"
54
81
  }))));
55
82
  }
package/dist/cjs/ui/DropList/index.js CHANGED
@@ -24,7 +24,7 @@ var _templateObject, _templateObject2, _templateObject3;
24
24
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
25
25
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } } /** @jsx jsx */
26
26
  var packageName = "@atlaskit/editor-common";
27
- var packageVersion = "74.56.2";
27
+ var packageVersion = "74.56.3";
28
28
  var halfFocusRing = 1;
29
29
  var dropOffset = '0, 8';
30
30
  var DropList = /*#__PURE__*/function (_Component) {
package/dist/cjs/ui-menu/ToolbarArrowKeyNavigationProvider/index.js CHANGED
@@ -214,6 +214,9 @@ function getFocusableElements(rootNode) {
214
214
  function getFilteredFocusableElements(rootNode) {
215
215
  //The focusable elements from child components such as dropdown menus / popups are ignored
216
216
  return getFocusableElements(rootNode).filter(function (elm) {
217
- return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons');
217
+ var style = window.getComputedStyle(elm);
218
+ // ignore invisible element to avoid losing focus
219
+ var isVisible = style.visibility !== 'hidden' && style.display !== 'none';
220
+ return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
218
221
  });
219
222
  }
package/dist/es2019/monitoring/error.js CHANGED
@@ -1,6 +1,6 @@
1
1
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
2
2
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
3
- const packageVersion = "74.56.2";
3
+ const packageVersion = "74.56.3";
4
4
  const sanitiseSentryEvents = (data, _hint) => {
5
5
  // Remove URL as it has UGC
6
6
  // TODO: Sanitise the URL instead of just removing it
package/dist/es2019/quick-insert/assets/custom-panel.js CHANGED
@@ -1,7 +1,9 @@
1
- // TODO: https://product-fabric.atlassian.net/browse/DSP-4138
2
- /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
3
1
  import React from 'react';
2
+ import { useIconThemed } from '../use-icon-themed';
4
3
  export default function IconCustomPanel() {
4
+ const {
5
+ iconThemed
6
+ } = useIconThemed();
5
7
  return /*#__PURE__*/React.createElement("svg", {
6
8
  width: "40",
7
9
  height: "40",
@@ -12,36 +14,63 @@ export default function IconCustomPanel() {
12
14
  }, /*#__PURE__*/React.createElement("rect", {
13
15
  width: "40",
14
16
  height: "40",
15
- fill: "white"
17
+ fill: iconThemed({
18
+ light: '#fff',
19
+ dark: '#161A1D'
20
+ })
16
21
  }), /*#__PURE__*/React.createElement("path", {
17
22
  d: "M8 13C8 12.4477 8.44772 12 9 12H40V28H9C8.44772 28 8 27.5523 8 27V13Z",
18
- fill: "#E6FCFF"
23
+ fill: iconThemed({
24
+ light: '#E3FAFC',
25
+ dark: '#1D474C'
26
+ })
19
27
  }), /*#__PURE__*/React.createElement("g", {
20
28
  clipPath: "url(#clip0)"
21
29
  }, /*#__PURE__*/React.createElement("path", {
22
30
  d: "M19.9999 16.2222C15.5817 16.2222 12.2222 19.5818 12.2222 24H16.0093C16.0093 21.7962 17.7964 20.0093 19.9999 20.0093V16.2222Z",
23
- fill: "#8767AC"
31
+ fill: iconThemed({
32
+ light: '#6E5DC6',
33
+ dark: '#9F8FEF'
34
+ })
24
35
  }), /*#__PURE__*/React.createElement("path", {
25
36
  d: "M12 23.9998H12.676C12.676 19.9578 15.9502 16.6809 19.9909 16.676V16C15.5767 16.0051 12 19.5847 12 23.9998Z",
26
- fill: "#EB2027"
37
+ fill: iconThemed({
38
+ light: '#E34935',
39
+ dark: '#EF5C48'
40
+ })
27
41
  }), /*#__PURE__*/React.createElement("path", {
28
42
  d: "M12.6851 24H13.3517C13.3517 20.3262 16.3273 17.3478 19.9999 17.3429V16.6762C15.9593 16.6811 12.6851 19.958 12.6851 24Z",
29
- fill: "#F19020"
43
+ fill: iconThemed({
44
+ light: '#D97008',
45
+ dark: '#F18D13'
46
+ })
30
47
  }), /*#__PURE__*/React.createElement("path", {
31
48
  d: "M13.3518 24H14.0185C14.0185 20.6945 16.6956 18.0145 20 18.0096V17.3429C16.3274 17.3478 13.3518 20.3262 13.3518 24Z",
32
- fill: "#FFCB4C"
49
+ fill: iconThemed({
50
+ light: '#E2B203',
51
+ dark: '#E2B203'
52
+ })
33
53
  }), /*#__PURE__*/React.createElement("path", {
34
54
  d: "M14.0184 24H14.6851C14.6851 21.0629 17.064 18.6811 20 18.6762V18.0096C16.6955 18.0144 14.0184 20.6944 14.0184 24Z",
35
- fill: "#5C903F"
55
+ fill: iconThemed({
56
+ light: '#6A9A23',
57
+ dark: '#82B536'
58
+ })
36
59
  }), /*#__PURE__*/React.createElement("path", {
37
60
  d: "M14.6851 24H15.3517C15.3517 21.4311 17.4322 19.348 19.9999 19.3431V18.6762C17.0639 18.6811 14.6851 21.0629 14.6851 24Z",
38
- fill: "#226798"
61
+ fill: iconThemed({
62
+ light: '#0055CC',
63
+ dark: '#579DFF'
64
+ })
39
65
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
40
66
  id: "clip0"
41
67
  }, /*#__PURE__*/React.createElement("rect", {
42
68
  width: "8",
43
69
  height: "8",
44
- fill: "white",
70
+ fill: iconThemed({
71
+ light: '#fff',
72
+ dark: '#fff'
73
+ }),
45
74
  transform: "translate(12 16)"
46
75
  }))));
47
76
  }
package/dist/es2019/ui/DropList/index.js CHANGED
@@ -8,7 +8,7 @@ import { themed } from '@atlaskit/theme/components';
8
8
  import { borderRadius } from '@atlaskit/theme/constants';
9
9
  import Layer from '../Layer';
10
10
  const packageName = "@atlaskit/editor-common";
11
- const packageVersion = "74.56.2";
11
+ const packageVersion = "74.56.3";
12
12
  const halfFocusRing = 1;
13
13
  const dropOffset = '0, 8';
14
14
  class DropList extends Component {
package/dist/es2019/ui-menu/ToolbarArrowKeyNavigationProvider/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  /** @jsx jsx */
2
2
  /* eslint-disable no-console */
3
+
3
4
  import React, { useCallback, useLayoutEffect, useRef } from 'react';
4
5
  import { css, jsx } from '@emotion/react';
5
6
  import { fullPageMessages as messages } from '../../messages';
@@ -205,5 +206,10 @@ function getFocusableElements(rootNode) {
205
206
  }
206
207
  function getFilteredFocusableElements(rootNode) {
207
208
  //The focusable elements from child components such as dropdown menus / popups are ignored
208
- return getFocusableElements(rootNode).filter(elm => !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons'));
209
+ return getFocusableElements(rootNode).filter(elm => {
210
+ const style = window.getComputedStyle(elm);
211
+ // ignore invisible element to avoid losing focus
212
+ const isVisible = style.visibility !== 'hidden' && style.display !== 'none';
213
+ return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
214
+ });
209
215
  }
package/dist/esm/monitoring/error.js CHANGED
@@ -6,7 +6,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
6
6
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7
7
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
8
8
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
9
- var packageVersion = "74.56.2";
9
+ var packageVersion = "74.56.3";
10
10
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
11
11
  // Remove URL as it has UGC
12
12
  // TODO: Sanitise the URL instead of just removing it
package/dist/esm/quick-insert/assets/custom-panel.js CHANGED
@@ -1,7 +1,8 @@
1
- // TODO: https://product-fabric.atlassian.net/browse/DSP-4138
2
- /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
3
1
  import React from 'react';
2
+ import { useIconThemed } from '../use-icon-themed';
4
3
  export default function IconCustomPanel() {
4
+ var _useIconThemed = useIconThemed(),
5
+ iconThemed = _useIconThemed.iconThemed;
5
6
  return /*#__PURE__*/React.createElement("svg", {
6
7
  width: "40",
7
8
  height: "40",
@@ -12,36 +13,63 @@ export default function IconCustomPanel() {
12
13
  }, /*#__PURE__*/React.createElement("rect", {
13
14
  width: "40",
14
15
  height: "40",
15
- fill: "white"
16
+ fill: iconThemed({
17
+ light: '#fff',
18
+ dark: '#161A1D'
19
+ })
16
20
  }), /*#__PURE__*/React.createElement("path", {
17
21
  d: "M8 13C8 12.4477 8.44772 12 9 12H40V28H9C8.44772 28 8 27.5523 8 27V13Z",
18
- fill: "#E6FCFF"
22
+ fill: iconThemed({
23
+ light: '#E3FAFC',
24
+ dark: '#1D474C'
25
+ })
19
26
  }), /*#__PURE__*/React.createElement("g", {
20
27
  clipPath: "url(#clip0)"
21
28
  }, /*#__PURE__*/React.createElement("path", {
22
29
  d: "M19.9999 16.2222C15.5817 16.2222 12.2222 19.5818 12.2222 24H16.0093C16.0093 21.7962 17.7964 20.0093 19.9999 20.0093V16.2222Z",
23
- fill: "#8767AC"
30
+ fill: iconThemed({
31
+ light: '#6E5DC6',
32
+ dark: '#9F8FEF'
33
+ })
24
34
  }), /*#__PURE__*/React.createElement("path", {
25
35
  d: "M12 23.9998H12.676C12.676 19.9578 15.9502 16.6809 19.9909 16.676V16C15.5767 16.0051 12 19.5847 12 23.9998Z",
26
- fill: "#EB2027"
36
+ fill: iconThemed({
37
+ light: '#E34935',
38
+ dark: '#EF5C48'
39
+ })
27
40
  }), /*#__PURE__*/React.createElement("path", {
28
41
  d: "M12.6851 24H13.3517C13.3517 20.3262 16.3273 17.3478 19.9999 17.3429V16.6762C15.9593 16.6811 12.6851 19.958 12.6851 24Z",
29
- fill: "#F19020"
42
+ fill: iconThemed({
43
+ light: '#D97008',
44
+ dark: '#F18D13'
45
+ })
30
46
  }), /*#__PURE__*/React.createElement("path", {
31
47
  d: "M13.3518 24H14.0185C14.0185 20.6945 16.6956 18.0145 20 18.0096V17.3429C16.3274 17.3478 13.3518 20.3262 13.3518 24Z",
32
- fill: "#FFCB4C"
48
+ fill: iconThemed({
49
+ light: '#E2B203',
50
+ dark: '#E2B203'
51
+ })
33
52
  }), /*#__PURE__*/React.createElement("path", {
34
53
  d: "M14.0184 24H14.6851C14.6851 21.0629 17.064 18.6811 20 18.6762V18.0096C16.6955 18.0144 14.0184 20.6944 14.0184 24Z",
35
- fill: "#5C903F"
54
+ fill: iconThemed({
55
+ light: '#6A9A23',
56
+ dark: '#82B536'
57
+ })
36
58
  }), /*#__PURE__*/React.createElement("path", {
37
59
  d: "M14.6851 24H15.3517C15.3517 21.4311 17.4322 19.348 19.9999 19.3431V18.6762C17.0639 18.6811 14.6851 21.0629 14.6851 24Z",
38
- fill: "#226798"
60
+ fill: iconThemed({
61
+ light: '#0055CC',
62
+ dark: '#579DFF'
63
+ })
39
64
  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
40
65
  id: "clip0"
41
66
  }, /*#__PURE__*/React.createElement("rect", {
42
67
  width: "8",
43
68
  height: "8",
44
- fill: "white",
69
+ fill: iconThemed({
70
+ light: '#fff',
71
+ dark: '#fff'
72
+ }),
45
73
  transform: "translate(12 16)"
46
74
  }))));
47
75
  }
package/dist/esm/ui/DropList/index.js CHANGED
@@ -18,7 +18,7 @@ import { themed } from '@atlaskit/theme/components';
18
18
  import { borderRadius } from '@atlaskit/theme/constants';
19
19
  import Layer from '../Layer';
20
20
  var packageName = "@atlaskit/editor-common";
21
- var packageVersion = "74.56.2";
21
+ var packageVersion = "74.56.3";
22
22
  var halfFocusRing = 1;
23
23
  var dropOffset = '0, 8';
24
24
  var DropList = /*#__PURE__*/function (_Component) {
package/dist/esm/ui-menu/ToolbarArrowKeyNavigationProvider/index.js CHANGED
@@ -2,6 +2,7 @@ import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral
2
2
  var _templateObject;
3
3
  /** @jsx jsx */
4
4
  /* eslint-disable no-console */
5
+
5
6
  import React, { useCallback, useLayoutEffect, useRef } from 'react';
6
7
  import { css, jsx } from '@emotion/react';
7
8
  import { fullPageMessages as messages } from '../../messages';
@@ -202,6 +203,9 @@ function getFocusableElements(rootNode) {
202
203
  function getFilteredFocusableElements(rootNode) {
203
204
  //The focusable elements from child components such as dropdown menus / popups are ignored
204
205
  return getFocusableElements(rootNode).filter(function (elm) {
205
- return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons');
206
+ var style = window.getComputedStyle(elm);
207
+ // ignore invisible element to avoid losing focus
208
+ var isVisible = style.visibility !== 'hidden' && style.display !== 'none';
209
+ return !elm.closest('[data-role="droplistContent"]') && !elm.closest('[data-emoji-picker-container="true"]') && !elm.closest('[data-test-id="color-picker-menu"]') && !elm.closest('.scroll-buttons') && isVisible;
206
210
  });
207
211
  }
package/dist/types/ui-menu/ToolbarArrowKeyNavigationProvider/index.d.ts CHANGED
@@ -1,10 +1,11 @@
1
1
  /** @jsx jsx */
2
- import React, { ReactNode } from 'react';
2
+ import type { ReactNode } from 'react';
3
+ import React from 'react';
3
4
  import { jsx } from '@emotion/react';
4
- import { IntlShape } from 'react-intl-next/src/types';
5
- import { EditorView } from '@atlaskit/editor-prosemirror/view';
6
- import { EditorAppearance } from '../../types';
7
- import { UseStickyToolbarType } from '../../ui';
5
+ import type { IntlShape } from 'react-intl-next/src/types';
6
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
7
+ import type { EditorAppearance } from '../../types';
8
+ import type { UseStickyToolbarType } from '../../ui';
8
9
  export interface KeyDownHandlerContext {
9
10
  handleArrowLeft: () => void;
10
11
  handleArrowRight: () => void;
package/dist/types-ts4.5/ui-menu/ToolbarArrowKeyNavigationProvider/index.d.ts CHANGED
@@ -1,10 +1,11 @@
1
1
  /** @jsx jsx */
2
- import React, { ReactNode } from 'react';
2
+ import type { ReactNode } from 'react';
3
+ import React from 'react';
3
4
  import { jsx } from '@emotion/react';
4
- import { IntlShape } from 'react-intl-next/src/types';
5
- import { EditorView } from '@atlaskit/editor-prosemirror/view';
6
- import { EditorAppearance } from '../../types';
7
- import { UseStickyToolbarType } from '../../ui';
5
+ import type { IntlShape } from 'react-intl-next/src/types';
6
+ import type { EditorView } from '@atlaskit/editor-prosemirror/view';
7
+ import type { EditorAppearance } from '../../types';
8
+ import type { UseStickyToolbarType } from '../../ui';
8
9
  export interface KeyDownHandlerContext {
9
10
  handleArrowLeft: () => void;
10
11
  handleArrowRight: () => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "74.56.2",
3
+ "version": "74.56.3",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -111,7 +111,7 @@
111
111
  "@atlaskit/smart-user-picker": "^6.3.0",
112
112
  "@atlaskit/spinner": "^15.5.0",
113
113
  "@atlaskit/task-decision": "^17.7.0",
114
- "@atlaskit/theme": "^12.5.0",
114
+ "@atlaskit/theme": "^12.6.0",
115
115
  "@atlaskit/tokens": "^1.18.0",
116
116
  "@atlaskit/tooltip": "^17.8.0",
117
117
  "@atlaskit/ufo": "^0.2.0",