This commit is contained in:
2026-03-29 15:01:30 +02:00
parent 7626c9cb60
commit ccfcbc82c5

View File

@@ -150,16 +150,18 @@ function GeoLayer({
} }
return ( return (
<g <g key={geo.rsmKey} style={{ cursor: cc ? "pointer" : "default" }}>
key={geo.rsmKey} <Geography
style={{ cursor: cc ? "pointer" : "default" }} geography={geo}
role={cc ? "button" : undefined} role={cc ? "button" : undefined}
tabIndex={cc ? 0 : undefined} tabIndex={cc ? 0 : undefined}
aria-label={cc aria-label={
? `${cc}: ${String(count)} ban${count !== 1 ? "s" : ""}${ cc
isSelected ? " (selected)" : "" ? `${cc}: ${String(count)} ban${count !== 1 ? "s" : ""}${
}` isSelected ? " (selected)" : ""
: undefined} }`
: undefined
}
aria-pressed={isSelected || undefined} aria-pressed={isSelected || undefined}
onClick={(): void => { onClick={(): void => {
if (cc) handleClick(cc); if (cc) handleClick(cc);
@@ -194,46 +196,43 @@ function GeoLayer({
onMouseLeave={(): void => { onMouseLeave={(): void => {
setTooltip(null); setTooltip(null);
}} }}
> style={{
<Geography default: {
geography={geo} fill: isSelected ? tokens.colorBrandBackground : fillColor,
style={{ stroke: tokens.colorNeutralStroke2,
default: { strokeWidth: 0.75,
fill: isSelected ? tokens.colorBrandBackground : fillColor, outline: "none",
stroke: tokens.colorNeutralStroke2, },
strokeWidth: 0.75, hover: {
outline: "none", fill: isSelected
}, ? tokens.colorBrandBackgroundHover
hover: { : cc && count > 0
fill: isSelected ? tokens.colorNeutralBackground3
? tokens.colorBrandBackgroundHover : fillColor,
: cc && count > 0 stroke: tokens.colorNeutralStroke1,
? tokens.colorNeutralBackground3 strokeWidth: 1,
: fillColor, outline: "none",
stroke: tokens.colorNeutralStroke1, },
strokeWidth: 1, pressed: {
outline: "none", fill: cc ? tokens.colorBrandBackgroundPressed : fillColor,
}, stroke: tokens.colorBrandStroke1,
pressed: { strokeWidth: 1,
fill: cc ? tokens.colorBrandBackgroundPressed : fillColor, outline: "none",
stroke: tokens.colorBrandStroke1, },
strokeWidth: 1, }}
outline: "none", />
}, {count > 0 && cx !== undefined && cy !== undefined && isFinite(cx) && isFinite(cy) && (
}} <text
/> x={cx}
{count > 0 && cx !== undefined && cy !== undefined && isFinite(cx) && isFinite(cy) && ( y={cy}
<text textAnchor="middle"
x={cx} dominantBaseline="central"
y={cy} className={styles.countLabel}
textAnchor="middle" >
dominantBaseline="central" {count}
className={styles.countLabel} </text>
> )}
{count} </g>
</text>
)}
</g>
); );
}, },
)} )}