@esportsplus/ui 0.57.0 → 0.58.0

package/build/components/editor/workspace/model.js

@@ -1,7 +1,14 @@
 import { EditorDocument } from '../code/document.js';
+import { sanitize } from './keybindings.js';
+import { closable, compareKey, compareTab, order, place } from './tabs.js';
+const AUTO_SAVE_DELAY_MAX = 60_000;
+const AUTO_SAVE_DELAY_MIN = 100;
 const DEFAULTS = {
+    autoSave: 'off',
+    autoSaveDelay: 1000,
     explorerOpen: true,
     explorerSide: 'right',
+    keybindings: {},
     showWhitespace: false,
     wrapText: false
 };
@@ -64,6 +71,7 @@ class EditorWorkspaceModel {
     tabId = 0;
     tabs = [];
     unwatch;
+    watchers = new Set();
     watchWork = Promise.resolve();
     constructor(host, cwd = '', preferences = {}) {
         this.cwd = cwd;
@@ -71,6 +79,12 @@ class EditorWorkspaceModel {
         this.applyPreferences(preferences);
     }
     applyPreferences(preferences) {
+        if (preferences.autoSave === 'delay' || preferences.autoSave === 'focus' || preferences.autoSave === 'off') {
+            this.preferences.autoSave = preferences.autoSave;
+        }
+        if (typeof preferences.autoSaveDelay === 'number' && Number.isFinite(preferences.autoSaveDelay)) {
+            this.preferences.autoSaveDelay = Math.min(Math.max(Math.round(preferences.autoSaveDelay), AUTO_SAVE_DELAY_MIN), AUTO_SAVE_DELAY_MAX);
+        }
         for (let key of ['explorerOpen', 'showWhitespace', 'wrapText']) {
             if (typeof preferences[key] === 'boolean') {
                 this.preferences[key] = preferences[key];
@@ -79,6 +93,9 @@ class EditorWorkspaceModel {
         if (preferences.explorerSide === 'left' || preferences.explorerSide === 'right') {
             this.preferences.explorerSide = preferences.explorerSide;
         }
+        if (preferences.keybindings !== undefined) {
+            this.preferences.keybindings = sanitize(preferences.keybindings);
+        }
     }
     async authorize(kind, tabs, paths) {
         let changed = tabs.filter(dirty), revisions = new Map(tabs.map((tab) => [tab.id, tab.document.state.revision]));
@@ -117,6 +134,23 @@ class EditorWorkspaceModel {
         }
         return revisions;
     }
+    async closeTabs(tabs) {
+        if (!tabs.length) {
+            return true;
+        }
+        let paths = tabs.map((tab) => tab.path);
+        for (let path of paths) {
+            this.closed.set(path, (this.closed.get(path) ?? 0) + 1);
+        }
+        if (!(await this.authorize('close', tabs, paths))) {
+            return false;
+        }
+        for (let tab of tabs) {
+            this.removeTab(tab);
+        }
+        this.emit();
+        return true;
+    }
     desire(before, after) {
         for (let entry of before) {
             this.overlay.set(entry.path, null);
@@ -215,6 +249,32 @@ class EditorWorkspaceModel {
         this.active = found.id;
         this.emit();
     }
+    adopt(path, content, saved, missing = false) {
+        if (this.disposed || this.opening.has(path) || this.tabs.some((tab) => tab.path === path)) {
+            return;
+        }
+        let tab = {
+            document: new EditorDocument(content),
+            id: ++this.tabId,
+            missing,
+            path,
+            pinned: false,
+            preview: false,
+            saved,
+            scroll: { left: 0, top: 0 }
+        };
+        this.tabs.push(tab);
+        this.documents.set(tab.id, tab.document.subscribe((_, change) => {
+            if (change.textChanged && dirty(tab) !== this.dirty.get(tab.id)) {
+                if (dirty(tab)) {
+                    tab.preview = false;
+                }
+                this.emit();
+            }
+        }));
+        this.emit();
+        return tab;
+    }
     async close(path = this.state.active?.path) {
         if (!path) {
             return false;
@@ -231,6 +291,48 @@ class EditorWorkspaceModel {
         this.emit();
         return true;
     }
+    closeOthers(path = this.state.active?.path) {
+        return this.closeTabs(closable(this.tabs, 'others', path));
+    }
+    closeRight(path = this.state.active?.path) {
+        return this.closeTabs(closable(this.tabs, 'right', path));
+    }
+    closeSaved() {
+        return this.closeTabs(closable(this.tabs, 'saved'));
+    }
+    async compare(original, modified) {
+        let paths;
+        try {
+            paths = [workspacePath(original, this.cwd), workspacePath(modified, this.cwd)];
+        }
+        catch (error) {
+            this.status(`Compare failed: ${message(error)}`, true);
+            return;
+        }
+        let cwd = this.cwd, epoch = this.epoch, key = compareKey(paths[0], paths[1]), tab = this.tabs.find((tab) => tab.path === key);
+        if (!tab) {
+            let texts;
+            try {
+                texts = await Promise.all([this.host.read(cwd, paths[0]), this.host.read(cwd, paths[1])]);
+            }
+            catch (error) {
+                if (epoch === this.epoch) {
+                    this.status(`Compare failed: ${message(error)}`, true);
+                }
+                return;
+            }
+            if (epoch !== this.epoch || this.disposed) {
+                return;
+            }
+            tab = this.tabs.find((tab) => tab.path === key);
+            if (!tab) {
+                tab = compareTab(++this.tabId, { modified: texts[1], original: texts[0], paths });
+                this.tabs.push(tab);
+            }
+        }
+        this.activate(tab);
+        return tab;
+    }
     async copyPath(path) {
         try {
             await this.host.copyPath(this.cwd, workspacePath(path, this.cwd));
@@ -293,7 +395,13 @@ class EditorWorkspaceModel {
         this.documents.clear();
         this.listeners.clear();
     }
-    async open(value, line, column = 1) {
+    onWatch(listener) {
+        this.watchers.add(listener);
+        return () => {
+            this.watchers.delete(listener);
+        };
+    }
+    async open(value, line, column = 1, preview = false) {
         if (this.disposed) {
             return;
         }
@@ -321,12 +429,20 @@ class EditorWorkspaceModel {
                         id: ++this.tabId,
                         missing: false,
                         path,
+                        pinned: false,
+                        preview,
                         saved: content,
                         scroll: { left: 0, top: 0 }
                     };
-                    this.tabs.push(tab);
+                    let replaced = place(this.tabs, tab);
+                    if (replaced) {
+                        this.removeTab(replaced);
+                    }
                     this.documents.set(tab.id, tab.document.subscribe((_, change) => {
                         if (change.textChanged && dirty(tab) !== this.dirty.get(tab.id)) {
+                            if (dirty(tab)) {
+                                tab.preview = false;
+                            }
                             this.emit();
                         }
                     }));
@@ -351,6 +467,9 @@ class EditorWorkspaceModel {
         if (!tab || epoch !== this.epoch || !this.tabs.includes(tab)) {
             return;
         }
+        if (!preview) {
+            tab.preview = false;
+        }
         if (intent === this.openIntent) {
             this.active = tab.id;
             if (line !== undefined) {
@@ -371,6 +490,16 @@ class EditorWorkspaceModel {
         this.lastTarget = target.requestId;
         return this.open(target.path, target.line, target.column);
     }
+    pin(path, pinned = true) {
+        let tab = this.tabs.find((tab) => tab.path === path);
+        if (!tab || tab.pinned === pinned) {
+            return;
+        }
+        tab.pinned = pinned;
+        tab.preview = false;
+        order(this.tabs);
+        this.emit();
+    }
     async refresh(_paths) {
         if (this.disposed || !this.cwd) {
             return;
@@ -409,6 +538,9 @@ class EditorWorkspaceModel {
                 if (epoch !== this.epoch || intent !== this.refreshIntent || mutation !== this.mutation) {
                     return;
                 }
+                if (tab.compare) {
+                    continue;
+                }
                 tab.missing = !entries.has(tab.path);
                 if (dirty(tab) || tab.missing) {
                     this.emit();
@@ -496,7 +628,7 @@ class EditorWorkspaceModel {
     }
     save(tab = this.state.active) {
         return this.queue('Save', async () => {
-            if (!tab || !this.tabs.includes(tab)) {
+            if (!tab || !this.tabs.includes(tab) || tab.compare) {
                 return false;
             }
             if (!dirty(tab) && !tab.missing) {
@@ -607,6 +739,9 @@ class EditorWorkspaceModel {
                 let stop = await this.host.watch(this.cwd, (event) => {
                     if (epoch === this.epoch) {
                         this.watchWork = this.refresh(event.paths);
+                        for (let watcher of [...this.watchers]) {
+                            watcher(event);
+                        }
                     }
                 });
                 if (epoch !== this.epoch) {
@@ -675,6 +810,9 @@ class EditorWorkspaceModel {
             return true;
         });
     }
+    unpin(path) {
+        this.pin(path, false);
+    }
     async whenIdle() {
         for (;;) {
             let operations = this.operations, preferences = this.preferenceWrite, watch = this.watchWork;

package/build/components/editor/workspace/navigate.d.ts

@@ -0,0 +1,19 @@
+import { type Command } from '../code/keymap.js';
+import type { CodeController } from '../code/view.js';
+import type { FileTreeController, FileTreeJump } from '../tree/index.js';
+import type { EditorWorkspaceModel } from './model.js';
+import type hosted from './session.js';
+type Options = {
+    bindings: () => Readonly<Record<string, Command | null>> | undefined;
+    hosting: ReturnType<typeof hosted>;
+    model: EditorWorkspaceModel;
+    tree: () => FileTreeController | undefined;
+};
+type Step = 'moved' | 'none' | 'wrapped';
+declare function step(controller: CodeController, kind: FileTreeJump, backward: boolean): Step;
+declare const navigate: ({ bindings, hosting, model, tree }: Options) => {
+    connect(element: HTMLElement): () => void;
+    go: (kind: FileTreeJump, backward?: boolean) => Promise<boolean>;
+};
+export default navigate;
+export { step };

package/build/components/editor/workspace/navigate.js

@@ -0,0 +1,118 @@
+import { effect, root } from '@esportsplus/reactivity';
+import { mac } from '../../../shared/platform.js';
+import { keymap } from '../code/keymap.js';
+const COMMANDS = {
+    nextChange: ['change', false],
+    nextProblem: ['problem', false],
+    previousChange: ['change', true],
+    previousProblem: ['problem', true]
+};
+const PROBLEMS_WAIT = 1500;
+function caret(selection) {
+    return selection.direction === 'backward' ? selection.start : selection.end;
+}
+function code(controller) {
+    return !!controller && 'nextChange' in controller && 'nextProblem' in controller;
+}
+function step(controller, kind, backward) {
+    let before = caret(controller.document.selection), moved = kind === 'change'
+        ? (backward ? controller.previousChange() : controller.nextChange())
+        : (backward ? controller.previousProblem() : controller.nextProblem());
+    if (!moved) {
+        return 'none';
+    }
+    let after = caret(controller.document.selection);
+    return (backward ? after >= before : after <= before) ? 'wrapped' : 'moved';
+}
+function reported(controller) {
+    return new Promise((resolve) => {
+        let stop = root((dispose) => {
+            effect(() => {
+                let { errors, warnings } = controller.state.problems;
+                if (errors || warnings) {
+                    queueMicrotask(finish);
+                }
+            });
+            return dispose;
+        }), timer = setTimeout(finish, PROBLEMS_WAIT);
+        function finish() {
+            clearTimeout(timer);
+            stop();
+            resolve();
+        }
+    });
+}
+const navigate = ({ bindings, hosting, model, tree }) => {
+    let bound = null, resolve = keymap(mac());
+    async function go(kind, backward = false) {
+        let active = model.state.active, controller = active && (await hosting.whenShown(active)), left, result = 'none';
+        if (active && code(controller) && model.state.active === active) {
+            left = controller.document.selection;
+            result = step(controller, kind, backward);
+            if (result === 'moved') {
+                return true;
+            }
+        }
+        hosting.mark();
+        let explorer = tree(), element = explorer && (await (backward ? explorer.previous(kind) : explorer.next(kind)));
+        if (!element || element.id === active?.path) {
+            if (result === 'none') {
+                model.status(kind === 'change' ? 'No changes' : 'No problems');
+            }
+            return result !== 'none';
+        }
+        if (result === 'wrapped' && code(controller) && left) {
+            controller.select(left, false);
+        }
+        let tab = await model.open(element.id);
+        return !!tab && model.state.active === tab && arrive(tab, kind, backward);
+    }
+    async function arrive(tab, kind, backward) {
+        let controller = await hosting.whenShown(tab);
+        if (!code(controller) || model.state.active !== tab) {
+            return !!controller;
+        }
+        if (kind === 'change') {
+            let text = await hosting.loaded(tab.path);
+            if (text != null) {
+                controller.setBaseline(text);
+            }
+        }
+        else if (!controller.state.problems.errors && !controller.state.problems.warnings) {
+            await reported(controller);
+        }
+        if (model.state.active !== tab) {
+            return false;
+        }
+        controller.select({ start: backward ? 0 : controller.document.value.length }, false);
+        step(controller, kind, backward);
+        return true;
+    }
+    function keydown(event) {
+        if (event.defaultPrevented || event.isComposing) {
+            return;
+        }
+        let next = bindings();
+        if (next !== bound) {
+            bound = next;
+            resolve = keymap(mac(), next);
+        }
+        let command = resolve(event), jump = command && COMMANDS[command];
+        if (!jump) {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        void go(jump[0], jump[1]);
+    }
+    return {
+        connect(element) {
+            let listening = new AbortController();
+            element.addEventListener('keydown', keydown, { capture: true, signal: listening.signal });
+            return () => listening.abort();
+        },
+        go
+    };
+};
+export default navigate;
+export { step };

package/build/components/editor/workspace/session.d.ts

@@ -0,0 +1,29 @@
+import Decorations from '../tree/decorations.js';
+import type { FileTreeElement, FileTreeImportEntry, FileTreeSnapshot } from '../tree/index.js';
+import { type EditorWorkspaceModel, type WorkspaceSession, type WorkspaceTab } from './model.js';
+import type { WorkspaceEditorController } from './index.js';
+type Shown = {
+    controller: WorkspaceEditorController;
+    tab: WorkspaceTab;
+};
+declare function parse(value: WorkspaceSession | null | undefined): WorkspaceSession | null;
+declare const hosted: (model: EditorWorkspaceModel, current: () => Shown | undefined, delay?: number) => {
+    baseline(path: string): string | null | undefined;
+    connect(element: HTMLElement): () => void;
+    dispose(): void;
+    explorer: FileTreeSnapshot;
+    export: ((element: FileTreeElement) => import("../index.js").FileTreeExport | null) | undefined;
+    flush: () => void;
+    import: ((target: FileTreeElement | null, entries: readonly FileTreeImportEntry[]) => Promise<void>) | undefined;
+    loaded(path: string): Promise<string | null>;
+    mark: () => void;
+    marks: Decorations;
+    ready: () => boolean;
+    remember(tab: WorkspaceTab, controller: WorkspaceEditorController): void;
+    restore(): Promise<void>;
+    shown(tab: WorkspaceTab, controller: WorkspaceEditorController): void;
+    whenShown(tab: WorkspaceTab): Promise<WorkspaceEditorController | undefined>;
+};
+export default hosted;
+export { parse };
+export type { Shown };