flexdesk 0.16.0 → 0.17.0

package/src/tiling/bottom_panel_tabs.js

@@ -41,12 +41,15 @@
  * the panel itself is open is the embedder's (a tile it toggles), so the bus
  * event is the embedder's to hear too.
  *
- * The strip is never rebuilt: a select toggles classes on the same buttons, so
- * a click that lands while a tab is being selected keeps its target.
+ * The strip is `createTabs` (`../ui/components/tabs.js`, STORY-0048) under the
+ * `twm-bp` block: this file adds only what a bottom panel has and a strip does
+ * not — the pane's own store, the remembered tab, `persist`, and its event.
  */
 
+import { createTabs, TAB_LEVELS } from '../ui/components/tabs.js';
+
 /** Badge levels, worst last. Any other value draws the neutral badge. */
-export const BADGE_LEVELS = Object.freeze(['info', 'warning', 'alert']);
+export const BADGE_LEVELS = TAB_LEVELS;
 
 /**
  * @param {HTMLElement} container
@@ -61,108 +64,44 @@ export const BADGE_LEVELS = Object.freeze(['info', 'warning', 'alert']);
 export function createBottomPanelTabs(container, {
     panes = [], remember = null, store = null, eventBus = null, onSelect = null, initial = null,
 } = {}) {
-    const doc = container.ownerDocument;
-    const root = doc.createElement('div');
-    root.className = 'twm-bp';
-    const strip = doc.createElement('div');
-    strip.className = 'twm-bp__tabs';
-    strip.setAttribute('role', 'tablist');
-    const body = doc.createElement('div');
-    body.className = 'twm-bp__body';
-    root.append(strip, body);
-    container.appendChild(root);
-
     const byId = new Map(panes.map((pane) => [pane.id, pane]));
-    const tabs = new Map();
-    const mounted = new Map();
-    let active = null;
+    // A tab put in front by THIS FILE (the remembered one) is not a choice: it
+    // is neither written back nor allowed to beat a choice made meanwhile.
+    let restoring = false;
     let chosen = false;
     let destroyed = false;
-
-    for (const pane of panes) {
-        const tab = doc.createElement('button');
-        tab.type = 'button';
-        tab.className = 'twm-bp__tab';
-        tab.dataset.pane = pane.id;
-        tab.setAttribute('role', 'tab');
-        tab.setAttribute('aria-selected', 'false');
-        const label = doc.createElement('span');
-        label.className = 'twm-bp__label';
-        label.textContent = pane.label;
-        const badge = doc.createElement('span');
-        badge.className = 'twm-bp__badge';
-        badge.hidden = true;
-        tab.append(label, badge);
-        tab.addEventListener('click', () => api.select(pane.id));
-        strip.appendChild(tab);
-        tabs.set(pane.id, tab);
-    }
-
-    function mount(id) {
-        if (mounted.has(id)) return mounted.get(id);
-        const pane = byId.get(id);
-        const el = doc.createElement('div');
-        el.className = 'twm-bp-pane';
-        el.dataset.pane = id;
-        el.setAttribute('role', 'tabpanel');
-        el.hidden = id !== active;
-        body.appendChild(el);
-        const entry = { el, instance: null };
-        mounted.set(id, entry);
-        // ONE PANE THAT THROWS IS ONE EMPTY TAB, not a dead panel: the strip
-        // and every other pane go on working.
-        try {
-            entry.instance = pane.mount?.(el, store ? store(pane) : null, api) ?? null;
-        } catch (err) {
-            console.error(`[bottom-panel] pane "${id}" failed to mount`, err);
-        }
-        return entry;
-    }
-
-    function show(id) {
-        if (destroyed || !byId.has(id)) return false;
-        active = id;
-        for (const [key, tab] of tabs) {
-            const on = key === id;
-            tab.classList.toggle('twm-bp__tab--on', on);
-            tab.setAttribute('aria-selected', String(on));
-        }
-        for (const [key, entry] of mounted) entry.el.hidden = key !== id;
-        mount(id).instance?.onShow?.();
-        onSelect?.(id, byId.get(id));
-        return true;
-    }
+    // Eager panes and the first one shown mount inside `createTabs`, before it
+    // has answered; `mountPane` hands the strip (and `api.root`) over then, so
+    // a pane sees the whole api inside its `mount`.
+    let strip = null;
 
     const api = {
-        root,
+        root: null,
         /** Bring a tab to the front, and remember it. */
         select(id) {
-            if (!show(id)) return;
+            if (destroyed || !byId.has(id)) return;
             chosen = true;
-            try { remember?.write?.(id); } catch { /* storage refused: not ours to fix */ }
+            if (strip.active() !== id) { strip.select(id); return; }
+            // Already in front: asked for again (a click on it, a toast's
+            // "+N more"), so the pane is told again and the choice is
+            // remembered, as any select.
+            strip.instance(id)?.onShow?.();
+            remembered(id);
         },
         /** The tab in front, or null. */
-        active: () => active,
+        active: () => strip.active(),
         /** `count` on a tab, coloured by `level`; nothing at zero. */
-        setBadge(id, count, level = null) {
-            const badge = tabs.get(id)?.querySelector('.twm-bp__badge');
-            if (!badge) return;
-            const n = Number(count) || 0;
-            badge.hidden = n <= 0;
-            badge.textContent = n > 99 ? '99+' : String(Math.max(n, 0));
-            badge.className = 'twm-bp__badge'
-                + (BADGE_LEVELS.includes(level) ? ` twm-bp__badge--${level}` : '');
-        },
+        setBadge: (id, count, level = null) => strip.setBadge(id, count, level),
         /** A mounted pane's live instance, or null — how one tab hands work to
          *  another. `select` it first, which mounts it. */
-        instance: (id) => mounted.get(id)?.instance ?? null,
+        instance: (id) => strip.instance(id),
         /** The panel is on screen again (its tile re-mounted): tell the pane in front. */
         reshow() {
-            if (active) mounted.get(active)?.instance?.onShow?.();
+            strip.instance(strip.active())?.onShow?.();
         },
         /** Before the panel is torn down: every mounted pane saves. */
         async persist() {
-            for (const entry of mounted.values()) await entry.instance?.persist?.();
+            for (const instance of strip.instances()) await instance.persist?.();
         },
         /** Gone for good: panes save, then are destroyed; the bus is let go. */
         async destroy() {
@@ -170,29 +109,58 @@ export function createBottomPanelTabs(container, {
             await api.persist();
             destroyed = true;
             try { subscription?.dispose?.(); } catch { /* bus gone */ }
-            for (const entry of mounted.values()) {
-                try { entry.instance?.destroy?.(); } catch (err) {
-                    console.warn('[bottom-panel] pane destroy failed', err);
-                }
-            }
-            mounted.clear();
-            root.remove();
+            strip.destroy();
         },
     };
 
-    for (const pane of panes) if (pane.eager) mount(pane.id);
+    function remembered(id) {
+        onSelect?.(id, byId.get(id));
+        try { remember?.write?.(id); } catch { /* storage refused: not ours to fix */ }
+    }
 
+    strip = createTabs(container, {
+        block: 'twm-bp',
+        dataKey: 'pane',
+        items: panes.map(({ id, label, eager }) => ({ id, label, eager: !!eager })),
+        active: byId.has(initial) ? initial : panes[0]?.id,
+        mountPane: (item, el, tabs) => {
+            strip ??= tabs;
+            api.root ??= tabs.root;
+            const pane = byId.get(item.id);
+            return pane.mount?.(el, store ? store(pane) : null, api) ?? null;
+        },
+        onSelect: (id) => {
+            if (restoring) { onSelect?.(id, byId.get(id)); return; }
+            chosen = true;
+            remembered(id);
+        },
+        // A click on the tab already in front is a select here, as it always
+        // was: the pane hears onShow again and the choice is remembered.
+        onReselect: (id) => api.select(id),
+    });
+    api.root ??= strip.root;
+    if (strip.active() != null) onSelect?.(strip.active(), byId.get(strip.active()));
+
+    // The bus is the bottom panel's, not the strip's: a `bottompanel:show` for
+    // the tab already in front still tells its pane, which a strip does not.
     const subscription = eventBus?.on?.('bottompanel:show',
         (payload) => api.select(payload?.tab ?? panes[0]?.id)) ?? null;
 
-    show(byId.has(initial) ? initial : panes[0]?.id);
-
     if (remember?.read) {
         Promise.resolve()
             .then(() => remember.read())
             .then((saved) => {
-                if (chosen || destroyed) return;
-                if (byId.has(saved)) show(saved);
+                if (chosen || destroyed || !byId.has(saved)) return;
+                if (strip.active() === saved) {
+                    // Already in front: shown again, as it always was — the
+                    // pane hears onShow and the caller onSelect, nothing is
+                    // written back.
+                    strip.instance(saved)?.onShow?.();
+                    onSelect?.(saved, byId.get(saved));
+                    return;
+                }
+                restoring = true;
+                try { strip.select(saved); } finally { restoring = false; }
             })
             .catch(() => { /* nothing remembered */ });
     }

package/src/tiling/command_palette.js

@@ -65,7 +65,10 @@
  *   groupLabel the group's header, when the group is not a taxonomy kind
  *   kindLabel  the word drawn on the right, when the taxonomy's is wrong
  *   boost      added to the match score (an embedder's "recently opened")
- *   modes      which of 'split' / 'window' the row offers (key hints)
+ *   modes      which of 'split' / 'window' the row offers (key hints). For
+ *              a row whose kind is single (KindDef `single`) both are copy
+ *              verbs: the hints are drawn greyed with the taxonomy's reason,
+ *              and Ctrl/Shift+Enter on the row does nothing.
  *   drillLabel the Tab hint ("search rows"); Tab is offered only with it
  *   shortcut   a key binding drawn on the right
  *   verb       the Enter hint ('open' by default, 'run' for a command)
@@ -79,16 +82,33 @@
  */
 
 import { HelpModal } from '../help/help_modal.js';
+import { KEYBOARD_SHORTCUTS_TOPIC_ID, KEYMAP_SHORTCUTS, keyboardShortcutsTopic } from './keymap.js';
 
 const ROOT_ID = 'twm-cmdpal';
 
-// Non-entity commands surfaced in the palette's search results. They
-// carry an `action` so `commit()` runs them instead of opening a tile.
-const STATIC_COMMANDS = [
-    { kind: 'command', id: 'shortcuts', label: 'Keyboard shortcuts',
-      hint: 'Show all key bindings (?)', icon: 'keyboard', shortcut: '?', verb: 'run',
-      action: () => HelpModal.open('keyboard-shortcuts') },
-];
+/** The words a shortcuts table uses for the help action — the default `?` row's. */
+const HELP_ACTION = KEYMAP_SHORTCUTS.find((r) => r.keys === '?').action;
+
+/**
+ * Non-entity commands surfaced in the palette's search results. They carry an
+ * `action` so `commit()` runs them instead of opening a tile. `shortcuts` is
+ * the table the *Keyboard shortcuts* command shows — the shell passes the one
+ * its keymap's bindings produced (`keymapShortcuts`). The command's hint names
+ * the keys that open help in that table: `?` by default, `F9` when an embedder
+ * moved help there, none when no key opens it.
+ */
+function _staticCommands(shortcuts) {
+    const helpKeys = shortcuts.filter((r) => r.action === HELP_ACTION).map((r) => r.keys).join(' / ');
+    return [
+        { kind: 'command', id: 'shortcuts', label: 'Keyboard shortcuts',
+          hint: helpKeys ? `Show all key bindings (${helpKeys})` : 'Show all key bindings',
+          icon: 'keyboard', ...(helpKeys ? { shortcut: helpKeys } : {}), verb: 'run',
+          // The application's help may define the topic; when it does not, the
+          // window manager's own bindings are shown rather than an error.
+          action: () => HelpModal.open(KEYBOARD_SHORTCUTS_TOPIC_ID,
+                                       { fallback: keyboardShortcutsTopic(shortcuts) }) },
+    ];
+}
 
 const DEFAULT_GROUP_CAP = 4;
 const DEFAULT_COMMAND_MIN_CHARS = 2;
@@ -104,7 +124,9 @@ const MAX_ROWS = 200;
  *                     gesture. See `commit` for what it is for; omitted, the
  *                     palette behaves as it always has.
  *  @param chrome, layout, groupCap, empty, emptyLabel, commands,
- *         commandMinChars, drill, cache, tips, footerNote — C39, above. */
+ *         commandMinChars, drill, cache, tips, footerNote — C39, above.
+ *  @param shortcuts   the rows the built-in *Keyboard shortcuts* command lists
+ *                     (`{keys, action}`); `KEYMAP_SHORTCUTS` when omitted. */
 export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder = 'Search…',
                                        onPick = null,
                                        chrome = {}, layout = 'flat',
@@ -113,7 +135,8 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
                                        commands = null,
                                        commandMinChars = DEFAULT_COMMAND_MIN_CHARS,
                                        drill = null, cache = false,
-                                       tips = null, footerNote = '' }) {
+                                       tips = null, footerNote = '',
+                                       shortcuts = KEYMAP_SHORTCUTS }) {
     if (!taxonomy) throw new Error('createCommandPalette: a taxonomy is required');
     if (!catalog)  throw new Error('createCommandPalette: an entity catalog is required');
     const grouped = layout === 'grouped';
@@ -122,6 +145,9 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
     let cached = null;            // C39 `cache`: the last loaded catalogue
     let onClose = null;
 
+    /** A row whose kind exists once (KindDef `single`): no split, no window. */
+    const isSingle = (row) => !!row && taxonomy.isSingle(row.kind);
+
     const isOpen = () => !!overlay;
     const close = () => {
         if (!overlay) return;
@@ -132,6 +158,7 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
     };
     const toggle = () => { isOpen() ? close() : open(); };
     const invalidate = () => { cached = null; };
+    const staticCommands = _staticCommands(shortcuts);
 
     const open = async () => {
         if (overlay) return;
@@ -152,11 +179,22 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
         const chips = overlay.querySelectorAll('[data-shortcut]');
         const toggles = overlay.querySelectorAll('[data-toggle]');
 
-        // Reflect current panel state in toggle buttons.
-        for (const btn of toggles) {
+        // Reflect current panel state in toggle buttons. A panel the primary
+        // content withholds is a chip that says why and does nothing.
+        const syncToggle = (btn) => {
             const which = btn.dataset.toggle;
+            const { available, reason } = wm.getPanelAvailability(which);
             btn.classList.toggle('twm-chip--on', wm.isPanelOpen(which));
-        }
+            if (available) {
+                btn.removeAttribute('aria-disabled');
+                btn.removeAttribute('title');
+            } else {
+                btn.setAttribute('aria-disabled', 'true');
+                if (reason) btn.setAttribute('title', reason);
+                else btn.removeAttribute('title');
+            }
+        };
+        toggles.forEach(syncToggle);
 
         chips.forEach((btn) => btn.addEventListener('click', () => {
             const kind = btn.dataset.shortcut;
@@ -164,9 +202,8 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
             close();
         }));
         toggles.forEach((btn) => btn.addEventListener('click', () => {
-            const which = btn.dataset.toggle;
-            wm.togglePanel(which);
-            btn.classList.toggle('twm-chip--on', wm.isPanelOpen(which));
+            wm.togglePanel(btn.dataset.toggle);
+            syncToggle(btn);
         }));
 
         // Scoped-search state. Typing `<prefix>:` converts the prefix
@@ -296,8 +333,13 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
             const modes = Array.isArray(r.modes) ? r.modes : [];
             const acts = [`<span><kbd>Enter</kbd> ${_esc(verb)}</span>`];
             if (r.drillLabel && drill) acts.push(`<span><kbd>Tab</kbd> ${_esc(r.drillLabel)}</span>`);
-            if (modes.includes('split'))  acts.push('<span><kbd>Ctrl Enter</kbd> split</span>');
-            if (modes.includes('window')) acts.push('<span><kbd>Shift Enter</kbd> window</span>');
+            // A single kind has no copies: its split and window hints are
+            // drawn refused, with the reason, rather than offered.
+            const refused = isSingle(r)
+                ? ` class="twm-cmdpal__act--disabled" aria-disabled="true" title="${_esc(taxonomy.singleReason(r.kind))}"`
+                : '';
+            if (modes.includes('split'))  acts.push(`<span${refused}><kbd>Ctrl Enter</kbd> split</span>`);
+            if (modes.includes('window')) acts.push(`<span${refused}><kbd>Shift Enter</kbd> window</span>`);
             const side = r.shortcut
                 ? `<kbd class="twm-cmdpal__shortcut">${_esc(r.shortcut)}</kbd>`
                 : `<span class="twm-cmdpal__kind">${_esc(kindLabel(r))}</span>`;
@@ -411,6 +453,9 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
             const picked = filtered[i];
             if (!picked) return;
             if (picked.more) { showAll(picked.more); return; }
+            // Split and window open a COPY; a single kind refuses both, and the
+            // palette stays open on the row whose hints say why.
+            if (mode !== 'open' && isSingle(picked)) return;
             const pick = _public(picked);
             const how = { mode, scope: scope?.id ?? null };
             close();
@@ -668,7 +713,7 @@ export function createCommandPalette({ wm, api, taxonomy, catalog, placeholder =
                 try { extra = (commands() || []).map((c) => ({ kind: 'command', ...c })); }
                 catch (err) { console.warn('[cmdpal] commands() threw', err); }
             }
-            return [...STATIC_COMMANDS, ...extra];
+            return [...staticCommands, ...extra];
         };
         // Objects before commands in the grouped layout, so that a tie that
         // survives every rule goes to the object (first seen wins).

package/src/tiling/content_registry.js

@@ -12,7 +12,10 @@
  * `ctx` is the shell's ctx plus, per leaf, `leafId` and `setTitle(text)` —
  * rename the pane's chrome title from inside the content, at mount or any
  * time after; it survives repaints, and `setTitle(null)` gives the title back
- * to the tree (tile_renderer.js, C41).
+ * to the tree (tile_renderer.js, C41) — and `setChromeActions(specs)`, which
+ * replaces the pane's content buttons the same way: at mount (winning over a
+ * returned `chromeActions`) or any time after, surviving repaints, `null` or
+ * `[]` clearing them (tile_renderer.js, C42).
  *
  * ── ONE REGISTRY PER SHELL ────────────────────────────────────────────
  * This module used to hold a module-level `Map` plus a `register(kind, fn)`

package/src/tiling/desktops.js

@@ -4,7 +4,8 @@
  * Where that key actually lands is the embedder's business (see the host's
  * `resolvePath`); this module only names it.
  *
- * Each desktop = { id, label, tree (TileTree), windows ([]), panels }.
+ * Each desktop = { id, label, tree (TileTree), windows ([]), panels,
+ * panelShares }.
  * Switching desktops swaps the active tree under the renderer.
  */
 
@@ -47,6 +48,11 @@ function _makeDesktop(label, seed, panelDefaults = DEFAULT_PANEL_STATE) {
         // when it asked for nothing. Names are assigned by wm._canonicalize via
         // PANEL_TITLES.
         panels: { ...panelDefaults },
+        // Each panel's last share of the WM area along its axis, recorded by
+        // the WM when a splitter drag ends (and, for a panel not yet
+        // measured, when it rebuilds the panels). A side with none opens at
+        // the default ratio.
+        panelShares: {},
         // C40. Both unset is a desktop exactly as it always was.
         group: null,
         fixed: false,
@@ -159,6 +165,9 @@ export class DesktopManager {
                 id: d.id, label: d.label,
                 tree: d.tree.serialize(),
                 panels: { ...d.panels },
+                // Written only when a panel has been measured, like the C40
+                // keys below.
+                ...(Object.keys(d.panelShares).length ? { panelShares: { ...d.panelShares } } : {}),
                 // C40. Written only when set, so a blob without them is
                 // byte-for-byte the blob it always was.
                 ...(d.group ? { group: d.group } : {}),
@@ -182,6 +191,7 @@ export class DesktopManager {
             // this merge order avoids. The default only fills a key the stored
             // blob predates.
             panels: { ...m.panelDefaults, ...(raw.panels || {}) },
+            panelShares: { ...(raw.panelShares || {}) },
             group: raw.group || null,
             fixed: !!raw.fixed,
         }));