@primer/behaviors 1.8.1-rc.b50bf48 → 1.8.1-rc.b95e141
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/dist/cjs/anchored-position.js +5 -5
- package/dist/cjs/focus-trap.js +6 -6
- package/dist/cjs/focus-zone.js +21 -21
- package/dist/cjs/utils/iterate-focusable-elements.js +2 -2
- package/dist/esm/anchored-position.mjs +5 -5
- package/dist/esm/focus-trap.mjs +6 -6
- package/dist/esm/focus-zone.mjs +21 -21
- package/dist/esm/utils/iterate-focusable-elements.mjs +2 -2
- package/package.json +2 -2
|
@@ -87,14 +87,14 @@ const positionDefaults = {
|
|
|
87
87
|
};
|
|
88
88
|
function getDefaultSettings(settings = {}) {
|
|
89
89
|
var _a, _b, _c, _d, _e;
|
|
90
|
-
const side = (_a = settings.side) !== null && _a !==
|
|
91
|
-
const align = (_b = settings.align) !== null && _b !==
|
|
90
|
+
const side = (_a = settings.side) !== null && _a !== void 0 ? _a : positionDefaults.side;
|
|
91
|
+
const align = (_b = settings.align) !== null && _b !== void 0 ? _b : positionDefaults.align;
|
|
92
92
|
return {
|
|
93
93
|
side,
|
|
94
94
|
align,
|
|
95
|
-
anchorOffset: (_c = settings.anchorOffset) !== null && _c !==
|
|
96
|
-
alignmentOffset: (_d = settings.alignmentOffset) !== null && _d !==
|
|
97
|
-
allowOutOfBounds: (_e = settings.allowOutOfBounds) !== null && _e !==
|
|
95
|
+
anchorOffset: (_c = settings.anchorOffset) !== null && _c !== void 0 ? _c : (side === 'inside-center' ? 0 : positionDefaults.anchorOffset),
|
|
96
|
+
alignmentOffset: (_d = settings.alignmentOffset) !== null && _d !== void 0 ? _d : (align !== 'center' && side.startsWith('inside') ? positionDefaults.alignmentOffset : 0),
|
|
97
|
+
allowOutOfBounds: (_e = settings.allowOutOfBounds) !== null && _e !== void 0 ? _e : positionDefaults.allowOutOfBounds,
|
|
98
98
|
};
|
|
99
99
|
}
|
|
100
100
|
function pureCalculateAnchoredPosition(viewportRect, relativePosition, floatingRect, anchorRect, { side, align, allowOutOfBounds, anchorOffset, alignmentOffset }) {
|
package/dist/cjs/focus-trap.js
CHANGED
|
@@ -30,10 +30,10 @@ function observeFocusTrap(container, sentinels) {
|
|
|
30
30
|
const firstChild = container.firstElementChild;
|
|
31
31
|
const lastChild = container.lastElementChild;
|
|
32
32
|
const [sentinelStart, sentinelEnd] = sentinels;
|
|
33
|
-
if (!(firstChild === null || firstChild ===
|
|
33
|
+
if (!(firstChild === null || firstChild === void 0 ? void 0 : firstChild.classList.contains('sentinel'))) {
|
|
34
34
|
container.insertAdjacentElement('afterbegin', sentinelStart);
|
|
35
35
|
}
|
|
36
|
-
if (!(lastChild === null || lastChild ===
|
|
36
|
+
if (!(lastChild === null || lastChild === void 0 ? void 0 : lastChild.classList.contains('sentinel'))) {
|
|
37
37
|
container.insertAdjacentElement('beforeend', sentinelEnd);
|
|
38
38
|
}
|
|
39
39
|
}
|
|
@@ -44,7 +44,7 @@ function observeFocusTrap(container, sentinels) {
|
|
|
44
44
|
}
|
|
45
45
|
function focusTrap(container, initialFocus, abortSignal) {
|
|
46
46
|
const controller = new AbortController();
|
|
47
|
-
const signal = abortSignal !== null && abortSignal !==
|
|
47
|
+
const signal = abortSignal !== null && abortSignal !== void 0 ? abortSignal : controller.signal;
|
|
48
48
|
container.setAttribute('data-focus-trap', 'active');
|
|
49
49
|
const sentinelStart = document.createElement('span');
|
|
50
50
|
sentinelStart.setAttribute('class', 'sentinel');
|
|
@@ -52,7 +52,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
52
52
|
sentinelStart.setAttribute('aria-hidden', 'true');
|
|
53
53
|
sentinelStart.onfocus = () => {
|
|
54
54
|
const lastFocusableChild = iterateFocusableElements.getFocusableChild(container, true);
|
|
55
|
-
lastFocusableChild === null || lastFocusableChild ===
|
|
55
|
+
lastFocusableChild === null || lastFocusableChild === void 0 ? void 0 : lastFocusableChild.focus();
|
|
56
56
|
};
|
|
57
57
|
const sentinelEnd = document.createElement('span');
|
|
58
58
|
sentinelEnd.setAttribute('class', 'sentinel');
|
|
@@ -60,7 +60,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
60
60
|
sentinelEnd.setAttribute('aria-hidden', 'true');
|
|
61
61
|
sentinelEnd.onfocus = () => {
|
|
62
62
|
const firstFocusableChild = iterateFocusableElements.getFocusableChild(container);
|
|
63
|
-
firstFocusableChild === null || firstFocusableChild ===
|
|
63
|
+
firstFocusableChild === null || firstFocusableChild === void 0 ? void 0 : firstFocusableChild.focus();
|
|
64
64
|
};
|
|
65
65
|
const existingSentinels = Array.from(container.children).filter(e => e.classList.contains('sentinel') && e.tagName === 'SPAN');
|
|
66
66
|
if (!existingSentinels.length) {
|
|
@@ -86,7 +86,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
86
86
|
}
|
|
87
87
|
else {
|
|
88
88
|
const firstFocusableChild = iterateFocusableElements.getFocusableChild(container);
|
|
89
|
-
firstFocusableChild === null || firstFocusableChild ===
|
|
89
|
+
firstFocusableChild === null || firstFocusableChild === void 0 ? void 0 : firstFocusableChild.focus();
|
|
90
90
|
return;
|
|
91
91
|
}
|
|
92
92
|
}
|
package/dist/cjs/focus-zone.js
CHANGED
|
@@ -130,13 +130,13 @@ function focusZone(container, settings) {
|
|
|
130
130
|
var _a, _b, _c, _d, _e;
|
|
131
131
|
const focusableElements = [];
|
|
132
132
|
const savedTabIndex = new WeakMap();
|
|
133
|
-
const bindKeys = (_a = settings === null || settings ===
|
|
134
|
-
const focusOutBehavior = (_b = settings === null || settings ===
|
|
135
|
-
const focusInStrategy = (_c = settings === null || settings ===
|
|
136
|
-
const activeDescendantControl = settings === null || settings ===
|
|
137
|
-
const activeDescendantCallback = settings === null || settings ===
|
|
133
|
+
const bindKeys = (_a = settings === null || settings === void 0 ? void 0 : settings.bindKeys) !== null && _a !== void 0 ? _a : ((settings === null || settings === void 0 ? void 0 : settings.getNextFocusable) ? exports.FocusKeys.ArrowAll : exports.FocusKeys.ArrowVertical) | exports.FocusKeys.HomeAndEnd;
|
|
134
|
+
const focusOutBehavior = (_b = settings === null || settings === void 0 ? void 0 : settings.focusOutBehavior) !== null && _b !== void 0 ? _b : 'stop';
|
|
135
|
+
const focusInStrategy = (_c = settings === null || settings === void 0 ? void 0 : settings.focusInStrategy) !== null && _c !== void 0 ? _c : 'previous';
|
|
136
|
+
const activeDescendantControl = settings === null || settings === void 0 ? void 0 : settings.activeDescendantControl;
|
|
137
|
+
const activeDescendantCallback = settings === null || settings === void 0 ? void 0 : settings.onActiveDescendantChanged;
|
|
138
138
|
let currentFocusedElement;
|
|
139
|
-
const preventScroll = (_d = settings === null || settings ===
|
|
139
|
+
const preventScroll = (_d = settings === null || settings === void 0 ? void 0 : settings.preventScroll) !== null && _d !== void 0 ? _d : false;
|
|
140
140
|
function getFirstFocusableElement() {
|
|
141
141
|
return focusableElements[0];
|
|
142
142
|
}
|
|
@@ -158,7 +158,7 @@ function focusZone(container, settings) {
|
|
|
158
158
|
if (from && from !== to && savedTabIndex.has(from)) {
|
|
159
159
|
from.setAttribute('tabindex', '-1');
|
|
160
160
|
}
|
|
161
|
-
to === null || to ===
|
|
161
|
+
to === null || to === void 0 ? void 0 : to.setAttribute('tabindex', '0');
|
|
162
162
|
}
|
|
163
163
|
function setActiveDescendant(from, to, directlyActivated = false) {
|
|
164
164
|
if (!to.id) {
|
|
@@ -174,22 +174,22 @@ function focusZone(container, settings) {
|
|
|
174
174
|
activeDescendantControl.setAttribute('aria-activedescendant', to.id);
|
|
175
175
|
container.setAttribute(hasActiveDescendantAttribute, to.id);
|
|
176
176
|
to.setAttribute(isActiveDescendantAttribute, directlyActivated ? activeDescendantActivatedDirectly : activeDescendantActivatedIndirectly);
|
|
177
|
-
activeDescendantCallback === null || activeDescendantCallback ===
|
|
177
|
+
activeDescendantCallback === null || activeDescendantCallback === void 0 ? void 0 : activeDescendantCallback(to, from, directlyActivated);
|
|
178
178
|
}
|
|
179
179
|
function clearActiveDescendant(previouslyActiveElement = currentFocusedElement) {
|
|
180
180
|
if (focusInStrategy === 'first') {
|
|
181
181
|
currentFocusedElement = undefined;
|
|
182
182
|
}
|
|
183
|
-
activeDescendantControl === null || activeDescendantControl ===
|
|
183
|
+
activeDescendantControl === null || activeDescendantControl === void 0 ? void 0 : activeDescendantControl.removeAttribute('aria-activedescendant');
|
|
184
184
|
container.removeAttribute(hasActiveDescendantAttribute);
|
|
185
|
-
previouslyActiveElement === null || previouslyActiveElement ===
|
|
185
|
+
previouslyActiveElement === null || previouslyActiveElement === void 0 ? void 0 : previouslyActiveElement.removeAttribute(isActiveDescendantAttribute);
|
|
186
186
|
for (const item of container.querySelectorAll(`[${isActiveDescendantAttribute}]`)) {
|
|
187
|
-
item === null || item ===
|
|
187
|
+
item === null || item === void 0 ? void 0 : item.removeAttribute(isActiveDescendantAttribute);
|
|
188
188
|
}
|
|
189
|
-
activeDescendantCallback === null || activeDescendantCallback ===
|
|
189
|
+
activeDescendantCallback === null || activeDescendantCallback === void 0 ? void 0 : activeDescendantCallback(undefined, previouslyActiveElement, false);
|
|
190
190
|
}
|
|
191
191
|
function beginFocusManagement(...elements) {
|
|
192
|
-
const filteredElements = elements.filter(e => { var _a, _b; return (_b = (_a = settings === null || settings ===
|
|
192
|
+
const filteredElements = elements.filter(e => { var _a, _b; return (_b = (_a = settings === null || settings === void 0 ? void 0 : settings.focusableElementFilter) === null || _a === void 0 ? void 0 : _a.call(settings, e)) !== null && _b !== void 0 ? _b : true; });
|
|
193
193
|
if (filteredElements.length === 0) {
|
|
194
194
|
return;
|
|
195
195
|
}
|
|
@@ -248,9 +248,9 @@ function focusZone(container, settings) {
|
|
|
248
248
|
}
|
|
249
249
|
}
|
|
250
250
|
const iterateFocusableElementsOptions = {
|
|
251
|
-
reverse: settings === null || settings ===
|
|
252
|
-
strict: settings === null || settings ===
|
|
253
|
-
onlyTabbable: settings === null || settings ===
|
|
251
|
+
reverse: settings === null || settings === void 0 ? void 0 : settings.reverse,
|
|
252
|
+
strict: settings === null || settings === void 0 ? void 0 : settings.strict,
|
|
253
|
+
onlyTabbable: settings === null || settings === void 0 ? void 0 : settings.onlyTabbable,
|
|
254
254
|
};
|
|
255
255
|
beginFocusManagement(...iterateFocusableElements.iterateFocusableElements(container, iterateFocusableElementsOptions));
|
|
256
256
|
const initialElement = typeof focusInStrategy === 'function' ? focusInStrategy(document.body) : getFirstFocusableElement();
|
|
@@ -288,7 +288,7 @@ function focusZone(container, settings) {
|
|
|
288
288
|
attributeOldValue: true,
|
|
289
289
|
});
|
|
290
290
|
const controller = new AbortController();
|
|
291
|
-
const signal = (_e = settings === null || settings ===
|
|
291
|
+
const signal = (_e = settings === null || settings === void 0 ? void 0 : settings.abortSignal) !== null && _e !== void 0 ? _e : controller.signal;
|
|
292
292
|
signal.addEventListener('abort', () => {
|
|
293
293
|
endFocusManagement(...focusableElements);
|
|
294
294
|
});
|
|
@@ -345,7 +345,7 @@ function focusZone(container, settings) {
|
|
|
345
345
|
if (event.relatedTarget instanceof Element && !container.contains(event.relatedTarget)) {
|
|
346
346
|
const targetElementIndex = lastKeyboardFocusDirection === 'previous' ? focusableElements.length - 1 : 0;
|
|
347
347
|
const targetElement = focusableElements[targetElementIndex];
|
|
348
|
-
targetElement === null || targetElement ===
|
|
348
|
+
targetElement === null || targetElement === void 0 ? void 0 : targetElement.focus({ preventScroll });
|
|
349
349
|
return;
|
|
350
350
|
}
|
|
351
351
|
else {
|
|
@@ -373,7 +373,7 @@ function focusZone(container, settings) {
|
|
|
373
373
|
lastKeyboardFocusDirection = undefined;
|
|
374
374
|
}, { signal });
|
|
375
375
|
}
|
|
376
|
-
const keyboardEventRecipient = activeDescendantControl !== null && activeDescendantControl !==
|
|
376
|
+
const keyboardEventRecipient = activeDescendantControl !== null && activeDescendantControl !== void 0 ? activeDescendantControl : container;
|
|
377
377
|
let lastKeyboardFocusDirection = undefined;
|
|
378
378
|
if (focusInStrategy === 'closest') {
|
|
379
379
|
document.addEventListener('keydown', event => {
|
|
@@ -399,8 +399,8 @@ function focusZone(container, settings) {
|
|
|
399
399
|
!shouldIgnoreFocusHandling(event, document.activeElement)) {
|
|
400
400
|
const direction = getDirection(event);
|
|
401
401
|
let nextElementToFocus = undefined;
|
|
402
|
-
if (settings === null || settings ===
|
|
403
|
-
nextElementToFocus = settings.getNextFocusable(direction, (_a = document.activeElement) !== null && _a !==
|
|
402
|
+
if (settings === null || settings === void 0 ? void 0 : settings.getNextFocusable) {
|
|
403
|
+
nextElementToFocus = settings.getNextFocusable(direction, (_a = document.activeElement) !== null && _a !== void 0 ? _a : undefined, event);
|
|
404
404
|
}
|
|
405
405
|
if (!nextElementToFocus) {
|
|
406
406
|
const lastFocusedIndex = getCurrentFocusedIndex();
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
function* iterateFocusableElements(container, options = {}) {
|
|
4
4
|
var _a, _b;
|
|
5
|
-
const strict = (_a = options.strict) !== null && _a !==
|
|
6
|
-
const acceptFn = ((_b = options.onlyTabbable) !== null && _b !==
|
|
5
|
+
const strict = (_a = options.strict) !== null && _a !== void 0 ? _a : false;
|
|
6
|
+
const acceptFn = ((_b = options.onlyTabbable) !== null && _b !== void 0 ? _b : false) ? isTabbable : isFocusable;
|
|
7
7
|
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
8
8
|
acceptNode: node => node instanceof HTMLElement && acceptFn(node, strict) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP,
|
|
9
9
|
});
|
|
@@ -85,14 +85,14 @@ const positionDefaults = {
|
|
|
85
85
|
};
|
|
86
86
|
function getDefaultSettings(settings = {}) {
|
|
87
87
|
var _a, _b, _c, _d, _e;
|
|
88
|
-
const side = (_a = settings.side) !== null && _a !==
|
|
89
|
-
const align = (_b = settings.align) !== null && _b !==
|
|
88
|
+
const side = (_a = settings.side) !== null && _a !== void 0 ? _a : positionDefaults.side;
|
|
89
|
+
const align = (_b = settings.align) !== null && _b !== void 0 ? _b : positionDefaults.align;
|
|
90
90
|
return {
|
|
91
91
|
side,
|
|
92
92
|
align,
|
|
93
|
-
anchorOffset: (_c = settings.anchorOffset) !== null && _c !==
|
|
94
|
-
alignmentOffset: (_d = settings.alignmentOffset) !== null && _d !==
|
|
95
|
-
allowOutOfBounds: (_e = settings.allowOutOfBounds) !== null && _e !==
|
|
93
|
+
anchorOffset: (_c = settings.anchorOffset) !== null && _c !== void 0 ? _c : (side === 'inside-center' ? 0 : positionDefaults.anchorOffset),
|
|
94
|
+
alignmentOffset: (_d = settings.alignmentOffset) !== null && _d !== void 0 ? _d : (align !== 'center' && side.startsWith('inside') ? positionDefaults.alignmentOffset : 0),
|
|
95
|
+
allowOutOfBounds: (_e = settings.allowOutOfBounds) !== null && _e !== void 0 ? _e : positionDefaults.allowOutOfBounds,
|
|
96
96
|
};
|
|
97
97
|
}
|
|
98
98
|
function pureCalculateAnchoredPosition(viewportRect, relativePosition, floatingRect, anchorRect, { side, align, allowOutOfBounds, anchorOffset, alignmentOffset }) {
|
package/dist/esm/focus-trap.mjs
CHANGED
|
@@ -28,10 +28,10 @@ function observeFocusTrap(container, sentinels) {
|
|
|
28
28
|
const firstChild = container.firstElementChild;
|
|
29
29
|
const lastChild = container.lastElementChild;
|
|
30
30
|
const [sentinelStart, sentinelEnd] = sentinels;
|
|
31
|
-
if (!(firstChild === null || firstChild ===
|
|
31
|
+
if (!(firstChild === null || firstChild === void 0 ? void 0 : firstChild.classList.contains('sentinel'))) {
|
|
32
32
|
container.insertAdjacentElement('afterbegin', sentinelStart);
|
|
33
33
|
}
|
|
34
|
-
if (!(lastChild === null || lastChild ===
|
|
34
|
+
if (!(lastChild === null || lastChild === void 0 ? void 0 : lastChild.classList.contains('sentinel'))) {
|
|
35
35
|
container.insertAdjacentElement('beforeend', sentinelEnd);
|
|
36
36
|
}
|
|
37
37
|
}
|
|
@@ -42,7 +42,7 @@ function observeFocusTrap(container, sentinels) {
|
|
|
42
42
|
}
|
|
43
43
|
function focusTrap(container, initialFocus, abortSignal) {
|
|
44
44
|
const controller = new AbortController();
|
|
45
|
-
const signal = abortSignal !== null && abortSignal !==
|
|
45
|
+
const signal = abortSignal !== null && abortSignal !== void 0 ? abortSignal : controller.signal;
|
|
46
46
|
container.setAttribute('data-focus-trap', 'active');
|
|
47
47
|
const sentinelStart = document.createElement('span');
|
|
48
48
|
sentinelStart.setAttribute('class', 'sentinel');
|
|
@@ -50,7 +50,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
50
50
|
sentinelStart.setAttribute('aria-hidden', 'true');
|
|
51
51
|
sentinelStart.onfocus = () => {
|
|
52
52
|
const lastFocusableChild = getFocusableChild(container, true);
|
|
53
|
-
lastFocusableChild === null || lastFocusableChild ===
|
|
53
|
+
lastFocusableChild === null || lastFocusableChild === void 0 ? void 0 : lastFocusableChild.focus();
|
|
54
54
|
};
|
|
55
55
|
const sentinelEnd = document.createElement('span');
|
|
56
56
|
sentinelEnd.setAttribute('class', 'sentinel');
|
|
@@ -58,7 +58,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
58
58
|
sentinelEnd.setAttribute('aria-hidden', 'true');
|
|
59
59
|
sentinelEnd.onfocus = () => {
|
|
60
60
|
const firstFocusableChild = getFocusableChild(container);
|
|
61
|
-
firstFocusableChild === null || firstFocusableChild ===
|
|
61
|
+
firstFocusableChild === null || firstFocusableChild === void 0 ? void 0 : firstFocusableChild.focus();
|
|
62
62
|
};
|
|
63
63
|
const existingSentinels = Array.from(container.children).filter(e => e.classList.contains('sentinel') && e.tagName === 'SPAN');
|
|
64
64
|
if (!existingSentinels.length) {
|
|
@@ -84,7 +84,7 @@ function focusTrap(container, initialFocus, abortSignal) {
|
|
|
84
84
|
}
|
|
85
85
|
else {
|
|
86
86
|
const firstFocusableChild = getFocusableChild(container);
|
|
87
|
-
firstFocusableChild === null || firstFocusableChild ===
|
|
87
|
+
firstFocusableChild === null || firstFocusableChild === void 0 ? void 0 : firstFocusableChild.focus();
|
|
88
88
|
return;
|
|
89
89
|
}
|
|
90
90
|
}
|
package/dist/esm/focus-zone.mjs
CHANGED
|
@@ -128,13 +128,13 @@ function focusZone(container, settings) {
|
|
|
128
128
|
var _a, _b, _c, _d, _e;
|
|
129
129
|
const focusableElements = [];
|
|
130
130
|
const savedTabIndex = new WeakMap();
|
|
131
|
-
const bindKeys = (_a = settings === null || settings ===
|
|
132
|
-
const focusOutBehavior = (_b = settings === null || settings ===
|
|
133
|
-
const focusInStrategy = (_c = settings === null || settings ===
|
|
134
|
-
const activeDescendantControl = settings === null || settings ===
|
|
135
|
-
const activeDescendantCallback = settings === null || settings ===
|
|
131
|
+
const bindKeys = (_a = settings === null || settings === void 0 ? void 0 : settings.bindKeys) !== null && _a !== void 0 ? _a : ((settings === null || settings === void 0 ? void 0 : settings.getNextFocusable) ? FocusKeys.ArrowAll : FocusKeys.ArrowVertical) | FocusKeys.HomeAndEnd;
|
|
132
|
+
const focusOutBehavior = (_b = settings === null || settings === void 0 ? void 0 : settings.focusOutBehavior) !== null && _b !== void 0 ? _b : 'stop';
|
|
133
|
+
const focusInStrategy = (_c = settings === null || settings === void 0 ? void 0 : settings.focusInStrategy) !== null && _c !== void 0 ? _c : 'previous';
|
|
134
|
+
const activeDescendantControl = settings === null || settings === void 0 ? void 0 : settings.activeDescendantControl;
|
|
135
|
+
const activeDescendantCallback = settings === null || settings === void 0 ? void 0 : settings.onActiveDescendantChanged;
|
|
136
136
|
let currentFocusedElement;
|
|
137
|
-
const preventScroll = (_d = settings === null || settings ===
|
|
137
|
+
const preventScroll = (_d = settings === null || settings === void 0 ? void 0 : settings.preventScroll) !== null && _d !== void 0 ? _d : false;
|
|
138
138
|
function getFirstFocusableElement() {
|
|
139
139
|
return focusableElements[0];
|
|
140
140
|
}
|
|
@@ -156,7 +156,7 @@ function focusZone(container, settings) {
|
|
|
156
156
|
if (from && from !== to && savedTabIndex.has(from)) {
|
|
157
157
|
from.setAttribute('tabindex', '-1');
|
|
158
158
|
}
|
|
159
|
-
to === null || to ===
|
|
159
|
+
to === null || to === void 0 ? void 0 : to.setAttribute('tabindex', '0');
|
|
160
160
|
}
|
|
161
161
|
function setActiveDescendant(from, to, directlyActivated = false) {
|
|
162
162
|
if (!to.id) {
|
|
@@ -172,22 +172,22 @@ function focusZone(container, settings) {
|
|
|
172
172
|
activeDescendantControl.setAttribute('aria-activedescendant', to.id);
|
|
173
173
|
container.setAttribute(hasActiveDescendantAttribute, to.id);
|
|
174
174
|
to.setAttribute(isActiveDescendantAttribute, directlyActivated ? activeDescendantActivatedDirectly : activeDescendantActivatedIndirectly);
|
|
175
|
-
activeDescendantCallback === null || activeDescendantCallback ===
|
|
175
|
+
activeDescendantCallback === null || activeDescendantCallback === void 0 ? void 0 : activeDescendantCallback(to, from, directlyActivated);
|
|
176
176
|
}
|
|
177
177
|
function clearActiveDescendant(previouslyActiveElement = currentFocusedElement) {
|
|
178
178
|
if (focusInStrategy === 'first') {
|
|
179
179
|
currentFocusedElement = undefined;
|
|
180
180
|
}
|
|
181
|
-
activeDescendantControl === null || activeDescendantControl ===
|
|
181
|
+
activeDescendantControl === null || activeDescendantControl === void 0 ? void 0 : activeDescendantControl.removeAttribute('aria-activedescendant');
|
|
182
182
|
container.removeAttribute(hasActiveDescendantAttribute);
|
|
183
|
-
previouslyActiveElement === null || previouslyActiveElement ===
|
|
183
|
+
previouslyActiveElement === null || previouslyActiveElement === void 0 ? void 0 : previouslyActiveElement.removeAttribute(isActiveDescendantAttribute);
|
|
184
184
|
for (const item of container.querySelectorAll(`[${isActiveDescendantAttribute}]`)) {
|
|
185
|
-
item === null || item ===
|
|
185
|
+
item === null || item === void 0 ? void 0 : item.removeAttribute(isActiveDescendantAttribute);
|
|
186
186
|
}
|
|
187
|
-
activeDescendantCallback === null || activeDescendantCallback ===
|
|
187
|
+
activeDescendantCallback === null || activeDescendantCallback === void 0 ? void 0 : activeDescendantCallback(undefined, previouslyActiveElement, false);
|
|
188
188
|
}
|
|
189
189
|
function beginFocusManagement(...elements) {
|
|
190
|
-
const filteredElements = elements.filter(e => { var _a, _b; return (_b = (_a = settings === null || settings ===
|
|
190
|
+
const filteredElements = elements.filter(e => { var _a, _b; return (_b = (_a = settings === null || settings === void 0 ? void 0 : settings.focusableElementFilter) === null || _a === void 0 ? void 0 : _a.call(settings, e)) !== null && _b !== void 0 ? _b : true; });
|
|
191
191
|
if (filteredElements.length === 0) {
|
|
192
192
|
return;
|
|
193
193
|
}
|
|
@@ -246,9 +246,9 @@ function focusZone(container, settings) {
|
|
|
246
246
|
}
|
|
247
247
|
}
|
|
248
248
|
const iterateFocusableElementsOptions = {
|
|
249
|
-
reverse: settings === null || settings ===
|
|
250
|
-
strict: settings === null || settings ===
|
|
251
|
-
onlyTabbable: settings === null || settings ===
|
|
249
|
+
reverse: settings === null || settings === void 0 ? void 0 : settings.reverse,
|
|
250
|
+
strict: settings === null || settings === void 0 ? void 0 : settings.strict,
|
|
251
|
+
onlyTabbable: settings === null || settings === void 0 ? void 0 : settings.onlyTabbable,
|
|
252
252
|
};
|
|
253
253
|
beginFocusManagement(...iterateFocusableElements(container, iterateFocusableElementsOptions));
|
|
254
254
|
const initialElement = typeof focusInStrategy === 'function' ? focusInStrategy(document.body) : getFirstFocusableElement();
|
|
@@ -286,7 +286,7 @@ function focusZone(container, settings) {
|
|
|
286
286
|
attributeOldValue: true,
|
|
287
287
|
});
|
|
288
288
|
const controller = new AbortController();
|
|
289
|
-
const signal = (_e = settings === null || settings ===
|
|
289
|
+
const signal = (_e = settings === null || settings === void 0 ? void 0 : settings.abortSignal) !== null && _e !== void 0 ? _e : controller.signal;
|
|
290
290
|
signal.addEventListener('abort', () => {
|
|
291
291
|
endFocusManagement(...focusableElements);
|
|
292
292
|
});
|
|
@@ -343,7 +343,7 @@ function focusZone(container, settings) {
|
|
|
343
343
|
if (event.relatedTarget instanceof Element && !container.contains(event.relatedTarget)) {
|
|
344
344
|
const targetElementIndex = lastKeyboardFocusDirection === 'previous' ? focusableElements.length - 1 : 0;
|
|
345
345
|
const targetElement = focusableElements[targetElementIndex];
|
|
346
|
-
targetElement === null || targetElement ===
|
|
346
|
+
targetElement === null || targetElement === void 0 ? void 0 : targetElement.focus({ preventScroll });
|
|
347
347
|
return;
|
|
348
348
|
}
|
|
349
349
|
else {
|
|
@@ -371,7 +371,7 @@ function focusZone(container, settings) {
|
|
|
371
371
|
lastKeyboardFocusDirection = undefined;
|
|
372
372
|
}, { signal });
|
|
373
373
|
}
|
|
374
|
-
const keyboardEventRecipient = activeDescendantControl !== null && activeDescendantControl !==
|
|
374
|
+
const keyboardEventRecipient = activeDescendantControl !== null && activeDescendantControl !== void 0 ? activeDescendantControl : container;
|
|
375
375
|
let lastKeyboardFocusDirection = undefined;
|
|
376
376
|
if (focusInStrategy === 'closest') {
|
|
377
377
|
document.addEventListener('keydown', event => {
|
|
@@ -397,8 +397,8 @@ function focusZone(container, settings) {
|
|
|
397
397
|
!shouldIgnoreFocusHandling(event, document.activeElement)) {
|
|
398
398
|
const direction = getDirection(event);
|
|
399
399
|
let nextElementToFocus = undefined;
|
|
400
|
-
if (settings === null || settings ===
|
|
401
|
-
nextElementToFocus = settings.getNextFocusable(direction, (_a = document.activeElement) !== null && _a !==
|
|
400
|
+
if (settings === null || settings === void 0 ? void 0 : settings.getNextFocusable) {
|
|
401
|
+
nextElementToFocus = settings.getNextFocusable(direction, (_a = document.activeElement) !== null && _a !== void 0 ? _a : undefined, event);
|
|
402
402
|
}
|
|
403
403
|
if (!nextElementToFocus) {
|
|
404
404
|
const lastFocusedIndex = getCurrentFocusedIndex();
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
function* iterateFocusableElements(container, options = {}) {
|
|
2
2
|
var _a, _b;
|
|
3
|
-
const strict = (_a = options.strict) !== null && _a !==
|
|
4
|
-
const acceptFn = ((_b = options.onlyTabbable) !== null && _b !==
|
|
3
|
+
const strict = (_a = options.strict) !== null && _a !== void 0 ? _a : false;
|
|
4
|
+
const acceptFn = ((_b = options.onlyTabbable) !== null && _b !== void 0 ? _b : false) ? isTabbable : isFocusable;
|
|
5
5
|
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
6
6
|
acceptNode: node => node instanceof HTMLElement && acceptFn(node, strict) ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP,
|
|
7
7
|
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@primer/behaviors",
|
|
3
|
-
"version": "1.8.1-rc.
|
|
3
|
+
"version": "1.8.1-rc.b95e141",
|
|
4
4
|
"description": "Shared behaviors for JavaScript components",
|
|
5
5
|
"type": "commonjs",
|
|
6
6
|
"main": "dist/cjs/index.js",
|
|
@@ -81,7 +81,7 @@
|
|
|
81
81
|
"@types/jest": "^29.5.11",
|
|
82
82
|
"@types/node": "^22.0.0",
|
|
83
83
|
"@types/react": "^19.0.1",
|
|
84
|
-
"esbuild": "^0.
|
|
84
|
+
"esbuild": "^0.25.0",
|
|
85
85
|
"esbuild-jest": "^0.5.0",
|
|
86
86
|
"eslint": "^8.50.0",
|
|
87
87
|
"eslint-plugin-github": "^5.0.0",
|