fix(a11y): radiogroup semantics for Campaign bonus-type selector

AdminCampaignCreate + AdminCampaignEdit: bonus-type button grid now uses
role=radiogroup + aria-labelledby + role=radio + aria-checked (WCAG 4.1.2).
This commit is contained in:
c0mrade
2026-05-26 11:32:32 +03:00
parent 30c4c2ecc6
commit 27ba50747a
2 changed files with 16 additions and 4 deletions

View File

@@ -393,15 +393,21 @@ export default function AdminCampaignCreate() {
{/* Bonus Type */}
<div className="card space-y-4">
<h2 className="text-lg font-semibold text-dark-100">
<h2 id="bonus-type-label" className="text-lg font-semibold text-dark-100">
{t('admin.campaigns.form.bonusType')}
</h2>
<div className="grid grid-cols-2 gap-3">
<div
className="grid grid-cols-2 gap-3"
role="radiogroup"
aria-labelledby="bonus-type-label"
>
{(Object.keys(bonusTypeConfig) as CampaignBonusType[]).map((type) => (
<button
key={type}
type="button"
role="radio"
aria-checked={bonusType === type}
onClick={() => setBonusType(type)}
className={`rounded-lg border p-4 text-left transition-all ${
bonusType === type

View File

@@ -429,15 +429,21 @@ export default function AdminCampaignEdit() {
{/* Bonus Type */}
<div className="card space-y-4">
<h2 className="text-lg font-semibold text-dark-100">
<h2 id="bonus-type-edit-label" className="text-lg font-semibold text-dark-100">
{t('admin.campaigns.form.bonusType')}
</h2>
<div className="grid grid-cols-2 gap-3">
<div
className="grid grid-cols-2 gap-3"
role="radiogroup"
aria-labelledby="bonus-type-edit-label"
>
{(Object.keys(bonusTypeConfig) as CampaignBonusType[]).map((type) => (
<button
key={type}
type="button"
role="radio"
aria-checked={bonusType === type}
onClick={() => setBonusType(type)}
className={`rounded-lg border p-4 text-left transition-all ${
bonusType === type