anentrypoint-design 0.0.121 → 0.0.124

package/src/components/files-modals.js

@@ -1,107 +1,107 @@
-// File modals — matches upstream signatures + class names.
-
-import * as webjsx from '../../vendor/webjsx/index.js';
-import { Btn } from './shell.js';
-import { fileGlyph, fmtFileSize } from './files.js';
-const h = webjsx.createElement;
-
-function Backdrop({ onClose, children, kind = '' } = {}) {
-    return h('div', {
-        class: 'ds-modal-backdrop',
-        onclick: (e) => { if (e.target === e.currentTarget && onClose) onClose(); }
-    },
-        h('div', { class: 'ds-modal' + (kind ? ' ds-modal-' + kind : '') }, ...(Array.isArray(children) ? children : [children]))
-    );
-}
-
-export function ConfirmDialog({ title = 'confirm', message, confirmLabel = 'confirm', cancelLabel = 'cancel', destructive, onConfirm, onCancel } = {}) {
-    return Backdrop({
-        onClose: onCancel,
-        kind: 'small',
-        children: [
-            h('div', { class: 'ds-modal-head' }, title),
-            h('div', { class: 'ds-modal-body' }, message || ''),
-            h('div', { class: 'ds-modal-actions' },
-                Btn({ onClick: onCancel, children: cancelLabel }),
-                h('button', {
-                    class: destructive ? 'btn-primary danger' : 'btn-primary',
-                    onclick: onConfirm
-                }, confirmLabel)
-            )
-        ]
-    });
-}
-
-export function PromptDialog({ title = 'name', value = '', placeholder = '', confirmLabel = 'ok', cancelLabel = 'cancel', onConfirm, onCancel, onInput } = {}) {
-    return Backdrop({
-        onClose: onCancel,
-        kind: 'small',
-        children: [
-            h('div', { class: 'ds-modal-head' }, title),
-            h('div', { class: 'ds-modal-body' },
-                h('input', {
-                    class: 'input ds-modal-input',
-                    type: 'text',
-                    value,
-                    placeholder,
-                    autofocus: true,
-                    oninput: (e) => onInput && onInput(e.target.value),
-                    onkeydown: (e) => {
-                        if (e.key === 'Enter') { e.preventDefault(); onConfirm && onConfirm(e.target.value); }
-                        if (e.key === 'Escape') { e.preventDefault(); onCancel && onCancel(); }
-                    }
-                })
-            ),
-            h('div', { class: 'ds-modal-actions' },
-                Btn({ onClick: onCancel, children: cancelLabel }),
-                h('button', { class: 'btn-primary', onclick: () => onConfirm && onConfirm(value) }, confirmLabel)
-            )
-        ]
-    });
-}
-
-export function FilePreviewMedia({ src, type = 'other', name } = {}) {
-    if (type === 'image') return h('img', { class: 'ds-preview-media', src, alt: name || '' });
-    if (type === 'video') return h('video', { class: 'ds-preview-media', src, controls: true });
-    if (type === 'audio') return h('audio', { class: 'ds-preview-audio', src, controls: true });
-    return h('div', { class: 'ds-preview-fallback' },
-        h('span', { class: 'ds-preview-glyph' }, fileGlyph(type)),
-        h('span', {}, 'no inline preview for ' + (type || 'this file'))
-    );
-}
-
-export function FilePreviewCode({ content = '', lang } = {}) {
-    return h('pre', { class: 'ds-preview-code' + (lang ? ' lang-' + lang : '') },
-        h('code', { class: lang ? 'language-' + lang : '' }, content)
-    );
-}
-
-export function FilePreviewText({ content = '', truncated } = {}) {
-    return h('pre', { class: 'ds-preview-text' },
-        h('code', {}, content),
-        truncated ? h('div', { class: 'ds-preview-truncated' }, '… (truncated)') : null
-    );
-}
-
-export function FileViewer({ file, body, onClose, onAction } = {}) {
-    if (!file) return null;
-    const meta = [file.type, file.size != null ? fmtFileSize(file.size) : null, file.modified || null]
-        .filter(Boolean).join(' · ');
-    return Backdrop({
-        onClose,
-        kind: 'preview',
-        children: [
-            h('div', { class: 'ds-modal-head ds-preview-head', 'data-file-type': file.type || 'other' },
-                h('span', { class: 'ds-preview-name' }, file.name || ''),
-                h('span', { class: 'ds-preview-meta' }, meta),
-                h('span', { class: 'ds-preview-actions' },
-                    onAction ? h('button', { class: 'ds-file-act', title: 'download', onclick: () => onAction('download') }, '↓') : null,
-                    h('button', { class: 'ds-file-act', title: 'close', onclick: onClose }, '✕')
-                )
-            ),
-            h('div', { class: 'ds-preview-body', 'data-file-type': file.type || 'other' },
-                ...(Array.isArray(body) ? body : [body])
-            )
-        ]
-    });
-}
+// File modals — matches upstream signatures + class names.
+
+import * as webjsx from '../../vendor/webjsx/index.js';
+import { Btn } from './shell.js';
+import { fileGlyph, fmtFileSize } from './files.js';
+const h = webjsx.createElement;
+
+function Backdrop({ onClose, children, kind = '' } = {}) {
+    return h('div', {
+        class: 'ds-modal-backdrop',
+        onclick: (e) => { if (e.target === e.currentTarget && onClose) onClose(); }
+    },
+        h('div', { class: 'ds-modal' + (kind ? ' ds-modal-' + kind : '') }, ...(Array.isArray(children) ? children : [children]))
+    );
+}
+
+export function ConfirmDialog({ title = 'confirm', message, confirmLabel = 'confirm', cancelLabel = 'cancel', destructive, onConfirm, onCancel } = {}) {
+    return Backdrop({
+        onClose: onCancel,
+        kind: 'small',
+        children: [
+            h('div', { class: 'ds-modal-head' }, title),
+            h('div', { class: 'ds-modal-body' }, message || ''),
+            h('div', { class: 'ds-modal-actions' },
+                Btn({ onClick: onCancel, children: cancelLabel }),
+                h('button', {
+                    class: destructive ? 'btn-primary danger' : 'btn-primary',
+                    onclick: onConfirm
+                }, confirmLabel)
+            )
+        ]
+    });
+}
+
+export function PromptDialog({ title = 'name', value = '', placeholder = '', confirmLabel = 'ok', cancelLabel = 'cancel', onConfirm, onCancel, onInput } = {}) {
+    return Backdrop({
+        onClose: onCancel,
+        kind: 'small',
+        children: [
+            h('div', { class: 'ds-modal-head' }, title),
+            h('div', { class: 'ds-modal-body' },
+                h('input', {
+                    class: 'input ds-modal-input',
+                    type: 'text',
+                    value,
+                    placeholder,
+                    autofocus: true,
+                    oninput: (e) => onInput && onInput(e.target.value),
+                    onkeydown: (e) => {
+                        if (e.key === 'Enter') { e.preventDefault(); onConfirm && onConfirm(e.target.value); }
+                        if (e.key === 'Escape') { e.preventDefault(); onCancel && onCancel(); }
+                    }
+                })
+            ),
+            h('div', { class: 'ds-modal-actions' },
+                Btn({ onClick: onCancel, children: cancelLabel }),
+                h('button', { class: 'btn-primary', onclick: () => onConfirm && onConfirm(value) }, confirmLabel)
+            )
+        ]
+    });
+}
+
+export function FilePreviewMedia({ src, type = 'other', name } = {}) {
+    if (type === 'image') return h('img', { class: 'ds-preview-media', src, alt: name || '' });
+    if (type === 'video') return h('video', { class: 'ds-preview-media', src, controls: true });
+    if (type === 'audio') return h('audio', { class: 'ds-preview-audio', src, controls: true });
+    return h('div', { class: 'ds-preview-fallback' },
+        h('span', { class: 'ds-preview-glyph' }, fileGlyph(type)),
+        h('span', {}, 'no inline preview for ' + (type || 'this file'))
+    );
+}
+
+export function FilePreviewCode({ content = '', lang } = {}) {
+    return h('pre', { class: 'ds-preview-code' + (lang ? ' lang-' + lang : '') },
+        h('code', { class: lang ? 'language-' + lang : '' }, content)
+    );
+}
+
+export function FilePreviewText({ content = '', truncated } = {}) {
+    return h('pre', { class: 'ds-preview-text' },
+        h('code', {}, content),
+        truncated ? h('div', { class: 'ds-preview-truncated' }, '… (truncated)') : null
+    );
+}
+
+export function FileViewer({ file, body, onClose, onAction } = {}) {
+    if (!file) return null;
+    const meta = [file.type, file.size != null ? fmtFileSize(file.size) : null, file.modified || null]
+        .filter(Boolean).join(' · ');
+    return Backdrop({
+        onClose,
+        kind: 'preview',
+        children: [
+            h('div', { class: 'ds-modal-head ds-preview-head', 'data-file-type': file.type || 'other' },
+                h('span', { class: 'ds-preview-name' }, file.name || ''),
+                h('span', { class: 'ds-preview-meta' }, meta),
+                h('span', { class: 'ds-preview-actions' },
+                    onAction ? h('button', { class: 'ds-file-act', title: 'download', onclick: () => onAction('download') }, '↓') : null,
+                    h('button', { class: 'ds-file-act', title: 'close', onclick: onClose }, '✕')
+                )
+            ),
+            h('div', { class: 'ds-preview-body', 'data-file-type': file.type || 'other' },
+                ...(Array.isArray(body) ? body : [body])
+            )
+        ]
+    });
+}

package/src/components/files.js

@@ -1,118 +1,118 @@
-// File primitives — matches upstream signatures.
-
-import * as webjsx from '../../vendor/webjsx/index.js';
-import { Btn } from './shell.js';
-const h = webjsx.createElement;
-
-const FILE_TYPES = ['dir', 'image', 'video', 'audio', 'code', 'text', 'archive', 'document', 'symlink', 'other'];
-const TYPE_GLYPH = {
-    dir: '▣', image: '◰', video: '▰', audio: '◎', code: '⌘',
-    text: '§', archive: '◐', document: '▢', symlink: '↗', other: '◌'
-};
-
-export function fileGlyph(type) {
-    return TYPE_GLYPH[type] || TYPE_GLYPH.other;
-}
-
-export function fmtFileSize(bytes) {
-    if (bytes == null || bytes === 0) return '—';
-    const u = ['B', 'KB', 'MB', 'GB', 'TB'];
-    let i = 0, n = bytes;
-    while (n >= 1024 && i < u.length - 1) { n /= 1024; i++; }
-    return n.toFixed(i === 0 ? 0 : 1) + ' ' + u[i];
-}
-
-export function FileIcon({ type = 'other' } = {}) {
-    return h('span', { class: 'ds-file-icon', 'data-file-type': type }, fileGlyph(type));
-}
-
-export function FileRow({ name, type = 'other', size, modified, code, onOpen, onAction, active, key } = {}) {
-    const meta = [type === 'dir' ? null : fmtFileSize(size), modified || null].filter(Boolean).join(' · ');
-    return h('div', {
-        key,
-        class: 'ds-file-row row' + (active ? ' active' : ''),
-        'data-file-type': type,
-        onclick: onOpen
-    },
-        code != null ? h('span', { class: 'code' }, code) : null,
-        FileIcon({ type }),
-        h('span', { class: 'title' }, name),
-        h('span', { class: 'ds-file-meta meta' }, meta || '—'),
-        onAction ? h('span', { class: 'ds-file-actions', onclick: (e) => e.stopPropagation() },
-            h('button', { class: 'ds-file-act', title: 'download', onclick: () => onAction('download') }, '↓'),
-            h('button', { class: 'ds-file-act', title: 'rename', onclick: () => onAction('rename') }, '✎'),
-            h('button', { class: 'ds-file-act ds-file-act-warn', title: 'delete', onclick: () => onAction('delete') }, '✕')
-        ) : null
-    );
-}
-
-export function FileGrid({ files = [], onOpen, onAction, emptyText = 'no files here yet' } = {}) {
-    if (!files.length) return EmptyState({ text: emptyText });
-    return h('div', { class: 'ds-file-grid' },
-        ...files.map((f, i) => FileRow({
-            key: f.path || f.name + i,
-            name: f.name, type: f.type, size: f.size, modified: f.modified, code: f.code, active: f.active,
-            onOpen: onOpen ? () => onOpen(f) : null,
-            onAction: onAction ? (act) => onAction(act, f) : null
-        }))
-    );
-}
-
-export function FileToolbar({ left = [], right = [] } = {}) {
-    return h('div', { class: 'ds-file-toolbar' },
-        h('div', { class: 'ds-file-toolbar-left' }, ...left),
-        h('div', { class: 'ds-file-toolbar-right' }, ...right)
-    );
-}
-
-export function DropZone({ children, dragover, onDrop, onDragOver, onDragLeave, label = 'drop files here', onPick } = {}) {
-    return h('div', {
-        class: 'ds-dropzone' + (dragover ? ' dragover' : ''),
-        ondragover: (e) => { e.preventDefault(); onDragOver && onDragOver(e); },
-        ondragleave: (e) => { onDragLeave && onDragLeave(e); },
-        ondrop: (e) => { e.preventDefault(); onDrop && onDrop(e.dataTransfer.files); }
-    },
-        h('div', { class: 'ds-dropzone-inner' },
-            h('span', { class: 'ds-dropzone-glyph' }, '⇪'),
-            h('span', { class: 'ds-dropzone-label' }, label),
-            onPick ? Btn({ onClick: onPick, children: 'pick files' }) : null
-        ),
-        ...(Array.isArray(children) ? children : children ? [children] : [])
-    );
-}
-
-export function UploadProgress({ items = [] } = {}) {
-    if (!items.length) return null;
-    return h('div', { class: 'ds-upload-progress' },
-        ...items.map((it, i) => h('div', {
-            key: it.name + i,
-            class: 'ds-upload-item' + (it.done ? ' done' : '') + (it.error ? ' error' : '')
-        },
-            h('span', { class: 'ds-upload-name' }, it.name),
-            h('span', { class: 'ds-upload-bar' },
-                h('span', { class: 'ds-upload-fill', 'data-pct': String(Math.max(0, Math.min(100, it.pct || 0))) })
-            ),
-            h('span', { class: 'ds-upload-pct' }, (it.error ? 'err' : (it.done ? 'ok' : (it.pct || 0) + '%')))
-        ))
-    );
-}
-
-export function EmptyState({ text = 'nothing here', glyph = '◌' } = {}) {
-    return h('div', { class: 'ds-file-empty' },
-        h('span', { class: 'ds-file-empty-glyph' }, glyph),
-        h('span', { class: 'ds-file-empty-text' }, text)
-    );
-}
-
-export function BreadcrumbPath({ segments = [], onNav, root = 'root' } = {}) {
-    const parts = [h('button', { key: 'root', class: 'ds-crumb-seg', onclick: () => onNav && onNav(0) }, root)];
-    segments.forEach((seg, i) => {
-        parts.push(h('span', { key: 'sep' + i, class: 'ds-crumb-sep' }, '›'));
-        parts.push(h('button', {
-            key: 'seg' + i,
-            class: 'ds-crumb-seg' + (i === segments.length - 1 ? ' leaf' : ''),
-            onclick: () => onNav && onNav(i + 1)
-        }, seg));
-    });
-    return h('div', { class: 'ds-crumb-path' }, ...parts);
-}
+// File primitives — matches upstream signatures.
+
+import * as webjsx from '../../vendor/webjsx/index.js';
+import { Btn } from './shell.js';
+const h = webjsx.createElement;
+
+const FILE_TYPES = ['dir', 'image', 'video', 'audio', 'code', 'text', 'archive', 'document', 'symlink', 'other'];
+const TYPE_GLYPH = {
+    dir: '▣', image: '◰', video: '▰', audio: '◎', code: '⌘',
+    text: '§', archive: '◐', document: '▢', symlink: '↗', other: '◌'
+};
+
+export function fileGlyph(type) {
+    return TYPE_GLYPH[type] || TYPE_GLYPH.other;
+}
+
+export function fmtFileSize(bytes) {
+    if (bytes == null || bytes === 0) return '—';
+    const u = ['B', 'KB', 'MB', 'GB', 'TB'];
+    let i = 0, n = bytes;
+    while (n >= 1024 && i < u.length - 1) { n /= 1024; i++; }
+    return n.toFixed(i === 0 ? 0 : 1) + ' ' + u[i];
+}
+
+export function FileIcon({ type = 'other' } = {}) {
+    return h('span', { class: 'ds-file-icon', 'data-file-type': type }, fileGlyph(type));
+}
+
+export function FileRow({ name, type = 'other', size, modified, code, onOpen, onAction, active, key } = {}) {
+    const meta = [type === 'dir' ? null : fmtFileSize(size), modified || null].filter(Boolean).join(' · ');
+    return h('div', {
+        key,
+        class: 'ds-file-row row' + (active ? ' active' : ''),
+        'data-file-type': type,
+        onclick: onOpen
+    },
+        code != null ? h('span', { class: 'code' }, code) : null,
+        FileIcon({ type }),
+        h('span', { class: 'title' }, name),
+        h('span', { class: 'ds-file-meta meta' }, meta || '—'),
+        onAction ? h('span', { class: 'ds-file-actions', onclick: (e) => e.stopPropagation() },
+            h('button', { class: 'ds-file-act', title: 'download', onclick: () => onAction('download') }, '↓'),
+            h('button', { class: 'ds-file-act', title: 'rename', onclick: () => onAction('rename') }, '✎'),
+            h('button', { class: 'ds-file-act ds-file-act-warn', title: 'delete', onclick: () => onAction('delete') }, '✕')
+        ) : null
+    );
+}
+
+export function FileGrid({ files = [], onOpen, onAction, emptyText = 'no files here yet' } = {}) {
+    if (!files.length) return EmptyState({ text: emptyText });
+    return h('div', { class: 'ds-file-grid' },
+        ...files.map((f, i) => FileRow({
+            key: f.path || f.name + i,
+            name: f.name, type: f.type, size: f.size, modified: f.modified, code: f.code, active: f.active,
+            onOpen: onOpen ? () => onOpen(f) : null,
+            onAction: onAction ? (act) => onAction(act, f) : null
+        }))
+    );
+}
+
+export function FileToolbar({ left = [], right = [] } = {}) {
+    return h('div', { class: 'ds-file-toolbar' },
+        h('div', { class: 'ds-file-toolbar-left' }, ...left),
+        h('div', { class: 'ds-file-toolbar-right' }, ...right)
+    );
+}
+
+export function DropZone({ children, dragover, onDrop, onDragOver, onDragLeave, label = 'drop files here', onPick } = {}) {
+    return h('div', {
+        class: 'ds-dropzone' + (dragover ? ' dragover' : ''),
+        ondragover: (e) => { e.preventDefault(); onDragOver && onDragOver(e); },
+        ondragleave: (e) => { onDragLeave && onDragLeave(e); },
+        ondrop: (e) => { e.preventDefault(); onDrop && onDrop(e.dataTransfer.files); }
+    },
+        h('div', { class: 'ds-dropzone-inner' },
+            h('span', { class: 'ds-dropzone-glyph' }, '⇪'),
+            h('span', { class: 'ds-dropzone-label' }, label),
+            onPick ? Btn({ onClick: onPick, children: 'pick files' }) : null
+        ),
+        ...(Array.isArray(children) ? children : children ? [children] : [])
+    );
+}
+
+export function UploadProgress({ items = [] } = {}) {
+    if (!items.length) return null;
+    return h('div', { class: 'ds-upload-progress' },
+        ...items.map((it, i) => h('div', {
+            key: it.name + i,
+            class: 'ds-upload-item' + (it.done ? ' done' : '') + (it.error ? ' error' : '')
+        },
+            h('span', { class: 'ds-upload-name' }, it.name),
+            h('span', { class: 'ds-upload-bar' },
+                h('span', { class: 'ds-upload-fill', 'data-pct': String(Math.max(0, Math.min(100, it.pct || 0))) })
+            ),
+            h('span', { class: 'ds-upload-pct' }, (it.error ? 'err' : (it.done ? 'ok' : (it.pct || 0) + '%')))
+        ))
+    );
+}
+
+export function EmptyState({ text = 'nothing here', glyph = '◌' } = {}) {
+    return h('div', { class: 'ds-file-empty' },
+        h('span', { class: 'ds-file-empty-glyph' }, glyph),
+        h('span', { class: 'ds-file-empty-text' }, text)
+    );
+}
+
+export function BreadcrumbPath({ segments = [], onNav, root = 'root' } = {}) {
+    const parts = [h('button', { key: 'root', class: 'ds-crumb-seg', onclick: () => onNav && onNav(0) }, root)];
+    segments.forEach((seg, i) => {
+        parts.push(h('span', { key: 'sep' + i, class: 'ds-crumb-sep' }, '›'));
+        parts.push(h('button', {
+            key: 'seg' + i,
+            class: 'ds-crumb-seg' + (i === segments.length - 1 ? ' leaf' : ''),
+            onclick: () => onNav && onNav(i + 1)
+        }, seg));
+    });
+    return h('div', { class: 'ds-crumb-path' }, ...parts);
+}

package/src/components/freddie/helpers.js

@@ -1,50 +1,50 @@
-// Freddie helpers — minimal stubs. Real freddie surfaces ship downstream
-// (gm-cc, foph, hermes-fork). The SDK exposes the registry shape and
-// localStorage helpers so consumer pages can wire to existing patterns.
-
-import * as webjsx from '../../../vendor/webjsx/index.js';
-const h = webjsx.createElement;
-
-export function renderPageStub({ id, title }) {
-    return h('div', { class: 'ds-freddie-stub' },
-        h('span', { class: 'eyebrow' }, 'freddie · ' + id),
-        h('h2', {}, title || id),
-        h('p', { class: 'dim' }, 'this page renderer is a stub. consumers override it on their own freddie router.')
-    );
-}
-
-const SKILL_LABELS = {
-    transcribe: 'transcribe',
-    summarize:  'summarize',
-    translate:  'translate',
-    extract:    'extract',
-    classify:   'classify',
-};
-
-export function skillLabel(slug) {
-    return SKILL_LABELS[slug] || slug;
-}
-
-const RECENT_KEY = 'ds247420.recent.paths';
-
-export function getRecentPaths() {
-    if (typeof localStorage === 'undefined') return [];
-    try { return JSON.parse(localStorage.getItem(RECENT_KEY) || '[]'); }
-    catch { return []; }
-}
-
-export function saveRecentPath(path) {
-    if (typeof localStorage === 'undefined' || !path) return;
-    const list = getRecentPaths().filter(p => p !== path);
-    list.unshift(path);
-    try { localStorage.setItem(RECENT_KEY, JSON.stringify(list.slice(0, 10))); } catch {}
-}
-
-// Helper used by consumers that want to render chat-message arrays with
-// our ChatMessage factory but pre-formatted for freddie's data shape.
-export function renderChatMessages(messages = [], opts = {}) {
-    // Import lazily to keep this module light.
-    return import('../chat.js').then(({ ChatMessage }) =>
-        messages.map((m, i) => ChatMessage({ ...m, key: m.key != null ? m.key : i, ...opts }))
-    );
-}
+// Freddie helpers — minimal stubs. Real freddie surfaces ship downstream
+// (gm-cc, foph, hermes-fork). The SDK exposes the registry shape and
+// localStorage helpers so consumer pages can wire to existing patterns.
+
+import * as webjsx from '../../../vendor/webjsx/index.js';
+const h = webjsx.createElement;
+
+export function renderPageStub({ id, title }) {
+    return h('div', { class: 'ds-freddie-stub' },
+        h('span', { class: 'eyebrow' }, 'freddie · ' + id),
+        h('h2', {}, title || id),
+        h('p', { class: 'dim' }, 'this page renderer is a stub. consumers override it on their own freddie router.')
+    );
+}
+
+const SKILL_LABELS = {
+    transcribe: 'transcribe',
+    summarize:  'summarize',
+    translate:  'translate',
+    extract:    'extract',
+    classify:   'classify',
+};
+
+export function skillLabel(slug) {
+    return SKILL_LABELS[slug] || slug;
+}
+
+const RECENT_KEY = 'ds247420.recent.paths';
+
+export function getRecentPaths() {
+    if (typeof localStorage === 'undefined') return [];
+    try { return JSON.parse(localStorage.getItem(RECENT_KEY) || '[]'); }
+    catch { return []; }
+}
+
+export function saveRecentPath(path) {
+    if (typeof localStorage === 'undefined' || !path) return;
+    const list = getRecentPaths().filter(p => p !== path);
+    list.unshift(path);
+    try { localStorage.setItem(RECENT_KEY, JSON.stringify(list.slice(0, 10))); } catch {}
+}
+
+// Helper used by consumers that want to render chat-message arrays with
+// our ChatMessage factory but pre-formatted for freddie's data shape.
+export function renderChatMessages(messages = [], opts = {}) {
+    // Import lazily to keep this module light.
+    return import('../chat.js').then(({ ChatMessage }) =>
+        messages.map((m, i) => ChatMessage({ ...m, key: m.key != null ? m.key : i, ...opts }))
+    );
+}

package/src/components/freddie.js

@@ -1,33 +1,33 @@
-// Freddie page registry. Matches upstream shape:
-//   FREDDIE_PAGES is an OBJECT mapping id → page-renderer fn (not an array).
-//   Per-page renderer functions are stubs by default — consumers (gm-cc,
-//   foph, hermes-fork, etc.) provide their own page bodies or import the
-//   richer upstream renderers.
-
-import { renderPageStub, getRecentPaths, saveRecentPath, skillLabel, renderChatMessages } from './freddie/helpers.js';
-
-const make = (label) => (props) => renderPageStub({ id: label, ...props });
-
-export const home      = make('home');
-export const chat      = make('chat');
-export const voice     = make('voice');
-export const sessions  = make('sessions');
-export const projects  = make('projects');
-export const agents    = make('agents');
-export const analytics = make('analytics');
-export const models    = make('models');
-export const cron      = make('cron');
-export const skills    = make('skills');
-export const config    = make('config');
-export const env       = make('env');
-export const tools     = make('tools');
-export const batch     = make('batch');
-export const gateway   = make('gateway');
-export const chains    = make('chains');
-
-export const FREDDIE_PAGES = {
-    home, chat, voice, sessions, projects, agents, analytics,
-    models, cron, skills, config, env, tools, batch, gateway, chains
-};
-
-export { skillLabel, getRecentPaths, saveRecentPath, renderChatMessages };
+// Freddie page registry. Matches upstream shape:
+//   FREDDIE_PAGES is an OBJECT mapping id → page-renderer fn (not an array).
+//   Per-page renderer functions are stubs by default — consumers (gm-cc,
+//   foph, hermes-fork, etc.) provide their own page bodies or import the
+//   richer upstream renderers.
+
+import { renderPageStub, getRecentPaths, saveRecentPath, skillLabel, renderChatMessages } from './freddie/helpers.js';
+
+const make = (label) => (props) => renderPageStub({ id: label, ...props });
+
+export const home      = make('home');
+export const chat      = make('chat');
+export const voice     = make('voice');
+export const sessions  = make('sessions');
+export const projects  = make('projects');
+export const agents    = make('agents');
+export const analytics = make('analytics');
+export const models    = make('models');
+export const cron      = make('cron');
+export const skills    = make('skills');
+export const config    = make('config');
+export const env       = make('env');
+export const tools     = make('tools');
+export const batch     = make('batch');
+export const gateway   = make('gateway');
+export const chains    = make('chains');
+
+export const FREDDIE_PAGES = {
+    home, chat, voice, sessions, projects, agents, analytics,
+    models, cron, skills, config, env, tools, batch, gateway, chains
+};
+
+export { skillLabel, getRecentPaths, saveRecentPath, renderChatMessages };