@nswds/app 1.122.0 → 1.123.0
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/index.cjs +14 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +14 -9
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -15091,7 +15091,7 @@ function resolveBackgroundToken(themeCategory, primaryKey, accentKey, preferredT
|
|
|
15091
15091
|
function getContrastRatio(backgroundHex, foregroundHex) {
|
|
15092
15092
|
return culori.wcagContrast(backgroundHex, foregroundHex) ?? 0;
|
|
15093
15093
|
}
|
|
15094
|
-
function
|
|
15094
|
+
function getContrastComplianceSummary(contrastRatio) {
|
|
15095
15095
|
if (contrastRatio >= AAA_NORMAL_CONTRAST_RATIO) {
|
|
15096
15096
|
return "Passes AA large, AA normal, AAA large, and AAA normal";
|
|
15097
15097
|
}
|
|
@@ -15231,12 +15231,12 @@ function getRecommendedCandidate(themeCategory, background, primaryFamily, accen
|
|
|
15231
15231
|
}
|
|
15232
15232
|
return null;
|
|
15233
15233
|
}
|
|
15234
|
-
function
|
|
15234
|
+
function getForegroundOptionsMeetingAaLarge(themeCategory, background, primaryFamily, accentFamily) {
|
|
15235
15235
|
return scoreForegroundCandidates(themeCategory, background, primaryFamily, accentFamily).filter((candidate) => candidate.contrastRatio >= AA_LARGE_CONTRAST_RATIO).sort((left, right) => right.contrastRatio - left.contrastRatio);
|
|
15236
15236
|
}
|
|
15237
15237
|
function getPreviewAnnouncement(background, foreground) {
|
|
15238
15238
|
if (!foreground) {
|
|
15239
|
-
return `${background.token} selected. No
|
|
15239
|
+
return `${background.token} selected. No foreground options meeting AA large (3 to 1) are available.`;
|
|
15240
15240
|
}
|
|
15241
15241
|
return `${background.token} paired with ${foreground.token}. Contrast ratio ${foreground.contrastRatio.toFixed(2)} to 1.`;
|
|
15242
15242
|
}
|
|
@@ -15294,7 +15294,7 @@ function getInitialPairingState(searchParams) {
|
|
|
15294
15294
|
const backgroundShade = [...primaryFamily.shades, ...accentFamily.shades, ...greyFamily.shades].find(
|
|
15295
15295
|
(shade) => shade.token === selectedBackgroundToken
|
|
15296
15296
|
) ?? getShadeForTone(primaryFamily, DEFAULT_BACKGROUND_TONE);
|
|
15297
|
-
const selectedForegroundId =
|
|
15297
|
+
const selectedForegroundId = getForegroundOptionsMeetingAaLarge(
|
|
15298
15298
|
themeCategory,
|
|
15299
15299
|
backgroundShade,
|
|
15300
15300
|
primaryFamily,
|
|
@@ -15511,7 +15511,7 @@ function ForegroundOption({
|
|
|
15511
15511
|
" ",
|
|
15512
15512
|
candidate.contrastRatio.toFixed(2),
|
|
15513
15513
|
" to 1, ",
|
|
15514
|
-
|
|
15514
|
+
badge.label
|
|
15515
15515
|
] })
|
|
15516
15516
|
]
|
|
15517
15517
|
}
|
|
@@ -15554,7 +15554,12 @@ function ColorPairingToolContent({ visibleFormats }) {
|
|
|
15554
15554
|
[backgroundShadeOptions, selectedBackgroundToken]
|
|
15555
15555
|
);
|
|
15556
15556
|
const accessibleForegroundOptions = useMemo(
|
|
15557
|
-
() =>
|
|
15557
|
+
() => getForegroundOptionsMeetingAaLarge(
|
|
15558
|
+
themeCategory,
|
|
15559
|
+
backgroundShade,
|
|
15560
|
+
primaryFamily,
|
|
15561
|
+
accentFamily
|
|
15562
|
+
),
|
|
15558
15563
|
[accentFamily, backgroundShade, primaryFamily, themeCategory]
|
|
15559
15564
|
);
|
|
15560
15565
|
const recommendedForeground = useMemo(
|
|
@@ -15691,7 +15696,7 @@ function ColorPairingToolContent({ visibleFormats }) {
|
|
|
15691
15696
|
`format: ${getColorFormatLabel(resolvedCopyFormat)}`,
|
|
15692
15697
|
`foreground: ${previewForeground.token} (${getColorValue(previewForeground, resolvedCopyFormat)})`,
|
|
15693
15698
|
`background: ${backgroundShade.token} (${getColorValue(backgroundShade, resolvedCopyFormat)})`,
|
|
15694
|
-
`contrast: ${previewForeground.contrastRatio.toFixed(2)}:1 ${
|
|
15699
|
+
`contrast: ${previewForeground.contrastRatio.toFixed(2)}:1 ${getContrastComplianceSummary(previewForeground.contrastRatio)}`
|
|
15695
15700
|
].join("\n")
|
|
15696
15701
|
);
|
|
15697
15702
|
setCopiedKey("pairing");
|
|
@@ -16068,7 +16073,7 @@ function ColorPairingToolContent({ visibleFormats }) {
|
|
|
16068
16073
|
onClick: () => handleForegroundChange(candidate.id)
|
|
16069
16074
|
},
|
|
16070
16075
|
candidate.id
|
|
16071
|
-
)) : /* @__PURE__ */ jsx("p", { className: "py-3 text-sm text-grey-600", children: "No
|
|
16076
|
+
)) : /* @__PURE__ */ jsx("p", { className: "py-3 text-sm text-grey-600", children: "No foreground options meeting AA large (3:1) are available for this background." }) })
|
|
16072
16077
|
] })
|
|
16073
16078
|
] })
|
|
16074
16079
|
] }) });
|
|
@@ -18969,7 +18974,7 @@ function FormatToggle({ format, setFormat }) {
|
|
|
18969
18974
|
|
|
18970
18975
|
// package.json
|
|
18971
18976
|
var package_default = {
|
|
18972
|
-
version: "1.
|
|
18977
|
+
version: "1.122.0"};
|
|
18973
18978
|
var SluggerContext = React5__default.createContext(null);
|
|
18974
18979
|
function flattenText(nodes) {
|
|
18975
18980
|
if (nodes == null || typeof nodes === "boolean") return "";
|