fix(web): focus-visible rings on remaining controls + live search count (#69)

Keyboard focus was invisible on the objects-table sort headers and
page-size select, breadcrumb links, the external-URI link, and the
combobox input/clear/trigger. Apply the shared focusRing helper in app
code and the kit's inline focus-visible classes (matching input.tsx)
in ui/combobox.

Make the search result count a role="status" live region so screen
readers announce updated counts while typing; the existing search test
now asserts the count through getByRole("status").

Closes #69

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-10 13:29:27 +02:00
parent 1d19ddfd96
commit ec11c9dc76
6 changed files with 22 additions and 9 deletions
+9 -3
View File
@@ -20,7 +20,10 @@ function ComboboxInput({ className, ...props }: ComboboxPrimitive.Input.Props) {
return (
<ComboboxPrimitive.Input
data-slot="combobox-input"
className={cn("w-full rounded border px-2 py-1 pr-12 text-sm", className)}
className={cn(
"w-full rounded border px-2 py-1 pr-12 text-sm transition-colors outline-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50",
className,
)}
{...props}
/>
);
@@ -31,7 +34,7 @@ function ComboboxClear({ className, ...props }: ComboboxPrimitive.Clear.Props) {
<ComboboxPrimitive.Clear
data-slot="combobox-clear"
className={cn(
"absolute right-6 text-muted-foreground hover:text-foreground",
"absolute right-6 rounded-sm text-muted-foreground outline-none hover:text-foreground focus-visible:ring-3 focus-visible:ring-ring/50",
className,
)}
{...props}
@@ -43,7 +46,10 @@ function ComboboxTrigger({ className, ...props }: ComboboxPrimitive.Trigger.Prop
return (
<ComboboxPrimitive.Trigger
data-slot="combobox-trigger"
className={cn("absolute right-1 text-muted-foreground", className)}
className={cn(
"absolute right-1 rounded-sm text-muted-foreground outline-none focus-visible:ring-3 focus-visible:ring-ring/50",
className,
)}
{...props}
/>
);