@atlaskit/editor-toolbar 0.16.2 → 0.16.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.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/editor-toolbar
|
|
2
2
|
|
|
3
|
+
## 0.16.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`f65390f90cb53`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f65390f90cb53) -
|
|
8
|
+
[ux] ED-29582 [Keyboard] When tab is pressed using keyboard shortcuts on selection toolbar, focus
|
|
9
|
+
should be moved away
|
|
10
|
+
|
|
3
11
|
## 0.16.2
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -75,6 +75,23 @@ var ToolbarKeyboardNavigationProvider = exports.ToolbarKeyboardNavigationProvide
|
|
|
75
75
|
}
|
|
76
76
|
(_focusableElements$ne = focusableElements[nextIndex]) === null || _focusableElements$ne === void 0 || _focusableElements$ne.focus();
|
|
77
77
|
};
|
|
78
|
+
var handleTab = function handleTab() {
|
|
79
|
+
var focusableElements = getFocusableElements();
|
|
80
|
+
if (focusableElements.length === 0) {
|
|
81
|
+
return;
|
|
82
|
+
}
|
|
83
|
+
var doc = (0, _browserApis.getDocument)();
|
|
84
|
+
var index = doc !== null && doc !== void 0 && doc.activeElement ? focusableElements.findIndex(function (el) {
|
|
85
|
+
return el === (doc === null || doc === void 0 ? void 0 : doc.activeElement);
|
|
86
|
+
}) : 0;
|
|
87
|
+
if (index < 0) {
|
|
88
|
+
index = 0;
|
|
89
|
+
}
|
|
90
|
+
focusableElements.forEach(function (el) {
|
|
91
|
+
return el.setAttribute('tabindex', '-1');
|
|
92
|
+
});
|
|
93
|
+
focusableElements[index].setAttribute('tabindex', '0');
|
|
94
|
+
};
|
|
78
95
|
var handleKeyDown = function handleKeyDown(event) {
|
|
79
96
|
var targetElement = event.target;
|
|
80
97
|
if (targetElement instanceof HTMLElement && !targetElement.closest("".concat(childComponentSelector))) {
|
|
@@ -93,6 +110,11 @@ var ToolbarKeyboardNavigationProvider = exports.ToolbarKeyboardNavigationProvide
|
|
|
93
110
|
event.preventDefault();
|
|
94
111
|
moveFocus('right');
|
|
95
112
|
break;
|
|
113
|
+
case 'Tab':
|
|
114
|
+
{
|
|
115
|
+
handleTab();
|
|
116
|
+
break;
|
|
117
|
+
}
|
|
96
118
|
default:
|
|
97
119
|
}
|
|
98
120
|
} else {
|
|
@@ -68,6 +68,19 @@ export const ToolbarKeyboardNavigationProvider = ({
|
|
|
68
68
|
}
|
|
69
69
|
(_focusableElements$ne = focusableElements[nextIndex]) === null || _focusableElements$ne === void 0 ? void 0 : _focusableElements$ne.focus();
|
|
70
70
|
};
|
|
71
|
+
const handleTab = () => {
|
|
72
|
+
const focusableElements = getFocusableElements();
|
|
73
|
+
if (focusableElements.length === 0) {
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
const doc = getDocument();
|
|
77
|
+
let index = doc !== null && doc !== void 0 && doc.activeElement ? focusableElements.findIndex(el => el === (doc === null || doc === void 0 ? void 0 : doc.activeElement)) : 0;
|
|
78
|
+
if (index < 0) {
|
|
79
|
+
index = 0;
|
|
80
|
+
}
|
|
81
|
+
focusableElements.forEach(el => el.setAttribute('tabindex', '-1'));
|
|
82
|
+
focusableElements[index].setAttribute('tabindex', '0');
|
|
83
|
+
};
|
|
71
84
|
const handleKeyDown = event => {
|
|
72
85
|
const targetElement = event.target;
|
|
73
86
|
if (targetElement instanceof HTMLElement && !targetElement.closest(`${childComponentSelector}`)) {
|
|
@@ -86,6 +99,11 @@ export const ToolbarKeyboardNavigationProvider = ({
|
|
|
86
99
|
event.preventDefault();
|
|
87
100
|
moveFocus('right');
|
|
88
101
|
break;
|
|
102
|
+
case 'Tab':
|
|
103
|
+
{
|
|
104
|
+
handleTab();
|
|
105
|
+
break;
|
|
106
|
+
}
|
|
89
107
|
default:
|
|
90
108
|
}
|
|
91
109
|
} else {
|
|
@@ -67,6 +67,23 @@ export var ToolbarKeyboardNavigationProvider = function ToolbarKeyboardNavigatio
|
|
|
67
67
|
}
|
|
68
68
|
(_focusableElements$ne = focusableElements[nextIndex]) === null || _focusableElements$ne === void 0 || _focusableElements$ne.focus();
|
|
69
69
|
};
|
|
70
|
+
var handleTab = function handleTab() {
|
|
71
|
+
var focusableElements = getFocusableElements();
|
|
72
|
+
if (focusableElements.length === 0) {
|
|
73
|
+
return;
|
|
74
|
+
}
|
|
75
|
+
var doc = getDocument();
|
|
76
|
+
var index = doc !== null && doc !== void 0 && doc.activeElement ? focusableElements.findIndex(function (el) {
|
|
77
|
+
return el === (doc === null || doc === void 0 ? void 0 : doc.activeElement);
|
|
78
|
+
}) : 0;
|
|
79
|
+
if (index < 0) {
|
|
80
|
+
index = 0;
|
|
81
|
+
}
|
|
82
|
+
focusableElements.forEach(function (el) {
|
|
83
|
+
return el.setAttribute('tabindex', '-1');
|
|
84
|
+
});
|
|
85
|
+
focusableElements[index].setAttribute('tabindex', '0');
|
|
86
|
+
};
|
|
70
87
|
var handleKeyDown = function handleKeyDown(event) {
|
|
71
88
|
var targetElement = event.target;
|
|
72
89
|
if (targetElement instanceof HTMLElement && !targetElement.closest("".concat(childComponentSelector))) {
|
|
@@ -85,6 +102,11 @@ export var ToolbarKeyboardNavigationProvider = function ToolbarKeyboardNavigatio
|
|
|
85
102
|
event.preventDefault();
|
|
86
103
|
moveFocus('right');
|
|
87
104
|
break;
|
|
105
|
+
case 'Tab':
|
|
106
|
+
{
|
|
107
|
+
handleTab();
|
|
108
|
+
break;
|
|
109
|
+
}
|
|
88
110
|
default:
|
|
89
111
|
}
|
|
90
112
|
} else {
|