anentrypoint-design 0.0.437 → 0.0.439

package/src/kits/os/icons.js

@@ -24,6 +24,11 @@ const OS_PATHS = {
     chat: ICON_PATHS.forum,
     tools: '<path d="M14 7l3-3 3 3-3 3-3-3zM7 14l3 3-7 7-3-3 7-7zM5 7l3-3M14 14l6 6"/>',
     freddie: '<circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2M8 12a4 4 0 008 0"/>',
+    // Titlebar window controls: mirrors ICON_PATHS's minus/plus/x visual weight
+    // so wm.js's chip buttons render through the same SVG contract as every
+    // other icon in this kit instead of raw ASCII glyph text (-/+/x).
+    minimize: '<path d="M5 12h14"/>',
+    maximize: '<rect x="5" y="5" width="14" height="14" rx="1"/>',
 };
 
 // iconMarkup() only resolves names already registered in the shared

package/src/kits/os/launcher.css

@@ -43,8 +43,9 @@
     color: var(--os-fg);
     box-shadow: inset 4px 0 0 var(--os-accent);
 }
-.launcher-add { font-size: 20px; color: var(--os-fg-2); }
+.launcher-add { color: var(--os-fg-2); }
 .launcher-add:hover { color: var(--os-accent); }
+.launcher-btn svg { width: 18px; height: 18px; display: block; fill: none; stroke: currentColor; }
 
 .launcher-instances {
     display: flex;
@@ -65,8 +66,12 @@
     gap: var(--space-1, 4px);
 }
 
-.launcher-close { font-size: 11px; opacity: 0.7; width: 20px; height: 20px; color: var(--os-fg-3); }
+.launcher-close { opacity: 0.7; width: 20px; height: 20px; color: var(--os-fg-3); }
+.launcher-close svg { width: 12px; height: 12px; }
 .launcher-close:hover { opacity: 1; color: var(--os-red); }
+/* Armed (first-click) confirm state for the second-click-to-confirm destructive
+ * close — a visible "are you sure" cue before the instance actually closes. */
+.launcher-close.confirm { opacity: 1; color: var(--os-red); box-shadow: inset 0 0 0 1px var(--os-red); }
 
 .launcher-dock + .wm-root { left: calc(var(--os-rail-w, 56px) + env(safe-area-inset-left, 0px)) !important; }
 

package/src/kits/os/launcher.js

@@ -2,7 +2,10 @@
 // Consumer (thebird) owns instance creation, fs/worker/shell wiring, teardown.
 // renderDock returns a handle whose setInstances/setActive are called from
 // lifecycle code. Visuals are bible-aligned: panel-select bg + accent inset
-// rail for active, tonal hover, lowercase mono labels.
+// rail for active, tonal hover, lowercase mono labels. Add/close controls
+// render through ./icons.js's SVG contract, not raw ASCII glyphs.
+
+import { icons } from './icons.js';
 
 export function renderDock(opts = {}) {
     const { root = document.body, callbacks = {} } = opts;
@@ -12,7 +15,7 @@ export function renderDock(opts = {}) {
 
     const addBtn = document.createElement('button');
     addBtn.className = 'launcher-btn launcher-add';
-    addBtn.textContent = '+';
+    addBtn.innerHTML = icons.plus;
     addBtn.title = 'new instance';
     addBtn.setAttribute('aria-label', 'new instance');
     addBtn.addEventListener('click', () => callbacks.onNewInstance && callbacks.onNewInstance());
@@ -51,15 +54,36 @@ export function renderDock(opts = {}) {
 
             const closeBtn = document.createElement('button');
             closeBtn.className = 'launcher-btn launcher-close';
-            closeBtn.textContent = 'x';
+            closeBtn.innerHTML = icons.close;
             closeBtn.title = 'close ' + inst.id;
             closeBtn.setAttribute('aria-label', 'close ' + inst.id);
             closeBtn.dataset.role = 'close';
             closeBtn.dataset.instanceId = inst.id;
+            // Destructive one-click close gets a second-click-to-confirm: the
+            // first click arms the button (visual + aria-label change) instead
+            // of firing immediately; a second click within the window commits.
+            // Clicking elsewhere, or the arm window elapsing, disarms silently.
+            let armed = false;
+            let armTimer = null;
+            function disarm() {
+                armed = false;
+                if (armTimer) { clearTimeout(armTimer); armTimer = null; }
+                closeBtn.classList.remove('confirm');
+                closeBtn.setAttribute('aria-label', 'close ' + inst.id);
+            }
             closeBtn.addEventListener('click', e => {
                 e.stopPropagation();
+                if (!armed) {
+                    armed = true;
+                    closeBtn.classList.add('confirm');
+                    closeBtn.setAttribute('aria-label', 'confirm close ' + inst.id);
+                    armTimer = setTimeout(disarm, 3000);
+                    return;
+                }
+                disarm();
                 callbacks.onCloseInstance && callbacks.onCloseInstance(inst.id);
             });
+            closeBtn.addEventListener('blur', disarm);
 
             row.append(selBtn, closeBtn);
             instancesHost.appendChild(row);

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

@@ -8,8 +8,14 @@ export function renderMonitorApp(opts = {}) {
     node.className = 'app-pane mono';
     node.dataset.component = 'monitor-app';
 
+    function renderError(err) {
+        node.textContent = 'could not read stats: ' + (err && err.message ? err.message : String(err));
+        node.classList.add('is-error');
+    }
+
     async function tick() {
         const s = (await Promise.resolve(getStats())) || {};
+        node.classList.remove('is-error');
         const heap = (s.jsHeapMb != null && s.jsHeapLimitMb != null)
             ? `js heap: ${Number(s.jsHeapMb).toFixed(1)} MB / ${Number(s.jsHeapLimitMb).toFixed(0)} MB`
             : 'js heap: n/a';
@@ -24,8 +30,8 @@ export function renderMonitorApp(opts = {}) {
         ].join('\n');
     }
 
-    tick().catch(() => {});
-    const timer = setInterval(() => tick().catch(() => {}), pollMs);
+    tick().catch(renderError);
+    const timer = setInterval(() => tick().catch(renderError), pollMs);
     return {
         node,
         tick,

package/src/kits/os/shell.js

@@ -42,8 +42,37 @@ export function createDesktopShell({ root = document.body, wm, registry, brand =
     osRoot.append(menubar, appsMenu, taskbar);
     document.body.append(sideRail, drawer);
 
-    function openMenu() { appsMenu.classList.add('open'); appsBtn.setAttribute('aria-expanded', 'true'); }
-    function closeMenu() { appsMenu.classList.remove('open'); appsBtn.setAttribute('aria-expanded', 'false'); }
+    // Apps menu keyboard operability (APG menu-button pattern), mirroring the
+    // drawer's capture/restore-focus treatment below: opening moves focus onto
+    // the first menuitem so Tab/arrow-keys start inside the now-visible menu
+    // instead of on a hidden ancestor; closing restores focus to appsBtn (the
+    // only trigger) so keyboard position isn't lost. Arrow keys roam the
+    // role="menuitem" set (roving focus) per the declared role="menu".
+    let menuReturnFocus = null;
+    function menuItems() { return [...appsMenu.querySelectorAll('[role="menuitem"]')]; }
+    function openMenu() {
+        menuReturnFocus = document.activeElement;
+        appsMenu.classList.add('open');
+        appsBtn.setAttribute('aria-expanded', 'true');
+        const items = menuItems();
+        if (items.length) items[0].focus();
+    }
+    function closeMenu() {
+        if (!appsMenu.classList.contains('open')) return;
+        appsMenu.classList.remove('open');
+        appsBtn.setAttribute('aria-expanded', 'false');
+        if (menuReturnFocus && typeof menuReturnFocus.focus === 'function') menuReturnFocus.focus();
+        menuReturnFocus = null;
+    }
+    appsMenu.addEventListener('keydown', e => {
+        const items = menuItems();
+        if (!items.length) return;
+        const i = items.indexOf(document.activeElement);
+        if (e.key === 'ArrowDown') { e.preventDefault(); items[(i + 1 + items.length) % items.length].focus(); }
+        else if (e.key === 'ArrowUp') { e.preventDefault(); items[(i - 1 + items.length) % items.length].focus(); }
+        else if (e.key === 'Home') { e.preventDefault(); items[0].focus(); }
+        else if (e.key === 'End') { e.preventDefault(); items[items.length - 1].focus(); }
+    });
     // Focus management: opening the drawer moves keyboard focus onto its
     // close button (the first reachable control inside the now-visible
     // dialog) so Tab starts inside it, not lost on a now-hidden ancestor;
@@ -136,26 +165,40 @@ export function createDesktopShell({ root = document.body, wm, registry, brand =
         refreshTaskbar();
     }
 
+    function makeLoadingNode() {
+        const n = document.createElement('div');
+        n.className = 'app-pane os-app-loading';
+        n.textContent = 'loading…';
+        return n;
+    }
+
     function openApp(appId) {
         const app = (typeof registry.get === 'function') ? registry.get(appId) : registry[appId];
         if (!app) throw new Error('unknown app: ' + appId);
         const ctx = { ...(activeContext || {}), registry, openApp, wm };
         const result = app.factory(ctx);
+        const isAsync = result && typeof result.then === 'function';
+        const sz = app.defaultSize || { w: 520, h: 360 };
+        const { w, h, x, y, maximized } = computeSpawnRect(sz, wm.count);
+        const titlePrefix = (activeContext && activeContext.titlePrefix) ? activeContext.titlePrefix + ' · ' : '';
+        // A slow async factory (network/worker-backed app) must not read as a
+        // dead click: spawn the window immediately with a loading placeholder
+        // body, then swap in the real content once the factory resolves.
+        const win = wm.open({ title: titlePrefix + app.name, body: isAsync ? makeLoadingNode() : result.node, kind: appId, width: w, height: h, x, y, maximized });
+        if (activeInstanceId && win.el) {
+            win.el.dataset.instanceId = activeInstanceId;
+            win.instanceId = activeInstanceId;
+        }
+        win.appId = appId;
+        refreshTaskbar();
         const finish = (r) => {
-            const sz = app.defaultSize || { w: 520, h: 360 };
-            const { w, h, x, y, maximized } = computeSpawnRect(sz, wm.count);
-            const titlePrefix = (activeContext && activeContext.titlePrefix) ? activeContext.titlePrefix + ' · ' : '';
-            const win = wm.open({ title: titlePrefix + app.name, body: r.node, kind: appId, width: w, height: h, x, y, maximized });
+            if (isAsync && typeof win.setBody === 'function') win.setBody(r.node);
             win._app = { id: appId, dispose: r.dispose };
-            if (activeInstanceId && win.el) {
-                win.el.dataset.instanceId = activeInstanceId;
-                win.instanceId = activeInstanceId;
-            }
-            win.appId = appId;
             refreshTaskbar();
             return win;
         };
-        return (result && typeof result.then === 'function') ? result.then(finish) : finish(result);
+        if (isAsync) return result.then(finish);
+        return finish(result);
     }
 
     if (newInstBtn) newInstBtn.addEventListener('click', () => onNewInstance && onNewInstance({ instSwitch, setContext, openApp }));

package/src/kits/os/theme.css

@@ -184,7 +184,10 @@ html, body {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
-    text-transform: lowercase;
+    /* No text-transform here: .os-task carries the app/window's own dynamic
+     * title (shell.js refreshTaskbar -> t.textContent = w.title), and a
+     * user- or app-supplied string (filename, acronym, URL) must render
+     * as-authored rather than get silently lowercased by brand-voice CSS. */
 }
 .os-task { min-height: 28px; }
 .os-task:hover { background: var(--panel-hover, var(--os-bg-2)); color: var(--os-fg); }
@@ -229,7 +232,9 @@ html, body {
     letter-spacing: 0.005em;
     text-align: center;
     font-weight: 600;
-    text-transform: lowercase;
+    /* No text-transform here: the titlebar renders the window's own dynamic
+     * title (renderWindow({title}) / setTitle(t) in wm.js) — a user- or
+     * app-supplied filename/acronym/URL must not be silently lowercased. */
 }
 .ds-247420 .wm-btns { gap: var(--space-1-75); order: -1; }
 .ds-247420 .wm-btn {
@@ -249,6 +254,11 @@ html, body {
     transition: background 100ms ease, color 100ms ease;
 }
 .ds-247420 .wm-btn:hover { background: var(--panel-hover, var(--os-bg-2)); color: var(--os-fg); }
+.ds-247420 .wm-btn svg { width: 12px; height: 12px; display: block; fill: none; stroke: currentColor; }
+/* Armed (first-click) confirm state for the window close button's
+ * second-click-to-confirm idiom — an unrecoverable close gets a visible cue
+ * before it commits, matching the launcher dock's instance-close treatment. */
+.ds-247420 .wm-btn.confirm { background: var(--os-red); color: var(--paper); }
 
 .ds-247420 .wm-resize {
     background: transparent;
@@ -402,6 +412,14 @@ html, body {
 .app-pane.mono .row:hover { background: var(--panel-hover, var(--os-bg-2)); }
 .app-pane.mono .row.selected { background: var(--panel-select, var(--os-accent-soft)); box-shadow: inset 4px 0 0 var(--os-accent); }
 .app-pane.mono .head { color: var(--os-accent); margin-bottom: var(--space-2); padding-bottom: var(--space-2); font-weight: 600; letter-spacing: 0.02em; border-bottom: 1px solid var(--os-bg-3); }
+/* Visible fetch-error surface for polling app panes (files/monitor): a swallowed
+ * rejection must not leave the pane silently frozen with no user-facing signal. */
+.app-pane.mono .row-error { color: var(--danger, #c0392b); padding: var(--space-2); }
+.app-pane.mono[data-component="monitor-app"].is-error { color: var(--danger, #c0392b); }
+/* Placeholder body shown immediately for a window spawned by an async app
+ * factory, swapped for the real content on resolve — see openApp() in
+ * shell.js. Prevents a slow factory from reading as a dead click. */
+.os-app-loading { display: flex; align-items: center; justify-content: center; color: var(--os-fg-3); font-style: italic; }
 .app-pane.mono pre { background: var(--os-bg-2); padding: var(--space-2-5) var(--space-2-75); margin: var(--space-2) 0 0 0; max-height: 220px; overflow: auto; white-space: pre-wrap; font: var(--fs-nano) var(--os-mono); border-radius: var(--r-1, 6px); color: var(--os-fg); border: none; }
 .app-shell-pane { margin: 0; padding: var(--space-2); font: var(--fs-micro) var(--os-mono); color: var(--os-fg); background: var(--os-bg-0); height: 100%; overflow: auto; white-space: pre-wrap; box-sizing: border-box; }
 .app-canvas { width: 100%; height: 100%; background: var(--os-bg-0); display: block; cursor: default; }

package/src/kits/os/wm.js

@@ -2,10 +2,14 @@
 // Consumer (thebird) owns z-order, focus stack, alt-tab, drag/resize math.
 // renderWindow returns a handle whose setBounds is called from pointermove.
 //
-// Visuals are bible-aligned: mac-less chip buttons (-+x in mono),
-// inset 4px rail for focus, low-opacity \25E2 glyph for resize affordance,
-// pointer-events:none on .wm-bar with auto on title+close so phone @media
-// auto-maximize can suppress drag without a JS branch.
+// Visuals are bible-aligned: mac-less chip buttons (SVG minimize/maximize/
+// close icons via ./icons.js, not raw ASCII glyphs — matches every other
+// icon surface in this kit), inset 4px rail for focus, CSS-gradient resize
+// affordance (no glyph), pointer-events:none on .wm-bar with auto on
+// title+close so phone @media auto-maximize can suppress drag without a JS
+// branch.
+
+import { icons } from './icons.js';
 
 export function renderWindow(opts = {}) {
     const {
@@ -62,9 +66,9 @@ export function renderWindow(opts = {}) {
     titleEl.textContent = title;
     const btns = document.createElement('div');
     btns.className = 'wm-btns';
-    const minBtn = mkBtn('-', 'minimize');
-    const maxBtn = mkBtn('+', 'maximize');
-    const closeBtn = mkBtn('x', 'close');
+    const minBtn = mkBtn(icons.minimize, 'minimize');
+    const maxBtn = mkBtn(icons.maximize, 'maximize');
+    const closeBtn = mkBtn(icons.close, 'close');
     btns.append(minBtn, maxBtn, closeBtn);
     bar.append(titleEl, btns);
 
@@ -99,7 +103,33 @@ export function renderWindow(opts = {}) {
 
     minBtn.addEventListener('click', e => { e.stopPropagation(); callbacks.onMinimize && callbacks.onMinimize(); });
     maxBtn.addEventListener('click', e => { e.stopPropagation(); callbacks.onMaximize && callbacks.onMaximize(); });
-    closeBtn.addEventListener('click', e => { e.stopPropagation(); callbacks.onClose && callbacks.onClose(); });
+
+    // Closing a window is destructive and unrecoverable (no undo), so it goes
+    // through the same second-click-to-confirm arm/commit idiom as the
+    // launcher dock's instance-close button: first click arms (visual +
+    // aria-label cue), a second click within the window commits; losing
+    // focus or the timeout elapsing disarms silently.
+    let closeArmed = false;
+    let closeArmTimer = null;
+    function disarmClose() {
+        closeArmed = false;
+        if (closeArmTimer) { clearTimeout(closeArmTimer); closeArmTimer = null; }
+        closeBtn.classList.remove('confirm');
+        closeBtn.setAttribute('aria-label', 'close');
+    }
+    closeBtn.addEventListener('click', e => {
+        e.stopPropagation();
+        if (!closeArmed) {
+            closeArmed = true;
+            closeBtn.classList.add('confirm');
+            closeBtn.setAttribute('aria-label', 'confirm close');
+            closeArmTimer = setTimeout(disarmClose, 3000);
+            return;
+        }
+        disarmClose();
+        callbacks.onClose && callbacks.onClose();
+    });
+    closeBtn.addEventListener('blur', disarmClose);
 
     const focus = () => callbacks.onFocus && callbacks.onFocus();
 
@@ -163,14 +193,14 @@ export function renderWindow(opts = {}) {
         setInstanceId(id) { if (id) el.dataset.instanceId = id; else delete el.dataset.instanceId; },
         setZIndex(z) { el.style.zIndex = String(z); },
         getBounds() { return { x: el.offsetLeft, y: el.offsetTop, w: el.offsetWidth, h: el.offsetHeight }; },
-        dispose() { el.remove(); },
+        dispose() { if (closeArmTimer) clearTimeout(closeArmTimer); el.remove(); },
     };
 }
 
-function mkBtn(label, ttl) {
+function mkBtn(svg, ttl) {
     const b = document.createElement('button');
     b.className = 'wm-btn';
-    b.textContent = label;
+    b.innerHTML = svg;
     b.title = ttl;
     b.setAttribute('aria-label', ttl);
     return b;

package/types/components.d.ts

@@ -294,6 +294,8 @@ export interface PanelProps {
     children?: any;
     kind?: any;
     id?: any;
+    /** @default 2 */
+    headingLevel?: number;
 }
 export declare function Panel(props?: PanelProps): VNode;
 

package/dist/slides/deck-stage-overlay.js

@@ -1,63 +0,0 @@
-const ICON_PREV = '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M10 3L5 8l5 5"/></svg>';
-const ICON_NEXT = '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M6 3l5 5-5 5"/></svg>';
-
-export function buildOverlay({ onPrev, onNext, onReset }) {
-    const overlay = document.createElement('div');
-    overlay.className = 'overlay export-hidden';
-    overlay.setAttribute('role', 'toolbar');
-    overlay.setAttribute('aria-label', 'Deck controls');
-    overlay.innerHTML = `
-        <button class="btn prev" type="button" aria-label="Previous slide" title="Previous (←)">${ICON_PREV}</button>
-        <span class="count" aria-live="polite"><span class="current">1</span><span class="sep">/</span><span class="total">1</span></span>
-        <button class="btn next" type="button" aria-label="Next slide" title="Next (→)">${ICON_NEXT}</button>
-        <span class="divider"></span>
-        <button class="btn reset" type="button" aria-label="Reset to first slide" title="Reset (R)">Reset<span class="kbd">R</span></button>
-    `;
-    overlay.querySelector('.prev').addEventListener('click', onPrev);
-    overlay.querySelector('.next').addEventListener('click', onNext);
-    overlay.querySelector('.reset').addEventListener('click', onReset);
-    return overlay;
-}
-
-export function buildTapzones({ onBack, onForward }) {
-    const tapzones = document.createElement('div');
-    tapzones.className = 'tapzones export-hidden';
-    tapzones.setAttribute('aria-hidden', 'true');
-    const tzBack = document.createElement('div');
-    tzBack.className = 'tapzone tapzone--back';
-    const tzMid = document.createElement('div');
-    tzMid.className = 'tapzone tapzone--mid';
-    tzMid.style.pointerEvents = 'none';
-    const tzFwd = document.createElement('div');
-    tzFwd.className = 'tapzone tapzone--fwd';
-    tzBack.addEventListener('click', onBack);
-    tzFwd.addEventListener('click', onForward);
-    tapzones.append(tzBack, tzMid, tzFwd);
-    return tapzones;
-}
-
-const KEY_HANDLERS = {
-    ArrowRight: (deck) => deck._go(deck._index + 1, 'keyboard'),
-    PageDown:   (deck) => deck._go(deck._index + 1, 'keyboard'),
-    ' ':        (deck) => deck._go(deck._index + 1, 'keyboard'),
-    Spacebar:   (deck) => deck._go(deck._index + 1, 'keyboard'),
-    ArrowLeft:  (deck) => deck._go(deck._index - 1, 'keyboard'),
-    PageUp:     (deck) => deck._go(deck._index - 1, 'keyboard'),
-    Home:       (deck) => deck._go(0, 'keyboard'),
-    End:        (deck) => deck._go(deck._slides.length - 1, 'keyboard'),
-    r:          (deck) => deck._go(0, 'keyboard'),
-    R:          (deck) => deck._go(0, 'keyboard')
-};
-
-export function handleDeckKey(deck, e) {
-    const t = e.target;
-    if (t && (t.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName))) return false;
-    if (e.metaKey || e.ctrlKey || e.altKey) return false;
-    const fn = KEY_HANDLERS[e.key];
-    if (fn) { fn(deck); return true; }
-    if (/^[0-9]$/.test(e.key)) {
-        const n = e.key === '0' ? 9 : parseInt(e.key, 10) - 1;
-        if (n < deck._slides.length) { deck._go(n, 'keyboard'); return true; }
-    }
-    return false;
-}

package/dist/slides/deck-stage-state.js

@@ -1,81 +0,0 @@
-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/dist/slides/deck-stage-style.js

@@ -1,117 +0,0 @@
-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: #000; 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: rgba(255,255,255,0.72);
-      transition: background 140ms ease, color 140ms ease;
-      -webkit-tap-highlight-color: transparent;
-    }
-    .btn:hover { background: rgba(255,255,255,0.12); color: #fff; }
-    .btn:active { background: rgba(255,255,255,0.18); }
-    .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: rgba(255,255,255,0.72);
-    }
-    .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: rgba(255,255,255,0.88);
-      background: rgba(255,255,255,0.12);
-      border-radius: 4px;
-    }
-    .count {
-      font-variant-numeric: tabular-nums;
-      color: #fff; font-weight: 500;
-      padding: 0 8px; min-width: 42px;
-      text-align: center; font-size: 14px;
-    }
-    .count .sep { color: rgba(255,255,255,0.45); margin: 0 3px; font-weight: 400; }
-    .count .total { color: rgba(255,255,255,0.55); }
-    .divider { width: 1px; height: 14px; background: rgba(255,255,255,0.18); 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; }
-    }
-`;