@zerwiz/ymir 0.1.34 → 0.1.35

package/apps/sessrumnir/src/renderer/src/components/subagent-progress.tsx

@@ -0,0 +1,254 @@
+import { useAppStore } from '../store'
+import { useState, useEffect, useMemo } from 'react'
+import { useTranslation } from 'react-i18next'
+import { clsx } from 'clsx'
+import {
+  ChevronDown,
+  Loader2,
+  Bot,
+  CheckCircle2,
+  XCircle,
+} from 'lucide-react'
+
+/**
+ * Compact subagent strip seated on top of the composer pill (parent sets
+ * left/right inset). Collapsed: one summary line. Expanded: one line per
+ * agent, max 4 then scroll.
+ */
+
+function stripAnsi(text: string): string {
+  // ESC sequences in tool/status text; control chars are intentional.
+  // eslint-disable-next-line no-control-regex -- strip CSI color / OSC hyperlink sequences
+  return text.replace(/\x1b\[[0-9;]*m/g, '').replace(/\x1b\]8;[^\x1b]*\x1b\\/g, '')
+}
+
+function formatDuration(ms: number): string {
+  if (ms <= 0) return ''
+  if (ms < 1000) return `${ms}ms`
+  if (ms < 60_000) return `${(ms / 1000).toFixed(1)}s`
+  return `${Math.floor(ms / 60_000)}m${Math.floor((ms % 60_000) / 1000)}s`
+}
+
+function formatTokens(n: number): string {
+  if (n <= 0) return ''
+  if (n < 1000) return String(n)
+  if (n < 10_000) return `${(n / 1000).toFixed(1)}k`
+  return `${Math.round(n / 1000)}k`
+}
+
+type AgentStatus = 'running' | 'done' | 'error'
+
+interface AgentLine {
+  id: string
+  agent: string
+  status: AgentStatus
+  task: string
+  toolCount: number
+  tokens: number
+  durationMs: number
+  currentTool?: string
+}
+
+function normalizeStatus(s: string): AgentStatus {
+  if (s === 'done' || s === 'completed') return 'done'
+  if (s === 'error' || s === 'failed') return 'error'
+  return 'running'
+}
+
+function StatusIcon({ status }: { status: AgentStatus }): React.JSX.Element {
+  if (status === 'running') {
+    return <Loader2 size={11} className="shrink-0 animate-spin text-accent-fg" />
+  }
+  if (status === 'error') {
+    return <XCircle size={11} className="shrink-0 text-error" />
+  }
+  return <CheckCircle2 size={11} className="shrink-0 text-success" />
+}
+
+function AgentRow({ line }: { line: AgentLine }): React.JSX.Element {
+  const detail = line.currentTool || line.task
+  const stats = [
+    line.toolCount > 0 ? `${line.toolCount}t` : '',
+    formatTokens(line.tokens),
+    formatDuration(line.durationMs),
+  ]
+    .filter(Boolean)
+    .join(' · ')
+
+  return (
+    <div
+      className={clsx(
+        'flex h-7 items-center gap-1.5 px-2.5 text-[11px] leading-none',
+        line.status === 'running' && 'bg-accent-bg/10'
+      )}
+    >
+      <StatusIcon status={line.status} />
+      <span
+        className={clsx(
+          'shrink-0 font-medium',
+          line.status === 'running' ? 'text-accent-fg' : 'text-secondary'
+        )}
+      >
+        {line.agent}
+      </span>
+      {detail && (
+        <>
+          <span className="shrink-0 text-faint">·</span>
+          <span
+            className={clsx(
+              'min-w-0 flex-1 truncate',
+              line.currentTool ? 'font-jetbrains text-muted' : 'text-dim'
+            )}
+            title={detail}
+          >
+            {detail}
+          </span>
+        </>
+      )}
+      {!detail && <span className="min-w-0 flex-1" />}
+      {stats && <span className="shrink-0 tabular-nums text-faint">{stats}</span>}
+    </div>
+  )
+}
+
+export function SubagentProgress(): React.JSX.Element | null {
+  const { t } = useTranslation()
+  const subagentProgress = useAppStore((state) => state.subagentProgress)
+  const extensionStatuses = useAppStore((state) => state.extensionStatuses)
+
+  // Default collapsed — one summary line. Toggle is fully manual.
+  const [expanded, setExpanded] = useState(false)
+  const [visible, setVisible] = useState(false)
+
+  const statusLines = useMemo(() => {
+    const lines: string[] = []
+    for (const key of ['subagent-slash', 'subagent-slash-text', 'subagents-edit']) {
+      if (extensionStatuses[key]) lines.push(stripAnsi(extensionStatuses[key]))
+    }
+    return lines
+  }, [extensionStatuses])
+
+  const lines: AgentLine[] = useMemo(() => {
+    const out: AgentLine[] = []
+    for (const p of subagentProgress) {
+      if (p.children && p.children.length > 0) {
+        for (const c of p.children) {
+          out.push({
+            id: c.id,
+            agent: c.agent,
+            status: normalizeStatus(c.status),
+            task: c.task,
+            toolCount: c.toolCount,
+            tokens: c.tokens,
+            durationMs: c.durationMs,
+            currentTool: c.currentTool,
+          })
+        }
+      } else {
+        out.push({
+          id: p.toolCallId,
+          agent: p.agent,
+          status: normalizeStatus(p.status),
+          task: p.task,
+          toolCount: p.toolCount,
+          tokens: p.tokens,
+          durationMs: p.durationMs,
+          currentTool: p.currentTool,
+        })
+      }
+    }
+    return out
+  }, [subagentProgress])
+
+  const hasContent = lines.length > 0 || statusLines.length > 0
+  const runningCount = lines.filter((l) => l.status === 'running').length
+  const hasRunning = runningCount > 0
+  const totalCount = lines.length || statusLines.length
+
+  useEffect(() => {
+    if (hasContent) {
+      setVisible(true)
+    } else {
+      const timer = setTimeout(() => {
+        setVisible(false)
+        setExpanded(false)
+      }, 1200)
+      return () => clearTimeout(timer)
+    }
+  }, [hasContent])
+
+  if (!visible || !hasContent) return null
+
+  const ROW_H = 28
+  const MAX_ROWS = 4
+  const listMaxH = MAX_ROWS * ROW_H
+
+  const summary = hasRunning
+    ? t('chat.subagentProgress.running', { count: runningCount })
+    : t('chat.subagentProgress.done', { count: totalCount })
+
+  return (
+    // Flush to the pill below: top rounded, bottom square so it reads as a cap.
+    <div
+      className={clsx(
+        'overflow-hidden rounded-t-xl border border-b-0 border-border-strong bg-surface/95 shadow-md shadow-black/20 backdrop-blur-sm',
+        hasRunning && 'border-accent-bg/40'
+      )}
+    >
+      <button
+        type="button"
+        onClick={(e) => {
+          e.preventDefault()
+          e.stopPropagation()
+          setExpanded((v) => !v)
+        }}
+        className="flex h-8 w-full items-center gap-1.5 px-3 text-left text-[11px] transition-colors hover:bg-highlight/40"
+        aria-expanded={expanded}
+      >
+        {hasRunning ? (
+          <Loader2 size={12} className="shrink-0 animate-spin text-accent-fg" />
+        ) : (
+          <Bot size={12} className="shrink-0 text-dim" />
+        )}
+        <span
+          className={clsx(
+            'min-w-0 flex-1 truncate font-medium',
+            hasRunning ? 'text-primary' : 'text-dim'
+          )}
+        >
+          {summary}
+        </span>
+        <ChevronDown
+          size={12}
+          className={clsx(
+            'shrink-0 text-faint transition-transform duration-150',
+            expanded ? 'rotate-0' : '-rotate-90'
+          )}
+        />
+      </button>
+
+      {expanded && (
+        <div
+          className="border-t border-border/50"
+          style={{
+            maxHeight: listMaxH,
+            overflowY:
+              lines.length > MAX_ROWS || statusLines.length > MAX_ROWS ? 'auto' : 'hidden',
+          }}
+        >
+          {lines.length > 0
+            ? lines.map((line) => <AgentRow key={line.id} line={line} />)
+            : statusLines.map((status, i) => (
+                <div
+                  key={i}
+                  className="flex h-7 items-center truncate px-3 font-jetbrains text-[11px] text-muted"
+                  title={status}
+                >
+                  {status}
+                </div>
+              ))}
+        </div>
+      )}
+    </div>
+  )
+}

package/apps/sessrumnir/src/renderer/src/components/task-launcher.tsx

@@ -0,0 +1,168 @@
+import { useEffect, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { GitBranch, Layers, Play, X } from 'lucide-react'
+import { useAppStore } from '../store'
+
+export function TaskLauncher(): React.JSX.Element | null {
+  const { t } = useTranslation()
+  const open = useAppStore((state) => state.taskLauncherOpen)
+  const setOpen = useAppStore((state) => state.setTaskLauncherOpen)
+  const workspaces = useAppStore((state) => state.workspaces)
+  const activeWorkspace = useAppStore((state) => state.activeWorkspace)
+  const launchTask = useAppStore((state) => state.launchTask)
+  const [workspaceId, setWorkspaceId] = useState('')
+  const [prompt, setPrompt] = useState('')
+  const [isolated, setIsolated] = useState(false)
+  const [busy, setBusy] = useState(false)
+  const inputRef = useRef<HTMLTextAreaElement>(null)
+
+  useEffect(() => {
+    const state = useAppStore.getState()
+    setWorkspaceId(state.activeWorkspace?.id ?? state.workspaces[0]?.id ?? '')
+    setPrompt('')
+    setIsolated(false)
+    // The focus lands a frame later, once the dialog is in the DOM; drop the
+    // pending frame if the dialog closes or unmounts before it runs.
+    const focusFrame = requestAnimationFrame(() => inputRef.current?.focus())
+    return () => cancelAnimationFrame(focusFrame)
+  }, [open])
+
+  useEffect(() => {
+    if (!open) return
+    setWorkspaceId((current) => {
+      if (current && workspaces.some((workspace) => workspace.id === current)) return current
+      return activeWorkspace?.id ?? workspaces[0]?.id ?? ''
+    })
+  }, [open, activeWorkspace?.id, workspaces])
+
+  if (!open) return null
+
+  const close = (): void => {
+    if (!busy) setOpen(false)
+  }
+
+  const submit = async (): Promise<void> => {
+    if (!workspaceId || !prompt.trim() || busy) return
+    setBusy(true)
+    const launched = await launchTask({ workspaceId, prompt, isolated })
+    setBusy(false)
+    if (launched) setOpen(false)
+  }
+
+  return (
+    <div
+      className="fixed inset-0 z-50 flex items-start justify-center bg-black/45 px-4 pt-[12vh]"
+      onMouseDown={(event) => {
+        if (event.target === event.currentTarget) close()
+      }}
+      role="presentation"
+    >
+      <section
+        className="w-full max-w-xl overflow-hidden rounded-xl border border-border-strong bg-surface shadow-2xl"
+        role="dialog"
+        aria-modal="true"
+        aria-labelledby="task-launcher-title"
+      >
+        <div className="flex items-start justify-between border-b border-border px-5 py-4">
+          <div>
+            <div className="flex items-center gap-2">
+              <Play size={16} className="text-accent-fg" />
+              <h2 id="task-launcher-title" className="text-sm font-semibold text-primary">{t('missionControl.newTask')}</h2>
+            </div>
+            <p className="mt-1 text-xs text-dim">{t('taskLauncher.subtitle')}</p>
+          </div>
+          <button
+            type="button"
+            onClick={close}
+            disabled={busy}
+            className="rounded p-1 text-faint transition-colors hover:bg-surface-hover hover:text-primary disabled:opacity-50"
+            aria-label={t('taskLauncher.closeAriaLabel')}
+          >
+            <X size={15} />
+          </button>
+        </div>
+
+        <div className="space-y-4 px-5 py-4">
+          <label className="block">
+            <span className="mb-1.5 block text-xs font-medium text-secondary">{t('common.project')}</span>
+            <span className="flex items-center gap-2 rounded-md border border-border bg-app px-3 py-2">
+              <Layers size={14} className="shrink-0 text-muted" />
+              <select
+                value={workspaceId}
+                onChange={(event) => setWorkspaceId(event.target.value)}
+                disabled={busy || workspaces.length === 0}
+                data-themed-select="true"
+                className="task-launcher-select min-w-0 flex-1 bg-transparent text-sm text-primary outline-none"
+              >
+                {workspaces.length === 0 && <option value="">{t('taskLauncher.openProjectFirst')}</option>}
+                {workspaces.map((workspace) => (
+                  <option key={workspace.id} value={workspace.id}>{workspace.name}</option>
+                ))}
+              </select>
+            </span>
+          </label>
+
+          <label className="block">
+            <span className="mb-1.5 block text-xs font-medium text-secondary">{t('taskLauncher.task')}</span>
+            <textarea
+              ref={inputRef}
+              value={prompt}
+              onChange={(event) => setPrompt(event.target.value)}
+              onKeyDown={(event) => {
+                if ((event.metaKey || event.ctrlKey) && event.key === 'Enter') {
+                  event.preventDefault()
+                  void submit()
+                }
+              }}
+              placeholder={t('taskLauncher.taskPlaceholder')}
+              rows={6}
+              disabled={busy}
+              className="w-full resize-y rounded-md border border-border bg-app px-3 py-2 text-sm leading-relaxed text-primary outline-none placeholder:text-faint focus:border-focus"
+            />
+          </label>
+
+          <label className="flex cursor-pointer items-start gap-2 rounded-md border border-border bg-app/50 px-3 py-2.5">
+            <input
+              type="checkbox"
+              checked={isolated}
+              onChange={(event) => setIsolated(event.target.checked)}
+              disabled={busy}
+              className="mt-0.5 accent-[var(--accent)]"
+            />
+            <span className="flex min-w-0 items-start gap-2">
+              <GitBranch size={14} className="mt-0.5 shrink-0 text-special" />
+              <span>
+                <span className="block text-xs font-medium text-secondary">{t('taskLauncher.isolatedWorktree.label')}</span>
+                <span className="mt-0.5 block text-[11px] text-faint">{t('taskLauncher.isolatedWorktree.description')}</span>
+              </span>
+            </span>
+          </label>
+
+          <p className="text-[11px] text-faint">
+            {t('taskLauncher.footerNote')}
+          </p>
+        </div>
+
+        <div className="flex items-center justify-end gap-2 border-t border-border bg-app/40 px-5 py-3">
+          <button
+            type="button"
+            onClick={close}
+            disabled={busy}
+            className="rounded-md px-3 py-1.5 text-xs text-muted transition-colors hover:bg-surface-hover hover:text-primary disabled:opacity-50"
+          >
+            {t('common.cancel')}
+          </button>
+          <button
+            type="button"
+            onClick={() => void submit()}
+            disabled={busy || !workspaceId || !prompt.trim()}
+            className="flex items-center gap-1.5 rounded-md bg-accent px-3 py-1.5 text-xs font-medium text-inverse transition-colors hover:bg-accent-hover disabled:cursor-not-allowed disabled:opacity-50"
+          >
+            <Play size={12} />
+            {busy ? t('taskLauncher.starting') : t('taskLauncher.startTask')}
+          </button>
+        </div>
+      </section>
+    </div>
+  )
+}

package/apps/sessrumnir/src/renderer/src/components/terminal.tsx

@@ -0,0 +1,203 @@
+import { useEffect, useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { Terminal as XTerm, type ITheme } from '@xterm/xterm'
+import { FitAddon } from '@xterm/addon-fit'
+import { WebLinksAddon } from '@xterm/addon-web-links'
+import '@xterm/xterm/css/xterm.css'
+import { useAppStore } from '../store'
+import { useAppliedThemeId } from '../hooks'
+import { DEFAULT_SETTINGS } from '../../../shared/default-settings'
+import { clsx } from 'clsx'
+import {
+  Terminal as TerminalIcon,
+  X,
+  Maximize2,
+  Minimize2,
+  Trash2,
+} from 'lucide-react'
+
+// Build the xterm color theme from the active app theme's CSS variables so the
+// terminal matches whichever theme (dark/light/nord/gruvbox/breeze) is applied.
+// Falls back to the dark palette if a variable is missing.
+function buildTerminalTheme(): ITheme {
+  const css = getComputedStyle(document.documentElement)
+  const v = (name: string, fallback: string): string => {
+    const value = css.getPropertyValue(name).trim()
+    return value || fallback
+  }
+
+  const bg = v('--color-app', '#0a0a0a')
+  const fg = v('--color-primary', '#d4d4d4')
+
+  return {
+    background: bg,
+    foreground: fg,
+    cursor: fg,
+    selectionBackground: v('--cm-selection-bg', '#c9973f66'),
+    black: bg,
+    red: v('--color-error', '#ef4444'),
+    green: v('--color-success', '#22c55e'),
+    yellow: v('--color-warning', '#eab308'),
+    blue: v('--color-accent', '#c9973f'),
+    magenta: v('--cm-keyword', '#a855f7'),
+    cyan: v('--cm-link', '#06b6d4'),
+    white: fg,
+    brightBlack: v('--color-muted', '#525252'),
+    brightRed: v('--color-error', '#f87171'),
+    brightGreen: v('--color-success', '#4ade80'),
+    brightYellow: v('--color-warning', '#facc15'),
+    brightBlue: v('--color-accent', '#60a5fa'),
+    brightMagenta: v('--cm-keyword', '#c084fc'),
+    brightCyan: v('--cm-link', '#22d3ee'),
+    brightWhite: v('--color-secondary', '#ffffff'),
+  }
+}
+
+export function TerminalPanel(): React.JSX.Element | null {
+  const { t } = useTranslation()
+  const terminalOpen = useAppStore((state) => state.terminalOpen)
+  const toggleTerminal = useAppStore((state) => state.toggleTerminal)
+  const activeWorkspace = useAppStore((state) => state.activeWorkspace)
+  const appliedThemeId = useAppliedThemeId()
+
+  const [maximized, setMaximized] = useState(false)
+  const [shellLabel, setShellLabel] = useState<string | null>(null)
+  const containerRef = useRef<HTMLDivElement>(null)
+  const terminalRef = useRef<XTerm | null>(null)
+  const fitRef = useRef<FitAddon | null>(null)
+
+  useEffect(() => {
+    if (!terminalOpen || !containerRef.current) return
+
+    const terminal = new XTerm({
+      cursorBlink: true,
+      convertEol: true,
+      fontFamily: "'IBM Plex Mono', 'JetBrains Mono Variable', 'Fira Code', 'Cascadia Code', monospace",
+      // Use the Terminal Font Size setting (or the unsaved settings draft),
+      // read once at creation. Applied on the next mount — i.e. when the user
+      // returns to chat — rather than live, to avoid resizing a hidden pty.
+      // Falls back to the default.
+      fontSize:
+        useAppStore.getState().settingsDraft.terminalFontSize ??
+        useAppStore.getState().settings?.terminalFontSize ??
+        DEFAULT_SETTINGS.terminalFontSize,
+      theme: buildTerminalTheme(),
+    })
+    const fit = new FitAddon()
+    terminal.loadAddon(fit)
+    terminal.loadAddon(new WebLinksAddon())
+    terminal.open(containerRef.current)
+
+    terminalRef.current = terminal
+    fitRef.current = fit
+
+    const fitAndResize = () => {
+      fit.fit()
+      window.piDesktop.terminal.resize(terminal.cols, terminal.rows)
+    }
+
+    const dataDisposable = terminal.onData((data) => {
+      window.piDesktop.terminal.input(data)
+    })
+    const outputCleanup = window.piDesktop.terminal.onData((data) => {
+      terminal.write(data)
+    })
+    const exitCleanup = window.piDesktop.terminal.onExit((event) => {
+      terminal.writeln('')
+      terminal.writeln(`[process exited with code ${event.exitCode}]`)
+    })
+
+    window.setTimeout(async () => {
+      fitAndResize()
+      try {
+        const result = await window.piDesktop.terminal.start({
+          cwd: activeWorkspace?.path,
+          cols: terminal.cols,
+          rows: terminal.rows,
+        })
+        setShellLabel(result.shell.split('/').pop() ?? result.shell)
+      } catch (err) {
+        terminal.writeln(`Failed to start terminal: ${err instanceof Error ? err.message : String(err)}`)
+      }
+      terminal.focus()
+    }, 0)
+
+    window.addEventListener('resize', fitAndResize)
+
+    return () => {
+      window.removeEventListener('resize', fitAndResize)
+      dataDisposable.dispose()
+      outputCleanup()
+      exitCleanup()
+      window.piDesktop.terminal.stop()
+      terminal.dispose()
+      terminalRef.current = null
+      fitRef.current = null
+    }
+  }, [terminalOpen, activeWorkspace?.path])
+
+  useEffect(() => {
+    if (!terminalOpen) return
+    window.setTimeout(() => {
+      fitRef.current?.fit()
+      const terminal = terminalRef.current
+      if (terminal) {
+        window.piDesktop.terminal.resize(terminal.cols, terminal.rows)
+      }
+    }, 0)
+  }, [terminalOpen, maximized])
+
+  // Recolor the live terminal when the app theme changes, without recreating it.
+  useEffect(() => {
+    if (terminalRef.current) {
+      terminalRef.current.options.theme = buildTerminalTheme()
+    }
+  }, [appliedThemeId])
+
+  if (!terminalOpen) return null
+
+  return (
+    <div
+      className={clsx(
+        'flex flex-col border-t border-border bg-app',
+        maximized ? 'flex-1' : 'h-64'
+      )}
+    >
+      <div className="flex items-center justify-between border-b border-border px-3 py-1.5">
+        <div className="flex items-center gap-2">
+          <TerminalIcon size={14} className="text-dim" />
+          <span className="text-xs text-muted">{t('terminal.title')}</span>
+          <span className="text-[10px] text-faint">{shellLabel ?? t('terminal.title')}</span>
+        </div>
+        <div className="flex items-center gap-1">
+          <button
+            onClick={() => terminalRef.current?.clear()}
+            className="rounded p-1 text-faint hover:text-muted transition-colors"
+            title={t('terminal.clearTitle')}
+            aria-label={t('terminal.clearAriaLabel')}
+          >
+            <Trash2 size={12} />
+          </button>
+          <button
+            onClick={() => setMaximized(!maximized)}
+            className="rounded p-1 text-faint hover:text-muted transition-colors"
+            title={maximized ? t('terminal.restoreLabel') : t('terminal.maximizeLabel')}
+            aria-label={maximized ? t('terminal.restoreLabel') : t('terminal.maximizeLabel')}
+          >
+            {maximized ? <Minimize2 size={12} /> : <Maximize2 size={12} />}
+          </button>
+          <button
+            onClick={toggleTerminal}
+            className="rounded p-1 text-faint hover:text-muted transition-colors"
+            title={t('terminal.closeTitle')}
+            aria-label={t('terminal.closeTitle')}
+          >
+            <X size={12} />
+          </button>
+        </div>
+      </div>
+
+      <div ref={containerRef} className="min-h-0 flex-1 overflow-hidden p-2" />
+    </div>
+  )
+}

package/apps/sessrumnir/src/renderer/src/components/theme-editor-helpers.test.ts

@@ -0,0 +1,35 @@
+// src/renderer/src/components/theme-editor-helpers.test.ts
+import { test } from 'node:test'
+import assert from 'node:assert/strict'
+import { forkTheme, withSeed, withOverride } from './theme-editor-helpers'
+import { THEME_SCHEMA_V1, type ThemeFile } from '../../../shared/theme/theme-file'
+
+const base: ThemeFile = {
+  $schema: THEME_SCHEMA_V1, name: 'Nord', kind: 'dark',
+  seeds: {
+    app: '#2E3440', surface: '#3B4252', text: '#ECEFF4', accent: '#5E81AC',
+    success: '#A3BE8C', warning: '#EBCB8B', error: '#BF616A',
+  },
+  overrides: { muted: '#9599A3' },
+}
+
+test('forkTheme deep-copies and renames', () => {
+  const fork = forkTheme(base, 'Nord Fork')
+  assert.equal(fork.name, 'Nord Fork')
+  assert.notEqual(fork.seeds, base.seeds)
+  assert.equal(fork.seeds.app, '#2E3440')
+})
+
+test('withSeed replaces one seed immutably', () => {
+  const next = withSeed(base, 'app', '#000000')
+  assert.equal(next.seeds.app, '#000000')
+  assert.equal(base.seeds.app, '#2E3440')
+})
+
+test('withOverride pins and clears', () => {
+  const pinned = withOverride(base, 'card', '#123456')
+  assert.equal(pinned.overrides?.card, '#123456')
+  const cleared = withOverride(pinned, 'muted', null)
+  assert.equal(cleared.overrides?.muted, undefined)
+  assert.equal(cleared.overrides?.card, '#123456')
+})

package/apps/sessrumnir/src/renderer/src/components/theme-editor-helpers.ts

@@ -0,0 +1,35 @@
+// Pure helpers for the theme editor. No DOM imports, no side effects — kept
+// in a .ts file (not .tsx) so `find src -name '*.test.ts'` can discover the
+// paired test; a .tsx test file would never run in CI.
+import type { SeedName, TokenName } from '../../../shared/theme/tokens'
+import type { SyntaxKey, ThemeFile } from '../../../shared/theme/theme-file'
+
+export function forkTheme(base: ThemeFile, newName: string): ThemeFile {
+  return { ...structuredClone(base), name: newName }
+}
+
+export function withSeed(theme: ThemeFile, seed: SeedName, value: string): ThemeFile {
+  return { ...theme, seeds: { ...theme.seeds, [seed]: value } }
+}
+
+export function withOverride(
+  theme: ThemeFile, token: TokenName, value: string | null,
+): ThemeFile {
+  const overrides = { ...theme.overrides }
+  if (value === null) delete overrides[token]
+  else overrides[token] = value
+  return Object.keys(overrides).length > 0
+    ? { ...theme, overrides }
+    : (({ overrides: _dropped, ...rest }) => rest)(theme)
+}
+
+export function withSyntax(
+  theme: ThemeFile, key: SyntaxKey, value: string | null,
+): ThemeFile {
+  const syntax = { ...theme.syntax }
+  if (value === null) delete syntax[key]
+  else syntax[key] = value
+  return Object.keys(syntax).length > 0
+    ? { ...theme, syntax }
+    : (({ syntax: _dropped, ...rest }) => rest)(theme)
+}