@vaadin/a11y-base 25.3.0-alpha4 → 25.3.0-alpha6
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/index.d.ts +1 -1
- package/index.js +1 -1
- package/package.json +5 -5
- package/src/focus-trap-controller.js +2 -2
- package/src/focus-utils.d.ts +3 -2
- package/src/focus-utils.js +3 -7
- package/src/list-mixin.d.ts +5 -0
- package/src/list-mixin.js +10 -0
package/index.d.ts
CHANGED
|
@@ -5,7 +5,7 @@ export { DisabledMixin } from './src/disabled-mixin.js';
|
|
|
5
5
|
export { FieldAriaController } from './src/field-aria-controller.js';
|
|
6
6
|
export { FocusMixin } from './src/focus-mixin.js';
|
|
7
7
|
export {
|
|
8
|
-
|
|
8
|
+
getTabbableElements,
|
|
9
9
|
isElementFocusable,
|
|
10
10
|
isElementFocused,
|
|
11
11
|
isElementHidden,
|
package/index.js
CHANGED
|
@@ -7,7 +7,7 @@ export { FocusMixin } from './src/focus-mixin.js';
|
|
|
7
7
|
export { FocusTrapController } from './src/focus-trap-controller.js';
|
|
8
8
|
export { FocusRestorationController } from './src/focus-restoration-controller.js';
|
|
9
9
|
export {
|
|
10
|
-
|
|
10
|
+
getTabbableElements,
|
|
11
11
|
isElementFocusable,
|
|
12
12
|
isElementFocused,
|
|
13
13
|
isElementHidden,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/a11y-base",
|
|
3
|
-
"version": "25.3.0-
|
|
3
|
+
"version": "25.3.0-alpha6",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -32,15 +32,15 @@
|
|
|
32
32
|
],
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
35
|
-
"@vaadin/component-base": "25.3.0-
|
|
35
|
+
"@vaadin/component-base": "25.3.0-alpha6",
|
|
36
36
|
"lit": "^3.0.0"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@vaadin/chai-plugins": "25.3.0-
|
|
40
|
-
"@vaadin/test-runner-commands": "25.3.0-
|
|
39
|
+
"@vaadin/chai-plugins": "25.3.0-alpha6",
|
|
40
|
+
"@vaadin/test-runner-commands": "25.3.0-alpha6",
|
|
41
41
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
42
42
|
"sinon": "^22.0.0"
|
|
43
43
|
},
|
|
44
44
|
"customElements": "custom-elements.json",
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "92c124fb9cff367bc07e734d8e65707facd0bd43"
|
|
46
46
|
}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Copyright (c) 2021 - 2026 Vaadin Ltd.
|
|
4
4
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
5
5
|
*/
|
|
6
|
-
import {
|
|
6
|
+
import { getTabbableElements, isElementFocused, isKeyboardActive } from './focus-utils.js';
|
|
7
7
|
|
|
8
8
|
const instances = [];
|
|
9
9
|
|
|
@@ -57,7 +57,7 @@ export class FocusTrapController {
|
|
|
57
57
|
* @private
|
|
58
58
|
*/
|
|
59
59
|
get __focusableElements() {
|
|
60
|
-
return
|
|
60
|
+
return getTabbableElements(this.__trapNode);
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
/**
|
package/src/focus-utils.d.ts
CHANGED
|
@@ -26,7 +26,8 @@ export declare function isKeyboardActive(): boolean;
|
|
|
26
26
|
export declare function isElementHidden(element: HTMLElement): boolean;
|
|
27
27
|
|
|
28
28
|
/**
|
|
29
|
-
* Returns true if the element is focusable,
|
|
29
|
+
* Returns true if the element is focusable, i.e. can be focused with a
|
|
30
|
+
* mouse click or a `focus()` call, otherwise false.
|
|
30
31
|
*
|
|
31
32
|
* The list of focusable elements is taken from http://stackoverflow.com/a/1600194/4228703.
|
|
32
33
|
* However, there isn't a definite list, it's up to the browser.
|
|
@@ -54,4 +55,4 @@ export declare function isElementFocused(element: HTMLElement): boolean;
|
|
|
54
55
|
*
|
|
55
56
|
* The method traverses nodes in shadow DOM trees too if any.
|
|
56
57
|
*/
|
|
57
|
-
export declare function
|
|
58
|
+
export declare function getTabbableElements(element: HTMLElement): HTMLElement[];
|
package/src/focus-utils.js
CHANGED
|
@@ -165,7 +165,8 @@ export function isElementHidden(element) {
|
|
|
165
165
|
}
|
|
166
166
|
|
|
167
167
|
/**
|
|
168
|
-
* Returns true if the element is focusable,
|
|
168
|
+
* Returns true if the element is focusable, i.e. can be focused with a
|
|
169
|
+
* mouse click or a `focus()` call, otherwise false.
|
|
169
170
|
*
|
|
170
171
|
* The list of focusable elements is taken from http://stackoverflow.com/a/1600194/4228703.
|
|
171
172
|
* However, there isn't a definite list, it's up to the browser.
|
|
@@ -184,11 +185,6 @@ export function isElementHidden(element) {
|
|
|
184
185
|
* @return {boolean}
|
|
185
186
|
*/
|
|
186
187
|
export function isElementFocusable(element) {
|
|
187
|
-
// The element cannot be focused if its `tabindex` attribute is set to `-1`.
|
|
188
|
-
if (element.matches('[tabindex="-1"]')) {
|
|
189
|
-
return false;
|
|
190
|
-
}
|
|
191
|
-
|
|
192
188
|
// Elements that cannot be focused if they have a `disabled` attribute.
|
|
193
189
|
if (element.matches('input, select, textarea, button, object')) {
|
|
194
190
|
return element.matches(':not([disabled])');
|
|
@@ -271,7 +267,7 @@ function collectFocusableNodes(node, result) {
|
|
|
271
267
|
* @param {HTMLElement} element
|
|
272
268
|
* @return {HTMLElement[]}
|
|
273
269
|
*/
|
|
274
|
-
export function
|
|
270
|
+
export function getTabbableElements(element) {
|
|
275
271
|
const focusableElements = [];
|
|
276
272
|
const needsSortByTabIndex = collectFocusableNodes(element, focusableElements);
|
|
277
273
|
// If there is at least one element with tabindex > 0,
|
package/src/list-mixin.d.ts
CHANGED
|
@@ -35,6 +35,11 @@ export declare class ListMixinClass {
|
|
|
35
35
|
*/
|
|
36
36
|
orientation: 'horizontal' | 'vertical';
|
|
37
37
|
|
|
38
|
+
/**
|
|
39
|
+
* Used for mixin detection because `instanceof` does not work with mixins.
|
|
40
|
+
*/
|
|
41
|
+
protected _hasVaadinListMixin: boolean;
|
|
42
|
+
|
|
38
43
|
/**
|
|
39
44
|
* A read-only list of items from which a selection can be made.
|
|
40
45
|
* It is populated from the elements passed to the light DOM,
|
package/src/list-mixin.js
CHANGED
|
@@ -77,6 +77,16 @@ export const ListMixin = (superClass) =>
|
|
|
77
77
|
return ['_enhanceItems(items, orientation, selected, disabled)'];
|
|
78
78
|
}
|
|
79
79
|
|
|
80
|
+
constructor() {
|
|
81
|
+
super();
|
|
82
|
+
|
|
83
|
+
/**
|
|
84
|
+
* Used for mixin detection because `instanceof` does not work with mixins.
|
|
85
|
+
* @protected
|
|
86
|
+
*/
|
|
87
|
+
this._hasVaadinListMixin = true;
|
|
88
|
+
}
|
|
89
|
+
|
|
80
90
|
/**
|
|
81
91
|
* @return {boolean}
|
|
82
92
|
* @protected
|