npm - total-recall-brain - Versions diffs - 3.45.0 → 3.46.0 - Mend

total-recall-brain 3.45.0 → 3.46.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (362) hide show

package/frontend/dist/assets/index-DtwsDyFM.css DELETED Viewed

@@ -1 +0,0 @@

- :root{--bg-primary:#070b14;--bg-secondary:#0c1220;--bg-tertiary:#121a2b;--bg-elevated:#172033;--bg-hover:#1c2740;--bg-active:#243352;--accent:#3b82f6;--accent-deep:#1e3a8a;--accent-glow:#3b82f647;--accent-hover:#60a5fa;--accent-muted:#3b82f624;--accent-soft:#93c5fd1f;--purple-primary:var(--accent);--purple-border:var(--border-accent);--success:#34d399;--success-muted:#34d3991f;--warning:#fbbf24;--warning-muted:#fbbf241f;--error:#f87171;--error-muted:#f871711f;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-tertiary:#64748b;--text-inverse:#070b14;--border:#94a3b81a;--border-hover:#94a3b838;--border-accent:#3b82f659;--glass:#0c1220b8;--glass-border:#94a3b81f;--mesh-1:#1e3a8a59;--mesh-2:#3b82f61f;--mesh-3:#0f172ae6;--font-heading:"Space Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "SF Mono", ui-monospace, monospace;--sidebar-width:252px;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--radius-xl:24px;--shadow-sm:0 1px 2px #00000059;--shadow-md:0 8px 24px #00000059;--shadow-lg:0 24px 64px #00000073;--shadow-glow:0 0 40px #3b82f62e;--transition-fast:.14s cubic-bezier(.23, 1, .32, 1);--transition-normal:.22s cubic-bezier(.23, 1, .32, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{background:var(--bg-primary);height:100%;color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;font-size:14px;line-height:1.6}body{background:radial-gradient(1200px 600px at 10% -10%, var(--mesh-1), transparent 55%), radial-gradient(900px 500px at 100% 0%, var(--mesh-2), transparent 50%), radial-gradient(800px 400px at 50% 100%, #1e3a8a33, transparent 60%), var(--bg-primary)}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:-.025em;color:var(--text-primary);font-weight:700}button{font-family:var(--font-sans);cursor:pointer;border:none;outline:none}code,pre{font-family:var(--font-mono)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}.app-layout{height:100vh;display:flex;position:relative;overflow:hidden}.sidebar{width:var(--sidebar-width);min-width:var(--sidebar-width);background:var(--glass);-webkit-backdrop-filter:blur(20px)saturate(1.4);border-right:1px solid var(--glass-border);transition:transform var(--transition-normal);z-index:100;flex-direction:column;padding:14px 0 12px;display:flex;box-shadow:4px 0 40px #00000040}.sidebar-brand{border-bottom:1px solid var(--border);flex-direction:column;gap:10px;margin-bottom:10px;padding:4px 16px 18px;display:flex}.sidebar-brand-row{align-items:center;gap:12px;display:flex}.sidebar-brand h1{color:var(--text-primary);letter-spacing:-.03em;font-size:15px;font-weight:700;line-height:1.2}.sidebar-brand span{color:var(--text-tertiary);letter-spacing:.02em;font-size:11px;font-weight:500}.sidebar-brand-lockup{background:linear-gradient(#f8fafc 0%,#e8eef9 100%);border-radius:12px;width:100%;padding:10px 12px;overflow:hidden;box-shadow:inset 0 1px #ffffffb3,0 8px 20px #0f172a59,0 0 0 1px #94a3b833}.sidebar-brand-lockup img{object-fit:contain;width:100%;height:auto;display:block}.sidebar-nav{scrollbar-width:thin;flex-direction:column;flex:1;gap:2px;padding:0 10px;display:flex;overflow-y:auto}.nav-section-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);opacity:.85;padding:12px 12px 6px;font-size:10px;font-weight:600}.nav-link{color:var(--text-secondary);transition:all var(--transition-fast);border:1px solid #0000;border-radius:10px;align-items:center;gap:10px;padding:9px 12px;font-size:13px;font-weight:500;text-decoration:none;display:flex;position:relative}.nav-link:hover{color:var(--text-primary);background:#94a3b814}.nav-link.active{color:#dbeafe;border-color:var(--border-accent);background:linear-gradient(135deg,#3b82f62e,#1e3a8a38);box-shadow:0 0 0 1px #3b82f614,inset 0 1px #ffffff0a}.nav-link.active:before{content:"";background:linear-gradient(#60a5fa,#2563eb);border-radius:0 3px 3px 0;width:3px;position:absolute;top:20%;bottom:20%;left:0;box-shadow:0 0 12px #3b82f699}.nav-link svg{opacity:.72;flex-shrink:0;width:18px;height:18px}.nav-link.active svg{opacity:1;color:#93c5fd}.nav-link:hover svg{opacity:.95}.sidebar-footer{border-top:1px solid var(--border);background:linear-gradient(#0000,#0f172a66);margin-top:8px;padding:12px 14px}.main-content{background:0 0;flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.page{flex:1;padding:28px 32px 40px;overflow-y:auto}.page-header{margin-bottom:28px}.page-header h1{letter-spacing:-.03em;background:linear-gradient(135deg,#f8fafc 0%,#93c5fd 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:24px;font-weight:700}.page-header p{color:var(--text-secondary);max-width:56ch;margin-top:6px;font-size:13.5px}.card{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-md);transition:all var(--transition-normal);background:#121a2ba6;border:1px solid #94a3b81f;padding:22px;box-shadow:0 4px 20px #00000040}.card:hover{background:#1c2740bf;border-color:#60a5fa59;transform:translateY(-1px);box-shadow:0 8px 30px #00000059}.card-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.btn{border-radius:var(--radius-md);min-height:44px;transition:all var(--transition-fast);letter-spacing:-.01em;cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:0 18px;font-size:13.5px;font-weight:600;display:inline-flex}.btn-primary{color:#fff;background:linear-gradient(135deg,#3b82f6 0%,#2563eb 55%,#1d4ed8 100%);border-color:#ffffff1a;box-shadow:inset 0 1px #fff3,0 4px 14px #2563eb59}.btn-primary:hover{box-shadow:0 0 24px var(--accent-glow), 0 6px 20px #2563eb73;background:linear-gradient(135deg,#60a5fa 0%,#3b82f6 50%,#2563eb 100%);transform:translateY(-1px)}.btn-ghost{color:var(--text-secondary);background:#94a3b814;border:1px solid #94a3b824}.btn-ghost:hover{color:var(--text-primary);background:#94a3b829;border-color:#94a3b847}.btn-sm{border-radius:var(--radius-sm);min-height:36px;padding:0 12px;font-size:12px}.alert{border-radius:var(--radius-sm);border:1px solid #0000;padding:12px 16px;font-size:13px;font-weight:500}.alert-error{background:var(--error-muted);color:var(--error);border-color:#f8717140}.alert-success{background:var(--success-muted);color:var(--success);border-color:#34d39940}.alert-warning{background:var(--warning-muted);color:var(--warning);border-color:#fbbf2440}.input,.select{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-family:var(--font-sans);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:9px 12px;font-size:13px}.input:focus,.select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}.input::placeholder{color:var(--text-tertiary)}.select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;padding-right:32px}.data-table{border-collapse:collapse;width:100%}.data-table th{text-align:left;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--border);background:var(--bg-secondary);padding:12px 16px;font-size:12px;font-weight:500}.data-table td{border-bottom:1px solid var(--border);color:var(--text-primary);padding:14px 16px;font-size:13px}.data-table tbody tr{transition:background var(--transition-fast)}.data-table tbody tr:hover{background:var(--bg-hover)}.data-table tr.is-leader td{background:var(--accent-soft)}.page-container{max-width:1200px;margin:0 auto;padding:32px}.page-header{justify-content:space-between;align-items:center;margin-bottom:32px;display:flex}.page-header h1{color:var(--text-primary);font-size:24px;font-weight:600}.badge{letter-spacing:.03em;border-radius:4px;align-items:center;padding:3px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-online,.badge-active{background:var(--success-muted);color:var(--success)}.badge-offline,.badge-inactive{background:var(--error-muted);color:var(--error)}.badge-leader{color:var(--accent-hover);background:#3b82f626}.badge-follower{background:var(--bg-hover);color:var(--text-secondary)}.surface-premium{border:1px solid var(--glass-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md), inset 0 1px 0 #ffffff0a;background:linear-gradient(165deg,#172033eb,#0c1220f5)}.login-shell{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex;position:relative;overflow:hidden}.login-shell:before{content:"";pointer-events:none;background:radial-gradient(50% 40% at 20% 20%,#2563eb47,#0000 55%),radial-gradient(45% 35% at 80% 70%,#1e3a8a59,#0000 50%),radial-gradient(30% 25%,#60a5fa14,#0000 60%);animation:18s ease-in-out infinite alternate meshDrift;position:absolute;inset:-20%}@keyframes meshDrift{0%{transform:translate(0,0)scale(1)}to{transform:translate(-2%,2%)scale(1.05)}}.login-card{z-index:1;border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:linear-gradient(165deg,#121a2beb,#080c16f5);border:1px solid #94a3b824;flex-direction:column;gap:28px;width:min(400px,100%);padding:40px 36px;display:flex;position:relative;box-shadow:0 0 0 1px #3b82f614,0 32px 80px #0000008c,0 0 80px #2563eb1f}.onboarding-shell{max-width:680px;margin:0 auto;padding:36px 22px 72px}.onboarding-progress{background:#94a3b81a;border-radius:99px;height:6px;overflow:hidden;box-shadow:inset 0 1px 2px #0000004d}.onboarding-progress>div{background:linear-gradient(90deg,#1e40af,#3b82f6,#93c5fd);border-radius:99px;height:100%;transition:width .3s cubic-bezier(.23,1,.32,1);box-shadow:0 0 16px #3b82f680}.loop-card{border:1px solid var(--border-accent);border-radius:var(--radius-md);font-family:var(--font-mono);color:#cbd5e1;background:linear-gradient(145deg,#1e3a8a40,#0c1220cc);padding:18px 20px;font-size:12.5px;line-height:1.85;box-shadow:inset 0 1px #ffffff0a}.badge{text-transform:uppercase;letter-spacing:.04em;border-radius:99px;align-items:center;gap:4px;padding:3px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-success{background:var(--success-muted);color:var(--success)}.badge-warning{background:var(--warning-muted);color:var(--warning)}.badge-error{background:var(--error-muted);color:var(--error)}.badge-accent{background:var(--accent-muted);color:var(--accent)}.chat-container{flex-direction:column;flex:1;height:calc(100vh - 1px);display:flex;overflow:hidden}.chat-messages{flex-direction:column;flex:1;gap:16px;padding:24px 32px;display:flex;overflow-y:auto}.chat-empty{color:var(--text-tertiary);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;display:flex}.chat-empty svg{opacity:.3;width:48px;height:48px}.chat-empty h2{color:var(--text-secondary);font-size:18px;font-weight:600}.chat-empty p{font-size:13px}.message{border-radius:var(--radius-md);white-space:pre-wrap;word-break:break-word;max-width:760px;padding:16px 20px;font-size:14px;line-height:1.65;animation:.18s cubic-bezier(.16,1,.3,1) msgIn;position:relative}@keyframes msgIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.message-user{color:#f8fafc;-webkit-backdrop-filter:blur(12px);background:#1e3a8a47;border:1px solid #3b82f659;border-bottom-right-radius:4px;align-self:flex-end;box-shadow:0 4px 18px #00000040}.message-assistant{-webkit-backdrop-filter:blur(12px);color:var(--text-primary);background:#121a2bb8;border:1px solid #94a3b81f;border-bottom-left-radius:4px;align-self:flex-start;box-shadow:0 6px 24px #0000004d}.message-assistant code{background:#070b14bf;border:1px solid #94a3b81a;border-radius:4px;padding:2px 6px;font-size:12.5px}.chat-input-bar{-webkit-backdrop-filter:blur(20px);background:#0c1220d9;border-top:1px solid #94a3b81a;padding:16px 32px 20px}.chat-input-wrapper{align-items:flex-end;gap:10px;max-width:820px;margin:0 auto;display:flex}.chat-input-wrapper textarea{resize:none;border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-sans);min-height:44px;max-height:160px;transition:all var(--transition-fast);background:#121a2ba6;border:1px solid #94a3b824;flex:1;padding:12px 16px;font-size:14px;line-height:1.5}.chat-input-wrapper textarea:focus{background:#121a2be6;border-color:#3b82f680;outline:none;box-shadow:0 0 0 3px #3b82f629}.chat-input-wrapper textarea::placeholder{color:var(--text-tertiary)}.chat-send-btn{border-radius:var(--radius-md);color:#fff;width:44px;height:44px;transition:all var(--transition-fast);background:linear-gradient(135deg,#3b82f6,#1d4ed8);flex-shrink:0;justify-content:center;align-items:center;display:flex;box-shadow:0 4px 14px #2563eb59}.chat-send-btn:hover{box-shadow:0 0 24px var(--accent-glow);background:linear-gradient(135deg,#60a5fa,#2563eb);transform:translateY(-1px)}.chat-send-btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none;transform:none}.chat-send-btn svg{width:18px;height:18px}.memory-layout{grid-template-columns:240px 1fr;gap:20px;height:calc(100vh - 120px);display:grid}.memory-sidebar{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-md);background:#0c1220b8;border:1px solid #94a3b81f;padding:14px;overflow-y:auto;box-shadow:0 4px 20px #00000040}.memory-sidebar h3{text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);padding:6px 8px 10px;font-size:11px;font-weight:600}.category-btn{border-radius:var(--radius-sm);width:100%;color:var(--text-secondary);text-align:left;transition:all var(--transition-fast);background:0 0;border:1px solid #0000;justify-content:space-between;align-items:center;padding:9px 12px;font-size:13px;font-weight:500;display:flex}.category-btn:hover{color:var(--text-primary);background:#94a3b814}.category-btn.active{color:#93c5fd;background:linear-gradient(135deg,#3b82f633,#1e3a8a40);border-color:#3b82f659;font-weight:600}.category-count{color:var(--text-secondary);background:#94a3b81f;border-radius:99px;padding:2px 7px;font-size:11px;font-weight:600}.memory-main{flex-direction:column;gap:14px;display:flex;overflow:hidden}.memory-search{gap:10px;display:flex}.memory-search input{-webkit-backdrop-filter:blur(16px);border-radius:var(--radius-md);color:var(--text-primary);font-size:13.5px;font-family:var(--font-sans);transition:all var(--transition-fast);background:#0c1220b8;border:1px solid #94a3b824;flex:1;padding:12px 16px}.memory-search input:focus{background:#121a2be6;border-color:#3b82f680;outline:none;box-shadow:0 0 0 3px #3b82f629}.memory-search input::placeholder{color:var(--text-tertiary)}.memory-list{flex-direction:column;flex:1;gap:10px;display:flex;overflow-y:auto}.memory-node-card{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);background:#121a2b99;border:1px solid #94a3b81f;padding:16px 18px;box-shadow:0 2px 8px #0003}.memory-node-card:hover{background:#1c2740b3;border-color:#60a5fa66;transform:translateY(-1px);box-shadow:0 4px 16px #0000004d}.memory-node-card.selected{background:#1e3a8a40;border-color:#3b82f68c;box-shadow:0 0 0 1px #3b82f64d,0 4px 20px #00000059}.memory-node-card h4{color:#f8fafc;margin-bottom:6px;font-size:14px;font-weight:600}.memory-node-card .meta{color:var(--text-tertiary);align-items:center;gap:14px;font-size:12px;display:flex}.memory-detail{-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-lg);background:#0c1220cc;border:1px solid #94a3b824;padding:24px;overflow-y:auto;box-shadow:0 8px 32px #0006}.memory-detail h2{margin-bottom:12px;font-size:18px}.memory-detail pre{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-sm);white-space:pre-wrap;color:var(--text-secondary);padding:16px;font-size:12px;line-height:1.7;overflow-x:auto}.memory-detail .frontmatter{background:var(--bg-tertiary);border-radius:var(--radius-sm);grid-template-columns:auto 1fr;gap:4px 16px;margin-bottom:16px;padding:12px 16px;font-size:13px;display:grid}.frontmatter dt{color:var(--text-tertiary);font-weight:500}.frontmatter dd{color:var(--text-primary)}.health-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.stat-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center;transition:border-color var(--transition-normal);padding:20px}.stat-card:hover{border-color:var(--border-hover)}.stat-card .value{letter-spacing:-.02em;font-size:28px;font-weight:700}.stat-card .label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.04em;margin-top:4px;font-size:12px}.stat-card.healthy .value{color:var(--success)}.stat-card.warning .value{color:var(--warning)}.stat-card.error .value{color:var(--error)}.health-log{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);padding:20px}.health-log h3{margin-bottom:12px;font-size:14px;font-weight:600}.health-log table{border-collapse:collapse;width:100%;font-size:13px}.health-log th{text-align:left;color:var(--text-tertiary);border-bottom:1px solid var(--border);padding:8px 12px;font-weight:500}.health-log td{border-bottom:1px solid var(--border);color:var(--text-secondary);padding:8px 12px}.sandbox-layout{grid-template-rows:1fr auto 1fr;gap:0;height:calc(100vh - 120px);display:grid}.sandbox-editor{flex-direction:column;display:flex;overflow:hidden}.sandbox-editor-header{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-md) var(--radius-md) 0 0;color:var(--text-tertiary);justify-content:space-between;align-items:center;padding:8px 12px;font-size:12px;display:flex}.sandbox-editor textarea{resize:none;background:var(--bg-secondary);border:1px solid var(--border);border-radius:0 0 var(--radius-md) var(--radius-md);width:100%;color:var(--text-primary);font-family:var(--font-mono);tab-size:2;border-top:none;flex:1;padding:16px;font-size:13px;line-height:1.6}.sandbox-editor textarea:focus{border-color:var(--accent);outline:none}.sandbox-toolbar{justify-content:center;align-items:center;padding:8px;display:flex}.sandbox-output{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-md);font-family:var(--font-mono);color:var(--success);white-space:pre-wrap;padding:16px;font-size:13px;line-height:1.6;overflow-y:auto}.sandbox-output.error{color:var(--error)}.pulse{background:var(--success);border-radius:50%;width:8px;height:8px;animation:2s infinite pulseAnim;display:inline-block}@keyframes pulseAnim{0%,to{box-shadow:0 0 #00cec966}50%{box-shadow:0 0 0 6px #00cec900}}.skeleton{background:linear-gradient(90deg, var(--bg-tertiary) 25%, var(--bg-hover) 50%, var(--bg-tertiary) 75%);border-radius:var(--radius-sm);background-size:200% 100%;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (width<=768px){.sidebar{position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:0 0 40px #00000080}.sidebar.open{transform:translate(0)}.memory-layout{grid-template-columns:1fr;height:auto}.page{padding:16px}.btn,.nav-link,.category-btn{touch-action:manipulation;min-height:44px}.chat-input-wrapper textarea,.memory-search input,.sandbox-editor textarea{font-size:16px}.chat-input-bar{padding:12px 16px 16px}}.chat-layout{width:100%;height:100%;display:flex;overflow:hidden}.chat-threads-sidebar{-webkit-backdrop-filter:blur(16px);background:#0c1220b3;border-right:1px solid #94a3b81a;flex-direction:column;flex-shrink:0;width:260px;height:100%;display:flex;overflow:hidden}.sidebar-header{border-bottom:1px solid #94a3b81a;padding:14px 16px}.new-chat-btn{color:#93c5fd;border-radius:var(--radius-sm);width:100%;transition:all var(--transition-fast);cursor:pointer;background:linear-gradient(135deg,#3b82f638,#1e3a8a47);border:1px solid #3b82f659;justify-content:center;align-items:center;gap:8px;padding:10px 16px;font-size:13px;font-weight:600;display:flex}.new-chat-btn:hover{color:#fff;box-shadow:0 0 16px var(--accent-glow);background:linear-gradient(135deg,#3b82f659,#1e3a8a73);border-color:#60a5fa80}.thread-list{flex-direction:column;flex:1;gap:6px;padding:16px 12px;display:flex;overflow-y:auto}.thread-item{border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);border:1px solid #0000;justify-content:space-between;align-items:center;padding:10px 12px;display:flex;position:relative}.thread-item:hover{background:#94a3b814}.thread-item.active{background:#3b82f61f;border-color:#3b82f64d}.thread-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.thread-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.thread-meta{color:var(--text-tertiary);align-items:center;gap:8px;font-size:11px;display:flex}.thread-delete-btn{color:var(--text-tertiary);cursor:pointer;opacity:0;transition:all var(--transition-fast);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:flex}.thread-item:hover .thread-delete-btn{opacity:1}.thread-delete-btn:hover{color:var(--error);background:var(--error-muted)}.chat-suggestions-container{width:100%;max-width:900px;margin-top:32px;animation:.4s ease-out fadeIn}.chat-suggestions-container h3{text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);text-align:center;margin-bottom:16px;font-size:12px}.chat-suggestions-deck{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;width:100%;display:grid}.suggestion-card{-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-md);cursor:pointer;text-align:left;transition:all var(--transition-normal);background:#12121a73;border:1px solid #ffffff0d;gap:14px;padding:16px;display:flex;position:relative;overflow:hidden}.suggestion-card:before{content:"";opacity:.8;width:4px;height:100%;transition:width var(--transition-fast) ease;position:absolute;top:0;left:0}.suggestion-card.card-fact:before{background:var(--success)}.suggestion-card.card-concept:before{background:var(--accent)}.suggestion-card.card-question:before{background:var(--warning)}.suggestion-card:hover{background:#1a1a2699;border-color:#ffffff1f;transform:translateY(-2px);box-shadow:0 8px 24px #0003}.suggestion-card:hover:before{width:6px}.suggestion-card.card-fact:hover{border-color:#00cec940;box-shadow:0 8px 24px #00cec90f}.suggestion-card.card-concept:hover{border-color:#6c5ce740;box-shadow:0 8px 24px #6c5ce70f}.suggestion-card.card-question:hover{border-color:#fdcb6e40;box-shadow:0 8px 24px #fdcb6e0f}.suggestion-card-icon{-webkit-user-select:none;user-select:none;align-items:flex-start;padding-top:2px;font-size:22px;display:flex}.suggestion-card-content{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.suggestion-card-content h4{color:var(--text-primary);font-size:13.5px;font-weight:600;line-height:1.4}.suggestion-card-content p{color:var(--text-secondary);font-size:12.5px;line-height:1.5}.suggestion-card-nodes{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.suggestion-node-pill{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;border-radius:4px;max-width:140px;padding:2px 6px;font-size:10px;font-weight:500;overflow:hidden}.grounding-pills{border:1px solid var(--border);border-radius:var(--radius-md) var(--radius-md) 0 0;background:#12121a66;border-bottom:none;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;display:flex}.grounding-pill{background:var(--accent-muted);color:var(--text-primary);transition:all var(--transition-fast);border:1px solid #6c5ce74d;border-radius:99px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:inline-flex}.grounding-pill:hover{background:#6c5ce733;border-color:#6c5ce780}.grounding-pill svg{color:var(--accent);flex-shrink:0}.grounding-pill-title{text-overflow:ellipsis;white-space:nowrap;max-width:150px;overflow:hidden}.grounding-pill-remove{color:var(--text-tertiary);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;padding:0 2px;font-size:14px;line-height:1;display:inline-flex}.grounding-pill-remove:hover{color:var(--error)}.grounding-count-badge{background:var(--accent);color:#fff;border:1.5px solid var(--bg-secondary);min-width:16px;height:16px;box-shadow:0 0 8px var(--accent-glow);border-radius:50%;justify-content:center;align-items:center;font-size:9px;font-weight:700;animation:.2s cubic-bezier(.175,.885,.32,1.275) popIn;display:flex;position:absolute;top:-4px;right:-4px}.node-selector-popover{-webkit-backdrop-filter:blur(20px);border-radius:var(--radius-lg);z-index:50;background:#12121ad9;border:1px solid #ffffff14;flex-direction:column;width:320px;max-height:380px;animation:.25s cubic-bezier(.16,1,.3,1) slideUp;display:flex;position:absolute;bottom:calc(100% + 12px);left:0;overflow:hidden;box-shadow:0 12px 32px #0006}.node-selector-header{border-bottom:1px solid var(--border);flex-direction:column;gap:8px;padding:14px 16px 10px;display:flex}.node-selector-header h4{color:var(--text-primary);letter-spacing:.02em;font-size:13px;font-weight:600}.node-search-input{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);font-size:12px;font-family:var(--font-sans);transition:all var(--transition-fast);padding:6px 10px}.node-search-input:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-glow);outline:none}.node-selector-list{flex-direction:column;flex:1;gap:2px;padding:8px;display:flex;overflow-y:auto}.node-selector-empty{text-align:center;color:var(--text-tertiary);padding:24px;font-size:12px}.node-selector-item{border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:10px;padding:8px 12px;display:flex}.node-selector-item:hover{background:var(--bg-hover)}.node-selector-item.selected{background:var(--accent-muted)}.node-selector-item-checkbox{border:1px solid var(--text-tertiary);width:16px;height:16px;color:var(--accent);transition:all var(--transition-fast);background:var(--bg-tertiary);border-radius:3px;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.node-selector-item.selected .node-selector-item-checkbox{background:var(--accent);border-color:var(--accent);color:#fff}.node-selector-item-info{flex-direction:column;flex:1;min-width:0;display:flex}.node-selector-item-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.node-selector-item-meta{color:var(--text-tertiary);text-transform:capitalize;font-size:11px}.animate-fade-in{animation:.2s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.graph-3d-wrapper{-webkit-user-select:none;user-select:none;background:radial-gradient(circle,#0a0d16 0%,#020408 100%);width:100%;height:100%;position:relative;overflow:hidden}.node-detail-drawer{-webkit-backdrop-filter:blur(25px);border-radius:var(--radius-lg);z-index:100;width:350px;color:var(--text-primary);background:#0a0f1ebf;border:1px solid #ffffff14;flex-direction:column;display:flex;position:absolute;top:20px;bottom:20px;right:20px;overflow:hidden;box-shadow:0 16px 48px #00000080,inset 0 0 0 1px #ffffff0d}.animate-slide-in{animation:.4s cubic-bezier(.16,1,.3,1) forwards slideInRight}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.drawer-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.drawer-badge{text-transform:uppercase;letter-spacing:.05em;border-radius:4px;padding:4px 8px;font-size:10px;font-weight:700}.drawer-badge.badge-memory{color:#c084fc;background:#8b5cf626;border:1px solid #8b5cf64d}.drawer-badge.badge-thread{color:#22d3ee;background:#06b6d426;border:1px solid #06b6d44d}.drawer-badge.badge-research{color:#fbbf24;background:#f59e0b26;border:1px solid #f59e0b4d}.drawer-close-btn{color:var(--text-tertiary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:4px;font-size:20px;transition:color .15s;display:flex}.drawer-close-btn:hover{color:#fff}.drawer-body{flex-direction:column;flex:1;gap:12px;padding:20px;display:flex;overflow-y:auto}.drawer-title{color:#fff;margin:0;font-size:18px;font-weight:700;line-height:1.35}.drawer-subtitle{color:var(--text-tertiary);margin-top:-4px;font-size:11px}.drawer-status{background:#ffffff08;border:1px solid #ffffff0a;border-radius:6px;align-items:center;gap:8px;width:fit-content;padding:6px 12px;font-size:12px;display:flex}.drawer-status .label{color:var(--text-tertiary)}.drawer-status .value{text-transform:capitalize;font-weight:600}.drawer-status .value.status-completed,.drawer-status .value.status-done,.drawer-status .value.status-active{color:#10b981}.drawer-status .value.status-in-progress{color:#f59e0b}.drawer-status .value.status-pending{color:#3b82f6}.drawer-excerpt{color:var(--text-secondary);white-space:pre-wrap;margin-top:8px;font-size:13.5px;line-height:1.6}.drawer-footer{background:#00000026;border-top:1px solid #ffffff0f;padding:16px 20px}.drawer-action-btn{border-radius:var(--radius-sm);cursor:pointer;width:100%;transition:all var(--transition-fast);border:none;justify-content:center;align-items:center;padding:10px 16px;font-size:13px;font-weight:600;display:flex}.drawer-action-btn.btn-cyan{color:#fff;background:#06b6d4}.drawer-action-btn.btn-cyan:hover{background:#0891b2;box-shadow:0 0 16px #06b6d466}.drawer-action-btn.btn-purple{color:#fff;background:#8b5cf6}.drawer-action-btn.btn-purple:hover{background:#7c3aed;box-shadow:0 0 16px #8b5cf666}@media (width<=768px){.node-detail-drawer{width:auto;height:300px;bottom:20px;left:20px}}.chat-messages:has(.graph-3d-wrapper){padding:0;overflow:hidden}.chat-header{-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);z-index:40;background:#12121aeb;flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 24px;display:flex;position:relative;overflow:visible}.chat-header-title{align-items:center;gap:10px;display:flex}.chat-header-title h2{color:var(--text-primary);letter-spacing:-.01em;font-size:15px;font-weight:600}.chat-header-model-selector{align-items:center;gap:8px;display:flex}.chat-header-model-selector span.selector-label{color:var(--text-tertiary);font-size:12px;font-weight:500}.model-selector-dropdown-wrapper{position:relative}.model-selector-dropdown-btn{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;background:#ffffff0a;align-items:center;gap:8px;padding:6px 12px;font-size:13px;font-weight:500;display:flex}.model-selector-dropdown-btn:hover{border-color:var(--border-hover);color:var(--text-primary);background:#ffffff14}.model-selector-dropdown-btn.active{border-color:var(--accent);color:var(--text-primary);background:var(--accent-muted)}.model-selector-menu{-webkit-backdrop-filter:blur(20px);border:1px solid var(--border);border-radius:var(--radius-md);z-index:200;pointer-events:auto;background:#12121afa;flex-direction:column;gap:2px;width:240px;margin-top:6px;padding:6px;animation:.15s ease-out popoverIn;display:flex;position:absolute;top:100%;right:0;box-shadow:0 12px 32px #0000008c}@keyframes popoverIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.model-selector-item{border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);text-align:left;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.model-selector-item:hover{background:var(--bg-hover)}.model-selector-item.selected{background:var(--accent-muted)}.model-selector-item-info{flex-direction:column;gap:2px;display:flex}.model-selector-item-name{color:var(--text-primary);font-size:13px;font-weight:500}.model-selector-item.selected .model-selector-item-name{color:var(--accent)}.model-selector-item-desc{color:var(--text-tertiary);font-size:11px}.model-selector-item-badge{background:var(--bg-tertiary);color:var(--text-tertiary);text-transform:uppercase;border-radius:99px;padding:2px 6px;font-size:9px;font-weight:600}.model-selector-item.selected .model-selector-item-badge{background:var(--accent-muted);color:var(--accent)}@media (width<=768px){button,a,[role=button]{min-width:44px;min-height:44px}.chat-input-area{bottom:0;bottom:env(safe-area-inset-bottom,0);position:sticky}.app-container{padding-left:env(safe-area-inset-left,0);padding-right:env(safe-area-inset-right,0);padding-bottom:env(safe-area-inset-bottom,0)}}@media (display-mode:standalone){body{padding-top:env(safe-area-inset-top,0)}}.network-page{animation:.35s ease-out page-fade-in}@keyframes page-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.stat-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px;display:grid}.stat-card{text-align:center;flex-direction:column;align-items:center;padding:24px 16px;display:flex}.stat-value{color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:32px;font-weight:700;line-height:1.2;transition:color .3s}.stat-value.error{color:var(--error)}.stat-value.success{color:var(--success)}.stat-value.accent{color:var(--accent)}.stat-label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.06em;margin-top:8px;font-size:12px;font-weight:500}.network-sections{grid-template-columns:1fr 1fr;gap:24px;margin-bottom:32px;display:grid}.network-section-full{margin-bottom:32px}.section-title{color:var(--text-primary);align-items:center;gap:8px;margin-bottom:16px;font-size:15px;font-weight:600;display:flex}.blocklist-items{max-height:240px;margin:0 0 12px;padding:0;list-style:none;overflow-y:auto}.blocklist-item{border-bottom:1px solid var(--border);font-family:var(--font-mono);color:var(--text-primary);transition:background var(--transition-fast);justify-content:space-between;align-items:center;padding:8px 12px;font-size:13px;display:flex}.blocklist-item:hover{background:var(--bg-hover)}.blocklist-item:last-child{border-bottom:none}.blocklist-remove{color:var(--error);opacity:.6;transition:opacity var(--transition-fast), background var(--transition-fast);background:0 0;border-radius:4px;padding:4px 8px;font-size:12px}.blocklist-remove:hover{opacity:1;background:var(--error-muted)}.blocklist-add{gap:8px;display:flex}.blocklist-add .input{flex:1}.limits-form{flex-direction:column;gap:12px;display:flex}.limits-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.limits-label{color:var(--text-secondary);flex-shrink:0;font-size:13px}.limits-input{text-align:right;width:100px}.limits-actions{justify-content:flex-end;margin-top:8px;display:flex}.audit-filters{flex-wrap:wrap;gap:12px;margin-bottom:16px;display:flex}.audit-filters .input,.audit-filters .select{flex:1;min-width:140px}.audit-status-badge{border-radius:3px;align-items:center;padding:2px 6px;font-size:11px;font-weight:600;display:inline-flex}.audit-status-badge.success{background:var(--success-muted);color:var(--success)}.audit-status-badge.error{background:var(--error-muted);color:var(--error)}.audit-status-badge.timeout{background:var(--warning-muted);color:var(--warning)}.toggle-row{align-items:center;gap:12px;margin-bottom:16px;display:flex}.toggle-switch{background:var(--bg-hover);cursor:pointer;width:44px;height:24px;transition:background var(--transition-fast);border:1px solid var(--border);border-radius:12px;flex-shrink:0;position:relative}.toggle-switch.active{background:var(--accent);border-color:var(--accent)}.toggle-switch:after{content:"";width:18px;height:18px;transition:transform var(--transition-fast);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #0003}.toggle-switch.active:after{transform:translate(20px)}.toggle-label{color:var(--text-secondary);font-size:13px}.refresh-controls{align-items:center;gap:8px;display:flex}.refresh-controls .select{width:auto;padding:6px 28px 6px 10px;font-size:12px}.empty-state{text-align:center;color:var(--text-tertiary);padding:32px 16px;font-size:13px;font-style:italic}@media (width<=768px){.stat-grid,.network-sections{grid-template-columns:1fr}}.webhooks-page{animation:.35s ease-out page-fade-in}.wizard-modal{width:100%;max-width:600px}.wizard-steps{justify-content:space-between;margin-bottom:24px;display:flex;position:relative}.wizard-steps:before{content:"";z-index:0;background:#ffffff1a;height:2px;position:absolute;top:12px;left:0;right:0}.wizard-step{background:var(--bg-surface);color:var(--text-muted);z-index:1;border:2px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;font-weight:600;transition:all .3s;display:flex}.wizard-step.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 0 12px #6366f180}.wizard-step.completed{background:var(--success);color:#fff;border-color:var(--success)}.json-viewer{color:#a5b4fc;background:#0003;border:1px solid #ffffff0d;border-radius:8px;margin-top:8px;padding:12px;font-family:Fira Code,monospace;font-size:13px;overflow-x:auto}.json-toggle{color:var(--primary);cursor:pointer;background:0 0;border:none;margin-top:4px;padding:0;font-size:12px}.json-toggle:hover{text-decoration:underline}.webhook-stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:24px;display:grid}.stat-box{text-align:center;background:#ffffff08;border:1px solid #ffffff0d;border-radius:12px;padding:16px}.stat-box .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:12px}.stat-box .value{color:var(--text-primary);font-size:24px;font-weight:700}.rotate-btn{color:var(--text-primary);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:4px;padding:4px 8px;font-size:12px;transition:all .2s}.rotate-btn:hover{background:#ffffff1a}.notifications-page{animation:.35s ease-out notif-fade-in}@keyframes notif-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.notif-rules-card{padding:0;overflow:hidden}.notif-rules-actions{gap:6px;display:flex}.priority-badge{text-transform:uppercase;letter-spacing:.04em;border-radius:4px;align-items:center;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.priority-badge.critical{background:var(--error-muted);color:var(--error)}.priority-badge.high{background:var(--warning-muted);color:var(--warning)}.priority-badge.low{background:var(--success-muted);color:var(--success)}.notif-toggle{background:var(--bg-hover);cursor:pointer;width:40px;height:22px;transition:background var(--transition-fast);border:1px solid var(--border);border-radius:11px;flex-shrink:0;position:relative}.notif-toggle.active{background:var(--accent);border-color:var(--accent)}.notif-toggle:after{content:"";width:16px;height:16px;transition:transform var(--transition-fast);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px;box-shadow:0 1px 3px #0003}.notif-toggle.active:after{transform:translate(18px)}.notif-history-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.notif-history-header h2{color:var(--text-primary);font-size:15px;font-weight:600}.notif-history-list{flex-direction:column;gap:10px;max-height:420px;display:flex;overflow-y:auto}.notif-history-entry{background:var(--bg-hover);border-radius:var(--radius-sm);transition:background var(--transition-fast);justify-content:space-between;align-items:flex-start;padding:14px 16px;display:flex}.notif-history-entry:hover{background:var(--bg-secondary)}.notif-entry-content{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.notif-entry-title{color:var(--text-primary);font-size:14px;font-weight:500}.notif-entry-message{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.notif-entry-meta{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:4px;margin-left:16px;display:flex}.notif-entry-time{color:var(--text-tertiary);white-space:nowrap;font-size:12px}.notif-status-badge{border-radius:3px;align-items:center;padding:2px 6px;font-size:11px;font-weight:600;display:inline-flex}.notif-status-badge.delivered{background:var(--success-muted);color:var(--success)}.notif-status-badge.failed{background:var(--error-muted);color:var(--error)}.notif-quiet-hours-row{align-items:center;gap:10px;display:flex}.notif-quiet-hours-label{color:var(--text-secondary);cursor:pointer;font-size:13px}.notif-empty{text-align:center;color:var(--text-tertiary);padding:32px 16px;font-size:13px;font-style:italic}@media (width<=768px){.notif-history-entry{flex-direction:column;gap:8px}.notif-entry-meta{flex-direction:row;align-items:center;margin-left:0}}

package/frontend/src/components/plugins/card/CardEngine.tsx DELETED Viewed

@@ -1,108 +0,0 @@
-import { useEffect, useMemo, useRef, useState } from 'react'
-import type { PluginInfo } from '../../../api/plugins'
-import { apiFetch, API_BASE } from '../../../api/_base'
-import { normalizeCard, type Card } from './contract'
-import { CardRunner } from './runner'
-import { ActivityWidget, CommandsWidget, SettingsWidget } from './widgets'
-import { brandStyle } from './theme'
-import { WorkspaceHost } from '../workspace/WorkspaceHost'
-import { PluginPanel } from '../PluginPanel'
-import './card.css'
-import { CardScenes } from './CardScenes'
-/** The provider's logo comes from the plugin through a locked-down route; <img> never runs SVG script. */
-function useLogo(card: Card) {
-  const [url, setUrl] = useState('')
-  useEffect(() => {
-    if (!card.branding.logo) return
-    let objectUrl = ''
-    let disposed = false
-    apiFetch(`${API_BASE}/api/plugins/${encodeURIComponent(card.id)}/logo`)
-      .then(r => r.ok ? r.blob() : Promise.reject(new Error('no logo')))
-      .then(blob => { if (!disposed) { objectUrl = URL.createObjectURL(blob); setUrl(objectUrl) } })
-      .catch(() => { if (!disposed) setUrl('') })
-    return () => { disposed = true; if (objectUrl) URL.revokeObjectURL(objectUrl) }
-  }, [card.id, card.branding.logo])
-  return url
-}
-function Header({ card, onOpenDrawer }: { card: Card; onOpenDrawer: () => void }) {
-  const logo = useLogo(card)
-  const { branding, distribution } = card
-  const hasWorkspace = Boolean(card.workspace)
-  return <header className={`card-header card-header-${branding.header}`}>
-    <div className="card-brand">
-      {logo ? <img className="card-logo" src={logo} alt={`${branding.provider?.name || branding.name} logo`} /> : <span className="card-logo-missing" aria-hidden="true" />}
-      <div>
-        <h2>{branding.name}</h2>
-        {branding.badge && <span className="card-badge">{branding.badge}</span>}
-        {distribution && <span className="card-badge card-badge-quiet">{distribution.tier} · {distribution.license === 'open' ? 'open source' : 'service'}</span>}
-      </div>
-    </div>
-    <button type="button" className="card-button card-button-quiet" onClick={onOpenDrawer}>
-      {hasWorkspace ? 'Open workspace' : 'Settings & usage'}
-    </button>
-  </header>
-}
-function Drawer({ plugin, card, onClose }: { plugin: PluginInfo; card: Card; onClose: () => void }) {
-  const hasWorkspace = Boolean(card.workspace)
-  const [tab, setTab] = useState<'workspace' | 'settings' | 'commands' | 'usage'>(hasWorkspace ? 'workspace' : 'settings')
-  const dialog = useRef<HTMLElement>(null)
-  const close = useRef(onClose)
-  useEffect(() => { close.current = onClose }, [onClose])
-  useEffect(() => {
-    const previous = document.activeElement instanceof HTMLElement ? document.activeElement : null
-    const focusable = () => Array.from(dialog.current?.querySelectorAll<HTMLElement>('button:not(:disabled), a[href], input:not(:disabled), select:not(:disabled), textarea:not(:disabled), [tabindex="0"]') || [])
-    focusable()[0]?.focus()
-    const key = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') { e.preventDefault(); close.current(); return }
-      if (e.key !== 'Tab') return
-      const targets = focusable(), first = targets[0], last = targets[targets.length - 1]
-      if (!first) { e.preventDefault(); dialog.current?.focus(); return }
-      if (!dialog.current?.contains(document.activeElement) || (e.shiftKey && document.activeElement === first)) { e.preventDefault(); (e.shiftKey ? last : first).focus() }
-      else if (!e.shiftKey && document.activeElement === last) { e.preventDefault(); first.focus() }
-    }
-    window.addEventListener('keydown', key)
-    return () => { window.removeEventListener('keydown', key); if (previous?.isConnected) previous.focus() }
-  }, [])
-  const tabs = hasWorkspace
-    ? (['workspace', 'settings', 'commands', 'usage'] as const)
-    : (['settings', 'commands', 'usage'] as const)
-  return <aside ref={dialog} tabIndex={-1} className="card-drawer" role="dialog" aria-modal="true" aria-label={`${card.title} settings`}>
-    <div className="card-drawer-head"><strong>{card.title}</strong><button type="button" className="card-link" onClick={onClose} aria-label="Close">Close</button></div>
-    <nav className="card-tabs" role="tablist">{tabs.map(t =>
-      <button key={t} role="tab" type="button" aria-selected={tab === t} onClick={() => setTab(t)}>
-        {t === 'workspace' ? 'Workspace' : t === 'settings' ? 'Settings' : t === 'commands' ? 'Commands' : 'Session activity'}
-      </button>)}</nav>
-    <div className="card-drawer-body">
-      {tab === 'workspace' && <WorkspaceHost plugin={plugin} card={card} />}
-      {tab === 'settings' && <SettingsWidget plugin={plugin} />}
-      {tab === 'commands' && <CommandsWidget />}
-      {tab === 'usage' && <ActivityWidget />}
-    </div>
-  </aside>
-}
-/**
- * The host gives a plugin its frame, its brand tokens and its command
- * plumbing. The layout is the plugin's own face: CardEngine never arranges
- * a plugin's interface and there is no shared template to fall back to.
- */
-export function CardEngine({ plugin }: { plugin: PluginInfo }) {
-  const card = useMemo(() => normalizeCard(plugin), [plugin])
-  const [drawer, setDrawer] = useState(false)
-  return <CardRunner card={card}>
-    <section className={`card card-bespoke${card.face ? ' card-owned' : ''}`} style={brandStyle(card.branding)} data-density={card.branding.density} aria-label={`${card.title} card`}>
-      <Header card={card} onOpenDrawer={() => setDrawer(true)} />
-      {card.description && <p className="card-muted card-description">{card.description}</p>}
-      <CardScenes plugin={plugin}>
-        {card.face
-          ? <PluginPanel plugin={plugin} elementId={card.face.id} />
-          : <p className="card-error" role="alert">{plugin.name} has not supplied its card face.</p>}
-      </CardScenes>
-      {card.branding.provider && <footer className="card-footer">{card.branding.provider.url ? <a href={card.branding.provider.url} target="_blank" rel="noreferrer noopener">{card.branding.provider.name}</a> : card.branding.provider.name} is a trademark of its owner. This plugin connects to the service with your own account.</footer>}
-      {drawer && <Drawer plugin={plugin} card={card} onClose={() => setDrawer(false)} />}
-    </section>
-  </CardRunner>
-}

package/frontend/src/components/plugins/card/CardScenes.tsx DELETED Viewed

@@ -1,103 +0,0 @@
-import { useEffect, useRef, useState } from 'react'
-import type { ReactNode } from 'react'
-import type { PluginInfo } from '../../../api/plugins'
-import { API_BASE, apiFetch } from '../../../api/_base'
-import { useRunner } from './runner-context'
-import { ExecutionPicker } from './ExecutionPicker'
-import { sanitizePluginScreens } from '../plugin-frame'
-import type { PluginScreen } from '../plugin-frame'
-/**
- * The host gives a plugin a place to put its screens and a way to move between
- * them. Which screens exist, what they are called and what is on them is the
- * plugin's design: the face declares them and reports the active one. The host
- * never derives a screen from the command list.
- */
-export type { PluginScreen } from '../plugin-frame'
-export function CardScenes({ plugin, children }: { plugin: PluginInfo; children: ReactNode }) {
-  const { card, busy } = useRunner()
-  const [enabled, setEnabled] = useState(plugin.activation?.enabled !== false)
-  useEffect(() => { setEnabled(plugin.activation?.enabled !== false) }, [plugin.id, plugin.activation?.enabled])
-  const [changing, setChanging] = useState(false)
-  const [error, setError] = useState('')
-  const [ownerBusy, setOwnerBusy] = useState<Record<string, string>>({})
-  const [menu, setMenu] = useState(false)
-  const [screens, setScreens] = useState<PluginScreen[]>([])
-  const [activeScreen, setActiveScreen] = useState('')
-  const screensRef = useRef<PluginScreen[]>([])
-  useEffect(() => {
-    screensRef.current = []
-    setScreens([]); setActiveScreen(''); setMenu(false)
-    const activity = (event: Event) => {
-      const detail = (event as CustomEvent).detail
-      if (detail?.pluginId !== plugin.id) return
-      setOwnerBusy(previous => { const next = { ...previous }; if (detail.running) next[detail.requestId] = detail.command; else delete next[detail.requestId]; return next })
-    }
-    const contextMenu = (event: Event) => { if ((event as CustomEvent).detail?.pluginId === plugin.id) setMenu(true) }
-    const declared = (event: Event) => {
-      const detail = (event as CustomEvent).detail
-      if (detail?.pluginId !== plugin.id) return
-      const next = sanitizePluginScreens(detail.screens)
-      screensRef.current = next
-      setScreens(next)
-      setActiveScreen(previous => next.some(screen => screen.id === previous) ? previous : next[0]?.id || '')
-    }
-    const changed = (event: Event) => {
-      const detail = (event as CustomEvent).detail
-      if (detail?.pluginId === plugin.id && screensRef.current.some(screen => screen.id === detail.screen)) setActiveScreen(detail.screen)
-    }
-    window.addEventListener('plugin-command-activity', activity)
-    window.addEventListener('plugin-context-menu', contextMenu)
-    window.addEventListener('plugin-screens', declared)
-    window.addEventListener('plugin-screen-changed', changed)
-    return () => {
-      window.removeEventListener('plugin-command-activity', activity); window.removeEventListener('plugin-context-menu', contextMenu)
-      window.removeEventListener('plugin-screens', declared); window.removeEventListener('plugin-screen-changed', changed)
-    }
-  }, [plugin.id])
-  const running = [...busy, ...Object.values(ownerBusy)]
-  // The face's own screens collapse into a single mount point: the plugin keeps
-  // every screen inside its own component and reports which one is active.
-  /** Ask the face to show a screen it declared; it may ignore a name it does not own. */
-  const openScreen = (name: string) => {
-    if (!screens.some(screen => screen.id === name)) return
-    setMenu(false)
-    window.dispatchEvent(new CustomEvent('plugin-show-screen', { detail: { pluginId: plugin.id, screen: name } }))
-  }
-  const move = (delta: number) => {
-    if (screens.length < 2) return
-    const current = Math.max(0, screens.findIndex(screen => screen.id === activeScreen))
-    openScreen(screens[(current + delta + screens.length) % screens.length].id)
-  }
-  const toggle = async () => {
-    setChanging(true); setError('')
-    try {
-      const response = await apiFetch(`${API_BASE}/api/plugins/${encodeURIComponent(plugin.id)}/activation`, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ enabled: !enabled }) })
-      const result = await response.json()
-      if (result.activation) setEnabled(result.activation.enabled)
-      if (!response.ok || !result.success) throw new Error(result.compilation?.error || result.error || 'Activation could not be changed')
-    } catch (err) { setError(err instanceof Error ? err.message : 'Activation could not be changed') }
-    finally { setChanging(false) }
-  }
-  return <div className="card-scenes" data-state={enabled ? 'active' : 'inactive'} aria-busy={running.length > 0 || changing}
-    onContextMenu={event => { event.preventDefault(); setMenu(true) }}
-    onKeyDown={event => { if (event.key === 'Escape') setMenu(false); if (event.key === 'F10' && event.shiftKey) { event.preventDefault(); setMenu(true) } }}>
-    <div className="card-row card-scene-controls">
-      <span role="status" className="card-pill">{running.length ? `Running ${running.join(', ')}` : enabled ? 'Active' : 'Inactive'}</span>
-      <button type="button" className="card-button" role="switch" aria-checked={enabled} aria-label={`${card.title} on or off`} onClick={() => void toggle()} disabled={changing || running.length > 0}>{changing ? 'Updating…' : enabled ? 'Turn off' : 'Turn on'}</button>
-      <button type="button" className="card-link" aria-label="Previous screen" disabled={screens.length < 2} onClick={() => move(-1)}>←</button>
-      <button type="button" className="card-link" aria-label="Next screen" disabled={screens.length < 2} onClick={() => move(1)}>→</button>
-      {screens.length > 0 && <span className="card-pill" aria-label="Current screen">{screens.find(screen => screen.id === activeScreen)?.label}</span>}
-      {screens.length > 0 && <button type="button" className="card-link" aria-haspopup="menu" aria-expanded={menu} onClick={() => setMenu(!menu)}>Screens</button>}
-    </div>
-    {menu && screens.length > 0 && <div role="menu" aria-label={`${card.title} declared screens`} className="card-context-menu">
-      {screens.map(screen => <button role="menuitem" type="button" className="card-link" key={screen.id} aria-current={screen.id === activeScreen ? 'page' : undefined} onClick={() => openScreen(screen.id)}>{screen.label}</button>)}
-    </div>}
-    {error && <p role="alert" className="card-error">{error}</p>}
-    <ExecutionPicker />
-    <div className="card-scene-track" tabIndex={0} aria-label={`${card.title} interface`}>
-      <section className="card-scene" aria-label="Interface">{children}</section>
-    </div>
-  </div>
-}

package/frontend/src/components/plugins/card/ExecutionPicker.tsx DELETED Viewed

@@ -1,64 +0,0 @@
-import { useRef, useState } from 'react'
-import { apiFetch, API_BASE } from '../../../api/_base'
-import { useRunner } from './runner-context'
-import type { PluginExecution } from '../../../api/plugins'
-type Agent = { id: string; name: string; installed: boolean; authenticated: boolean | 'unknown'; version?: string; versionVerified?: boolean }
-type Node = { id: string; name: string; online: boolean; self: boolean; accessConfigured: boolean }
-const DEFAULT: PluginExecution = { agent: 'direct', node: 'local', permissions: { read: true, write: false, send: false, destructive: false } }
-const labels = { read: 'Read commands', write: 'Write commands', send: 'Send commands', destructive: 'Delete commands' }
-let targetCache: { at: number; data: { nodes: Node[] } } | undefined
-export function ExecutionPicker() {
-  const { execution, setExecution, busy } = useRunner()
-  const selected = execution || DEFAULT
-  const [open, setOpen] = useState(false)
-  const [nodes, setNodes] = useState<Node[]>([])
-  const [agents, setAgents] = useState<Agent[]>([])
-  const [loading, setLoading] = useState(false)
-  const [error, setError] = useState('')
-  const inspection = useRef(0)
-  const loadAgents = async (node: string) => {
-    const revision = ++inspection.current
-    setLoading(true); setAgents([]); setError('')
-    try {
-      const response = await apiFetch(`${API_BASE}/api/plugins/execution-targets?node=${encodeURIComponent(node)}`)
-      const value = await response.json()
-      if (!response.ok || !value.success) throw new Error(value.error || 'Could not inspect this node')
-      if (revision === inspection.current) setAgents(value.agents || [])
-    } catch (err) { if (revision === inspection.current) setError(err instanceof Error ? err.message : 'Could not inspect this node') }
-    finally { if (revision === inspection.current) setLoading(false) }
-  }
-  const show = async () => {
-    setOpen(!open)
-    if (open) return
-    setLoading(true); setError('')
-    try {
-      if (!targetCache || Date.now() - targetCache.at > 60000) {
-        const response = await apiFetch(`${API_BASE}/api/plugins/execution-targets`)
-        const data = await response.json()
-        if (!response.ok || !data.success) throw new Error(data.error || 'CLI agents is unavailable')
-        targetCache = { at: Date.now(), data }
-      }
-      setNodes(targetCache.data.nodes || [])
-      await loadAgents(selected.node)
-    } catch (err) { setError(err instanceof Error ? err.message : 'CLI agents is unavailable'); setLoading(false) }
-  }
-  return <div className="card-execution">
-    <button type="button" className="card-link" onClick={() => void show()} aria-expanded={open}>Agent, node & permissions</button>
-    {open && <fieldset className="card-form" disabled={loading || busy.size > 0}>
-      <legend>Command execution</legend>
-      <label>Mesh node<select value={selected.node} onChange={event => { const node = event.target.value; setExecution({ ...selected, node, agent: 'direct', cwd: undefined }); void loadAgents(node) }}>
-        <option value="local">This node</option>{nodes.filter(node => !node.self).map(node => <option key={node.id} value={node.id} disabled={!node.online || !node.accessConfigured}>{node.name}{!node.online ? ' · offline' : !node.accessConfigured ? ' · access needed' : ''}</option>)}
-      </select></label>
-      <label>CLI agent<select value={selected.agent} onChange={event => setExecution({ ...selected, agent: event.target.value, allowUnknownAuth: event.target.value !== 'direct' })}>
-        <option value="direct">Direct CLI</option>{agents.map(agent => <option key={agent.id} value={agent.id} disabled={!agent.installed || !agent.versionVerified || agent.authenticated === false}>{agent.name}{!agent.installed ? ' · not installed' : agent.authenticated === false ? ' · sign in needed' : agent.authenticated === 'unknown' ? ' · account unchecked' : ''}</option>)}
-      </select></label>
-      {selected.node !== 'local' && <label>Workspace on selected node<input value={selected.cwd || ''} placeholder="/absolute/workspace" onChange={event => setExecution({ ...selected, cwd: event.target.value })} /></label>}
-      <div className="card-permissions">{(Object.keys(labels) as Array<keyof typeof labels>).map(key => <label key={key}><input type="checkbox" role="switch" checked={selected.permissions[key]} onChange={event => setExecution({ ...selected, permissions: { ...selected.permissions, [key]: event.target.checked } })} />{labels[key]}</label>)}</div>
-      <button type="button" className="card-link" onClick={() => void loadAgents(selected.node)}>Refresh installed agents</button>
-    </fieldset>}
-    {loading && <p role="status" className="card-muted">Inspecting installed agents…</p>}
-    {error && <p role="alert" className="card-error">{error}</p>}
-  </div>
-}

package/frontend/src/components/plugins/card/args.ts DELETED Viewed

@@ -1,28 +0,0 @@
-import type { CardArg, CardCommand } from './contract'
-export type ArgValues = Record<string, string | number | boolean | undefined>
-/** Secret arguments are never put on the command line; they are managed in the drawer's Credentials. */
-export const visibleArgs = (command: CardCommand) => command.args.filter(arg => !arg.secret)
-export function missingRequired(command: CardCommand, values: ArgValues): string[] {
-  return visibleArgs(command).filter(arg => arg.required && (values[arg.name] === undefined || values[arg.name] === '')).map(arg => arg.label)
-}
-/** Positionals first, in declared order, then flags. Returns argv for `--json` runs. */
-export function buildArgs(command: CardCommand, values: ArgValues, extra: string[] = []): string[] {
-  const argv: string[] = []
-  const flagged: string[] = []
-  for (const arg of visibleArgs(command)) {
-    const value = values[arg.name]
-    if (value === undefined || value === '' || value === false) continue
-    if (arg.positional) { argv.push(String(value)); continue }
-    if (!arg.flag) continue
-    if (arg.type === 'boolean') flagged.push(arg.flag)
-    else flagged.push(arg.flag, String(value))
-  }
-  return [...argv, ...flagged, ...extra, ...(command.output === 'json' ? ['--json'] : [])]
-}
-export const needsConfirmation = (command: CardCommand) => command.effect === 'destructive' || command.effect === 'send'
-export const defaultValue = (arg: CardArg) => arg.type === 'boolean' ? false : arg.type === 'choice' && arg.options?.length && arg.required ? arg.options[0] : ''

package/frontend/src/components/plugins/card/card.css DELETED Viewed

@@ -1,32 +0,0 @@
-.card{--card-surface:var(--bg-secondary,#fff);--card-text:var(--text-primary,#111);--card-muted:var(--text-secondary,#555);--card-line:var(--border,#d4d4d8);position:relative;background:var(--card-surface);color:var(--card-text);border:1px solid var(--card-line);border-radius:var(--card-radius);padding:var(--card-gap);display:grid;gap:var(--card-gap);overflow:hidden}
-.card h2,.card h3{margin:0}.card h2{font-size:1.15rem}.card h3{font-size:.8rem;text-transform:uppercase;letter-spacing:.06em;color:var(--card-muted);margin-bottom:6px}
-.card-header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
-.card-brand{display:flex;align-items:center;gap:12px}.card-logo{height:36px;max-width:140px;object-fit:contain}.card-logo-missing{width:36px;height:36px;border-radius:var(--card-radius);background:var(--card-color)}
-.card-header-band{background:var(--card-color);color:var(--card-on-color);margin:calc(var(--card-gap)*-1) calc(var(--card-gap)*-1) 0;padding:var(--card-gap)}
-.card-header-ledger-rule{border-bottom:3px double var(--card-line);padding-bottom:var(--card-gap)}
-.card-header-tab-strip{border-bottom:2px solid var(--card-accent);padding-bottom:6px}
-.card-header-badge-left{flex-direction:row-reverse;justify-content:flex-end}
-.card-badge{display:inline-block;margin:4px 6px 0 0;padding:1px 8px;border-radius:var(--card-radius);background:var(--card-accent);color:var(--card-on-accent);font-size:.7rem;font-weight:600}
-.card-badge-quiet{background:transparent;color:var(--card-muted);border:1px solid var(--card-line)}
-.card-description{margin:0}.card-muted{color:var(--card-muted);font-size:.85rem;margin:2px 0}
-/* The face supplies its own layout; the host only gives it a surface. */
-.card-bespoke .card-face{display:block;min-width:0}
-.card-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.card-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:8px 0 0}.card-kv dt{font-size:.7rem;color:var(--card-muted);text-transform:uppercase}.card-kv dd{margin:0;font-weight:600;overflow-wrap:anywhere}
-.card-pill{padding:1px 8px;border-radius:999px;font-size:.75rem;font-weight:600;border:1px solid currentColor}.card-pill-ok{color:#047857}.card-pill-warn{color:#b45309}.card-pill-error{color:#b91c1c}.card-pill-neutral{color:var(--card-muted)}
-.card-button{background:var(--card-color);color:var(--card-on-color);border:0;border-radius:var(--card-radius);padding:6px 12px;font:inherit;cursor:pointer}.card-button:disabled{opacity:.5;cursor:not-allowed}.card-button-quiet{background:transparent;color:var(--card-text);border:1px solid var(--card-line)}
-.card-link{background:none;border:0;color:var(--card-color);cursor:pointer;font:inherit;text-decoration:underline;padding:0}
-.card :focus-visible{outline:2px solid var(--card-accent);outline-offset:2px}
-.card-code,.card-pre{font-family:ui-monospace,monospace;font-size:.78rem;background:rgba(127,127,127,.12);border-radius:var(--card-radius);padding:4px 8px;overflow-x:auto}.card-pre{white-space:pre-wrap;max-height:260px;overflow:auto}
-.card-commands,.card-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.card-commands li{border-top:1px solid var(--card-line);padding-top:8px}
-.card-form{display:grid;gap:8px;margin-top:8px}.card-form label{display:grid;gap:2px;font-size:.8rem}.card-form input,.card-form select{font:inherit;padding:4px 6px;border:1px solid var(--card-line);border-radius:var(--card-radius);background:transparent;color:inherit}
-.card-scroll{overflow-x:auto}.card-table{width:100%;border-collapse:collapse;font-size:.85rem}.card-table th{text-align:left;font-size:.7rem;text-transform:uppercase;color:var(--card-muted);border-bottom:2px solid var(--card-line);padding:4px 8px}.card-table td{padding:5px 8px;border-bottom:1px solid var(--card-line)}
-.card-gauge{height:10px;background:rgba(127,127,127,.2);border-radius:var(--card-radius);overflow:hidden}.card-gauge span{display:block;height:100%;background:var(--card-accent)}
-.card-error{color:#b91c1c;margin:6px 0}.card-footer{font-size:.72rem;color:var(--card-muted)}.card-footer a{color:inherit}
-.card-drawer{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--card-surface);border-left:1px solid var(--card-line);box-shadow:-8px 0 24px rgba(0,0,0,.15);display:flex;flex-direction:column;z-index:2}
-.card-drawer-head{display:flex;justify-content:space-between;padding:var(--card-gap);border-bottom:1px solid var(--card-line)}.card-drawer-body{padding:var(--card-gap);overflow:auto;flex:1}
-.card-tabs{display:flex;border-bottom:1px solid var(--card-line)}.card-tabs button{flex:1;background:none;border:0;border-bottom:3px solid transparent;padding:8px;font:inherit;color:var(--card-muted);cursor:pointer}.card-tabs button[aria-selected=true]{color:var(--card-text);border-bottom-color:var(--card-accent)}
-@media (prefers-reduced-motion:no-preference){.card-drawer{animation:card-slide .18s ease-out}@keyframes card-slide{from{transform:translateX(24px);opacity:0}}}
-.card-scene-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;gap:var(--card-gap);overscroll-behavior-x:contain}.card-scene{flex:0 0 100%;min-width:0;scroll-snap-align:start;padding:4px}.card-scene-controls{margin-bottom:var(--card-gap)}.card-scenes[data-state=inactive] .card-scene-track{opacity:.65}.card-scenes[aria-busy=true] .card-pill{animation:card-running 1.1s ease-in-out infinite}@keyframes card-running{50%{box-shadow:0 0 0 3px color-mix(in srgb,var(--card-color) 28%,transparent)}}@media(prefers-reduced-motion:reduce){.card-scenes[aria-busy=true] .card-pill{animation:none}.card-scene-track{scroll-behavior:auto}}
-.card-scene-track{position:relative}.card-context-menu{display:grid;gap:8px;padding:12px;border:1px solid var(--card-line);border-radius:var(--card-radius);background:var(--card-surface);box-shadow:0 8px 24px #0002}.card-context-menu button{text-align:left}
-.card.card-owned{border:1px solid var(--card-line);background:var(--card-surface);border-radius:var(--card-radius);padding:var(--card-gap);box-shadow:0 1px 3px rgba(0,0,0,0.06)}.card-owned .card-link{color:var(--text-primary,#111)}.card-permissions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.card-permissions label{display:flex;align-items:center;gap:8px}.card-execution{margin-bottom:var(--card-gap)}
-.card-scenes,.card-scene-track{min-width:0;max-width:100%}.card-scene{box-sizing:border-box}.card-execution fieldset{min-inline-size:0;box-sizing:border-box;width:100%}.card-execution select,.card-execution input:not([type=checkbox]){min-width:0;width:100%;box-sizing:border-box}.card-permissions label{white-space:normal}

package/frontend/src/components/plugins/card/cli-line.ts DELETED Viewed

@@ -1,13 +0,0 @@
-import type { Card, CardCommand } from './contract'
-/** The exact line an agent runs; shown on the card so config and CLI never drift apart. */
-export function cliLine(card: Card, command: CardCommand, cliName: string): string {
-  const parts = [`total-recall`, cliName || card.id, command.name]
-  for (const arg of command.args) {
-    if (arg.secret) continue // secrets go on stdin, never in the line an agent logs
-    const token = arg.positional ? `<${arg.name}>` : `${arg.flag}${arg.type === 'boolean' ? '' : ` <${arg.name}>`}`
-    parts.push(arg.required ? token : `[${token}]`)
-  }
-  if (command.output === 'json') parts.push('--json')
-  return parts.join(' ')
-}

package/frontend/src/components/plugins/card/contract.ts DELETED Viewed

@@ -1,91 +0,0 @@
-import type { PluginInfo } from '../../../api/plugins'
-export type ArgType = 'string' | 'number' | 'boolean' | 'choice'
-export type Effect = 'read' | 'write' | 'destructive' | 'send'
-export interface CardArg { name: string; flag?: string; positional?: boolean; label: string; type: ArgType; options?: Array<string | number>; required?: boolean; secret?: boolean }
-export interface CardCommand { name: string; description?: string; args: CardArg[]; effect: Effect; output: 'json' | 'text'; timeoutMs?: number }
-export interface CardBranding {
-  name: string; color: string; accent: string; font: string; density: 'compact' | 'comfortable' | 'spacious'
-  radius: 'none' | 'sm' | 'md' | 'lg' | 'pill'; header: 'plain' | 'ledger-rule' | 'band' | 'tab-strip' | 'badge-left'
-  badge?: string; logo?: string; provider?: { name: string; url?: string }
-}
-export interface CardWorkspace {
-  component?: string;
-  tabs?: string[];
-  permissions?: string[];
-}
-/** The plugin's own card face. Layout belongs to the plugin, never to a shared template. */
-export interface CardFace { id: string; tag: string; module: string; description?: string }
-export interface Card {
-  id: string; title: string; description: string; face?: CardFace
-  commands: Map<string, CardCommand>; branding: CardBranding; status?: { command: string; refreshSeconds: number }
-  distribution?: { tier: string; license: string }
-  workspace?: CardWorkspace
-}
-const FONTS = ['system', 'inter', 'ibm-plex', 'space-grotesk', 'jetbrains-mono', 'dm-sans', 'outfit', 'fraunces', 'newsreader', 'chivo-mono']
-const HEX = /^#[0-9a-fA-F]{6}$/
-/** Manifest JSON is untyped input; every field is checked before it is used. */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export type Loose = any
-const obj = (v: unknown): Record<string, Loose> => (v && typeof v === 'object' && !Array.isArray(v) ? v as Record<string, Loose> : {})
-function normalizeArg(raw: unknown): CardArg | null {
-  const a = obj(raw)
-  if (typeof a.name !== 'string' || typeof a.label !== 'string') return null
-  const type = ['string', 'number', 'boolean', 'choice'].includes(a.type) ? a.type : 'string'
-  return { name: a.name, flag: typeof a.flag === 'string' ? a.flag : undefined, positional: a.positional === true, label: a.label, type, options: Array.isArray(a.options) ? a.options : undefined, required: a.required === true, secret: a.secret === true }
-}
-export function normalizeCard(plugin: PluginInfo): Card {
-  const manifest = obj(plugin.manifest)
-  const commands = new Map<string, CardCommand>()
-  for (const sub of plugin.cli?.subcommands || []) {
-    const declared = obj(manifest.cli?.subcommands?.find((item: Loose) => item?.name === sub.name))
-    commands.set(sub.name, {
-      name: sub.name, description: sub.description,
-      args: (Array.isArray(declared.args) ? declared.args : []).map(normalizeArg).filter(Boolean) as CardArg[],
-      // A grouped command such as `config set` may write. Only explicit read declarations are safe.
-      effect: ['read', 'write', 'destructive', 'send'].includes(declared.effect) ? declared.effect : 'write',
-      output: declared.output === 'text' ? 'text' : 'json',
-      timeoutMs: Number.isFinite(declared.timeout_ms) ? declared.timeout_ms : undefined,
-    })
-  }
-  const b = obj(manifest.branding)
-  const branding: CardBranding = {
-    name: typeof b.name === 'string' ? b.name : plugin.name,
-    color: HEX.test(b.color) ? b.color : '#475569',
-    accent: HEX.test(b.accent) ? b.accent : HEX.test(b.color) ? b.color : '#0ea5e9',
-    font: FONTS.includes(b.font) ? b.font : 'system',
-    density: ['compact', 'comfortable', 'spacious'].includes(b.density) ? b.density : 'comfortable',
-    radius: ['none', 'sm', 'md', 'lg', 'pill'].includes(b.radius) ? b.radius : 'md',
-    header: ['plain', 'ledger-rule', 'band', 'tab-strip', 'badge-left'].includes(b.header) ? b.header : 'plain',
-    badge: typeof b.badge === 'string' ? b.badge : undefined,
-    logo: typeof b.logo === 'string' ? b.logo : undefined,
-    provider: obj(b.provider).name ? { name: String(b.provider.name), url: typeof b.provider.url === 'string' ? b.provider.url : undefined } : undefined,
-  }
-  const status = obj(manifest.status)
-  const statusCommand = typeof status.command === 'string' && commands.has(status.command) ? status.command : undefined
-  // The face is the plugin's own component; there is no shared layout to fall back to.
-  // Only `kind: 'card'` is the face. A plugin may declare any number of
-  // `kind: 'panel'` screens, and one declared before the card is still a
-  // secondary screen, never the face.
-  const elements: Loose[] = Array.isArray(manifest.ui?.elements) ? manifest.ui.elements : (Array.isArray(plugin.ui?.elements) ? plugin.ui.elements : [])
-  const declared = elements.find((element: Loose) => element && typeof element === 'object' && element.kind === 'card')
-  const face: CardFace | undefined = declared && typeof declared.id === 'string' && typeof declared.tag === 'string' && typeof declared.module === 'string'
-    ? { id: declared.id, tag: declared.tag, module: declared.module, description: typeof declared.description === 'string' ? declared.description : undefined }
-    : undefined
-  const ws = obj(manifest.workspace)
-  const workspace: CardWorkspace | undefined = ws && (ws.component || Array.isArray(ws.tabs)) ? {
-    component: typeof ws.component === 'string' ? ws.component : undefined,
-    tabs: Array.isArray(ws.tabs) ? ws.tabs.filter((t: unknown) => typeof t === 'string') : undefined,
-    permissions: Array.isArray(ws.permissions) ? ws.permissions.filter((p: unknown) => typeof p === 'string') : undefined,
-  } : undefined
-  return {
-    id: plugin.id, title: branding.name, description: plugin.description, face, commands, branding,
-    status: statusCommand ? { command: statusCommand, refreshSeconds: Number.isInteger(status.refresh_seconds) ? Math.min(86400, Math.max(5, status.refresh_seconds)) : 30 } : undefined,
-    distribution: obj(manifest.distribution).tier ? { tier: manifest.distribution.tier, license: manifest.distribution.license } : undefined,
-    workspace,
-  }
-}

package/frontend/src/components/plugins/card/format.ts DELETED Viewed

@@ -1,49 +0,0 @@
-import type { Loose } from './contract'
-/**
- * How a scalar is rendered. This is presentation owned by the card face that
- * asks for it — not a template primitive. The layout vocabulary (`CardRegion`,
- * `CardColumn`, `CellFormat`) that once shared these names is deleted.
- */
-export type CellFormat = 'text' | 'number' | 'money' | 'percent' | 'bytes' | 'date' | 'datetime'
-export type Tone = 'ok' | 'warn' | 'error' | 'neutral'
-const GOOD = /^(ok|healthy|active|connected|ready|running|verified|delivered|sent|passed|pass|up|online|true|complete|completed)$/i
-const BAD = /^(error|failed|fail|down|offline|rejected|bounced|blocked|false|expired|denied)$/i
-const WARN = /^(warn|warning|pending|queued|degraded|unknown|stale|paused|partial|throttled)$/i
-export const toneOf = (value: unknown): Tone => { const s = String(value); return GOOD.test(s) ? 'ok' : BAD.test(s) ? 'error' : WARN.test(s) ? 'warn' : 'neutral' }
-export function formatCell(value: unknown, format: CellFormat = 'text'): string {
-  if (value === null || value === undefined || value === '') return '—'
-  if (typeof value === 'object') return JSON.stringify(value)
-  const n = Number(value)
-  switch (format) {
-    case 'number': return Number.isFinite(n) ? n.toLocaleString() : String(value)
-    case 'money': return Number.isFinite(n) ? n.toLocaleString(undefined, { style: 'currency', currency: 'USD' }) : String(value)
-    case 'percent': return Number.isFinite(n) ? `${Math.round((n <= 1 ? n * 100 : n) * 10) / 10}%` : String(value)
-    case 'bytes': {
-      if (!Number.isFinite(n)) return String(value)
-      const units = ['B', 'KB', 'MB', 'GB', 'TB']; let v = n, i = 0
-      while (v >= 1024 && i < units.length - 1) { v /= 1024; i++ }
-      return `${i === 0 ? v : v.toFixed(1)} ${units[i]}`
-    }
-    case 'date': case 'datetime': {
-      const d = new Date(String(value))
-      if (Number.isNaN(d.getTime())) return String(value)
-      return format === 'date' ? d.toLocaleDateString() : d.toLocaleString()
-    }
-    default: return String(value)
-  }
-}
-/** Rows may arrive as a bare array or wrapped under a common key. */
-export function rowsOf(data: Loose): Loose[] {
-  if (Array.isArray(data)) return data
-  for (const key of ['rows', 'items', 'results', 'data', 'entries', 'records']) if (Array.isArray(data?.[key])) return data[key]
-  return []
-}
-export function scalarsOf(data: Loose): Array<[string, string]> {
-  if (!data || typeof data !== 'object' || Array.isArray(data)) return []
-  return Object.entries(data).filter(([, v]) => v === null || ['string', 'number', 'boolean'].includes(typeof v)).map(([k, v]) => [k, v === null ? '—' : String(v)])
-}

package/frontend/src/components/plugins/card/runner-context.ts DELETED Viewed

@@ -1,11 +0,0 @@
-import { createContext, useContext } from 'react'
-import type { ArgValues } from './args'
-import type { Card, Loose } from './contract'
-import type { PluginExecution } from '../../../api/plugins'
-export interface RunResult { ok: boolean; data?: Loose; text: string; error?: string; ms: number }
-export interface ActivityEntry { at: string; command: string; effect: string; ok: boolean; ms: number }
-export interface Runner { card: Card; run: (command: string, values?: ArgValues, extra?: string[], stdin?: string) => Promise<RunResult>; activity: ActivityEntry[]; busy: Set<string>; execution: PluginExecution | null; setExecution: (value: PluginExecution | null) => void }
-export const RunnerContext = createContext<Runner | null>(null)
-export const useRunner = () => { const value = useContext(RunnerContext); if (!value) throw new Error('Card widgets must render inside a CardRunner'); return value }