anentrypoint-design 0.0.121 → 0.0.124

package/src/kits/os/app-panes.css

@@ -1,152 +1,152 @@
-/* App-pane chrome for kit components rendered inside .wm-win bodies.
-   Bible tokens only — no hardcoded color, font, or radius. Focus = inset rail; no shadows, no gradients. */
-
-/* ── terminal-app ───────────────────────────────────────────────────── */
-.terminal-app {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    background: var(--os-bg-1);
-    color: var(--os-fg);
-    font-family: var(--os-mono);
-}
-.terminal-app-head {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    padding: 4px 10px;
-    background: var(--os-bg-2);
-    font-family: var(--os-mono);
-    font-size: 11px;
-    color: var(--os-fg-2);
-    text-transform: lowercase;
-    flex: 0 0 auto;
-}
-.terminal-app-title { font-family: var(--os-mono); }
-.terminal-app-status { font-family: var(--os-mono); color: var(--os-fg-3); }
-.terminal-app-slot {
-    flex: 1 1 auto;
-    min-height: 0;
-    overflow: hidden;
-    background: var(--os-bg-0);
-}
-
-/* ── browser-app ────────────────────────────────────────────────────── */
-.browser-app {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    background: var(--os-bg-1);
-    color: var(--os-fg);
-    font-family: var(--os-font);
-}
-.browser-app-bar {
-    display: flex;
-    align-items: center;
-    gap: 6px;
-    padding: 6px 8px;
-    background: var(--os-bg-2);
-    flex: 0 0 auto;
-}
-.browser-app-btn {
-    height: 28px;
-    min-width: 28px;
-    padding: 0 8px;
-    background: var(--os-bg-3);
-    color: var(--os-fg);
-    border: none;
-    border-radius: var(--os-radius-sm);
-    font: 12px var(--os-mono);
-    cursor: pointer;
-    outline: none;
-}
-.browser-app-btn:hover { background: var(--os-accent-soft); }
-.browser-app-url {
-    flex: 1 1 auto;
-    height: 28px;
-    padding: 0 10px;
-    background: var(--os-bg-0);
-    color: var(--os-fg);
-    border: none;
-    border-radius: var(--os-radius-sm);
-    font: 12px var(--os-mono);
-    outline: none;
-}
-.browser-app-url:focus { box-shadow: inset 4px 0 0 var(--os-accent); }
-.browser-app-slot {
-    flex: 1 1 auto;
-    min-height: 0;
-    overflow: hidden;
-    background: var(--os-bg-0);
-    display: flex;
-}
-.browser-app-slot > * { flex: 1 1 auto; min-width: 0; min-height: 0; }
-.browser-app-status {
-    flex: 0 0 auto;
-    padding: 2px 10px;
-    background: var(--os-bg-2);
-    font: 11px var(--os-mono);
-    color: var(--os-fg-3);
-    text-transform: lowercase;
-    min-height: 18px;
-}
-
-/* ── validator-app ──────────────────────────────────────────────────── */
-.validator-app {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-    background: var(--os-bg-1);
-    color: var(--os-fg);
-    font-family: var(--os-font);
-}
-.validator-app-head {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-    padding: 6px 10px;
-    background: var(--os-bg-2);
-    flex: 0 0 auto;
-}
-.validator-app-banner {
-    padding: 2px 10px;
-    border-radius: 999px;
-    font: 11px var(--os-mono);
-    text-transform: lowercase;
-    background: var(--os-bg-3);
-    color: var(--os-fg-2);
-}
-.validator-app-banner[data-state="pass"] { background: var(--os-accent-soft); color: var(--os-fg); }
-.validator-app-banner[data-state="fail"] { background: var(--os-red); color: var(--os-bg-0); }
-.validator-app-counts {
-    font: 11px var(--os-mono);
-    color: var(--os-fg-2);
-}
-.validator-app-rerun {
-    margin-left: auto;
-    height: 24px;
-    padding: 0 10px;
-    background: var(--os-bg-3);
-    color: var(--os-fg);
-    border: none;
-    border-radius: var(--os-radius-sm);
-    font: 11px var(--os-mono);
-    text-transform: lowercase;
-    cursor: pointer;
-    outline: none;
-}
-.validator-app-rerun:hover { background: var(--os-accent-soft); }
-.validator-app-slot {
-    flex: 1 1 auto;
-    min-height: 0;
-    overflow: hidden;
-    display: flex;
-    background: var(--os-bg-0);
-}
-.validator-app-slot > * { flex: 1 1 auto; min-width: 0; min-height: 0; }
-.validator-app-frame {
-    width: 100%;
-    height: 100%;
-    border: none;
-    background: var(--os-bg-0);
-}
+/* App-pane chrome for kit components rendered inside .wm-win bodies.
+   Bible tokens only — no hardcoded color, font, or radius. Focus = inset rail; no shadows, no gradients. */
+
+/* ── terminal-app ───────────────────────────────────────────────────── */
+.terminal-app {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background: var(--os-bg-1);
+    color: var(--os-fg);
+    font-family: var(--os-mono);
+}
+.terminal-app-head {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 4px 10px;
+    background: var(--os-bg-2);
+    font-family: var(--os-mono);
+    font-size: 11px;
+    color: var(--os-fg-2);
+    text-transform: lowercase;
+    flex: 0 0 auto;
+}
+.terminal-app-title { font-family: var(--os-mono); }
+.terminal-app-status { font-family: var(--os-mono); color: var(--os-fg-3); }
+.terminal-app-slot {
+    flex: 1 1 auto;
+    min-height: 0;
+    overflow: hidden;
+    background: var(--os-bg-0);
+}
+
+/* ── browser-app ────────────────────────────────────────────────────── */
+.browser-app {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background: var(--os-bg-1);
+    color: var(--os-fg);
+    font-family: var(--os-font);
+}
+.browser-app-bar {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 6px 8px;
+    background: var(--os-bg-2);
+    flex: 0 0 auto;
+}
+.browser-app-btn {
+    height: 28px;
+    min-width: 28px;
+    padding: 0 8px;
+    background: var(--os-bg-3);
+    color: var(--os-fg);
+    border: none;
+    border-radius: var(--os-radius-sm);
+    font: 12px var(--os-mono);
+    cursor: pointer;
+    outline: none;
+}
+.browser-app-btn:hover { background: var(--os-accent-soft); }
+.browser-app-url {
+    flex: 1 1 auto;
+    height: 28px;
+    padding: 0 10px;
+    background: var(--os-bg-0);
+    color: var(--os-fg);
+    border: none;
+    border-radius: var(--os-radius-sm);
+    font: 12px var(--os-mono);
+    outline: none;
+}
+.browser-app-url:focus { box-shadow: inset 4px 0 0 var(--os-accent); }
+.browser-app-slot {
+    flex: 1 1 auto;
+    min-height: 0;
+    overflow: hidden;
+    background: var(--os-bg-0);
+    display: flex;
+}
+.browser-app-slot > * { flex: 1 1 auto; min-width: 0; min-height: 0; }
+.browser-app-status {
+    flex: 0 0 auto;
+    padding: 2px 10px;
+    background: var(--os-bg-2);
+    font: 11px var(--os-mono);
+    color: var(--os-fg-3);
+    text-transform: lowercase;
+    min-height: 18px;
+}
+
+/* ── validator-app ──────────────────────────────────────────────────── */
+.validator-app {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    background: var(--os-bg-1);
+    color: var(--os-fg);
+    font-family: var(--os-font);
+}
+.validator-app-head {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 6px 10px;
+    background: var(--os-bg-2);
+    flex: 0 0 auto;
+}
+.validator-app-banner {
+    padding: 2px 10px;
+    border-radius: 999px;
+    font: 11px var(--os-mono);
+    text-transform: lowercase;
+    background: var(--os-bg-3);
+    color: var(--os-fg-2);
+}
+.validator-app-banner[data-state="pass"] { background: var(--os-accent-soft); color: var(--os-fg); }
+.validator-app-banner[data-state="fail"] { background: var(--os-red); color: var(--os-bg-0); }
+.validator-app-counts {
+    font: 11px var(--os-mono);
+    color: var(--os-fg-2);
+}
+.validator-app-rerun {
+    margin-left: auto;
+    height: 24px;
+    padding: 0 10px;
+    background: var(--os-bg-3);
+    color: var(--os-fg);
+    border: none;
+    border-radius: var(--os-radius-sm);
+    font: 11px var(--os-mono);
+    text-transform: lowercase;
+    cursor: pointer;
+    outline: none;
+}
+.validator-app-rerun:hover { background: var(--os-accent-soft); }
+.validator-app-slot {
+    flex: 1 1 auto;
+    min-height: 0;
+    overflow: hidden;
+    display: flex;
+    background: var(--os-bg-0);
+}
+.validator-app-slot > * { flex: 1 1 auto; min-width: 0; min-height: 0; }
+.validator-app-frame {
+    width: 100%;
+    height: 100%;
+    border: none;
+    background: var(--os-bg-0);
+}

package/src/kits/os/browser-app.js

@@ -1,58 +1,58 @@
-// Browser-pane paint surface — URL bar + iframe slot + status row. Consumer owns iframe.
-// renderBrowserPane({initialUrl, callbacks: {onNavigate, onReload, onBack, onForward}})
-//   -> {node, slot, setUrl, setStatus, dispose}.
-// slot is the container the consumer should append its iframe to.
-
-export function renderBrowserPane(opts = {}) {
-    const { initialUrl = 'about:blank', callbacks = {} } = opts;
-    const node = document.createElement('div');
-    node.className = 'app-pane browser-app';
-    node.dataset.component = 'browser-app';
-
-    const bar = document.createElement('div');
-    bar.className = 'browser-app-bar';
-
-    const mkBtn = (label, role) => {
-        const b = document.createElement('button');
-        b.type = 'button';
-        b.className = 'browser-app-btn';
-        b.dataset.role = role;
-        b.textContent = label;
-        return b;
-    };
-    const backBtn = mkBtn('<', 'back');
-    const fwdBtn = mkBtn('>', 'forward');
-    const reloadBtn = mkBtn('reload', 'reload');
-
-    const urlInput = document.createElement('input');
-    urlInput.type = 'text';
-    urlInput.className = 'browser-app-url';
-    urlInput.value = initialUrl;
-    urlInput.spellcheck = false;
-    urlInput.addEventListener('keydown', (e) => {
-        if (e.key === 'Enter' && callbacks.onNavigate) callbacks.onNavigate(urlInput.value);
-    });
-    backBtn.addEventListener('click', () => callbacks.onBack && callbacks.onBack());
-    fwdBtn.addEventListener('click', () => callbacks.onForward && callbacks.onForward());
-    reloadBtn.addEventListener('click', () => callbacks.onReload && callbacks.onReload());
-
-    bar.append(backBtn, fwdBtn, reloadBtn, urlInput);
-
-    const slot = document.createElement('div');
-    slot.className = 'browser-app-slot';
-    slot.dataset.role = 'iframe-mount';
-
-    const status = document.createElement('div');
-    status.className = 'browser-app-status';
-    status.textContent = '';
-
-    node.append(bar, slot, status);
-
-    return {
-        node,
-        get slot() { return slot; },
-        setUrl(u) { urlInput.value = u; },
-        setStatus(s) { status.textContent = s; },
-        dispose() {},
-    };
-}
+// Browser-pane paint surface — URL bar + iframe slot + status row. Consumer owns iframe.
+// renderBrowserPane({initialUrl, callbacks: {onNavigate, onReload, onBack, onForward}})
+//   -> {node, slot, setUrl, setStatus, dispose}.
+// slot is the container the consumer should append its iframe to.
+
+export function renderBrowserPane(opts = {}) {
+    const { initialUrl = 'about:blank', callbacks = {} } = opts;
+    const node = document.createElement('div');
+    node.className = 'app-pane browser-app';
+    node.dataset.component = 'browser-app';
+
+    const bar = document.createElement('div');
+    bar.className = 'browser-app-bar';
+
+    const mkBtn = (label, role) => {
+        const b = document.createElement('button');
+        b.type = 'button';
+        b.className = 'browser-app-btn';
+        b.dataset.role = role;
+        b.textContent = label;
+        return b;
+    };
+    const backBtn = mkBtn('<', 'back');
+    const fwdBtn = mkBtn('>', 'forward');
+    const reloadBtn = mkBtn('reload', 'reload');
+
+    const urlInput = document.createElement('input');
+    urlInput.type = 'text';
+    urlInput.className = 'browser-app-url';
+    urlInput.value = initialUrl;
+    urlInput.spellcheck = false;
+    urlInput.addEventListener('keydown', (e) => {
+        if (e.key === 'Enter' && callbacks.onNavigate) callbacks.onNavigate(urlInput.value);
+    });
+    backBtn.addEventListener('click', () => callbacks.onBack && callbacks.onBack());
+    fwdBtn.addEventListener('click', () => callbacks.onForward && callbacks.onForward());
+    reloadBtn.addEventListener('click', () => callbacks.onReload && callbacks.onReload());
+
+    bar.append(backBtn, fwdBtn, reloadBtn, urlInput);
+
+    const slot = document.createElement('div');
+    slot.className = 'browser-app-slot';
+    slot.dataset.role = 'iframe-mount';
+
+    const status = document.createElement('div');
+    status.className = 'browser-app-status';
+    status.textContent = '';
+
+    node.append(bar, slot, status);
+
+    return {
+        node,
+        get slot() { return slot; },
+        setUrl(u) { urlInput.value = u; },
+        setStatus(s) { status.textContent = s; },
+        dispose() {},
+    };
+}

package/src/kits/os/files-app.js

@@ -1,44 +1,44 @@
-// Files-app paint surface — bible classes, pure DOM. Consumer provides callbacks.
-// renderFilesApp({list, readFile}) -> {node, refresh, dispose}.
-// list() -> Promise<string[]>; readFile(path) -> Promise<string|Uint8Array>.
-// Header text comes from {label} (consumer assembles "<id> — N files").
-
-export function renderFilesApp(opts = {}) {
-    const { list, readFile, label = '', pollMs = 2000 } = opts;
-    const node = document.createElement('div');
-    node.className = 'app-pane mono';
-    node.dataset.component = 'files-app';
-
-    let preview = null;
-    async function refresh() {
-        const items = await list();
-        node.innerHTML = '';
-        const head = document.createElement('div');
-        head.className = 'head';
-        head.textContent = (label ? label + ' — ' : '') + items.length + ' files';
-        node.appendChild(head);
-        for (const p of items) {
-            const row = document.createElement('div');
-            row.className = 'row';
-            row.textContent = p;
-            row.addEventListener('click', async () => {
-                const body = await readFile(p);
-                if (preview) preview.remove();
-                preview = document.createElement('pre');
-                preview.textContent = String(body);
-                node.appendChild(preview);
-            });
-            node.appendChild(row);
-        }
-    }
-
-    let timer = null;
-    refresh().catch(() => {});
-    if (pollMs > 0) timer = setInterval(() => refresh().catch(() => {}), pollMs);
-
-    return {
-        node,
-        refresh,
-        dispose() { if (timer) clearInterval(timer); },
-    };
-}
+// Files-app paint surface — bible classes, pure DOM. Consumer provides callbacks.
+// renderFilesApp({list, readFile}) -> {node, refresh, dispose}.
+// list() -> Promise<string[]>; readFile(path) -> Promise<string|Uint8Array>.
+// Header text comes from {label} (consumer assembles "<id> — N files").
+
+export function renderFilesApp(opts = {}) {
+    const { list, readFile, label = '', pollMs = 2000 } = opts;
+    const node = document.createElement('div');
+    node.className = 'app-pane mono';
+    node.dataset.component = 'files-app';
+
+    let preview = null;
+    async function refresh() {
+        const items = await list();
+        node.innerHTML = '';
+        const head = document.createElement('div');
+        head.className = 'head';
+        head.textContent = (label ? label + ' — ' : '') + items.length + ' files';
+        node.appendChild(head);
+        for (const p of items) {
+            const row = document.createElement('div');
+            row.className = 'row';
+            row.textContent = p;
+            row.addEventListener('click', async () => {
+                const body = await readFile(p);
+                if (preview) preview.remove();
+                preview = document.createElement('pre');
+                preview.textContent = String(body);
+                node.appendChild(preview);
+            });
+            node.appendChild(row);
+        }
+    }
+
+    let timer = null;
+    refresh().catch(() => {});
+    if (pollMs > 0) timer = setInterval(() => refresh().catch(() => {}), pollMs);
+
+    return {
+        node,
+        refresh,
+        dispose() { if (timer) clearInterval(timer); },
+    };
+}

package/src/kits/os/freddie/helpers.js

@@ -1,59 +1,59 @@
-import * as webjsx from '../../../../vendor/webjsx/index.js';
-const h = webjsx.createElement;
-
-export function pre(obj) {
-    return h('pre', { class: 'fd-pre' }, typeof obj === 'string' ? obj : JSON.stringify(obj, null, 2));
-}
-
-export function form(opts) {
-    const { fields = [], submit = 'submit', onSubmit } = opts;
-    return h('form', { class: 'row-form', onsubmit: (ev) => { ev.preventDefault(); onSubmit && onSubmit(ev); } },
-        ...fields.map(f => f.kind === 'textarea'
-            ? h('textarea', { name: f.name, placeholder: f.placeholder || '', rows: f.rows || 4 })
-            : h('input', { name: f.name, type: f.type || 'text', placeholder: f.placeholder || '', value: f.value || '', required: f.required ? 'true' : null })),
-        h('button', { type: 'submit', class: 'btn-primary' }, submit));
-}
-
-export function getRecentPaths() {
-    try { return JSON.parse(localStorage.getItem('fd_recent_cwds') || '[]'); } catch { return []; }
-}
-
-export function saveRecentPath(p) {
-    if (!p) return;
-    try {
-        const prev = getRecentPaths().filter(x => x !== p);
-        localStorage.setItem('fd_recent_cwds', JSON.stringify([p, ...prev].slice(0, 5)));
-    } catch {}
-}
-
-export function skillLabel(s) {
-    if (s.shortName) return s.shortName;
-    const n = s.name || '';
-    return n.replace(/^gm:/, '').replace(/^software-development$/, 'software dev').replace(/-/g, ' ');
-}
-
-export function renderChatMessages(container, messages) {
-    if (!container) return;
-    container.innerHTML = '';
-    for (const m of messages) {
-        if (m.role === 'tool') {
-            const det = document.createElement('details');
-            det.className = 'fd-chatlog-tool';
-            const sum = document.createElement('summary');
-            sum.className = 'fd-chatlog-tool-sum';
-            sum.textContent = '⚒ ' + m.name + (m.argsSummary ? ' ' + m.argsSummary : '');
-            det.appendChild(sum);
-            const body = document.createElement('pre');
-            body.className = 'fd-chatlog-tool-body';
-            body.textContent = m.content || '';
-            det.appendChild(body);
-            container.appendChild(det);
-        } else {
-            const el = document.createElement('div');
-            el.className = 'fd-chatlog-msg fd-chatlog-' + (m.role === 'assistant' ? 'assistant' : 'user');
-            el.textContent = (m.role === 'assistant' ? '◈ ' : '▷ ') + (m.content || '');
-            container.appendChild(el);
-        }
-    }
-    container.scrollTop = container.scrollHeight;
-}
+import * as webjsx from '../../../../vendor/webjsx/index.js';
+const h = webjsx.createElement;
+
+export function pre(obj) {
+    return h('pre', { class: 'fd-pre' }, typeof obj === 'string' ? obj : JSON.stringify(obj, null, 2));
+}
+
+export function form(opts) {
+    const { fields = [], submit = 'submit', onSubmit } = opts;
+    return h('form', { class: 'row-form', onsubmit: (ev) => { ev.preventDefault(); onSubmit && onSubmit(ev); } },
+        ...fields.map(f => f.kind === 'textarea'
+            ? h('textarea', { name: f.name, placeholder: f.placeholder || '', rows: f.rows || 4 })
+            : h('input', { name: f.name, type: f.type || 'text', placeholder: f.placeholder || '', value: f.value || '', required: f.required ? 'true' : null })),
+        h('button', { type: 'submit', class: 'btn-primary' }, submit));
+}
+
+export function getRecentPaths() {
+    try { return JSON.parse(localStorage.getItem('fd_recent_cwds') || '[]'); } catch { return []; }
+}
+
+export function saveRecentPath(p) {
+    if (!p) return;
+    try {
+        const prev = getRecentPaths().filter(x => x !== p);
+        localStorage.setItem('fd_recent_cwds', JSON.stringify([p, ...prev].slice(0, 5)));
+    } catch {}
+}
+
+export function skillLabel(s) {
+    if (s.shortName) return s.shortName;
+    const n = s.name || '';
+    return n.replace(/^gm:/, '').replace(/^software-development$/, 'software dev').replace(/-/g, ' ');
+}
+
+export function renderChatMessages(container, messages) {
+    if (!container) return;
+    container.innerHTML = '';
+    for (const m of messages) {
+        if (m.role === 'tool') {
+            const det = document.createElement('details');
+            det.className = 'fd-chatlog-tool';
+            const sum = document.createElement('summary');
+            sum.className = 'fd-chatlog-tool-sum';
+            sum.textContent = '⚒ ' + m.name + (m.argsSummary ? ' ' + m.argsSummary : '');
+            det.appendChild(sum);
+            const body = document.createElement('pre');
+            body.className = 'fd-chatlog-tool-body';
+            body.textContent = m.content || '';
+            det.appendChild(body);
+            container.appendChild(det);
+        } else {
+            const el = document.createElement('div');
+            el.className = 'fd-chatlog-msg fd-chatlog-' + (m.role === 'assistant' ? 'assistant' : 'user');
+            el.textContent = (m.role === 'assistant' ? '◈ ' : '▷ ') + (m.content || '');
+            container.appendChild(el);
+        }
+    }
+    container.scrollTop = container.scrollHeight;
+}