flexdesk 0.17.15 → 0.17.16

package/src/tiles/tile_base.js

@@ -47,10 +47,13 @@ export class TileBase {
      * @param {{resolve: Function}} [options.dataSource] - Where this tile asks for its
      *        own rows. Handed down by `TileGrid`; absent for a grid whose data is
      *        broadcast with `setData()`, and then nothing ever calls `loadData()`.
+     * @param {boolean} [options.configOnDoubleClick=true] - A double-click on the
+     *        title strip (not on its buttons or an editable field in it) does what
+     *        the cogwheel does. False leaves the cogwheel as the only way in.
      */
     constructor({ id, grid, eventBus = null, config = {}, readonly = false,
                   headless = false, host = null, stateGuard = null,
-                  dataSource = null }) {
+                  dataSource = null, configOnDoubleClick = true }) {
         this.host = host;
         // THE TILE PULLS; THE GRID DOES NOT PUSH.
         //
@@ -74,6 +77,9 @@ export class TileBase {
         this.config = { ...this.getDefaultConfig(), ...config };
         this.readonly = readonly;
         this.headless = headless;
+        this.configOnDoubleClick = configOnDoubleClick;
+        /** STORY-0128. See `setConfiguring`. */
+        this._configuring = false;
         this.element = null;
         this.contentElement = null;
         this.chartInstance = null;
@@ -288,7 +294,8 @@ export class TileBase {
         if (this._disposed) return;
 
         this.element = document.createElement('div');
-        this.element.className = `tile${this.readonly ? ' tile--readonly' : ''}`;
+        this.element.className = `tile${this.readonly ? ' tile--readonly' : ''}`
+            + `${this._configuring ? ' tile--configuring' : ''}`;
 
         // Use StateGuard bypass if available to set dataset properties
         const stateGuard = this.stateGuard;
@@ -595,6 +602,17 @@ export class TileBase {
                 this._onConfigClick();
             });
 
+            // STORY-0128. The title strip's double-click is a second door to
+            // the cogwheel, through the same `_onConfigClick`. Not on a button
+            // in the strip (each has its own verb) and not on an editable
+            // field, where a double-click selects a word.
+            header.addEventListener('dblclick', (e) => {
+                if (!this.configOnDoubleClick || !configBtn) return;
+                if (e.target.closest?.('button, input, textarea, select, [contenteditable=""], [contenteditable="true"], .tile-menu-dropdown')) return;
+                e.stopPropagation();
+                this._onConfigClick();
+            });
+
             // "..." menu button + dropdown
             const menuBtn = header.querySelector('.tile-menu-btn');
             const menuDropdown = header.querySelector('.tile-menu-dropdown');
@@ -705,6 +723,34 @@ export class TileBase {
         if (this._menuHome && menu.parentNode !== this._menuHome) this._menuHome.appendChild(menu);
     }
 
+    /**
+     * Mark this tile as being configured, or clear the mark (STORY-0128).
+     * A convenience for `grid.setConfiguring(tile.id, on)`, which is the API:
+     * the grid holds the mark by tile id, so it outlives this tile instance
+     * (`setLayout` disposes and rebuilds every tile). A tile with no grid
+     * holds the mark itself.
+     *
+     * @param {boolean} [on=true]
+     */
+    setConfiguring(on = true) {
+        if (typeof this.grid?.setConfiguring === 'function') {
+            this.grid.setConfiguring(this.id, on);
+            return;
+        }
+        this._applyConfiguring(on);
+    }
+
+    /** Draw (or clear) the configuring mark. Called by the grid.
+     *  @param {boolean} on
+     *  @private */
+    _applyConfiguring(on) {
+        this._configuring = !!on;
+        this.element?.classList.toggle('tile--configuring', this._configuring);
+    }
+
+    /** True while this tile is marked as being configured. */
+    get isConfiguring() { return this._configuring; }
+
     /**
      * Handle config button click — highlight tile and emit config request.
      * @private

package/src/tiles/tile_grid.js

@@ -27,6 +27,8 @@ export class TileGrid {
      * @param {*} [options.scope=null] - The board's scope, a filter every tile
      *        follows (0.16.1); see `setScope`.
      * @param {Function} [options.onScopeChange] - `(scope)` after `setScope` changed it.
+     * @param {boolean} [options.configOnDoubleClick=true] - Whether a double-click
+     *        on a tile's title strip opens its config, as its cogwheel does (0.17.16).
      */
     constructor({ container, columns = 12, rowHeight = 80, gap = 16, eventBus = null,
                   showToolbar = true, readonly = false, onLayoutChange, onBeforeLayoutChange,
@@ -38,12 +40,19 @@ export class TileGrid {
                   host = null, stateGuard = null,
                   // Injected, never constructed here: the grid does not know what
                   // a binding is, only that a tile may have somewhere to ask.
-                  dataSource = null, scope = null, onScopeChange = null }) {
+                  dataSource = null, scope = null, onScopeChange = null,
+                  // STORY-0128. Handed to every tile: false turns off the
+                  // title strip's double-click to configure.
+                  configOnDoubleClick = true }) {
         this.host = host;
         this.scope = scope;
         this._onScopeChangeCallback = onScopeChange;
         this.stateGuard = stateGuard;
         this.dataSource = dataSource;
+        this.configOnDoubleClick = configOnDoubleClick;
+        /** STORY-0128. Ids of the tiles marked as being configured; see
+         *  `setConfiguring`. Kept by id so a rebuilt tile is marked again. */
+        this._configuringIds = new Set();
         this.container = container;
         this.columns = columns;
         this.rowHeight = rowHeight;
@@ -194,11 +203,14 @@ export class TileGrid {
             host: this.host,
             stateGuard: this.stateGuard,
             dataSource: this.dataSource,
+            configOnDoubleClick: this.configOnDoubleClick,
         });
 
         if (!tile) return null;
         // Before mount, so a tile's first render and first load already follow it.
         tile.scope = this.scope;
+        // STORY-0128. A tile rebuilt under a marked id (setLayout) is marked.
+        if (this._configuringIds.has(tileId)) tile._applyConfiguring(true);
 
         // Add to layout
         const layoutEntry = {
@@ -340,6 +352,35 @@ export class TileGrid {
         }));
     }
 
+    /**
+     * Mark a tile as being configured, or clear the mark (STORY-0128).
+     *
+     * A config request (cogwheel or title double-click) highlights the
+     * requesting tile with `tile--selected` and takes that highlight off every
+     * other tile: one selection per grid. An embedder that keeps a config
+     * window open per tile marks each such tile here instead. The mark
+     * (`tile--configuring`, drawn like the selection) is the embedder's alone:
+     * no config request clears it, and it is held by id, so a tile that
+     * `setLayout` rebuilds (or an id added later) is marked again. Clear it
+     * when that tile's config window closes.
+     *
+     * @param {string} tileId
+     * @param {boolean} [on=true]
+     */
+    setConfiguring(tileId, on = true) {
+        if (on) this._configuringIds.add(tileId);
+        else this._configuringIds.delete(tileId);
+        this.tiles.get(tileId)?._applyConfiguring(!!on);
+    }
+
+    /**
+     * @param {string} tileId
+     * @returns {boolean} Whether the tile is marked as being configured.
+     */
+    isConfiguring(tileId) {
+        return this._configuringIds.has(tileId);
+    }
+
     /**
      * Set layout and rebuild tiles.
      * @param {Array|Object} layout - Layout array or object with tiles property

package/src/tiling/kind_taxonomy.js

@@ -62,6 +62,20 @@
  *               a reason, and keeps the first of any duplicates a restored
  *               layout holds. The root kind cannot be single: every new
  *               pane, tab and desktop is seeded with it.
+ *
+ *   window?     `{ width?, height? }` — the initial size, in px, of a managed
+ *               window this kind opens in (`navigate(…, { dest: 'window' })`,
+ *               or always for `windowOnly`); clamped to the screen and to the
+ *               window's minimum (400 × 300) as any window is. Absent: the
+ *               window's default size (STORY-0127).
+ *   windowOnly? `true`: the kind lives in a managed window, never in a tile
+ *               — a tool, not a page. Every open path (navigate with any
+ *               `dest`, openInPrimary, openInLeaf, the tab and split verbs)
+ *               opens it in a window; its window never docks into a tile
+ *               (no Back to tile, maximise is geometric, no drag-to-dock); a
+ *               restored layout drops a tile tab of it, with one warning, and
+ *               a tab's history entry of it opens a window. Neither the root
+ *               nor a top-nav kind can be window-only (STORY-0127).
  */
 
 import { PANEL_OFFERED, PANEL_SIDES, readPanelOffer } from './panel_availability.js';
@@ -104,6 +118,26 @@ export function createTaxonomy({ kinds, root } = {}) {
             throw new TypeError(
                 `createTaxonomy: '${kind}'.single must be true or a prop name`);
         }
+        if (def.window != null) {
+            const w = def.window;
+            const bad = (v) => v != null && !(typeof v === 'number' && Number.isFinite(v) && v > 0);
+            if (typeof w !== 'object' || Array.isArray(w) || bad(w.width) || bad(w.height)) {
+                throw new TypeError(
+                    `createTaxonomy: '${kind}'.window must be { width?, height? } in positive px`);
+            }
+        }
+        if (def.windowOnly != null && typeof def.windowOnly !== 'boolean') {
+            throw new TypeError(`createTaxonomy: '${kind}'.windowOnly must be true or false`);
+        }
+        if (def.windowOnly && def.isTopNav) {
+            throw new Error(
+                `createTaxonomy: '${kind}' is a top-nav page and cannot be windowOnly — a page lives in tiles`);
+        }
+    }
+    if (kinds[root].windowOnly) {
+        throw new Error(
+            `createTaxonomy: the root kind '${root}' cannot be windowOnly — `
+            + 'every new pane, tab and desktop is seeded with it');
     }
     if (kinds[root].single) {
         throw new Error(
@@ -227,6 +261,15 @@ export function createTaxonomy({ kinds, root } = {}) {
         return `${kind}\u0000${v == null ? '' : String(v)}`;
     };
 
+    /** Whether `kind` lives in a managed window only (KindDef `windowOnly`). */
+    const isWindowOnly = (kind) => _kinds[kind]?.windowOnly === true;
+
+    /** The initial size of a window `kind` opens in (KindDef `window`), or null. */
+    const windowSize = (kind) => {
+        const w = _kinds[kind]?.window;
+        return w ? { width: w.width ?? null, height: w.height ?? null } : null;
+    };
+
     /** The sentence a refused copy verb shows for a single kind. */
     const singleReason = (kind) =>
         `${_kinds[kind]?.label || kind} is open once: use the one that is open`;
@@ -246,5 +289,7 @@ export function createTaxonomy({ kinds, root } = {}) {
         isSingle,
         instanceKey,
         singleReason,
+        isWindowOnly,
+        windowSize,
     });
 }

package/src/tiling/wm.js

@@ -303,8 +303,14 @@ export class WindowManager {
                 }
             }
         }
-        // A single kind is open once, whatever the saved layout says.
-        const deduped = this._dropDuplicateSingles();
+        // A window-only kind is never in a tile, and a single kind is open
+        // once, whatever the saved layout says.
+        const windowOnlyDropped = this._dropWindowOnlyTabs();
+        if (windowOnlyDropped.length) {
+            (this.logger ?? console).warn?.(`[wm] the saved layout held ${windowOnlyDropped.length} tile tab(s) `
+                + `of window-only kind(s) ${[...new Set(windowOnlyDropped)].join(', ')}; they open in a window when asked for`);
+        }
+        const deduped = this._dropDuplicateSingles() || windowOnlyDropped.length > 0;
         for (const d of this.desktops.desktops) this._canonicalize(d.tree, d);
         this.renderer.tree = this.desktops.active().tree;
         this.renderer.render();
@@ -581,20 +587,57 @@ export class WindowManager {
         return keys;
     }
 
+    /** Open a window-only kind (KindDef `windowOnly`) in its window — the one
+     *  that is open, or a new one — and say so; any other kind: false, and the
+     *  caller opens it where it asked (STORY-0127). */
+    _openWindowOnly(kind, props) {
+        if (!this.taxonomy.isWindowOnly?.(kind)) return false;
+        this._navigateWindow(kind, props);
+        return true;
+    }
+
+    /** Whether a window record holds a window-only kind: such a window never
+     *  docks into a tile (Back to tile, maximize, drag-to-dock). */
+    _holdsWindowOnly(rec) {
+        return !!this.taxonomy.isWindowOnly
+            && _windowTabSpecs(rec).some((t) => this.taxonomy.isWindowOnly(t?.kind));
+    }
+
+    /** A restored layout never holds a window-only kind in a tile: its tabs,
+     *  and its tabs archived under a page, go. Windows are not restored, so
+     *  the content simply opens in a window the next time it is asked for.
+     *  Returns the kinds of the tabs that went, one entry per tab. */
+    _dropWindowOnlyTabs() {
+        if (!this.taxonomy.isWindowOnly) return [];
+        const dropped = [];
+        this._pruneRestoredTabs((t) => {
+            if (!t || !this.taxonomy.isWindowOnly(t.kind)) return true;
+            dropped.push(t.kind);
+            return false;
+        });
+        return dropped;
+    }
+
     /** A restored layout keeps the FIRST instance of each single kind: later
      *  live tabs are dropped (the tile shows the tab that took the dropped
      *  one's place, or closes when it held nothing else), and so are later
      *  archived ones. Answers whether anything was dropped. */
     _dropDuplicateSingles() {
         const seen = new Set();
-        let dropped = false;
-        const keep = (t) => {
+        return this._pruneRestoredTabs((t) => {
             const k = t ? this._instanceKey(t.kind, t.props) : null;
             if (k == null) return true;
             if (seen.has(k)) return false;
             seen.add(k);
             return true;
-        };
+        });
+    }
+
+    /** Drop every tab of the restored layout `keep(tab)` refuses, in the
+     *  tiles and in their archived pages; a tile left empty closes (seeding a
+     *  content tile if none is left). Returns whether anything went. */
+    _pruneRestoredTabs(keep) {
+        let dropped = false;
         for (const d of this.desktops.desktops) {
             const tree = d.tree;
             for (const leaf of tree.leaves()) {
@@ -862,6 +905,9 @@ export class WindowManager {
         const tree = this._tree();
         const prior = tree.popActiveTabHistory?.(id);
         if (!prior || !prior.kind) return false;
+        // A window-only kind in a tab's history (a layout saved before the kind
+        // was one) goes back to its window, never into this tile.
+        if (this._openWindowOnly(prior.kind, prior.props || {})) return true;
         // A single kind opened elsewhere since this entry was pushed is
         // revealed there, not put back here as a second copy.
         if (this.revealInstance(prior.kind, prior.props || {})) return true;
@@ -973,6 +1019,7 @@ export class WindowManager {
      *  the leaf. Used by Backspace + breadcrumb segments + anything
      *  else that should walk WITHIN the tile rather than reset it. */
     navigateActiveTab(leafId, kind, props = {}) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         const tree = this._tree();
         const leaf = tree.get(leafId);
@@ -1029,6 +1076,7 @@ export class WindowManager {
      *  tab feature shipped), the behavior is identical to the old
      *  setLeafContent: one tab in, one tab out. */
     openInLeaf(leafId, kind, props = {}) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         const tree = this._tree();
         const leaf = tree.get(leafId);
@@ -1047,6 +1095,7 @@ export class WindowManager {
      *  previous mount, mounts the new kind into the same body element,
      *  and updates the window's title. */
     openInWindow(winId, kind, props = {}) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         const rec = this._windowToLeaf.get(winId);
         if (!rec) { this.openInPrimary(kind, props); return; }
@@ -1089,6 +1138,7 @@ export class WindowManager {
      *  If only panel tiles exist (or the tree is empty), spawn a new
      *  content leaf and canonicalize so the panels wrap it. */
     openInPrimary(kind, props = {}) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         const tree = this._tree();
         let leafId = tree.primaryLeafId();
@@ -1172,6 +1222,7 @@ export class WindowManager {
      *  pane in a split never dismounts the original). Returns the new
      *  leaf id, or null if the leaf can't be split. */
     splitLeafWith(leafId, dir, kind, props = {}, title = '') {
+        if (this._openWindowOnly(kind, props)) return null;
         if (this.revealInstance(kind, props)) return null;
         const tree = this._tree();
         leafId = this._contentLeafId(leafId);
@@ -1661,6 +1712,9 @@ export class WindowManager {
             canMaximize: true,
             canResize: true,
             modal: false,
+            // BUG-0053. The id is minted per window and never opens again, so
+            // geometry saved under it could never be restored.
+            persistGeometry: false,
             // C15. Dropping a promoted window on a tile PUTS IT BACK — as that
             // tile's content, as a split of it, or as one of its tabs. Off
             // unless the embedder asked, because it changes what a drag to an
@@ -2273,6 +2327,9 @@ export class WindowManager {
         // false lets the geometric maximise happen instead — the answer every
         // other window manager gives a window with nowhere to go back to.
         if (!rec) return false;
+        // A window-only kind has no tile to go back to (STORY-0127): the
+        // geometric maximise happens instead.
+        if (this._holdsWindowOnly(rec)) return false;
         const tree = this.desktops.desktops[rec.desktopIdx]?.tree;
         const home = rec.homeLeafId ? tree?.get(rec.homeLeafId) : null;
         if (home && home.kind === 'leaf') {
@@ -3138,6 +3195,7 @@ export class WindowManager {
     dockWindowInto(windowId, target) {
         const rec = this._windowToLeaf.get(windowId);
         if (!rec || !target?.leafId) return false;
+        if (this._holdsWindowOnly(rec)) return false;   // never into a tile (STORY-0127)
         rec._dock = { ...target };
         rec._demoting = true;
         try { rec.window.close({ force: true }); }
@@ -3343,7 +3401,8 @@ export class WindowManager {
             e.preventDefault();
             const rec = this._windowToLeaf.get(winId);
             if (!rec) return;
-            const items = [
+            // A window-only kind's window has no tile to go back to
+            const items = this._holdsWindowOnly(rec) ? [] : [
                 { label: 'Back to tile', icon: 'close_fullscreen', action: 'back' },
             ];
             // C40. Never onto a fixed desktop — `moveWindowToDesktop` refuses.
@@ -4223,6 +4282,9 @@ export class WindowManager {
 
     /** The routing behind `navigate`, for a kind known to be registered. */
     _route(kind, props, opts) {
+        // A window-only kind (KindDef `windowOnly`) opens in a window, whatever
+        // the destination asked for.
+        if (this._openWindowOnly(kind, props)) return;
         const { ctx = null, transient = false } = opts;
         // Append the tab but stay where you are. Only meaningful with `newTab`.
         const background = !!opts.background;
@@ -4297,6 +4359,10 @@ export class WindowManager {
      *  source leaf — closing the window just disposes the content. */
     _navigateWindow(kind, props) {
         if (this.revealInstance(kind, props)) return;
+        const size = this.taxonomy.windowSize?.(kind);
+        // A window-only kind's window maximises as any window does and never
+        // snaps into a tile (STORY-0127)
+        const dockable = !this.taxonomy.isWindowOnly?.(kind);
         const winId = `twm-mw-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 5)}`;
         const contentEl = document.createElement('div');
         contentEl.className = 'twm-window-content';
@@ -4309,17 +4375,22 @@ export class WindowManager {
             title: mountInfo?.title || title,
             icon: 'web_asset',
             content: contentEl,
+            ...(size?.width ? { defaultWidth: size.width } : {}),
+            ...(size?.height ? { defaultHeight: size.height } : {}),
             canMinimize: true,
             canMaximize: true,
             canResize: true,
             modal: false,
+            // BUG-0053. The id is minted per window and never opens again, so
+            // geometry saved under it could never be restored.
+            persistGeometry: false,
             // C15, and this is the SECOND of the two places the WM builds a
             // window. Alt+N and "Open in new window" produce a window that is
             // every bit as dockable as a promoted one, and a window that can be
             // dragged onto a tile in one case and not the other is a rule
             // nobody can learn.
-            snap: this.snapPromotion,
-            snapController: this.snapPromotion ? this._snapController() : null,
+            snap: dockable && this.snapPromotion,
+            snapController: dockable && this.snapPromotion ? this._snapController() : null,
             // R1. THE PANE IS A BOX WITH `overflow: hidden`. A window contained
             // to one (C21) cannot be dragged a single pixel outside it, so
             // "drag a window from one tile to another" — the gesture all three
@@ -4337,9 +4408,11 @@ export class WindowManager {
             // harder. So the maximize button docks — and the separate demote
             // button the WM used to inject beside it is gone, because two
             // buttons for one verb is how you get a chrome nobody reads.
-            onMaximize: () => this.bringBackWindow(winId),
-            maximizeIcon: 'close_fullscreen',
-            maximizeTitle: 'Back to tile',
+            ...(dockable ? {
+                onMaximize: () => this.bringBackWindow(winId),
+                maximizeIcon: 'close_fullscreen',
+                maximizeTitle: 'Back to tile',
+            } : {}),
             onClose: () => this._onManagedWindowClosed(winId, mountInfo),
         });
         // DECORATED ONCE, below, after the record exists. It was called here as
@@ -4425,6 +4498,7 @@ export class WindowManager {
      *  routing) but uses `appendLeafTab` so the existing content
      *  stays in place as a tab. */
     openInTabFromContext(ctx, kind, props = {}, transient = false, background = false) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         // Managed-window content: just open in the window — managed
         // windows aren't tabbed (one window = one content).
@@ -4461,6 +4535,7 @@ export class WindowManager {
      *  "Add row" button, which passes no ctx) reliably lands as a sibling
      *  tab in the main tile rather than swapping its content. */
     openInTabInPrimary(kind, props = {}, transient = false, background = false) {
+        if (this._openWindowOnly(kind, props)) return;
         if (this.revealInstance(kind, props)) return;
         const tree = this._tree();
         const leafId = tree.primaryLeafId();