feat: CodeMirror markdown editor for identity/memory file editor

Replace plain textarea with CodeMirror 5 + markdown mode loaded from
jsDelivr CDN. Editor fills the modal body via flex layout, theme-aware
via CSS vars (cursor, selection, headings, bold/em/links/code all mapped
to Cortex dark/light palette). Lazy init on first file open; history
cleared per-file so undo doesn't bleed across files.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-04-28 23:05:57 -04:00
parent 66cb197de0
commit 217c7c3d6a
3 changed files with 73 additions and 29 deletions

View File

@@ -1141,20 +1141,43 @@
flex-direction: column;
}
#file-editor {
/* CodeMirror markdown editor */
#file-editor-wrap {
flex: 1;
width: 100%;
min-height: 0;
overflow: hidden;
display: flex;
flex-direction: column;
}
#file-editor-wrap.hidden { display: none; }
#file-editor-wrap .CodeMirror {
flex: 1;
height: 100%;
background: var(--bg);
color: var(--text);
border: none;
outline: none;
padding: 16px;
font-family: 'Courier New', monospace;
font-size: 0.85rem;
line-height: 1.55;
resize: none;
display: block;
border: none;
}
#file-editor-wrap .CodeMirror-scroll { padding: 12px 16px; }
#file-editor-wrap .CodeMirror-lines { padding: 0; }
#file-editor-wrap .CodeMirror-cursor { border-left-color: var(--accent); }
#file-editor-wrap .CodeMirror-selectedtext { background: var(--border) !important; }
#file-editor-wrap .CodeMirror-selected { background: var(--border) !important; }
#file-editor-wrap .CodeMirror-focused .CodeMirror-selected { background: var(--border) !important; }
/* Markdown token colours */
#file-editor-wrap .cm-header { color: var(--accent); font-weight: 600; }
#file-editor-wrap .cm-strong { color: var(--text); font-weight: 700; }
#file-editor-wrap .cm-em { color: var(--muted); font-style: italic; }
#file-editor-wrap .cm-link { color: #a78bfa; }
#file-editor-wrap .cm-url { color: var(--muted); }
#file-editor-wrap .cm-comment { color: var(--muted); }
#file-editor-wrap .cm-quote { color: var(--muted); font-style: italic; }
#file-editor-wrap .cm-code { color: var(--muted); background: var(--surface); }
#file-editor-wrap .cm-hr { color: var(--border); }
#file-preview {
flex: 1;
@@ -1164,8 +1187,8 @@
line-height: 1.6;
}
#file-preview.active { display: block; }
#file-editor.hidden { display: none; }
#file-preview.active { display: block; }
#file-editor-wrap.hidden { display: none; }
/* Talk activity badge on Sessions button */
#sessions-btn.talk-badge::after {