fix(admin): keyboard-reachable audit payload toggle; drop dead step ternary
Review follow-ups: the audit row's expand was mouse-only (onclick on a bare
<tr>). Move the toggle to a real <button> in the actions cell with
aria-expanded + aria-label so keyboard/AT users can open a row's payload; the
row onclick stays as a mouse convenience (stopPropagation avoids a double
toggle). Also simplify a no-op `step={'%' ? '1' : '1'}` to step="1" on the
threshold inputs.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -149,9 +149,20 @@
|
||||
<td><span class="action">{r.action}</span></td>
|
||||
<td class="target">{targetLabel(r)}</td>
|
||||
<td class="actions">
|
||||
<span class="chev" aria-hidden="true"
|
||||
>{expanded === r.id ? '▾' : '▸'}</span
|
||||
<!-- Real button so the payload toggle is keyboard-
|
||||
reachable; the row onclick is a mouse convenience. -->
|
||||
<button
|
||||
type="button"
|
||||
class="chev"
|
||||
aria-expanded={expanded === r.id}
|
||||
aria-label={expanded === r.id ? 'Collapse payload' : 'Expand payload'}
|
||||
onclick={(e) => {
|
||||
e.stopPropagation();
|
||||
expanded = expanded === r.id ? null : r.id;
|
||||
}}
|
||||
>
|
||||
{expanded === r.id ? '▾' : '▸'}
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
{#if expanded === r.id}
|
||||
@@ -213,6 +224,19 @@
|
||||
text-align: right;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.chev {
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--text-muted);
|
||||
cursor: pointer;
|
||||
font-size: var(--font-sm);
|
||||
padding: 2px var(--space-1);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
.chev:hover {
|
||||
color: var(--text);
|
||||
background: var(--surface-elevated);
|
||||
}
|
||||
tr.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -158,7 +158,7 @@
|
||||
<span>{f.label}{f.unit ? ` (${f.unit})` : ''}</span>
|
||||
<input
|
||||
type="number"
|
||||
step={f.unit === '%' ? '1' : '1'}
|
||||
step="1"
|
||||
min="0"
|
||||
bind:value={form[f.key]}
|
||||
data-testid={`threshold-${f.key}`}
|
||||
|
||||
Reference in New Issue
Block a user