@polderlabs/bizar 7.0.2 → 7.0.4

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 (27) hide show
  1. package/bizar-dash/dist/assets/EnvVarsSection-BfhAz3ax.js.map +1 -1
  2. package/bizar-dash/dist/assets/Toast-ATSAmbdi.js.map +1 -1
  3. package/bizar-dash/dist/assets/main-CJAtrosO.css +1 -0
  4. package/bizar-dash/dist/assets/main-DKKj9dsq.js +430 -0
  5. package/bizar-dash/dist/assets/main-DKKj9dsq.js.map +1 -0
  6. package/bizar-dash/dist/assets/mobile-layout-GZ3bE8L6.js.map +1 -1
  7. package/bizar-dash/dist/assets/useSlashCommands-BOwD7lNb.js.map +1 -1
  8. package/bizar-dash/dist/index.html +2 -2
  9. package/bizar-dash/node_modules/.vite/vitest/da39a3ee5e6b4b0d3255bfef95601890afd80709/results.json +1 -0
  10. package/bizar-dash/src/web/components/SettingsNav.tsx +9 -4
  11. package/bizar-dash/src/web/components/Topbar.tsx +45 -0
  12. package/bizar-dash/src/web/styles/main.css +87 -89
  13. package/bizar-dash/src/web/styles/memory.css +30 -35
  14. package/bizar-dash/src/web/styles/settings.css +6 -26
  15. package/bizar-dash/src/web/ui/data/data.css +6 -1
  16. package/bizar-dash/src/web/ui/index.ts +1 -0
  17. package/bizar-dash/src/web/views/Memory.tsx +94 -62
  18. package/bizar-dash/src/web/views/Overview.tsx +2 -23
  19. package/bizar-dash/tests/settings-layout.test.tsx +2 -2
  20. package/bizar-dash/tests/settings-nav.test.tsx +6 -6
  21. package/cli/provision-claude.mjs +108 -5
  22. package/package.json +1 -1
  23. package/packages/sdk/.harness/agents.json +17 -0
  24. package/packages/sdk/.harness/topology.json +4 -0
  25. package/bizar-dash/dist/assets/main-306CZfn6.js +0 -430
  26. package/bizar-dash/dist/assets/main-306CZfn6.js.map +0 -1
  27. package/bizar-dash/dist/assets/main-G3bNDpY3.css +0 -1
@@ -29,13 +29,13 @@
29
29
  }
30
30
  })();
31
31
  </script>
32
- <script type="module" crossorigin src="/assets/main-306CZfn6.js"></script>
32
+ <script type="module" crossorigin src="/assets/main-DKKj9dsq.js"></script>
33
33
  <link rel="modulepreload" crossorigin href="/assets/mobile-layout-GZ3bE8L6.js">
34
34
  <link rel="modulepreload" crossorigin href="/assets/Toast-ATSAmbdi.js">
35
35
  <link rel="modulepreload" crossorigin href="/assets/EnvVarsSection-BfhAz3ax.js">
36
36
  <link rel="modulepreload" crossorigin href="/assets/useSlashCommands-BOwD7lNb.js">
37
37
  <link rel="stylesheet" crossorigin href="/assets/mobile-layout-BWLtwtfQ.css">
38
- <link rel="stylesheet" crossorigin href="/assets/main-G3bNDpY3.css">
38
+ <link rel="stylesheet" crossorigin href="/assets/main-CJAtrosO.css">
39
39
  </head>
40
40
  <body>
41
41
  <div id="root"></div>
@@ -0,0 +1 @@
1
+ {"version":"4.1.10","results":[[":tests/views/Memory.test.tsx",{"duration":427.588434,"failed":false}],[":tests/BackgroundAgents.test.tsx",{"duration":268.359411,"failed":false}],[":tests/autosave.test.tsx",{"duration":258.93156,"failed":false}],[":tests/views/Overview.test.tsx",{"duration":493.33852,"failed":false}],[":tests/mobile-layout.test.tsx",{"duration":284.669842,"failed":false}],[":tests/views/Agents.test.tsx",{"duration":622.547519,"failed":false}],[":tests/components/settings-search.test.tsx",{"duration":742.6605920000001,"failed":false}],[":tests/eval-web-ui.test.tsx",{"duration":134.72983299999999,"failed":false}],[":tests/views/Tasks.test.tsx",{"duration":443.49187600000005,"failed":false}],[":tests/a11y/forms.test.tsx",{"duration":89.58849199999997,"failed":true}],[":tests/mobile-settings.test.tsx",{"duration":214.629275,"failed":false}],[":tests/a11y.test.tsx",{"duration":2510.271573,"failed":false}],[":tests/backup-restore.test.tsx",{"duration":199.76050199999997,"failed":false}],[":tests/mobile-tasks.test.tsx",{"duration":200.3035920000001,"failed":false}],[":tests/chat-composer.test.tsx",{"duration":273.03698099999997,"failed":false}],[":tests/mobile-overview.test.tsx",{"duration":251.19768999999985,"failed":false}],[":src/web/components/agents/RoutingDecisions.test.tsx",{"duration":96.87386300000003,"failed":false}],[":tests/lib/utils.test.ts",{"duration":16.848490000000027,"failed":false}],[":tests/ui/data/DataTable.test.tsx",{"duration":194.62984499999993,"failed":false}],[":tests/lib/search-fuzzy.test.ts",{"duration":4.908913999999982,"failed":false}],[":tests/settings-layout.test.tsx",{"duration":206.809751,"failed":false}],[":tests/settings-nav.test.tsx",{"duration":282.1045120000001,"failed":false}],[":tests/settings-mode-wiring.test.tsx",{"duration":312.29586500000005,"failed":false}],[":tests/minimax-bar.test.tsx",{"duration":32.567679999999996,"failed":false}],[":tests/ui/feedback/Toast.test.tsx",{"duration":250.11323599999992,"failed":false}],[":tests/ui/navigation/CommandPalette.test.tsx",{"duration":282.23178600000006,"failed":false}],[":tests/components/doctor-panel.test.tsx",{"duration":91.71197599999994,"failed":false}],[":tests/views/sidebar.test.tsx",{"duration":129.53635500000007,"failed":false}],[":tests/ui/layout/Tabs.test.tsx",{"duration":192.45391100000006,"failed":false}],[":tests/views/topbar.test.tsx",{"duration":519.7306729999999,"failed":false}],[":tests/components/Toast.test.tsx",{"duration":201.75069100000007,"failed":false}],[":tests/ui/feedback/Tooltip.test.tsx",{"duration":93.07135800000003,"failed":false}],[":tests/voice-recorder.test.tsx",{"duration":144.5129629999999,"failed":false}],[":tests/mobile-chat.test.tsx",{"duration":81.44125299999996,"failed":false}],[":tests/ui/data/StatTile.test.tsx",{"duration":112.04556500000001,"failed":false}],[":tests/ui/layout/Sidebar.test.tsx",{"duration":160.56550000000004,"failed":false}],[":tests/ui/feedback/Dialog.test.tsx",{"duration":169.84368500000005,"failed":false}],[":tests/goal-input.test.tsx",{"duration":195.10940199999993,"failed":false}],[":tests/goap-planner.test.ts",{"duration":3.8911860000000047,"failed":false}],[":tests/components/Modal.test.tsx",{"duration":201.81510500000002,"failed":false}],[":tests/communication-log.test.tsx",{"duration":76.99420199999997,"failed":false}],[":tests/ui/feedback/ProgressBar.test.tsx",{"duration":76.68909899999994,"failed":false}],[":tests/memory-graph-view.test.tsx",{"duration":46.589782000000014,"failed":false}],[":tests/ui/data/KeyValueList.test.tsx",{"duration":152.445653,"failed":false}],[":tests/ui/layout/Breadcrumbs.test.tsx",{"duration":136.796558,"failed":false}],[":tests/ui/navigation/NavLink.test.tsx",{"duration":178.380541,"failed":false}],[":tests/components/screenshot-ocr.test.tsx",{"duration":34.225052000000005,"failed":false}],[":tests/hooks/useModal.test.tsx",{"duration":147.95084200000008,"failed":false}],[":tests/ui/data/BarChart.test.tsx",{"duration":94.56861200000003,"failed":false}],[":tests/ui/controls/Textarea.test.tsx",{"duration":112.77774600000009,"failed":false}],[":tests/event-log.test.tsx",{"duration":65.03253399999994,"failed":false}],[":tests/ui/controls/Select.test.tsx",{"duration":152.022293,"failed":false}],[":tests/ui/data/Sparkline.test.tsx",{"duration":32.044768999999974,"failed":false}],[":tests/components/workspace-selector.test.tsx",{"duration":137.78600100000006,"failed":false}],[":tests/ui/navigation/NavGroup.test.tsx",{"duration":171.45922700000006,"failed":false}],[":tests/dep-graph.test.tsx",{"duration":118.61701100000005,"failed":false}],[":tests/ui/controls/RadioGroup.test.tsx",{"duration":167.64945699999998,"failed":false}],[":tests/ui/layout/Panel.test.tsx",{"duration":34.87961399999995,"failed":false}],[":tests/quality-gates.test.tsx",{"duration":43.57956200000001,"failed":false}],[":tests/ui/controls/NumberInput.test.tsx",{"duration":149.17823099999998,"failed":false}],[":tests/ui/data/EmptyState.test.tsx",{"duration":104.00983799999995,"failed":false}],[":tests/ui/layout/ViewHeader.test.tsx",{"duration":39.52563399999997,"failed":false}],[":tests/ui/controls/SearchInput.test.tsx",{"duration":150.78952400000003,"failed":false}],[":tests/ui/primitives/Box.test.tsx",{"duration":32.86741299999994,"failed":false}],[":tests/ui/layout/AppShell.test.tsx",{"duration":27.480504999999994,"failed":false}],[":tests/ui/controls/Button.test.tsx",{"duration":141.232436,"failed":false}],[":tests/ui/controls/Slider.test.tsx",{"duration":83.16240600000003,"failed":false}],[":tests/hooks/useToast.test.tsx",{"duration":125.98108200000001,"failed":false}],[":tests/ui/data/ErrorState.test.tsx",{"duration":117.94075600000008,"failed":false}],[":tests/ui/data/LoadingState.test.tsx",{"duration":77.70447200000001,"failed":false}],[":tests/ui/controls/TextInput.test.tsx",{"duration":117.05886900000007,"failed":false}],[":tests/ui/layout/Topbar.test.tsx",{"duration":70.17956199999992,"failed":false}],[":tests/ui/feedback/StatusDot.test.tsx",{"duration":80.754097,"failed":false}],[":tests/lib/i18n.test.ts",{"duration":2.413669000000027,"failed":false}],[":tests/ui/feedback/Badge.test.tsx",{"duration":48.463427000000024,"failed":false}],[":tests/ui/controls/Checkbox.test.tsx",{"duration":116.98734100000001,"failed":false}],[":tests/components/Button.test.tsx",{"duration":115.24144100000001,"failed":false}],[":tests/components/Card.test.tsx",{"duration":25.367482000000052,"failed":false}],[":tests/ui/primitives/Stack.test.tsx",{"duration":25.539912000000072,"failed":false}],[":tests/components/StatusBadge.test.tsx",{"duration":35.74661299999991,"failed":false}],[":tests/ui/controls/Toggle.test.tsx",{"duration":142.27458000000001,"failed":false}],[":tests/ui/primitives/Separator.test.tsx",{"duration":17.745345999999984,"failed":false}],[":tests/ui/controls/IconButton.test.tsx",{"duration":96.80897900000002,"failed":false}],[":tests/ui/controls/Kbd.test.tsx",{"duration":19.74353099999996,"failed":false}],[":tests/ui/primitives/Inline.test.tsx",{"duration":15.097170000000006,"failed":false}],[":tests/ui/primitives/Grid.test.tsx",{"duration":21.766181000000017,"failed":false}],[":tests/ui/layout/PanelHeader.test.tsx",{"duration":18.773353999999983,"failed":false}],[":tests/ui/primitives/VisuallyHidden.test.tsx",{"duration":15.98928699999999,"failed":false}],[":tests/components/Spinner.test.tsx",{"duration":61.72107700000004,"failed":false}]]}
@@ -68,7 +68,12 @@ export type SettingsNavProps = {
68
68
 
69
69
  export function SettingsNav({ activeSection, onSectionChange, onExitSettings }: SettingsNavProps) {
70
70
  return (
71
- <div className="settings-nav-root" aria-label="Settings sections">
71
+ // v7.0.4 — reuse the .sidebar-* shell classes so the Settings rail
72
+ // is visually identical to the main nav rail. The legacy .settings-nav-*
73
+ // wrapper classes were a near-duplicate of .sidebar-nav + .sidebar-section-*
74
+ // and produced a subtly different bg tone. With the shared classes, both
75
+ // rails read as one component.
76
+ <nav className="sidebar-nav" aria-label="Settings sections">
72
77
  {/* Back button */}
73
78
  <button
74
79
  type="button"
@@ -80,12 +85,12 @@ export function SettingsNav({ activeSection, onSectionChange, onExitSettings }:
80
85
  <span className="sidebar-tab-label">Back</span>
81
86
  </button>
82
87
 
83
- <div className="settings-nav-divider" aria-hidden="true" />
88
+ <div className="sidebar-section-divider" aria-hidden="true" />
84
89
 
85
90
  {/* Section groups */}
86
91
  {SECTION_GROUPS.map((group) => (
87
92
  <div key={group.label} className="settings-nav-group">
88
- <div className="settings-nav-group-label">{group.label}</div>
93
+ <div className="sidebar-section-label">{group.label}</div>
89
94
  {group.sections.map((s) => {
90
95
  const Icon = s.icon;
91
96
  const active = activeSection === s.id;
@@ -107,6 +112,6 @@ export function SettingsNav({ activeSection, onSectionChange, onExitSettings }:
107
112
  })}
108
113
  </div>
109
114
  ))}
110
- </div>
115
+ </nav>
111
116
  );
112
117
  }
@@ -27,6 +27,8 @@ import {
27
27
  Stethoscope,
28
28
  ClipboardCheck,
29
29
  Target,
30
+ Sun,
31
+ Moon,
30
32
  type LucideIcon,
31
33
  } from 'lucide-react';
32
34
  import { cn } from '../lib/utils';
@@ -126,6 +128,38 @@ export function Topbar({
126
128
  extraTabs,
127
129
  clineStatus = null,
128
130
  }: TopbarProps) {
131
+ // v7.0.4 — theme toggle hoisted from views/Overview.tsx so the
132
+ // user can swap light/dark from any view (not only Overview).
133
+ // Persisted to localStorage; falls back to system preference once
134
+ // on first paint, then user choice wins.
135
+ const [isDark, setIsDark] = useState<boolean>(() => {
136
+ if (typeof document === 'undefined') return true;
137
+ const stored = window.localStorage?.getItem('bizar.theme');
138
+ if (stored === 'light') return false;
139
+ if (stored === 'dark') return true;
140
+ const attr = document.documentElement.getAttribute('data-theme');
141
+ if (attr === 'light') return false;
142
+ if (attr === 'dark') return true;
143
+ return window.matchMedia?.('(prefers-color-scheme: light)').matches === false;
144
+ });
145
+ useEffect(() => {
146
+ if (typeof document === 'undefined') return;
147
+ if (isDark) {
148
+ document.documentElement.removeAttribute('data-theme');
149
+ try {
150
+ window.localStorage?.setItem('bizar.theme', 'dark');
151
+ } catch {
152
+ /* private mode / quota — non-fatal */
153
+ }
154
+ } else {
155
+ document.documentElement.setAttribute('data-theme', 'light');
156
+ try {
157
+ window.localStorage?.setItem('bizar.theme', 'light');
158
+ } catch {
159
+ /* non-fatal */
160
+ }
161
+ }
162
+ }, [isDark]);
129
163
  return (
130
164
  <header className="topbar">
131
165
  <div className="topbar-row">
@@ -156,6 +190,17 @@ export function Topbar({
156
190
  <div className="topbar-right">
157
191
  {notificationsSlot}
158
192
  {rightSlot}
193
+ {/* v7.0.4 — theme toggle (hoisted from Overview so it's reachable from any view) */}
194
+ <button
195
+ type="button"
196
+ className="icon-btn topbar-theme-toggle"
197
+ onClick={() => setIsDark((v) => !v)}
198
+ aria-label={isDark ? 'Switch to light theme' : 'Switch to dark theme'}
199
+ title={isDark ? 'Switch to light theme' : 'Switch to dark theme'}
200
+ data-testid="topbar-theme-toggle"
201
+ >
202
+ {isDark ? <Sun size={14} /> : <Moon size={14} />}
203
+ </button>
159
204
  {clineStatus && (
160
205
  <div
161
206
  className={cn('cline-status', `cline-${clineStatus.state}`)}
@@ -141,38 +141,46 @@ pre,
141
141
  /* ─── Theme tokens ─────────────────────────────────────────────────── */
142
142
 
143
143
  :root {
144
- /* Surfaces */
145
- --bg: #0b0e14;
146
- --bg-elev: #12161f;
147
- --bg-elev-2: #1a1f2b;
148
- --bg-elev-3: #232a39;
149
-
150
- /* Borders */
151
- --border: #232a39;
152
- --border-strong: #2d3648;
153
-
154
- /* Text */
155
- --text: #c9d1d9;
156
- --text-dim: #b4bcd0;
157
- --text-muted: var(--text-dim);
158
- --text-strong: #f0f6fc;
159
-
160
- /* Brand & status */
161
- --accent: #8b5cf6;
162
- --accent-2: #a78bfa;
163
- --accent-3: #c4b5fd;
164
- --accent-bg: rgba(139, 92, 246, 0.12);
165
- --accent-border: rgba(139, 92, 246, 0.4);
166
- --accent-glow: rgba(139, 92, 246, 0.18);
167
- --accent-soft: rgba(139, 92, 246, 0.08);
168
-
169
- --success: oklch(0.72 0.16 145);
170
- --warning: oklch(0.78 0.14 70);
171
- --error: oklch(0.66 0.20 25);
172
- --info: oklch(0.72 0.13 235);
173
- --success-soft: rgba(52, 211, 153, 0.15);
174
- --error-soft: rgba(248, 113, 113, 0.12);
175
- --warning-soft: rgba(251, 191, 36, 0.15);
144
+ /* v7.0.4 — legacy token aliases. The chrome (topbar / sidebar /
145
+ .app shell) reads --bg / --bg-elev / --text-dim / --accent-3 /
146
+ etc.; the new design-system primitives in `ui/styles/tokens.css`
147
+ define --surface-* / --text-* / --accent / --border-* as the
148
+ single source of truth. These aliases collapse the two systems
149
+ to one so the inner Overview panels and the outer app chrome
150
+ share the same surface tone — the user's v7.0.4 visual
151
+ request: "make the whole dashboard look like the inner part of
152
+ overview".
153
+
154
+ The legacy variable NAMES are kept for backwards-compat with
155
+ the ~10k-line main.css body (every rule below references
156
+ these names); we just retarget the values to the design-system
157
+ tokens. */
158
+ --bg: var(--surface-0);
159
+ --bg-elev: var(--surface-1);
160
+ --bg-elev-2: var(--surface-2);
161
+ --bg-elev-3: var(--surface-3);
162
+ --bg-elevated: var(--bg-elev);
163
+
164
+ --border: var(--border-default);
165
+ --border-strong: var(--border-strong);
166
+
167
+ --text: var(--text-primary);
168
+ --text-dim: var(--text-secondary);
169
+ --text-muted: var(--text-tertiary);
170
+ --text-strong: var(--text-primary);
171
+
172
+ --accent: #3ecf8e;
173
+ --accent-2: var(--accent);
174
+ --accent-3: var(--accent);
175
+ --accent-bg: var(--accent-subtle);
176
+ --accent-border: var(--accent);
177
+ --accent-glow: var(--accent-subtle);
178
+ --accent-soft: var(--accent-subtle);
179
+
180
+ --error: var(--danger);
181
+ --success-soft: var(--success-subtle);
182
+ --warning-soft: var(--warning-subtle);
183
+ --error-soft: var(--danger-subtle);
176
184
 
177
185
  /* Syntax highlight (json tree) */
178
186
  --syntax-key: #79c0ff;
@@ -232,8 +240,6 @@ pre,
232
240
  --shadow-2: 0 4px 12px var(--shadow-color);
233
241
  --shadow-3: 0 12px 32px var(--shadow-color);
234
242
  --shadow-glow: 0 0 0 1px var(--accent-border), 0 8px 32px var(--accent-glow);
235
- --bg-elevated: var(--bg-elev);
236
- --surface-2: var(--bg-elev-2);
237
243
 
238
244
  /* Motion */
239
245
  --motion-fast: 120ms;
@@ -242,11 +248,6 @@ pre,
242
248
  --ease: cubic-bezier(0.4, 0, 0.2, 1);
243
249
  --motion-ease: cubic-bezier(0.2, 0, 0, 1);
244
250
 
245
- /* v3.21.x — Semantic and surface tokens for chat UI overhaul */
246
- --surface-0: var(--bg);
247
- --surface-1: color-mix(in oklab, var(--bg) 92%, var(--text) 8%);
248
- --surface-2: color-mix(in oklab, var(--bg) 84%, var(--text) 16%);
249
-
250
251
  /* v3.21.x — Gemini-inspired surface tokens for chat UI overhaul.
251
252
  --bg-1, --bg-2 are NEW names that don't conflict with --bg / --bg-elev. */
252
253
  --bg-1: #18181b;
@@ -275,33 +276,36 @@ pre,
275
276
  }
276
277
 
277
278
  [data-theme='light'] {
278
- --bg: #f7f8fa;
279
- --bg-elev: #ffffff;
280
- --bg-elev-2: #f0f3f8;
281
- --bg-elev-3: #e6ebf2;
282
-
283
- --border: #e2e8f0;
284
- --border-strong: #cbd5e1;
285
-
286
- --text: #1f2937;
287
- --text-dim: #475569;
288
- --text-strong: #0f172a;
289
-
290
- --accent: #7c3aed;
291
- --accent-2: #6d28d9;
292
- --accent-3: #5b21b6;
293
- --accent-bg: rgba(124, 58, 237, 0.08);
294
- --accent-border: rgba(124, 58, 237, 0.3);
295
- --accent-glow: rgba(124, 58, 237, 0.18);
296
- --accent-soft: rgba(124, 58, 237, 0.06);
297
-
298
- --success: #047857;
299
- --warning: #b45309;
300
- --error: #b91c1c;
301
- --info: #1d4ed8;
302
- --success-soft: rgba(5, 150, 105, 0.12);
303
- --error-soft: rgba(220, 38, 38, 0.08);
304
- --warning-soft: rgba(217, 119, 6, 0.12);
279
+ /* v7.0.4 — see :root block above. Light theme aliases collapse to the
280
+ design-system tokens from `ui/styles/tokens.css` as well. */
281
+ --bg: var(--surface-0);
282
+ --bg-elev: var(--surface-1);
283
+ --bg-elev-2: var(--surface-2);
284
+ --bg-elev-3: var(--surface-3);
285
+
286
+ --border: var(--border-default);
287
+ --border-strong: var(--border-strong);
288
+
289
+ --text: var(--text-primary);
290
+ --text-dim: var(--text-secondary);
291
+ --text-muted: var(--text-tertiary);
292
+ --text-strong: var(--text-primary);
293
+
294
+ --accent: #3ecf8e;
295
+ --accent-2: var(--accent);
296
+ --accent-3: var(--accent);
297
+ --accent-bg: var(--accent-subtle);
298
+ --accent-border: var(--accent);
299
+ --accent-glow: var(--accent-subtle);
300
+ --accent-soft: var(--accent-subtle);
301
+
302
+ --success: var(--success);
303
+ --warning: var(--warning);
304
+ --error: var(--danger);
305
+ --success-soft: var(--success-subtle);
306
+ --warning-soft: var(--warning-subtle);
307
+ --error-soft: var(--danger-subtle);
308
+ --info: var(--info);
305
309
 
306
310
  --syntax-key: #0969da;
307
311
  --syntax-string: #0a3069;
@@ -315,18 +319,6 @@ pre,
315
319
  --shadow-2: 0 4px 12px var(--shadow-color);
316
320
  --shadow-3: 0 12px 32px var(--shadow-color);
317
321
 
318
- /* v3.21.x — Surface and semantic tokens (light theme overrides). */
319
- --surface-1: color-mix(in oklab, var(--bg) 92%, var(--text) 8%);
320
- --surface-2: color-mix(in oklab, var(--bg) 84%, var(--text) 16%);
321
- /* v4.8.0 — Darken light-theme status colors so they pass WCAG AA (4.5:1)
322
- against the light surface (#f7f8fa). */
323
- --success: oklch(0.48 0.14 145);
324
- --warning: oklch(0.55 0.15 70);
325
- --error: oklch(0.48 0.20 25);
326
- --info: oklch(0.48 0.16 235);
327
- --bg-1: #f4f4f5;
328
- --bg-2: #e4e4e7;
329
-
330
322
  color-scheme: light;
331
323
  }
332
324
 
@@ -336,10 +328,16 @@ pre,
336
328
  display: flex;
337
329
  flex-direction: column;
338
330
  height: 100vh;
339
- background:
340
- radial-gradient(circle at 0% 0%, var(--accent-bg), transparent 50%),
341
- var(--bg);
342
- background-attachment: fixed;
331
+ background: var(--bg);
332
+ position: relative;
333
+ }
334
+ .app::before {
335
+ content: '';
336
+ position: fixed;
337
+ inset: 0;
338
+ background: radial-gradient(circle at 0% 0%, var(--accent-bg), transparent 60%);
339
+ pointer-events: none;
340
+ z-index: 0;
343
341
  }
344
342
 
345
343
  /* `.content` styling moved to `.app > .layout-body > .content` in Layout variants below.
@@ -5493,15 +5491,15 @@ button.mod-instructions-head {
5493
5491
 
5494
5492
  .sidebar-section-divider {
5495
5493
  height: 1px;
5496
- background: var(--border-soft, rgba(255,255,255,0.06));
5497
- margin: 12px 8px 4px;
5494
+ background: var(--border);
5495
+ margin: 12px 8px 6px;
5498
5496
  }
5499
5497
  .sidebar-section-label {
5500
5498
  font-size: 10px;
5501
5499
  text-transform: uppercase;
5502
5500
  letter-spacing: 0.08em;
5503
- color: var(--text-dim, rgba(255,255,255,0.5));
5504
- padding: 4px 12px;
5501
+ color: var(--text-tertiary);
5502
+ padding: 6px 12px 2px;
5505
5503
  margin-bottom: 2px;
5506
5504
  font-weight: 600;
5507
5505
  }
@@ -5855,7 +5853,7 @@ html[data-animations="false"] * {
5855
5853
  .sidebar {
5856
5854
  width: 220px;
5857
5855
  flex-shrink: 0;
5858
- background: color-mix(in srgb, var(--bg-elev) 88%, transparent);
5856
+ background: var(--bg-elev);
5859
5857
  border-right: 1px solid var(--border);
5860
5858
  padding: var(--space-3) var(--space-2);
5861
5859
  overflow-y: auto;
@@ -5906,13 +5904,13 @@ html[data-animations="false"] * {
5906
5904
 
5907
5905
  .sidebar-tab-active {
5908
5906
  background: var(--accent-bg);
5909
- color: var(--accent-3);
5907
+ color: var(--accent);
5910
5908
  border-color: var(--accent-border);
5911
5909
  }
5912
5910
 
5913
5911
  .sidebar-tab-active:hover {
5914
5912
  background: var(--accent-bg);
5915
- color: var(--accent-3);
5913
+ color: var(--accent);
5916
5914
  }
5917
5915
 
5918
5916
  .sidebar-tab-label {
@@ -11,37 +11,15 @@
11
11
  /* ── View layout ──────────────────────────────────────────────────────────── */
12
12
 
13
13
  .view-memory {
14
- display: flex;
15
- flex-direction: column;
16
- gap: var(--space-4, 16px);
17
- padding: 16px 20px 32px;
18
14
  max-width: 1400px;
19
15
  margin: 0 auto;
20
16
  width: 100%;
21
17
  }
22
18
 
23
- .memory-tab .view-header {
24
- display: flex;
25
- justify-content: space-between;
26
- align-items: flex-end;
27
- gap: 16px;
28
- flex-wrap: wrap;
29
- }
30
-
31
- /* ── Body grid (rail + main) ─────────────────────────────────────────────── */
32
-
33
- .memory-tab-body {
34
- display: grid;
35
- grid-template-columns: 200px 1fr;
36
- gap: var(--space-4, 16px);
37
- align-items: start;
38
- }
39
-
40
- @media (max-width: 900px) {
41
- .memory-tab-body {
42
- grid-template-columns: 1fr;
43
- }
44
- }
19
+ /* v7.0.4 — removed .memory-tab .view-header + .memory-tab-body +
20
+ @media (max-width: 900px) collapse: Memory.tsx now renders a
21
+ ui/layout ViewHeader + ui/primitives Grid for the rail/main
22
+ split, so the legacy selectors are dead. */
45
23
 
46
24
  /* ── Source rail ─────────────────────────────────────────────────────────── */
47
25
 
@@ -57,31 +35,48 @@
57
35
  top: 16px;
58
36
  }
59
37
 
38
+ /* v7.0.4 — Source rail buttons read identical to .sidebar-tab (which
39
+ the main nav rail uses). Same hover, same active tone. Aligns the
40
+ Memory rail visually with the rest of the dashboard chrome. */
41
+
60
42
  .memory-source-button {
61
43
  display: flex;
62
44
  align-items: center;
63
45
  gap: 10px;
64
- padding: 10px 12px;
46
+ padding: 9px 12px;
65
47
  background: transparent;
66
48
  border: 1px solid transparent;
67
- border-radius: var(--radius-sm, 6px);
68
- color: var(--text-dim, #b4bcd0);
49
+ border-radius: var(--radius, 8px);
50
+ color: var(--text-dim);
69
51
  font-size: 13px;
70
52
  font-weight: 500;
71
53
  cursor: pointer;
72
54
  text-align: left;
73
- transition: background var(--motion-fast, 120ms), color var(--motion-fast, 120ms), border-color var(--motion-fast, 120ms);
55
+ width: 100%;
56
+ font-family: inherit;
57
+ white-space: nowrap;
58
+ overflow: hidden;
59
+ text-overflow: ellipsis;
60
+ transition:
61
+ background var(--motion-base, 200ms) var(--ease),
62
+ color var(--motion-base, 200ms) var(--ease),
63
+ border-color var(--motion-base, 200ms) var(--ease);
74
64
  }
75
65
 
76
66
  .memory-source-button:hover {
77
- background: var(--bg-elev-2, #1a1f2b);
78
- color: var(--text, #c9d1d9);
67
+ background: var(--bg-elev-2);
68
+ color: var(--text);
79
69
  }
80
70
 
81
71
  .memory-source-button-active {
82
- background: var(--accent-bg, rgba(139, 92, 246, 0.12));
83
- border-color: var(--accent-border, rgba(139, 92, 246, 0.4));
84
- color: var(--accent, #8b5cf6);
72
+ background: var(--accent-bg);
73
+ color: var(--accent);
74
+ border-color: var(--accent-border);
75
+ }
76
+
77
+ .memory-source-button-active:hover {
78
+ background: var(--accent-bg);
79
+ color: var(--accent);
85
80
  }
86
81
 
87
82
  /* ── Main panel column ──────────────────────────────────────────────────── */
@@ -609,34 +609,15 @@
609
609
  background: var(--bg);
610
610
  }
611
611
 
612
- /* Settings nav root */
613
- .settings-nav-root {
614
- display: flex;
615
- flex-direction: column;
616
- padding: var(--space-3);
617
- gap: 2px;
618
- }
619
-
620
- .settings-nav-divider {
621
- height: 1px;
622
- background: var(--border);
623
- margin: var(--space-2) 0;
624
- }
625
-
626
- /* Section groups */
612
+ /* v7.0.4 — SettingsNav reuses the .sidebar-nav + .sidebar-section-*
613
+ classes from main.css so the Settings rail is visually identical
614
+ to the main nav rail. Only the group spacing remains here so each
615
+ labelled section (General / Core / Agents / Experience / Data) gets
616
+ extra breathing room between its label and the next group. */
627
617
  .settings-nav-group {
628
618
  margin-bottom: var(--space-3);
629
619
  }
630
620
 
631
- .settings-nav-group-label {
632
- font-size: 10px;
633
- text-transform: uppercase;
634
- letter-spacing: 0.08em;
635
- color: var(--text-dim);
636
- font-weight: 600;
637
- padding: 4px 8px 6px;
638
- }
639
-
640
621
  /* ─────────────────────────────────────────────────────────────────────
641
622
  v5.4 — Mobile settings accordion (mobile-settings)
642
623
  ───────────────────────────────────────────────────────────────────── */
@@ -780,8 +761,7 @@
780
761
  }
781
762
 
782
763
  /* Hide sidebar nav on mobile */
783
- .settings-sidebar,
784
- .settings-nav-root {
764
+ .settings-sidebar {
785
765
  display: none;
786
766
  }
787
767
 
@@ -166,9 +166,10 @@
166
166
  }
167
167
 
168
168
  .bd-bar-chart__track {
169
- height: 8px;
169
+ height: 10px;
170
170
  width: 100%;
171
171
  background: var(--surface-2);
172
+ border: 1px solid var(--border-subtle);
172
173
  border-radius: var(--radius-full);
173
174
  overflow: hidden;
174
175
  }
@@ -177,6 +178,10 @@
177
178
  height: 100%;
178
179
  border-radius: var(--radius-full);
179
180
  transition: width var(--duration-normal) var(--ease-out);
181
+ /* v7.0.4 — bars read clearly in dark mode now that tokens.css drives
182
+ the surface tones. Inner track has a hairline border so empty
183
+ rows are still visible (no more "barely visible outline"). */
184
+ box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.18);
180
185
  }
181
186
 
182
187
  /* ============ DataTable ============ */
@@ -48,6 +48,7 @@ export {
48
48
  Topbar, type TopbarProps,
49
49
  Panel, type PanelProps, type PanelPadding, type PanelVariant,
50
50
  PanelHeader, type PanelHeaderProps,
51
+ ViewHeader, type ViewHeaderProps,
51
52
  Tabs, type TabsProps, type TabDef,
52
53
  Breadcrumbs, type BreadcrumbsProps, type BreadcrumbItem,
53
54
  } from './layout';