@bpmnkit/plugins 0.0.8

package/dist/storage/index.js

@@ -0,0 +1,201 @@
+import { Bpmn } from "@bpmnkit/core";
+import { showConfirmDialog, showInputDialog } from "./dialog.js";
+import { exportProjectAsZip } from "./export.js";
+import { StorageApi } from "./storage-api.js";
+export { StorageApi } from "./storage-api.js";
+export { showInputDialog, showConfirmDialog } from "./dialog.js";
+/**
+ * Creates an IndexedDB-backed storage plugin.
+ *
+ * Integrates with the main menu plugin to provide workspace/project navigation
+ * via drill-down menus. Auto-saves BPMN changes with a 500 ms debounce.
+ * Persists the last-opened project across page refreshes.
+ */
+export function createStoragePlugin(options) {
+    const storageApi = new StorageApi(options);
+    let offDiagramChange;
+    let offChange;
+    function getProjectLabel(projectId) {
+        const workspaces = storageApi.getCachedWorkspaces();
+        for (const ws of workspaces) {
+            const projects = storageApi.getCachedProjects(ws.id);
+            const p = projects.find((pr) => pr.id === projectId);
+            if (p)
+                return `${ws.name} / ${p.name}`;
+        }
+        return "Project";
+    }
+    function buildWorkspaceDrillItems(onProjectClick) {
+        const workspaces = storageApi.getCachedWorkspaces();
+        if (workspaces.length === 0) {
+            return [
+                {
+                    type: "info",
+                    text: "No workspaces yet",
+                    actionLabel: "Create",
+                    onAction: () => {
+                        void handleCreateWorkspace(onProjectClick);
+                    },
+                },
+            ];
+        }
+        const items = [];
+        for (const ws of workspaces) {
+            items.push({
+                type: "drill",
+                label: ws.name,
+                items: () => buildProjectDrillItems(ws, onProjectClick),
+            });
+        }
+        items.push({ type: "separator" });
+        items.push({
+            label: "New Workspace…",
+            onClick: () => void handleCreateWorkspace(onProjectClick),
+        });
+        return items;
+    }
+    function buildProjectDrillItems(ws, onProjectClick) {
+        const projects = storageApi.getCachedProjects(ws.id);
+        const items = [];
+        if (projects.length === 0) {
+            items.push({ type: "info", text: "No projects yet" });
+        }
+        for (const proj of projects) {
+            items.push({
+                label: proj.name,
+                onClick: () => onProjectClick(ws, proj),
+            });
+        }
+        items.push({ type: "separator" });
+        items.push({
+            label: "New Project…",
+            onClick: () => void handleCreateProject(ws, onProjectClick),
+        });
+        items.push({
+            label: "Rename Workspace…",
+            onClick: async () => {
+                const newName = await showInputDialog({ title: "Rename workspace", defaultValue: ws.name });
+                if (newName)
+                    void storageApi.renameWorkspace(ws.id, newName);
+            },
+        });
+        items.push({
+            label: "Delete Workspace",
+            onClick: async () => {
+                const ok = await showConfirmDialog({
+                    title: "Delete workspace",
+                    message: `Delete workspace "${ws.name}" and all its data?`,
+                    danger: true,
+                });
+                if (ok)
+                    void storageApi.deleteWorkspace(ws.id);
+            },
+        });
+        return items;
+    }
+    async function handleCreateWorkspace(onProjectClick) {
+        const name = await showInputDialog({ title: "New workspace", placeholder: "Workspace name" });
+        if (!name)
+            return;
+        await storageApi.createWorkspace(name);
+    }
+    async function handleCreateProject(ws, onProjectClick) {
+        const name = await showInputDialog({ title: "New project", placeholder: "Project name" });
+        if (!name)
+            return;
+        await storageApi.createProject(ws.id, name);
+    }
+    function buildDynamicItems() {
+        const currentProjectId = storageApi.getCurrentProjectId();
+        const items = [];
+        if (currentProjectId) {
+            items.push({
+                type: "info",
+                text: getProjectLabel(currentProjectId),
+                actionLabel: "Leave",
+                onAction: () => {
+                    storageApi.setCurrentProjectId(null);
+                    options.mainMenu.api.setTitle(options.initialTitle ?? "");
+                    options.onLeaveProject?.();
+                },
+            });
+            const currentFileId = storageApi.getCurrentFileId();
+            if (currentFileId && options.onRenameCurrentFile) {
+                const onRename = options.onRenameCurrentFile;
+                items.push({
+                    label: "Rename current file\u2026",
+                    onClick: async () => {
+                        const newName = await showInputDialog({ title: "Rename file" });
+                        if (!newName)
+                            return;
+                        await storageApi.renameFile(currentFileId, newName);
+                        onRename(currentFileId, newName);
+                    },
+                });
+            }
+            items.push({
+                label: "Export Project\u2026",
+                onClick: () => void exportProjectAsZip(storageApi),
+            });
+            items.push({ type: "separator" });
+        }
+        items.push({
+            type: "drill",
+            label: "Open Project",
+            items: () => buildWorkspaceDrillItems((ws, proj) => {
+                void storageApi.openProject(proj.id).then(() => {
+                    options.mainMenu.api.setTitle(`${ws.name} / ${proj.name}`);
+                });
+            }),
+        });
+        items.push({
+            type: "drill",
+            label: "Save All to Project…",
+            items: () => buildWorkspaceDrillItems((ws, proj) => {
+                const tabs = options.getOpenTabs();
+                void storageApi.saveTabsToProject(proj.id, ws.id, tabs).then(() => {
+                    options.mainMenu.api.setTitle(`${ws.name} / ${proj.name}`);
+                });
+            }),
+        });
+        items.push({ type: "separator" });
+        return items;
+    }
+    return {
+        name: "storage",
+        api: storageApi,
+        install(canvasApi) {
+            // Register dynamic items supplier
+            options.mainMenu.api.setDynamicItems(buildDynamicItems);
+            // Load caches so getCachedWorkspaces / getRecentProjects work immediately.
+            // Do NOT auto-restore the last project — always show the welcome screen.
+            void storageApi.initialize().then(() => {
+                storageApi.setCurrentProjectId(null);
+                options.onReady?.();
+            });
+            // Rebuild dynamic items next time menu opens when data changes
+            offChange = storageApi.onChange(() => {
+                options.mainMenu.api.setDynamicItems(buildDynamicItems);
+            });
+            // Subscribe to diagram:change and diagram:load for auto-save.
+            // diagram:load fires when XML is programmatically loaded (e.g. AI apply, history restore).
+            const anyOn = canvasApi.on.bind(canvasApi);
+            function onDiagramUpdate(rawDefs) {
+                const currentId = storageApi.getCurrentFileId();
+                if (!currentId)
+                    return;
+                const defs = rawDefs;
+                const xml = Bpmn.export(defs);
+                storageApi.scheduleSave(currentId, xml);
+            }
+            offDiagramChange = anyOn("diagram:change", onDiagramUpdate);
+            anyOn("diagram:load", onDiagramUpdate);
+        },
+        uninstall() {
+            offDiagramChange?.();
+            offChange?.();
+            void storageApi.flush();
+        },
+    };
+}
+//# sourceMappingURL=index.js.map

package/dist/storage/sidebar.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sidebar.d.ts.map

package/dist/storage/sidebar.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=sidebar.js.map

package/dist/storage/storage-api.d.ts

@@ -0,0 +1,76 @@
+import type { FileRecord, FileType, ProjectRecord, WorkspaceRecord } from "./types.js";
+export interface StorageApiOptions {
+    /** Called when the user opens a file from the menu. */
+    onOpenFile(file: FileRecord, content: string): void;
+}
+export declare class StorageApi {
+    private readonly _options;
+    private _currentFileId;
+    private _currentProjectId;
+    private readonly _autoSave;
+    private _listeners;
+    private _workspaces;
+    private _projects;
+    constructor(_options: StorageApiOptions);
+    /** Load caches and restore last-opened project. Returns the project files if restoring. */
+    initialize(): Promise<FileRecord[] | null>;
+    getCurrentProjectId(): string | null;
+    setCurrentProjectId(id: string | null): void;
+    getCachedWorkspaces(): WorkspaceRecord[];
+    getCachedProjects(wsId: string): ProjectRecord[];
+    getProjectName(id: string): string | null;
+    /** Open a project: sets it as current and returns its files. */
+    openProject(id: string): Promise<FileRecord[]>;
+    /**
+     * Save the given open tabs as files in a project, creating new file records
+     * (or updating existing ones by matching name+type) and activating the project.
+     */
+    saveTabsToProject(projectId: string, workspaceId: string, tabs: Array<{
+        tabId: string;
+        name: string;
+        type: FileType;
+        content: string;
+    }>): Promise<string[]>;
+    createWorkspace(name: string): Promise<WorkspaceRecord>;
+    getWorkspaces(): Promise<WorkspaceRecord[]>;
+    renameWorkspace(id: string, name: string): Promise<void>;
+    deleteWorkspace(id: string): Promise<void>;
+    createProject(workspaceId: string, name: string): Promise<ProjectRecord>;
+    getProjects(workspaceId: string): Promise<ProjectRecord[]>;
+    renameProject(id: string, name: string): Promise<void>;
+    deleteProject(id: string): Promise<void>;
+    private _deleteProjectData;
+    createFile(projectId: string, workspaceId: string, name: string, type: FileType, content: string): Promise<FileRecord>;
+    getFiles(projectId: string): Promise<FileRecord[]>;
+    getSharedFiles(): Promise<FileRecord[]>;
+    getFileContent(fileId: string): Promise<string | null>;
+    renameFile(id: string, name: string): Promise<void>;
+    setFileShared(id: string, isShared: boolean): Promise<void>;
+    deleteFile(id: string): Promise<void>;
+    openFile(fileId: string): Promise<void>;
+    getCurrentFileId(): string | null;
+    setCurrentFileId(id: string | null): void;
+    getCurrentContext(): {
+        projectId: string;
+        fileId: string;
+    } | null;
+    scheduleSave(fileId: string, content: string): void;
+    flush(): Promise<void>;
+    private _persistContent;
+    private _updateProjectCacheTimestamp;
+    /** Returns the MRU file-ID list for a project (most recent first). */
+    getMru(projectId: string): Promise<string[]>;
+    /** Pushes a file ID to the front of the project's MRU list (deduplicates, max 50). */
+    pushMruFile(projectId: string, fileId: string): Promise<void>;
+    /**
+     * Returns up to 10 projects sorted by most recently saved (descending).
+     * Uses the in-memory cache — call after `initialize()` completes.
+     */
+    getRecentProjects(): Array<{
+        project: ProjectRecord;
+        workspace: WorkspaceRecord;
+    }>;
+    onChange(cb: () => void): () => void;
+    private _notify;
+}
+//# sourceMappingURL=storage-api.d.ts.map

package/dist/storage/storage-api.js

@@ -0,0 +1,342 @@
+import { AutoSave } from "./auto-save.js";
+import { db } from "./db.js";
+const CURRENT_PROJECT_KEY = "bpmn-sdk-current-project";
+function now() {
+    return Date.now();
+}
+function newId() {
+    return crypto.randomUUID();
+}
+export class StorageApi {
+    _options;
+    _currentFileId = null;
+    _currentProjectId;
+    _autoSave;
+    _listeners = [];
+    // In-memory caches for synchronous menu building
+    _workspaces = [];
+    _projects = new Map();
+    constructor(_options) {
+        this._options = _options;
+        this._currentProjectId = localStorage.getItem(CURRENT_PROJECT_KEY);
+        this._autoSave = new AutoSave(async (fileId, content) => {
+            await this._persistContent(fileId, content);
+            this._notify();
+        });
+    }
+    /** Load caches and restore last-opened project. Returns the project files if restoring. */
+    async initialize() {
+        this._workspaces = await db.workspaces.orderBy("name").toArray();
+        for (const ws of this._workspaces) {
+            const projects = await db.projects.where("workspaceId").equals(ws.id).sortBy("name");
+            this._projects.set(ws.id, projects);
+        }
+        if (this._currentProjectId) {
+            const project = await db.projects.get(this._currentProjectId);
+            if (project) {
+                return db.files.where("projectId").equals(this._currentProjectId).sortBy("name");
+            }
+            // Project no longer exists — clear persisted id
+            this.setCurrentProjectId(null);
+        }
+        return null;
+    }
+    getCurrentProjectId() {
+        return this._currentProjectId;
+    }
+    setCurrentProjectId(id) {
+        this._currentProjectId = id;
+        if (id === null) {
+            localStorage.removeItem(CURRENT_PROJECT_KEY);
+        }
+        else {
+            localStorage.setItem(CURRENT_PROJECT_KEY, id);
+        }
+    }
+    getCachedWorkspaces() {
+        return this._workspaces;
+    }
+    getCachedProjects(wsId) {
+        return this._projects.get(wsId) ?? [];
+    }
+    getProjectName(id) {
+        for (const projects of this._projects.values()) {
+            const p = projects.find((pr) => pr.id === id);
+            if (p)
+                return p.name;
+        }
+        return null;
+    }
+    /** Open a project: sets it as current and returns its files. */
+    async openProject(id) {
+        this.setCurrentProjectId(id);
+        const files = await db.files.where("projectId").equals(id).sortBy("name");
+        for (const file of files) {
+            const content = await this.getFileContent(file.id);
+            if (content !== null) {
+                this._options.onOpenFile(file, content);
+            }
+        }
+        this._notify();
+        return files;
+    }
+    /**
+     * Save the given open tabs as files in a project, creating new file records
+     * (or updating existing ones by matching name+type) and activating the project.
+     */
+    async saveTabsToProject(projectId, workspaceId, tabs) {
+        const existingFiles = await db.files.where("projectId").equals(projectId).toArray();
+        const fileIdByKey = new Map();
+        for (const f of existingFiles) {
+            fileIdByKey.set(`${f.name}::${f.type}`, f.id);
+        }
+        const tabIds = [];
+        for (const tab of tabs) {
+            const key = `${tab.name}::${tab.type}`;
+            const existingId = fileIdByKey.get(key);
+            if (existingId) {
+                await this._persistContent(existingId, tab.content);
+                await db.files.update(existingId, { updatedAt: now() });
+                tabIds.push(existingId);
+            }
+            else {
+                const file = await this.createFile(projectId, workspaceId, tab.name, tab.type, tab.content);
+                tabIds.push(file.id);
+            }
+        }
+        this.setCurrentProjectId(projectId);
+        this._notify();
+        return tabIds;
+    }
+    // ─── Workspaces ──────────────────────────────────────────────────────────────
+    async createWorkspace(name) {
+        const ws = { id: newId(), name, createdAt: now(), updatedAt: now() };
+        await db.workspaces.add(ws);
+        this._workspaces = [...this._workspaces, ws].sort((a, b) => a.name.localeCompare(b.name));
+        this._notify();
+        return ws;
+    }
+    async getWorkspaces() {
+        return db.workspaces.orderBy("name").toArray();
+    }
+    async renameWorkspace(id, name) {
+        await db.workspaces.update(id, { name, updatedAt: now() });
+        this._workspaces = this._workspaces.map((w) => (w.id === id ? { ...w, name } : w));
+        this._workspaces.sort((a, b) => a.name.localeCompare(b.name));
+        this._notify();
+    }
+    async deleteWorkspace(id) {
+        const projects = await db.projects.where("workspaceId").equals(id).toArray();
+        for (const p of projects)
+            await this._deleteProjectData(p.id);
+        await db.workspaces.delete(id);
+        this._workspaces = this._workspaces.filter((w) => w.id !== id);
+        this._projects.delete(id);
+        if (this._currentFileId !== null) {
+            const f = await db.files.get(this._currentFileId);
+            if (!f || f.workspaceId === id)
+                this._currentFileId = null;
+        }
+        if (this._currentProjectId) {
+            const p = await db.projects.get(this._currentProjectId);
+            if (!p || p.workspaceId === id)
+                this.setCurrentProjectId(null);
+        }
+        this._notify();
+    }
+    // ─── Projects ────────────────────────────────────────────────────────────────
+    async createProject(workspaceId, name) {
+        const p = { id: newId(), workspaceId, name, createdAt: now(), updatedAt: now() };
+        await db.projects.add(p);
+        const existing = this._projects.get(workspaceId) ?? [];
+        const updated = [...existing, p].sort((a, b) => a.name.localeCompare(b.name));
+        this._projects.set(workspaceId, updated);
+        this._notify();
+        return p;
+    }
+    async getProjects(workspaceId) {
+        return db.projects.where("workspaceId").equals(workspaceId).sortBy("name");
+    }
+    async renameProject(id, name) {
+        await db.projects.update(id, { name, updatedAt: now() });
+        for (const [wsId, projects] of this._projects) {
+            const idx = projects.findIndex((p) => p.id === id);
+            if (idx !== -1) {
+                const updated = projects.map((p) => (p.id === id ? { ...p, name } : p));
+                updated.sort((a, b) => a.name.localeCompare(b.name));
+                this._projects.set(wsId, updated);
+                break;
+            }
+        }
+        this._notify();
+    }
+    async deleteProject(id) {
+        await this._deleteProjectData(id);
+        if (this._currentProjectId === id)
+            this.setCurrentProjectId(null);
+        this._notify();
+    }
+    async _deleteProjectData(projectId) {
+        const files = await db.files.where("projectId").equals(projectId).toArray();
+        for (const f of files) {
+            await db.fileContents.delete(f.id);
+            if (this._currentFileId === f.id)
+                this._currentFileId = null;
+        }
+        await db.files.where("projectId").equals(projectId).delete();
+        await db.projects.delete(projectId);
+        // Update cache
+        for (const [wsId, projects] of this._projects) {
+            if (projects.some((p) => p.id === projectId)) {
+                this._projects.set(wsId, projects.filter((p) => p.id !== projectId));
+                break;
+            }
+        }
+    }
+    // ─── Files ───────────────────────────────────────────────────────────────────
+    async createFile(projectId, workspaceId, name, type, content) {
+        const file = {
+            id: newId(),
+            projectId,
+            workspaceId,
+            name,
+            type,
+            isShared: false,
+            gitPath: null,
+            createdAt: now(),
+            updatedAt: now(),
+        };
+        const fc = { fileId: file.id, content, version: 1 };
+        await db.files.add(file);
+        await db.fileContents.add(fc);
+        this._notify();
+        return file;
+    }
+    async getFiles(projectId) {
+        return db.files.where("projectId").equals(projectId).sortBy("name");
+    }
+    async getSharedFiles() {
+        return db.files.filter((f) => f.isShared).toArray();
+    }
+    async getFileContent(fileId) {
+        const fc = await db.fileContents.get(fileId);
+        return fc?.content ?? null;
+    }
+    async renameFile(id, name) {
+        await db.files.update(id, { name, updatedAt: now() });
+        this._notify();
+    }
+    async setFileShared(id, isShared) {
+        await db.files.update(id, { isShared, updatedAt: now() });
+        this._notify();
+    }
+    async deleteFile(id) {
+        await db.fileContents.delete(id);
+        await db.files.delete(id);
+        if (this._currentFileId === id)
+            this._currentFileId = null;
+        this._notify();
+    }
+    // ─── Navigation ──────────────────────────────────────────────────────────────
+    async openFile(fileId) {
+        const file = await db.files.get(fileId);
+        if (!file)
+            return;
+        const content = await this.getFileContent(fileId);
+        if (content === null)
+            return;
+        this._currentFileId = fileId;
+        this._options.onOpenFile(file, content);
+        this._notify();
+    }
+    getCurrentFileId() {
+        return this._currentFileId;
+    }
+    setCurrentFileId(id) {
+        this._currentFileId = id;
+    }
+    getCurrentContext() {
+        if (this._currentProjectId === null || this._currentFileId === null)
+            return null;
+        return { projectId: this._currentProjectId, fileId: this._currentFileId };
+    }
+    // ─── Auto-save ───────────────────────────────────────────────────────────────
+    scheduleSave(fileId, content) {
+        this._autoSave.schedule(fileId, content);
+    }
+    async flush() {
+        await this._autoSave.flush();
+    }
+    async _persistContent(fileId, content) {
+        const existing = await db.fileContents.get(fileId);
+        if (existing) {
+            await db.fileContents.update(fileId, { content, version: existing.version + 1 });
+        }
+        else {
+            await db.fileContents.add({ fileId, content, version: 1 });
+        }
+        const ts = now();
+        await db.files.update(fileId, { updatedAt: ts });
+        // Bump project's updatedAt so it sorts correctly in getRecentProjects
+        if (this._currentProjectId !== null) {
+            await db.projects.update(this._currentProjectId, { updatedAt: ts });
+            this._updateProjectCacheTimestamp(this._currentProjectId, ts);
+        }
+    }
+    _updateProjectCacheTimestamp(projectId, ts) {
+        for (const [wsId, projects] of this._projects) {
+            const idx = projects.findIndex((p) => p.id === projectId);
+            if (idx === -1)
+                continue;
+            this._projects.set(wsId, projects.map((p) => (p.id === projectId ? { ...p, updatedAt: ts } : p)));
+            break;
+        }
+    }
+    // ─── MRU (most-recently-used files per project) ───────────────────────────────
+    /** Returns the MRU file-ID list for a project (most recent first). */
+    async getMru(projectId) {
+        const record = await db.projectMru.get(projectId);
+        return record?.fileIds ?? [];
+    }
+    /** Pushes a file ID to the front of the project's MRU list (deduplicates, max 50). */
+    async pushMruFile(projectId, fileId) {
+        const existing = await db.projectMru.get(projectId);
+        const current = existing?.fileIds ?? [];
+        const updated = [fileId, ...current.filter((id) => id !== fileId)].slice(0, 50);
+        if (existing) {
+            await db.projectMru.update(projectId, { fileIds: updated });
+        }
+        else {
+            await db.projectMru.add({ projectId, fileIds: updated });
+        }
+    }
+    // ─── Recent projects ─────────────────────────────────────────────────────────
+    /**
+     * Returns up to 10 projects sorted by most recently saved (descending).
+     * Uses the in-memory cache — call after `initialize()` completes.
+     */
+    getRecentProjects() {
+        const result = [];
+        for (const [wsId, projects] of this._projects) {
+            const ws = this._workspaces.find((w) => w.id === wsId);
+            if (!ws)
+                continue;
+            for (const p of projects) {
+                result.push({ project: p, workspace: ws });
+            }
+        }
+        return result.sort((a, b) => b.project.updatedAt - a.project.updatedAt).slice(0, 10);
+    }
+    // ─── Change listeners ─────────────────────────────────────────────────────────
+    onChange(cb) {
+        this._listeners.push(cb);
+        return () => {
+            this._listeners = this._listeners.filter((l) => l !== cb);
+        };
+    }
+    _notify() {
+        for (const l of this._listeners)
+            l();
+    }
+}
+//# sourceMappingURL=storage-api.js.map

package/dist/storage/types.d.ts

@@ -0,0 +1,44 @@
+export type FileType = "bpmn" | "dmn" | "form";
+export interface WorkspaceRecord {
+    id: string;
+    name: string;
+    createdAt: number;
+    updatedAt: number;
+}
+export interface ProjectRecord {
+    id: string;
+    workspaceId: string;
+    name: string;
+    createdAt: number;
+    updatedAt: number;
+}
+export interface FileRecord {
+    id: string;
+    projectId: string;
+    /** Denormalized from project — avoids extra joins in workspace-level queries. */
+    workspaceId: string;
+    name: string;
+    type: FileType;
+    /** When true this file is accessible cross-workspace for reference resolution. */
+    isShared: boolean;
+    /** Reserved for future GitHub sync — maps to `workspace/project/file.ext`. */
+    gitPath: string | null;
+    createdAt: number;
+    updatedAt: number;
+}
+export interface FileContentRecord {
+    /** Same as FileRecord.id — used as the primary key. */
+    fileId: string;
+    /** BPMN XML, DMN XML, or Form JSON string. */
+    content: string;
+    /** Monotonically increasing; incremented on every save. */
+    version: number;
+}
+/** Per-project most-recently-used file order for Ctrl+Tab switching. */
+export interface ProjectMruRecord {
+    /** Primary key — matches ProjectRecord.id. */
+    projectId: string;
+    /** File IDs ordered most-recently-used first (index 0 = most recent). */
+    fileIds: string[];
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/storage/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map