@gouvfr/dsfr-roller 1.0.48 → 1.0.49
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/package.json +3 -3
- package/src/page/body/main.js +21 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@gouvfr/dsfr-roller",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.49",
|
|
4
4
|
"description": "Le module `dsfr-roller` permet de publier le site de documentation du Système de Design de l’État - DSFR",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Système de Design de l'État",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
},
|
|
43
43
|
"type": "module",
|
|
44
44
|
"engines": {
|
|
45
|
-
"node": ">=
|
|
45
|
+
"node": ">=20.19.3"
|
|
46
46
|
},
|
|
47
47
|
"packageManager": "yarn@4.5.2+sha224.c2e2e9ed3cdadd6ec250589b3393f71ae56d5ec297af11cec1eba3b4",
|
|
48
48
|
"files": [
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
],
|
|
57
57
|
"main": "./index.js",
|
|
58
58
|
"dependencies": {
|
|
59
|
-
"@gouvfr/dsfr-forge": "=1.0.
|
|
59
|
+
"@gouvfr/dsfr-forge": "=1.0.49",
|
|
60
60
|
"@gouvfr/dsfr-publisher": "npm:@gouvfr/dsfr@1.14.0",
|
|
61
61
|
"deepmerge": "^4.3.1",
|
|
62
62
|
"ejs": "^3.1.10",
|
package/src/page/body/main.js
CHANGED
|
@@ -1,6 +1,18 @@
|
|
|
1
1
|
import { templateFactory } from '../../template/template-factory.js';
|
|
2
2
|
import { Renderable } from '../../core/renderable.js';
|
|
3
3
|
|
|
4
|
+
const EMOJI_REGEX = /((?)\p{Emoji}(?:(?!\u{200D})\p{EComp}|(?=\u{200D})\u{200D}\p{Emoji})*)+/gmu;
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Surrounds the given text with a span element with aria-hidden attribute.
|
|
8
|
+
* This is used to wrap emojis in a span to prevent them from being read by screen readers.
|
|
9
|
+
* @param {string} text - The text to be wrapped.
|
|
10
|
+
* @returns {string} - The text wrapped in a span element.
|
|
11
|
+
*/
|
|
12
|
+
const surroundEmojiWithSpan = (text) => {
|
|
13
|
+
return text.replace(EMOJI_REGEX, (match) => `<span aria-hidden="true">${match}</span>`);
|
|
14
|
+
};
|
|
15
|
+
|
|
4
16
|
class Main extends Renderable {
|
|
5
17
|
constructor (data) {
|
|
6
18
|
super(data);
|
|
@@ -8,13 +20,21 @@ class Main extends Renderable {
|
|
|
8
20
|
}
|
|
9
21
|
|
|
10
22
|
async render () {
|
|
23
|
+
let renderedContent = await this._template.render();
|
|
24
|
+
renderedContent = this.silenceEmoji(renderedContent);
|
|
25
|
+
|
|
11
26
|
return `
|
|
12
27
|
<main id="content" role="main">
|
|
13
|
-
${
|
|
28
|
+
${renderedContent}
|
|
14
29
|
</main>
|
|
15
30
|
`;
|
|
16
31
|
}
|
|
17
32
|
|
|
33
|
+
silenceEmoji (text) {
|
|
34
|
+
const parts = text.split(/(<span[^>]+aria-hidden[^>]*>.*?<\/span>)/g);
|
|
35
|
+
return parts.map(part => part.includes('aria-hidden') ? part : surroundEmojiWithSpan(part)).join('')
|
|
36
|
+
};
|
|
37
|
+
|
|
18
38
|
get text () {
|
|
19
39
|
return this._template.text;
|
|
20
40
|
}
|