@react-aria/live-announcer 3.3.3 → 3.3.4
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/LiveAnnouncer.main.js +23 -23
- package/dist/LiveAnnouncer.mjs +24 -24
- package/dist/LiveAnnouncer.module.js +23 -23
- package/package.json +2 -2
|
@@ -18,7 +18,7 @@ $parcel$export(module.exports, "destroyAnnouncer", () => $97cebfa4133ebec3$expor
|
|
|
18
18
|
* governing permissions and limitations under the License.
|
|
19
19
|
*/ /* Inspired by https://github.com/AlmeroSteyn/react-aria-live */ const $97cebfa4133ebec3$var$LIVEREGION_TIMEOUT_DELAY = 7000;
|
|
20
20
|
let $97cebfa4133ebec3$var$liveAnnouncer = null;
|
|
21
|
-
function $97cebfa4133ebec3$export$a9b970dcc4ae71a9(message, assertiveness =
|
|
21
|
+
function $97cebfa4133ebec3$export$a9b970dcc4ae71a9(message, assertiveness = 'assertive', timeout = $97cebfa4133ebec3$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
22
22
|
if (!$97cebfa4133ebec3$var$liveAnnouncer) $97cebfa4133ebec3$var$liveAnnouncer = new $97cebfa4133ebec3$var$LiveAnnouncer();
|
|
23
23
|
$97cebfa4133ebec3$var$liveAnnouncer.announce(message, assertiveness, timeout);
|
|
24
24
|
}
|
|
@@ -39,10 +39,10 @@ function $97cebfa4133ebec3$export$d8686216b8b81b2f() {
|
|
|
39
39
|
// See this discussion for more details: https://github.com/reactwg/react-18/discussions/125#discussioncomment-2382638
|
|
40
40
|
class $97cebfa4133ebec3$var$LiveAnnouncer {
|
|
41
41
|
createLog(ariaLive) {
|
|
42
|
-
let node = document.createElement(
|
|
43
|
-
node.setAttribute(
|
|
44
|
-
node.setAttribute(
|
|
45
|
-
node.setAttribute(
|
|
42
|
+
let node = document.createElement('div');
|
|
43
|
+
node.setAttribute('role', 'log');
|
|
44
|
+
node.setAttribute('aria-live', ariaLive);
|
|
45
|
+
node.setAttribute('aria-relevant', 'additions');
|
|
46
46
|
return node;
|
|
47
47
|
}
|
|
48
48
|
destroy() {
|
|
@@ -50,40 +50,40 @@ class $97cebfa4133ebec3$var$LiveAnnouncer {
|
|
|
50
50
|
document.body.removeChild(this.node);
|
|
51
51
|
this.node = null;
|
|
52
52
|
}
|
|
53
|
-
announce(message, assertiveness =
|
|
53
|
+
announce(message, assertiveness = 'assertive', timeout = $97cebfa4133ebec3$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
54
54
|
if (!this.node) return;
|
|
55
|
-
let node = document.createElement(
|
|
55
|
+
let node = document.createElement('div');
|
|
56
56
|
node.textContent = message;
|
|
57
|
-
if (assertiveness ===
|
|
57
|
+
if (assertiveness === 'assertive') this.assertiveLog.appendChild(node);
|
|
58
58
|
else this.politeLog.appendChild(node);
|
|
59
|
-
if (message !==
|
|
59
|
+
if (message !== '') setTimeout(()=>{
|
|
60
60
|
node.remove();
|
|
61
61
|
}, timeout);
|
|
62
62
|
}
|
|
63
63
|
clear(assertiveness) {
|
|
64
64
|
if (!this.node) return;
|
|
65
|
-
if (!assertiveness || assertiveness ===
|
|
66
|
-
if (!assertiveness || assertiveness ===
|
|
65
|
+
if (!assertiveness || assertiveness === 'assertive') this.assertiveLog.innerHTML = '';
|
|
66
|
+
if (!assertiveness || assertiveness === 'polite') this.politeLog.innerHTML = '';
|
|
67
67
|
}
|
|
68
68
|
constructor(){
|
|
69
|
-
this.node = document.createElement(
|
|
70
|
-
this.node.dataset.liveAnnouncer =
|
|
69
|
+
this.node = document.createElement('div');
|
|
70
|
+
this.node.dataset.liveAnnouncer = 'true';
|
|
71
71
|
// copied from VisuallyHidden
|
|
72
72
|
Object.assign(this.node.style, {
|
|
73
73
|
border: 0,
|
|
74
|
-
clip:
|
|
75
|
-
clipPath:
|
|
76
|
-
height:
|
|
77
|
-
margin:
|
|
78
|
-
overflow:
|
|
74
|
+
clip: 'rect(0 0 0 0)',
|
|
75
|
+
clipPath: 'inset(50%)',
|
|
76
|
+
height: '1px',
|
|
77
|
+
margin: '-1px',
|
|
78
|
+
overflow: 'hidden',
|
|
79
79
|
padding: 0,
|
|
80
|
-
position:
|
|
81
|
-
width:
|
|
82
|
-
whiteSpace:
|
|
80
|
+
position: 'absolute',
|
|
81
|
+
width: '1px',
|
|
82
|
+
whiteSpace: 'nowrap'
|
|
83
83
|
});
|
|
84
|
-
this.assertiveLog = this.createLog(
|
|
84
|
+
this.assertiveLog = this.createLog('assertive');
|
|
85
85
|
this.node.appendChild(this.assertiveLog);
|
|
86
|
-
this.politeLog = this.createLog(
|
|
86
|
+
this.politeLog = this.createLog('polite');
|
|
87
87
|
this.node.appendChild(this.politeLog);
|
|
88
88
|
document.body.prepend(this.node);
|
|
89
89
|
}
|
package/dist/LiveAnnouncer.mjs
CHANGED
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
* governing permissions and limitations under the License.
|
|
11
11
|
*/ /* Inspired by https://github.com/AlmeroSteyn/react-aria-live */ const $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY = 7000;
|
|
12
12
|
let $319e236875307eab$var$liveAnnouncer = null;
|
|
13
|
-
function $319e236875307eab$export$a9b970dcc4ae71a9(message, assertiveness =
|
|
13
|
+
function $319e236875307eab$export$a9b970dcc4ae71a9(message, assertiveness = 'assertive', timeout = $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
14
14
|
if (!$319e236875307eab$var$liveAnnouncer) $319e236875307eab$var$liveAnnouncer = new $319e236875307eab$var$LiveAnnouncer();
|
|
15
15
|
$319e236875307eab$var$liveAnnouncer.announce(message, assertiveness, timeout);
|
|
16
16
|
}
|
|
@@ -31,10 +31,10 @@ function $319e236875307eab$export$d8686216b8b81b2f() {
|
|
|
31
31
|
// See this discussion for more details: https://github.com/reactwg/react-18/discussions/125#discussioncomment-2382638
|
|
32
32
|
class $319e236875307eab$var$LiveAnnouncer {
|
|
33
33
|
createLog(ariaLive) {
|
|
34
|
-
let node = document.createElement(
|
|
35
|
-
node.setAttribute(
|
|
36
|
-
node.setAttribute(
|
|
37
|
-
node.setAttribute(
|
|
34
|
+
let node = document.createElement('div');
|
|
35
|
+
node.setAttribute('role', 'log');
|
|
36
|
+
node.setAttribute('aria-live', ariaLive);
|
|
37
|
+
node.setAttribute('aria-relevant', 'additions');
|
|
38
38
|
return node;
|
|
39
39
|
}
|
|
40
40
|
destroy() {
|
|
@@ -42,40 +42,40 @@ class $319e236875307eab$var$LiveAnnouncer {
|
|
|
42
42
|
document.body.removeChild(this.node);
|
|
43
43
|
this.node = null;
|
|
44
44
|
}
|
|
45
|
-
announce(message, assertiveness =
|
|
45
|
+
announce(message, assertiveness = 'assertive', timeout = $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
46
46
|
if (!this.node) return;
|
|
47
|
-
let node = document.createElement(
|
|
47
|
+
let node = document.createElement('div');
|
|
48
48
|
node.textContent = message;
|
|
49
|
-
if (assertiveness ===
|
|
49
|
+
if (assertiveness === 'assertive') this.assertiveLog.appendChild(node);
|
|
50
50
|
else this.politeLog.appendChild(node);
|
|
51
|
-
if (message !==
|
|
51
|
+
if (message !== '') setTimeout(()=>{
|
|
52
52
|
node.remove();
|
|
53
53
|
}, timeout);
|
|
54
54
|
}
|
|
55
55
|
clear(assertiveness) {
|
|
56
56
|
if (!this.node) return;
|
|
57
|
-
if (!assertiveness || assertiveness ===
|
|
58
|
-
if (!assertiveness || assertiveness ===
|
|
57
|
+
if (!assertiveness || assertiveness === 'assertive') this.assertiveLog.innerHTML = '';
|
|
58
|
+
if (!assertiveness || assertiveness === 'polite') this.politeLog.innerHTML = '';
|
|
59
59
|
}
|
|
60
60
|
constructor(){
|
|
61
|
-
this.node = document.createElement(
|
|
62
|
-
this.node.dataset.liveAnnouncer =
|
|
61
|
+
this.node = document.createElement('div');
|
|
62
|
+
this.node.dataset.liveAnnouncer = 'true';
|
|
63
63
|
// copied from VisuallyHidden
|
|
64
64
|
Object.assign(this.node.style, {
|
|
65
65
|
border: 0,
|
|
66
|
-
clip:
|
|
67
|
-
clipPath:
|
|
68
|
-
height:
|
|
69
|
-
margin:
|
|
70
|
-
overflow:
|
|
66
|
+
clip: 'rect(0 0 0 0)',
|
|
67
|
+
clipPath: 'inset(50%)',
|
|
68
|
+
height: '1px',
|
|
69
|
+
margin: '-1px',
|
|
70
|
+
overflow: 'hidden',
|
|
71
71
|
padding: 0,
|
|
72
|
-
position:
|
|
73
|
-
width:
|
|
74
|
-
whiteSpace:
|
|
72
|
+
position: 'absolute',
|
|
73
|
+
width: '1px',
|
|
74
|
+
whiteSpace: 'nowrap'
|
|
75
75
|
});
|
|
76
|
-
this.assertiveLog = this.createLog(
|
|
76
|
+
this.assertiveLog = this.createLog('assertive');
|
|
77
77
|
this.node.appendChild(this.assertiveLog);
|
|
78
|
-
this.politeLog = this.createLog(
|
|
78
|
+
this.politeLog = this.createLog('polite');
|
|
79
79
|
this.node.appendChild(this.politeLog);
|
|
80
80
|
document.body.prepend(this.node);
|
|
81
81
|
}
|
|
@@ -83,4 +83,4 @@ class $319e236875307eab$var$LiveAnnouncer {
|
|
|
83
83
|
|
|
84
84
|
|
|
85
85
|
export {$319e236875307eab$export$a9b970dcc4ae71a9 as announce, $319e236875307eab$export$d10ae4f68404609a as clearAnnouncer, $319e236875307eab$export$d8686216b8b81b2f as destroyAnnouncer};
|
|
86
|
-
//# sourceMappingURL=LiveAnnouncer.
|
|
86
|
+
//# sourceMappingURL=LiveAnnouncer.module.js.map
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
* governing permissions and limitations under the License.
|
|
11
11
|
*/ /* Inspired by https://github.com/AlmeroSteyn/react-aria-live */ const $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY = 7000;
|
|
12
12
|
let $319e236875307eab$var$liveAnnouncer = null;
|
|
13
|
-
function $319e236875307eab$export$a9b970dcc4ae71a9(message, assertiveness =
|
|
13
|
+
function $319e236875307eab$export$a9b970dcc4ae71a9(message, assertiveness = 'assertive', timeout = $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
14
14
|
if (!$319e236875307eab$var$liveAnnouncer) $319e236875307eab$var$liveAnnouncer = new $319e236875307eab$var$LiveAnnouncer();
|
|
15
15
|
$319e236875307eab$var$liveAnnouncer.announce(message, assertiveness, timeout);
|
|
16
16
|
}
|
|
@@ -31,10 +31,10 @@ function $319e236875307eab$export$d8686216b8b81b2f() {
|
|
|
31
31
|
// See this discussion for more details: https://github.com/reactwg/react-18/discussions/125#discussioncomment-2382638
|
|
32
32
|
class $319e236875307eab$var$LiveAnnouncer {
|
|
33
33
|
createLog(ariaLive) {
|
|
34
|
-
let node = document.createElement(
|
|
35
|
-
node.setAttribute(
|
|
36
|
-
node.setAttribute(
|
|
37
|
-
node.setAttribute(
|
|
34
|
+
let node = document.createElement('div');
|
|
35
|
+
node.setAttribute('role', 'log');
|
|
36
|
+
node.setAttribute('aria-live', ariaLive);
|
|
37
|
+
node.setAttribute('aria-relevant', 'additions');
|
|
38
38
|
return node;
|
|
39
39
|
}
|
|
40
40
|
destroy() {
|
|
@@ -42,40 +42,40 @@ class $319e236875307eab$var$LiveAnnouncer {
|
|
|
42
42
|
document.body.removeChild(this.node);
|
|
43
43
|
this.node = null;
|
|
44
44
|
}
|
|
45
|
-
announce(message, assertiveness =
|
|
45
|
+
announce(message, assertiveness = 'assertive', timeout = $319e236875307eab$var$LIVEREGION_TIMEOUT_DELAY) {
|
|
46
46
|
if (!this.node) return;
|
|
47
|
-
let node = document.createElement(
|
|
47
|
+
let node = document.createElement('div');
|
|
48
48
|
node.textContent = message;
|
|
49
|
-
if (assertiveness ===
|
|
49
|
+
if (assertiveness === 'assertive') this.assertiveLog.appendChild(node);
|
|
50
50
|
else this.politeLog.appendChild(node);
|
|
51
|
-
if (message !==
|
|
51
|
+
if (message !== '') setTimeout(()=>{
|
|
52
52
|
node.remove();
|
|
53
53
|
}, timeout);
|
|
54
54
|
}
|
|
55
55
|
clear(assertiveness) {
|
|
56
56
|
if (!this.node) return;
|
|
57
|
-
if (!assertiveness || assertiveness ===
|
|
58
|
-
if (!assertiveness || assertiveness ===
|
|
57
|
+
if (!assertiveness || assertiveness === 'assertive') this.assertiveLog.innerHTML = '';
|
|
58
|
+
if (!assertiveness || assertiveness === 'polite') this.politeLog.innerHTML = '';
|
|
59
59
|
}
|
|
60
60
|
constructor(){
|
|
61
|
-
this.node = document.createElement(
|
|
62
|
-
this.node.dataset.liveAnnouncer =
|
|
61
|
+
this.node = document.createElement('div');
|
|
62
|
+
this.node.dataset.liveAnnouncer = 'true';
|
|
63
63
|
// copied from VisuallyHidden
|
|
64
64
|
Object.assign(this.node.style, {
|
|
65
65
|
border: 0,
|
|
66
|
-
clip:
|
|
67
|
-
clipPath:
|
|
68
|
-
height:
|
|
69
|
-
margin:
|
|
70
|
-
overflow:
|
|
66
|
+
clip: 'rect(0 0 0 0)',
|
|
67
|
+
clipPath: 'inset(50%)',
|
|
68
|
+
height: '1px',
|
|
69
|
+
margin: '-1px',
|
|
70
|
+
overflow: 'hidden',
|
|
71
71
|
padding: 0,
|
|
72
|
-
position:
|
|
73
|
-
width:
|
|
74
|
-
whiteSpace:
|
|
72
|
+
position: 'absolute',
|
|
73
|
+
width: '1px',
|
|
74
|
+
whiteSpace: 'nowrap'
|
|
75
75
|
});
|
|
76
|
-
this.assertiveLog = this.createLog(
|
|
76
|
+
this.assertiveLog = this.createLog('assertive');
|
|
77
77
|
this.node.appendChild(this.assertiveLog);
|
|
78
|
-
this.politeLog = this.createLog(
|
|
78
|
+
this.politeLog = this.createLog('polite');
|
|
79
79
|
this.node.appendChild(this.politeLog);
|
|
80
80
|
document.body.prepend(this.node);
|
|
81
81
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/live-announcer",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.4",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -27,5 +27,5 @@
|
|
|
27
27
|
"publishConfig": {
|
|
28
28
|
"access": "public"
|
|
29
29
|
},
|
|
30
|
-
"gitHead": "
|
|
30
|
+
"gitHead": "b77d7d594dff4dcfb5359bffbcfd18142b146433"
|
|
31
31
|
}
|