From 09b0741b373864da251849bd06d51a5736551b79 Mon Sep 17 00:00:00 2001 From: Anna Effort Date: Thu, 20 Aug 2026 10:57:18 -0700 Subject: [PATCH] fix(ui): restore the flat row fill on tools, resources & prompts tables MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Reverts the light/dark hover and selected steps added in 8a07588 during PR #47. The steps sat below the contrast threshold, so they read as a selection cue without being one — the details drawer remains the affordance for which row is open. Drops the comment that framed the flat fill as an accessibility gap. Signed-off-by: Anna Effort --- src/components/prompts/PromptDefinitionTable.tsx | 6 +----- src/components/resources/ResourcesTable.tsx | 2 +- src/components/tools/ToolsTable.tsx | 2 +- 3 files changed, 3 insertions(+), 7 deletions(-) diff --git a/src/components/prompts/PromptDefinitionTable.tsx b/src/components/prompts/PromptDefinitionTable.tsx index bdabc68..28c3b34 100644 --- a/src/components/prompts/PromptDefinitionTable.tsx +++ b/src/components/prompts/PromptDefinitionTable.tsx @@ -35,10 +35,6 @@ export interface PromptDefinitionTableProps { * copyable ID, plus a per-row overflow menu (Edit/Delete). Selecting a row * updates the Prompt details sidebar. The overflow menu replaces the one that * previously sat beside the panel title. - * - * a11y: row selection is conveyed visually via `data-state` only, matching the - * Tools/Resources tables. Exposing it to assistive tech (grid role + - * aria-selected) is a cross-cutting follow-up across all three tables. */ export function PromptDefinitionTable({ prompts, @@ -79,7 +75,7 @@ export function PromptDefinitionTable({ onSelectPrompt(prompt); } }} - className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-100 data-[state=selected]:bg-neutral-200 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-700/60 dark:data-[state=selected]:bg-neutral-700 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" + className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-50 data-[state=selected]:bg-neutral-50 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-800/50 dark:data-[state=selected]:bg-neutral-800/50 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" > {prompt.displayName || prompt.name} diff --git a/src/components/resources/ResourcesTable.tsx b/src/components/resources/ResourcesTable.tsx index 7a7f75c..39eb2b9 100644 --- a/src/components/resources/ResourcesTable.tsx +++ b/src/components/resources/ResourcesTable.tsx @@ -65,7 +65,7 @@ export function ResourcesTable({ onSelectResource(resource); } }} - className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-100 data-[state=selected]:bg-neutral-200 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-700/60 dark:data-[state=selected]:bg-neutral-700 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" + className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-50 data-[state=selected]:bg-neutral-50 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-800/50 dark:data-[state=selected]:bg-neutral-800/50 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" > {resource.title || resource.name} diff --git a/src/components/tools/ToolsTable.tsx b/src/components/tools/ToolsTable.tsx index adb6115..b2c9795 100644 --- a/src/components/tools/ToolsTable.tsx +++ b/src/components/tools/ToolsTable.tsx @@ -78,7 +78,7 @@ export function ToolsTable({ onSelectTool(tool); } }} - className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-100 data-[state=selected]:bg-neutral-200 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-700/60 dark:data-[state=selected]:bg-neutral-700 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" + className="cursor-pointer border-0 bg-neutral-50 hover:bg-neutral-50 data-[state=selected]:bg-neutral-50 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-inset dark:bg-neutral-800/50 dark:hover:bg-neutral-800/50 dark:data-[state=selected]:bg-neutral-800/50 [&>td:first-child]:rounded-l-lg [&>td:last-child]:rounded-r-lg" > {tool.displayName || tool.title || tool.name}