refactor: migrate remaining components to Design System v4

111 files across 14 directories: common, tree-editor, kb-accelerator,
copilot, assistant, analytics, library, procedural, procedural-editor,
public, script-editor, ui, admin, step-library.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Michael Chihlas
2026-03-22 02:18:15 -04:00
parent 858f890ed3
commit d1a56f0529
111 changed files with 1330 additions and 1330 deletions

View File

@@ -18,19 +18,19 @@ export function FlowTemplateCard({ template, onClick }: FlowTemplateCardProps) {
<button
type="button"
onClick={onClick}
className="glass-card text-left w-full flex flex-col gap-3 p-5"
className="card-interactive text-left w-full flex flex-col gap-3 p-5"
>
<div className="flex items-start justify-between gap-2">
<h3 className="font-heading text-foreground text-base font-semibold leading-tight line-clamp-2">
<h3 className="font-heading text-[#e2e5eb] text-base font-semibold leading-tight line-clamp-2">
{template.name}
</h3>
<span className="shrink-0">
<GitBranch className="w-4 h-4 text-muted-foreground" />
<GitBranch className="w-4 h-4 text-[#848b9b]" />
</span>
</div>
{template.description && (
<p className="text-muted-foreground text-sm leading-relaxed line-clamp-2">
<p className="text-[#848b9b] text-sm leading-relaxed line-clamp-2">
{template.description}
</p>
)}
@@ -40,33 +40,33 @@ export function FlowTemplateCard({ template, onClick }: FlowTemplateCardProps) {
{template.tags.slice(0, 3).map((tag) => (
<span
key={tag}
className="font-label text-[0.625rem] uppercase tracking-[0.1em] px-2 py-0.5 rounded-md bg-card border border-border text-muted-foreground"
className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] px-2 py-0.5 rounded-md bg-[#14161d] border border-[#1e2130] text-[#848b9b]"
>
{tag}
</span>
))}
{template.tags.length > 3 && (
<span className="font-label text-[0.625rem] text-muted-foreground">
<span className="font-sans text-xs text-[0.625rem] text-[#848b9b]">
+{template.tags.length - 3}
</span>
)}
</div>
)}
<div className="flex items-center gap-4 mt-auto pt-2 border-t border-border">
<div className="flex items-center gap-4 mt-auto pt-2 border-t border-[#1e2130]">
{template.category && (
<span className="font-label text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground">
<span className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-[#848b9b]">
{template.category}
</span>
)}
<span className="font-label text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground flex items-center gap-1">
<span className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-[#848b9b] flex items-center gap-1">
<Layers className="w-3 h-3" />
{template.step_count} steps
</span>
{template.success_rate !== null && (
<span
className={cn(
'font-label text-[0.625rem] uppercase tracking-[0.1em] flex items-center gap-1 ml-auto',
'font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] flex items-center gap-1 ml-auto',
template.success_rate >= 80
? 'text-emerald-400'
: template.success_rate >= 50
@@ -82,12 +82,12 @@ export function FlowTemplateCard({ template, onClick }: FlowTemplateCardProps) {
<div className="flex items-center justify-between">
<span className={cn(
'font-label text-[0.625rem] px-2 py-0.5 rounded-md border',
'bg-primary/5 border-primary/20 text-primary'
'font-sans text-xs text-[0.625rem] px-2 py-0.5 rounded-md border',
'bg-primary/5 border-primary/20 text-[#22d3ee]'
)}>
{typeLabels[template.tree_type] || template.tree_type}
</span>
<span className="font-label text-[0.625rem] text-[#5a6170]">
<span className="font-sans text-xs text-[0.625rem] text-[#5a6170]">
{template.usage_count.toLocaleString()} uses
</span>
</div>