feat(FN-2699): switch runtime source selectors to tab controls

- Replace runtime source radio groups with tablist/tab buttons in NewAgentDialog and AgentDetailView
- Preserve runtime mode behavior by keeping model/runtime selection handlers and reset logic intact
- Align AgentDetailView runtime selector styling with tab pattern and remove obsolete radio-toggle CSS
- Update AgentDetailView tests to assert tab semantics via role and aria-selected
This commit is contained in:
Fusion
2026-04-27 08:53:09 -07:00
committed by gsxdsm
parent 47ace9ca09
commit ccf77ab507
5 changed files with 58 additions and 130 deletions

View File

@@ -150,58 +150,6 @@
gap: var(--space-sm);
}
.agent-runtime-mode-toggle {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: var(--space-sm);
}
.agent-runtime-mode-option {
position: relative;
display: flex;
}
.agent-runtime-mode-option input {
position: absolute;
width: var(--space-xs);
height: var(--space-xs);
margin: 0;
opacity: 0;
pointer-events: none;
}
.agent-runtime-mode-option span {
width: 100%;
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--card);
color: var(--text-muted);
padding: var(--space-sm) var(--space-md);
text-align: center;
font-size: calc(var(--space-sm) + var(--space-xs));
font-weight: 600;
cursor: pointer;
transition: border-color var(--transition-fast), color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast);
}
.agent-runtime-mode-option input:checked + span {
border-color: var(--todo);
color: var(--text);
background: color-mix(in srgb, var(--todo) 12%, transparent);
}
.agent-runtime-mode-option input:focus-visible + span {
outline: none;
border-color: var(--todo);
box-shadow: var(--focus-ring-strong);
}
.agent-runtime-mode-option span:hover {
border-color: var(--todo);
color: var(--text);
background: var(--card-hover);
}
.agent-role-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(calc(var(--space-xl) * 3 + var(--space-sm)), 1fr));
@@ -537,9 +485,4 @@
padding: var(--space-sm) 0;
}
@media (max-width: 768px) {
.agent-runtime-mode-toggle {
grid-template-columns: 1fr;
}
}