anentrypoint-design 0.0.322 → 0.0.324

package/src/kits/slides/deck-stage-state.js

@@ -0,0 +1,81 @@
+export const STORAGE_PREFIX = 'deck-stage:slide:';
+const VALIDATE_ATTR = 'no_overflowing_text,no_overlapping_text,slide_sized_text';
+const pad2 = (n) => String(n).padStart(2, '0');
+
+export function loadNotes(deckEl) {
+    const tag = document.getElementById('speaker-notes');
+    if (!tag) return [];
+    try {
+        const parsed = JSON.parse(tag.textContent || '[]');
+        return Array.isArray(parsed) ? parsed : [];
+    } catch (e) {
+        console.warn('[deck-stage] Failed to parse #speaker-notes JSON:', e);
+        return [];
+    }
+}
+
+export function restoreIndex(deckEl, slides) {
+    const storageKey = STORAGE_PREFIX + (location.pathname || '/');
+    try {
+        const raw = localStorage.getItem(storageKey);
+        if (raw == null) return 0;
+        const n = parseInt(raw, 10);
+        if (Number.isFinite(n) && n >= 0 && n < slides.length) return n;
+    } catch (e) { /* ignore */ }
+    return 0;
+}
+
+export function persistIndex(deckEl, index) {
+    const storageKey = STORAGE_PREFIX + (location.pathname || '/');
+    try { localStorage.setItem(storageKey, String(index)); } catch (e) {}
+}
+
+export function collectSlides(deckEl, slot) {
+    const assigned = slot.assignedElements({ flatten: true });
+    const slides = assigned.filter((el) => {
+        const tag = el.tagName;
+        return tag !== 'TEMPLATE' && tag !== 'SCRIPT' && tag !== 'STYLE';
+    });
+    slides.forEach((slide, i) => {
+        const n = i + 1;
+        let label = slide.getAttribute('data-label');
+        if (!label) {
+            const existing = slide.getAttribute('data-screen-label');
+            if (existing) label = existing.replace(/^\s*\d+\s*/, '').trim() || existing;
+        }
+        if (!label) {
+            const heading = slide.querySelector('h1, h2, h3, [data-title]');
+            if (heading) label = (heading.textContent || '').trim().slice(0, 40);
+        }
+        if (!label) label = 'Slide';
+        slide.setAttribute('data-screen-label', `${pad2(n)} ${label}`);
+        if (!slide.hasAttribute('data-om-validate')) slide.setAttribute('data-om-validate', VALIDATE_ATTR);
+        slide.setAttribute('data-deck-slide', String(i));
+    });
+    return slides;
+}
+
+export function applyIndex(deckEl, { index, prevIndex, slides, countEl, showOverlay = true, broadcast = true, reason = 'init', flashFn = null } = {}) {
+    if (!slides.length) return;
+    const prev = prevIndex == null ? -1 : prevIndex;
+    const curr = index;
+    slides.forEach((s, i) => {
+        if (i === curr) s.setAttribute('data-deck-active', '');
+        else s.removeAttribute('data-deck-active');
+    });
+    if (countEl) countEl.textContent = String(curr + 1);
+    persistIndex(deckEl, curr);
+    if (broadcast) {
+        try { window.postMessage({ slideIndexChanged: curr }, '*'); } catch (e) {}
+        deckEl.dispatchEvent(new CustomEvent('slidechange', {
+            detail: {
+                index: curr, previousIndex: prev, total: slides.length,
+                slide: slides[curr] || null,
+                previousSlide: prev >= 0 ? (slides[prev] || null) : null,
+                reason
+            },
+            bubbles: true, composed: true
+        }));
+    }
+    if (showOverlay && flashFn) flashFn();
+}

package/src/kits/slides/deck-stage-style.js

@@ -0,0 +1,117 @@
+export const STYLESHEET = `
+    :host {
+      position: fixed;
+      inset: 0;
+      display: block;
+      background: var(--panel-0, #000);
+      color: var(--panel-text, #fff);
+      font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, sans-serif;
+      overflow: hidden;
+    }
+    .stage { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
+    .canvas {
+      position: relative;
+      transform-origin: center center;
+      flex-shrink: 0;
+      background: var(--panel-1, #fff);
+      will-change: transform;
+    }
+    ::slotted(*) {
+      position: absolute !important;
+      inset: 0 !important;
+      width: 100% !important;
+      height: 100% !important;
+      box-sizing: border-box !important;
+      overflow: hidden;
+      opacity: 0;
+      pointer-events: none;
+      visibility: hidden;
+    }
+    ::slotted([data-deck-active]) { opacity: 1; pointer-events: auto; visibility: visible; }
+    .tapzones {
+      position: fixed; inset: 0; display: flex; z-index: 2147482000; pointer-events: none;
+    }
+    .tapzone { flex: 1; pointer-events: auto; -webkit-tap-highlight-color: transparent; }
+    @media (hover: hover) and (pointer: fine) { .tapzones { display: none; } }
+    .overlay {
+      position: fixed;
+      left: 50%; bottom: 22px;
+      transform: translate(-50%, 6px) scale(0.92);
+      filter: blur(6px);
+      display: flex; align-items: center;
+      gap: 4px; padding: 4px;
+      background: var(--scrim-media, rgba(19,19,24,0.85)); color: var(--on-color, #fff);
+      border-radius: 999px;
+      font-size: 14px;
+      font-feature-settings: "tnum" 1;
+      letter-spacing: 0.01em;
+      opacity: 0; pointer-events: none;
+      transition: opacity 260ms ease, transform 260ms cubic-bezier(.2,.8,.2,1), filter 260ms ease;
+      transform-origin: center bottom;
+      z-index: 2147483000;
+      user-select: none;
+    }
+    .overlay[data-visible] {
+      opacity: 1; pointer-events: auto;
+      transform: translate(-50%, 0) scale(1);
+      filter: blur(0);
+    }
+    .btn {
+      appearance: none; -webkit-appearance: none;
+      background: transparent; border: 0; margin: 0; padding: 0;
+      color: inherit; font: inherit; cursor: default;
+      display: inline-flex; align-items: center; justify-content: center;
+      height: 28px; min-width: 28px;
+      border-radius: 999px;
+      color: color-mix(in oklab, var(--on-color, #fff) 72%, transparent);
+      transition: background 140ms ease, color 140ms ease;
+      -webkit-tap-highlight-color: transparent;
+    }
+    .btn:hover { background: color-mix(in oklab, var(--on-color, #fff) 12%, transparent); color: var(--on-color, #fff); }
+    .btn:active { background: color-mix(in oklab, var(--on-color, #fff) 18%, transparent); }
+    .btn:focus, .btn:focus-visible { outline: none; }
+    .btn::-moz-focus-inner { border: 0; }
+    .btn svg { width: 14px; height: 14px; display: block; }
+    .btn.reset {
+      font-size: 13px; font-weight: 500; letter-spacing: 0.02em;
+      padding: 0 10px 0 12px; gap: 6px;
+      color: color-mix(in oklab, var(--on-color, #fff) 72%, transparent);
+    }
+    .btn.reset .kbd {
+      display: inline-flex; align-items: center; justify-content: center;
+      min-width: 16px; height: 16px; padding: 0 4px;
+      font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
+      font-size: 12px; line-height: 1;
+      color: color-mix(in oklab, var(--on-color, #fff) 88%, transparent);
+      background: color-mix(in oklab, var(--on-color, #fff) 12%, transparent);
+      border-radius: 4px;
+    }
+    .count {
+      font-variant-numeric: tabular-nums;
+      color: var(--on-color, #fff); font-weight: 500;
+      padding: 0 8px; min-width: 42px;
+      text-align: center; font-size: 14px;
+    }
+    .count .sep { color: color-mix(in oklab, var(--on-color, #fff) 45%, transparent); margin: 0 3px; font-weight: 400; }
+    .count .total { color: color-mix(in oklab, var(--on-color, #fff) 55%, transparent); }
+    .divider { width: 1px; height: 14px; background: color-mix(in oklab, var(--on-color, #fff) 18%, transparent); margin: 0 2px; }
+    @media print {
+      :host { position: static; inset: auto; background: none; overflow: visible; color: inherit; }
+      .stage { position: static; display: block; }
+      .canvas { transform: none !important; width: auto !important; height: auto !important; background: none; will-change: auto; }
+      ::slotted(*) {
+        position: relative !important;
+        inset: auto !important;
+        width: var(--deck-design-w) !important;
+        height: var(--deck-design-h) !important;
+        box-sizing: border-box !important;
+        opacity: 1 !important;
+        visibility: visible !important;
+        pointer-events: auto;
+        break-after: page; page-break-after: always; break-inside: avoid;
+        overflow: hidden;
+      }
+      ::slotted(*:last-child) { break-after: auto; page-break-after: auto; }
+      .overlay, .tapzones { display: none !important; }
+    }
+`;

package/src/kits/slides/deck-stage.js

@@ -0,0 +1,167 @@
+import { STYLESHEET } from './deck-stage-style.js';
+import { buildOverlay, buildTapzones, handleDeckKey } from './deck-stage-overlay.js';
+import { loadNotes, restoreIndex, persistIndex, collectSlides, applyIndex, STORAGE_PREFIX } from './deck-stage-state.js';
+
+const DESIGN_W_DEFAULT = 1920;
+const DESIGN_H_DEFAULT = 1080;
+const OVERLAY_HIDE_MS = 1800;
+
+class DeckStage extends HTMLElement {
+    static get observedAttributes() { return ['width', 'height', 'noscale', 'fill']; }
+
+    constructor() {
+        super();
+        this._root = this.attachShadow({ mode: 'open' });
+        this._index = 0;
+        this._slides = [];
+        this._notes = [];
+        this._hideTimer = null;
+        this._mouseIdleTimer = null;
+        this._storageKey = STORAGE_PREFIX + (location.pathname || '/');
+        this._onKey = this._onKey.bind(this);
+        this._onResize = this._onResize.bind(this);
+        this._onSlotChange = this._onSlotChange.bind(this);
+        this._onMouseMove = this._onMouseMove.bind(this);
+    }
+
+    get designWidth()  { return parseInt(this.getAttribute('width'), 10)  || DESIGN_W_DEFAULT; }
+    get designHeight() { return parseInt(this.getAttribute('height'), 10) || DESIGN_H_DEFAULT; }
+
+    connectedCallback() {
+        this._render();
+        this._notes = loadNotes(this);
+        this._syncPrintPageRule();
+        window.addEventListener('keydown', this._onKey);
+        window.addEventListener('resize', this._onResize);
+        window.addEventListener('mousemove', this._onMouseMove, { passive: true });
+    }
+
+    disconnectedCallback() {
+        window.removeEventListener('keydown', this._onKey);
+        window.removeEventListener('resize', this._onResize);
+        window.removeEventListener('mousemove', this._onMouseMove);
+        if (this._hideTimer) clearTimeout(this._hideTimer);
+        if (this._mouseIdleTimer) clearTimeout(this._mouseIdleTimer);
+    }
+
+    attributeChangedCallback() {
+        if (!this._canvas) return;
+        this._canvas.style.width = this.designWidth + 'px';
+        this._canvas.style.height = this.designHeight + 'px';
+        this._canvas.style.setProperty('--deck-design-w', this.designWidth + 'px');
+        this._canvas.style.setProperty('--deck-design-h', this.designHeight + 'px');
+        this._fit();
+        this._syncPrintPageRule();
+    }
+
+    _render() {
+        const style = document.createElement('style');
+        style.textContent = STYLESHEET;
+        const stage = document.createElement('div');
+        stage.className = 'stage';
+        const canvas = document.createElement('div');
+        canvas.className = 'canvas';
+        canvas.style.width = this.designWidth + 'px';
+        canvas.style.height = this.designHeight + 'px';
+        canvas.style.setProperty('--deck-design-w', this.designWidth + 'px');
+        canvas.style.setProperty('--deck-design-h', this.designHeight + 'px');
+        const slot = document.createElement('slot');
+        slot.addEventListener('slotchange', this._onSlotChange);
+        canvas.appendChild(slot);
+        stage.appendChild(canvas);
+
+        const tapzones = buildTapzones({
+            onBack: (e) => { e.preventDefault(); this._go(this._index - 1, 'tap'); },
+            onForward: (e) => { e.preventDefault(); this._go(this._index + 1, 'tap'); }
+        });
+        const overlay = buildOverlay({
+            onPrev: () => this._go(this._index - 1, 'click'),
+            onNext: () => this._go(this._index + 1, 'click'),
+            onReset: () => this._go(0, 'click')
+        });
+
+        this._root.append(style, stage, tapzones, overlay);
+        this._canvas = canvas;
+        this._slot = slot;
+        this._overlay = overlay;
+        this._countEl = overlay.querySelector('.current');
+        this._totalEl = overlay.querySelector('.total');
+    }
+
+    _syncPrintPageRule() {
+        const id = 'deck-stage-print-page';
+        let tag = document.getElementById(id);
+        if (!tag) {
+            tag = document.createElement('style');
+            tag.id = id;
+            document.head.appendChild(tag);
+        }
+        tag.textContent =
+            '@page { size: ' + this.designWidth + 'px ' + this.designHeight + 'px; margin: 0; } ' +
+            '@media print { html, body { margin: 0 !important; padding: 0 !important; background: none !important; overflow: visible !important; height: auto !important; } ' +
+            '* { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }';
+    }
+
+    _onSlotChange() {
+        this._slides = collectSlides(this, this._slot);
+        this._index = restoreIndex(this, this._slides);
+        applyIndex(this, {
+            index: this._index, prevIndex: this._prevIndex, slides: this._slides,
+            countEl: this._countEl, showOverlay: false, broadcast: true, reason: 'init',
+            flashFn: () => this._flashOverlay()
+        });
+        this._fit();
+    }
+
+
+    _flashOverlay() {
+        if (!this._overlay) return;
+        this._overlay.setAttribute('data-visible', '');
+        if (this._hideTimer) clearTimeout(this._hideTimer);
+        this._hideTimer = setTimeout(() => this._overlay.removeAttribute('data-visible'), OVERLAY_HIDE_MS);
+    }
+
+    _fit() {
+        if (!this._canvas) return;
+        if (this.hasAttribute('noscale')) { this._canvas.style.transform = 'none'; return; }
+        const wRatio = window.innerWidth / this.designWidth;
+        const hRatio = window.innerHeight / this.designHeight;
+        // Default "contain" (Math.min) always shows the full design canvas,
+        // letterboxing on a mismatched aspect ratio. Opt-in fill="cover"
+        // (Math.max) instead fills the viewport edge-to-edge for wide
+        // presentation displays, cropping the canvas to the stage's
+        // existing `overflow:hidden` — never changes designWidth/designHeight,
+        // so the @page print-size sync in _syncPrintPageRule is unaffected.
+        const s = this.getAttribute('fill') === 'cover' ? Math.max(wRatio, hRatio) : Math.min(wRatio, hRatio);
+        this._canvas.style.transform = `scale(${s})`;
+    }
+
+    _onResize() { this._fit(); }
+    _onMouseMove() { this._flashOverlay(); }
+    _onKey(e) { if (handleDeckKey(this, e)) { e.preventDefault(); this._flashOverlay(); } }
+
+    _go(i, reason = 'api') {
+        if (!this._slides.length) return;
+        const clamped = Math.max(0, Math.min(this._slides.length - 1, i));
+        if (clamped === this._index) { this._flashOverlay(); return; }
+        this._index = clamped;
+        applyIndex(this, {
+            index: this._index, prevIndex: this._prevIndex, slides: this._slides,
+            countEl: this._countEl, showOverlay: true, broadcast: true, reason,
+            flashFn: () => this._flashOverlay()
+        });
+    }
+
+    get index() { return this._index; }
+    get length() { return this._slides.length; }
+    goTo(i) { this._go(i, 'api'); }
+    next()   { this._go(this._index + 1, 'api'); }
+    prev()   { this._go(this._index - 1, 'api'); }
+    reset()  { this._go(0, 'api'); }
+}
+
+if (typeof customElements !== 'undefined' && !customElements.get('deck-stage')) {
+    customElements.define('deck-stage', DeckStage);
+}
+
+export { DeckStage };

package/src/kits/slides/index.js

@@ -0,0 +1,5 @@
+// slides kit — presentation-deck web component (title/content/quote/
+// comparison/receipt/end template pattern). Side-effect import registers the
+// <deck-stage> custom element; DeckStage itself is also exported for direct
+// use/typing by a consumer that wants the class reference.
+export { DeckStage } from './deck-stage.js';

package/src/markdown.js

@@ -1,6 +1,10 @@
 // Markdown — lazy-loads marked + DOMPurify on first call. Stub-safe:
 // if loading fails, we fall back to a simple escape-and-linebreak pass so
-// the chat doesn't go blank.
+// the chat doesn't go blank. FAIL-CLOSED: on any doubt about whether the
+// sanitizer is actually active (load failure, parse/sanitize throw, or a
+// purifier that doesn't look like a real DOMPurify instance), the render
+// path returns escaped plaintext rather than ever risking raw HTML reaching
+// innerHTML.
 
 import { escapeHtml } from './html-escape.js';
 
@@ -15,14 +19,42 @@ const RETRY_BACKOFF_MS = 30000;
 // Pin to exact semver so the CDN cannot silently swap code under us.
 // SRI cannot be applied to dynamic ESM imports in browsers (no importmap
 // integrity support at design time); pinning the version is the best available
-// mitigation for CDN-supply-chain risk on these two dependencies.
-const MARKED_URL = 'https://cdn.jsdelivr.net/npm/marked@15.0.12/+esm';
-const PURIFY_URL = 'https://cdn.jsdelivr.net/npm/dompurify@3.2.6/+esm';
+// mitigation for CDN-supply-chain risk on these two dependencies. Both are
+// overridable (see configureMarkdownCdn below) for a consumer that wants to
+// self-host, mirror-pin, or route through a CSP-allowlisted proxy; the
+// defaults below are byte-for-byte unchanged from before, so a zero-config
+// consumer's behavior is untouched.
+const DEFAULT_MARKED_URL = 'https://cdn.jsdelivr.net/npm/marked@15.0.12/+esm';
+const DEFAULT_PURIFY_URL = 'https://cdn.jsdelivr.net/npm/dompurify@3.2.6/+esm';
+
+let _markedUrl = DEFAULT_MARKED_URL;
+let _purifyUrl = DEFAULT_PURIFY_URL;
+
+// Optional override for where marked/DOMPurify are fetched from. Additive:
+// call before the first render() to take effect (ensureReady() reads these
+// module-level vars lazily on first invocation only, same as before). Every
+// existing consumer that never calls this keeps hitting the pinned jsDelivr
+// URLs above, byte-for-byte. Passing null/undefined for a key resets that
+// one URL back to its default without touching the other.
+export function configureMarkdownCdn({ markedUrl, purifyUrl } = {}) {
+    if (markedUrl !== undefined) _markedUrl = markedUrl || DEFAULT_MARKED_URL;
+    if (purifyUrl !== undefined) _purifyUrl = purifyUrl || DEFAULT_PURIFY_URL;
+    // Force a fresh load on the next render so a runtime override (e.g. a
+    // consumer switching to a self-hosted mirror after boot) actually takes.
+    _ready = null;
+    _failedAt = 0;
+}
+
+// Read-only introspection of the URLs actually in effect (defaults or
+// override) — useful for a consumer's own SRI/CSP audit tooling.
+export function getMarkdownCdnConfig() {
+    return { markedUrl: _markedUrl, purifyUrl: _purifyUrl };
+}
 
 // True while the markdown stack is unavailable (escaped-fallback rendering).
 // Consumers (markdown-cache) use this to avoid caching degraded output.
 export function isDegraded() {
-    return !_marked || !_purify;
+    return !_marked || !_purify || typeof _purify.sanitize !== 'function';
 }
 
 export async function ensureReady() {
@@ -30,14 +62,24 @@ export async function ensureReady() {
     if (_failedAt && Date.now() - _failedAt < RETRY_BACKOFF_MS) return false;
     _ready = (async () => {
         try {
-            const [{ marked }, DOMPurifyMod] = await Promise.all([import(MARKED_URL), import(PURIFY_URL)]);
+            const [{ marked }, DOMPurifyMod] = await Promise.all([import(_markedUrl), import(_purifyUrl)]);
+            const purify = DOMPurifyMod.default || DOMPurifyMod;
+            // Fail closed if either module didn't resolve to something usable —
+            // a CDN that 200s with an empty/HTML error-page body can satisfy the
+            // dynamic import yet hand back a shape with no .parse/.sanitize.
+            if (!marked || typeof marked.parse !== 'function') throw new Error('marked module missing parse()');
+            if (!purify || typeof purify.sanitize !== 'function') throw new Error('DOMPurify module missing sanitize()');
             _marked = marked;
-            _purify = DOMPurifyMod.default || DOMPurifyMod;
+            _purify = purify;
             _failedAt = 0;
             return true;
         } catch (err) {
             console.warn('[247420] markdown loader failed:', err);
             // Reset the cached promise so a later render retries (after backoff).
+            // Also drop any partial module refs so isDegraded()/renderMarkdown
+            // never treat a half-initialized state as ready.
+            _marked = null;
+            _purify = null;
             _ready = null;
             _failedAt = Date.now();
             return false;
@@ -46,6 +88,13 @@ export async function ensureReady() {
     return _ready;
 }
 
+// Fail-closed plaintext fallback, always wrapped in the same safe container
+// shape the real sanitized output would use (a plain block the caller can
+// innerHTML directly) — never bare unwrapped text relying on caller discipline.
+function escapedFallback(src) {
+    return escapeHtml(src).replace(/\n/g, '<br>');
+}
+
 // The single HTML-entity escape for the whole SDK now lives in html-escape.js
 // (full set incl. quotes, so it is safe in attribute contexts too).
 // Re-exported here for backward compatibility with existing importers of
@@ -54,9 +103,28 @@ export { escapeHtml };
 
 export async function renderMarkdown(src) {
     const ok = await ensureReady();
-    if (!ok) return escapeHtml(src).replace(/\n/g, '<br>');
-    const raw = _marked.parse(String(src));
-    return _purify.sanitize(raw, { FORCE_BODY: true });
+    if (!ok) return escapedFallback(src);
+    // Fail-closed around the parse+sanitize call itself too, not just the
+    // loader: a CDN module that resolved but throws mid-parse (a malformed
+    // remote payload, a marked/DOMPurify version mismatch) must never let a
+    // partially-produced `raw` string reach the caller unsanitized, and must
+    // never propagate an unhandled rejection that a caller might swallow into
+    // a raw-HTML fallback of their own.
+    try {
+        const raw = _marked.parse(String(src));
+        if (typeof _purify.sanitize !== 'function') throw new Error('purifier unavailable mid-render');
+        return _purify.sanitize(raw, { FORCE_BODY: true });
+    } catch (err) {
+        console.warn('[247420] markdown render failed, falling back to escaped text:', err);
+        // Treat this exactly like a load failure: drop refs and start the
+        // backoff so the next call retries a fresh load rather than re-hitting
+        // whatever made this one throw.
+        _marked = null;
+        _purify = null;
+        _ready = null;
+        _failedAt = Date.now();
+        return escapedFallback(src);
+    }
 }
 
 // Sanitize already-rendered HTML before it touches innerHTML. For any surface
@@ -66,5 +134,15 @@ export async function renderMarkdown(src) {
 export async function sanitizeHtml(html) {
     const ok = await ensureReady();
     if (!ok) return escapeHtml(html);
-    return _purify.sanitize(String(html), { FORCE_BODY: true });
+    try {
+        if (typeof _purify.sanitize !== 'function') throw new Error('purifier unavailable mid-sanitize');
+        return _purify.sanitize(String(html), { FORCE_BODY: true });
+    } catch (err) {
+        console.warn('[247420] sanitizeHtml failed, falling back to escaped text:', err);
+        _marked = null;
+        _purify = null;
+        _ready = null;
+        _failedAt = Date.now();
+        return escapeHtml(html);
+    }
 }

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

@@ -1,33 +0,0 @@
-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, ' ');
-}