@mintlify/cli 4.0.762 → 4.0.763
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/bin/accessibility.js +26 -12
- package/bin/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +2 -2
- package/src/accessibility.ts +35 -15
package/bin/accessibility.js
CHANGED
|
@@ -5,7 +5,7 @@ export const WCAG_STANDARDS = {
|
|
|
5
5
|
AAA_NORMAL: 7,
|
|
6
6
|
AAA_LARGE: 4.5,
|
|
7
7
|
};
|
|
8
|
-
export function checkColorContrast(foreground, background) {
|
|
8
|
+
export function checkColorContrast(foreground, background, minThreshold = WCAG_STANDARDS.AA_NORMAL) {
|
|
9
9
|
try {
|
|
10
10
|
const fg = Color(foreground);
|
|
11
11
|
const bg = Color(background);
|
|
@@ -15,17 +15,29 @@ export function checkColorContrast(foreground, background) {
|
|
|
15
15
|
const meetsAAA = level === 'AAA';
|
|
16
16
|
let recommendation;
|
|
17
17
|
let message;
|
|
18
|
-
if (
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
18
|
+
if (minThreshold !== WCAG_STANDARDS.AA_NORMAL) {
|
|
19
|
+
if (ratio >= minThreshold) {
|
|
20
|
+
recommendation = 'pass';
|
|
21
|
+
message = `Contrast ratio: ${ratio.toFixed(2)}:1 (meets minimum threshold of ${minThreshold}:1)`;
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
recommendation = 'fail';
|
|
25
|
+
message = `Poor contrast ratio: ${ratio.toFixed(2)}:1 (fails minimum threshold, required: ${minThreshold}:1)`;
|
|
26
|
+
}
|
|
25
27
|
}
|
|
26
28
|
else {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
+
if (meetsAAA) {
|
|
30
|
+
recommendation = 'pass';
|
|
31
|
+
message = `Excellent contrast ratio: ${ratio.toFixed(2)}:1 (meets WCAG AAA)`;
|
|
32
|
+
}
|
|
33
|
+
else if (meetsAA) {
|
|
34
|
+
recommendation = 'warning';
|
|
35
|
+
message = `Good contrast ratio: ${ratio.toFixed(2)}:1 (meets WCAG AA, consider AAA for better accessibility)`;
|
|
36
|
+
}
|
|
37
|
+
else {
|
|
38
|
+
recommendation = 'fail';
|
|
39
|
+
message = `Poor contrast ratio: ${ratio.toFixed(2)}:1 (fails WCAG AA, minimum required: ${WCAG_STANDARDS.AA_NORMAL}:1)`;
|
|
40
|
+
}
|
|
29
41
|
}
|
|
30
42
|
return {
|
|
31
43
|
ratio,
|
|
@@ -47,8 +59,10 @@ export function checkDocsColors(colors, background, navigation) {
|
|
|
47
59
|
? checkColorContrast(colors.primary, lightBackground)
|
|
48
60
|
: null;
|
|
49
61
|
const lightContrast = colors.light ? checkColorContrast(colors.light, darkBackground) : null;
|
|
50
|
-
const darkContrast = colors.dark ? checkColorContrast(colors.dark, darkBackground) : null;
|
|
51
|
-
const darkOnLightContrast = colors.dark
|
|
62
|
+
const darkContrast = colors.dark ? checkColorContrast(colors.dark, darkBackground, 3) : null;
|
|
63
|
+
const darkOnLightContrast = colors.dark
|
|
64
|
+
? checkColorContrast(colors.dark, lightBackground, 3)
|
|
65
|
+
: null;
|
|
52
66
|
const anchorResults = [];
|
|
53
67
|
if ((_a = navigation === null || navigation === void 0 ? void 0 : navigation.global) === null || _a === void 0 ? void 0 : _a.anchors) {
|
|
54
68
|
for (const anchor of navigation.global.anchors) {
|