core-lead/molecule-core
1
0
Fork 0
forked from molecule-ai/molecule-core
Code Pull Requests Activity

Merge pull request #2687 from Molecule-AI/a11y/canvas-memory-tab-hovers

Browse Source 
canvas/MemoryTab: fix 9 hover bugs (4 light + 4 no-op + Delete no-op)
This commit is contained in:
Hongming Wang 2026-05-04 04:08:39 +00:00 committed by GitHub
commit 5de0eee328
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 14 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
canvas/src/components/tabs/MemoryTab.tsx
View File

@ -137,14 +137,14 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={() => setShowAwareness((prev) => !prev)} onClick={() => setShowAwareness((prev) => !prev)}
className="shrink-0 px-2 py-1 bg-surface-card hover:bg-surface-card text-[10px] rounded text-ink" className="shrink-0 px-2 py-1 bg-surface-card hover:bg-surface-elevated text-[10px] rounded text-ink"
> >
{showAwareness ? "Collapse" : "Expand"} {showAwareness ? "Collapse" : "Expand"}
</button> </button>
<button <button
type="button" type="button"
onClick={openAwareness} onClick={openAwareness}
className="shrink-0 px-2 py-1 bg-surface-card hover:bg-surface-card text-[10px] rounded text-ink" className="shrink-0 px-2 py-1 bg-surface-card hover:bg-surface-elevated text-[10px] rounded text-ink"
> >
Open Open
</button> </button>
@ -177,7 +177,7 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={() => setShowAwareness(true)} onClick={() => setShowAwareness(true)}
className="shrink-0 px-2 py-1 bg-accent-strong hover:bg-accent text-[10px] rounded text-white" className="shrink-0 px-2 py-1 bg-accent hover:bg-accent-strong text-[10px] rounded text-white"
> >
Expand Expand
</button> </button>
@ -212,21 +212,21 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={() => setShowAdvanced((prev) => !prev)} onClick={() => setShowAdvanced((prev) => !prev)}
className="px-2 py-1 bg-surface-card hover:bg-surface-card text-[10px] rounded text-ink-mid" className="px-2 py-1 bg-surface-card hover:bg-surface-elevated text-[10px] rounded text-ink-mid"
> >
{showAdvanced ? "Hide Advanced" : "Advanced"} {showAdvanced ? "Hide Advanced" : "Advanced"}
</button> </button>
<button <button
type="button" type="button"
onClick={loadMemory} onClick={loadMemory}
className="px-2 py-1 bg-surface-card hover:bg-surface-card text-[10px] rounded text-ink-mid" className="px-2 py-1 bg-surface-card hover:bg-surface-elevated text-[10px] rounded text-ink-mid"
> >
Refresh Refresh
</button> </button>
<button <button
type="button" type="button"
onClick={() => { setShowAdd(!showAdd); if (!showAdd) setShowAdvanced(true); }} onClick={() => { setShowAdd(!showAdd); if (!showAdd) setShowAdvanced(true); }}
className="px-2 py-1 bg-accent-strong hover:bg-accent text-[10px] rounded text-white" className="px-2 py-1 bg-accent hover:bg-accent-strong text-[10px] rounded text-white"
> >
+ Add + Add
</button> </button>
@ -262,7 +262,7 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={handleAdd} onClick={handleAdd}
className="px-3 py-1 bg-accent-strong hover:bg-accent text-xs rounded text-white" className="px-3 py-1 bg-accent hover:bg-accent-strong text-xs rounded text-white"
> >
Save Save
</button> </button>
@ -272,7 +272,7 @@ export function MemoryTab({ workspaceId }: Props) {
setShowAdd(false); setShowAdd(false);
setError(null); setError(null);
}} }}
className="px-3 py-1 bg-surface-card hover:bg-surface-card text-xs rounded text-ink-mid" className="px-3 py-1 bg-surface-card hover:bg-surface-elevated text-xs rounded text-ink-mid"
> >
Cancel Cancel
</button> </button>
@ -318,7 +318,11 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={() => handleDelete(entry.key)} onClick={() => handleDelete(entry.key)}
className="text-[10px] text-bad hover:text-bad" // hover:text-bad on top of text-bad was a no-op.
// Switch to a hover bg + focus-visible ring so
// the destructive button visibly responds and
// keyboard users see focus.
className="text-[10px] text-bad hover:bg-red-950/40 rounded px-1 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-red-500/60"
> >
Delete Delete
</button> </button>
@ -340,7 +344,7 @@ export function MemoryTab({ workspaceId }: Props) {
<button <button
type="button" type="button"
onClick={() => setShowAdvanced(true)} onClick={() => setShowAdvanced(true)}
className="shrink-0 px-2 py-1 bg-accent-strong hover:bg-accent text-[10px] rounded text-white" className="shrink-0 px-2 py-1 bg-accent hover:bg-accent-strong text-[10px] rounded text-white"
> >
Show Show
</button> </button>