@olenbetong/appframe-ds 1.0.3 → 1.2.0

package/src/mdi/layoutSpec.ts

@@ -1,214 +1,214 @@
-import type { GroupviewPanelState, SerializedDockview, SerializedGridObject } from "dockview-react";
-import { Orientation } from "dockview-react";
-
-import { panelId } from "./ids.js";
-import { resolveClosable, resolveTitle, resolveType } from "./registry.js";
-import type {
-	MdiDocumentSpec,
-	MdiDocumentState,
-	MdiDocumentTypes,
-	MdiGroupSpec,
-	MdiLayout,
-	MdiLayoutNode,
-	MdiLayoutSpec,
-	MdiLocked,
-	MdiSplitSpec,
-} from "./types.js";
-
-/** dockview does not export its group state type; derive it from the serialized layout. */
-export type MdiGroupState = SerializedDockview["grid"]["root"] extends SerializedGridObject<infer T> ? T : never;
-
-/** The single dockview component/tab renderer every Mdi panel uses */
-export const MDI_COMPONENT = "mdi";
-
-/**
- * dockview scales the serialized sizes proportionally to the real container, so the
- * numbers only need to be consistent relative to each other.
- */
-const NOMINAL_SIZE = 1000;
-
-export function isGroupSpec(node: MdiLayoutNode): node is MdiGroupSpec {
-	return "tabs" in node;
-}
-
-/** A group without a tab bar refuses drops into it unless the spec says otherwise. */
-export function resolveLocked(group: MdiGroupSpec): MdiLocked {
-	if (group.locked !== undefined) return group.locked;
-	return group.hideHeader ? true : false;
-}
-
-export function specDocumentId(types: MdiDocumentTypes, tab: MdiDocumentSpec): string {
-	let definition = resolveType(types, tab.type);
-	return panelId(tab.type, definition.singleton ? undefined : tab.key);
-}
-
-export function listSpecDocuments(spec: MdiLayoutSpec): MdiDocumentSpec[] {
-	let result: MdiDocumentSpec[] = [];
-
-	function walk(node: MdiLayoutNode) {
-		if (isGroupSpec(node)) {
-			result.push(...node.tabs);
-		} else {
-			node.children.forEach(walk);
-		}
-	}
-
-	walk(spec.root);
-	return result;
-}
-
-type BuildContext = {
-	types: MdiDocumentTypes;
-	documents: Record<string, MdiDocumentState>;
-	panels: Record<string, GroupviewPanelState>;
-	groupCount: number;
-	firstGroup?: string;
-};
-
-function toOrientation(direction: MdiSplitSpec["direction"]): Orientation {
-	return direction === "horizontal" ? Orientation.HORIZONTAL : Orientation.VERTICAL;
-}
-
-function addDocument(tab: MdiDocumentSpec, context: BuildContext): string {
-	let definition = resolveType(context.types, tab.type);
-	let key = definition.singleton ? undefined : tab.key;
-	let id = panelId(tab.type, key);
-
-	if (context.documents[id]) {
-		throw new Error(`Mdi: the layout contains the document "${id}" more than once.`);
-	}
-
-	let params = { ...tab.params };
-	let title = tab.title ?? resolveTitle(definition, tab.type, params, key);
-
-	context.documents[id] = {
-		type: tab.type,
-		key,
-		params,
-		title,
-		closable: resolveClosable(definition, tab.closable),
-	};
-	context.panels[id] = {
-		id,
-		contentComponent: MDI_COMPONENT,
-		tabComponent: MDI_COMPONENT,
-		title,
-	};
-
-	return id;
-}
-
-function serializeGroup(group: MdiGroupSpec, context: BuildContext): MdiGroupState {
-	if (group.tabs.length === 0) {
-		throw new Error("Mdi: every group in the layout needs at least one tab.");
-	}
-
-	context.groupCount += 1;
-	let id = `mdi-g${context.groupCount}`;
-	let views = group.tabs.map((tab) => addDocument(tab, context));
-
-	if (group.active !== undefined && !views.includes(group.active)) {
-		throw new Error(`Mdi: active tab "${group.active}" is not part of its group.`);
-	}
-
-	context.firstGroup ??= id;
-
-	let state: MdiGroupState = {
-		id,
-		views,
-		activeView: group.active ?? views[0],
-	};
-	let locked = resolveLocked(group);
-
-	if (locked) {
-		state.locked = locked;
-	}
-
-	if (group.hideHeader) {
-		state.hideHeader = true;
-	}
-
-	return state;
-}
-
-/**
- * The children of a split with their normalised weights. dockview alternates the
- * orientation on every level of the tree, so a nested split with the same direction as
- * its parent is inlined into the parent instead.
- */
-function flattenChildren(split: MdiSplitSpec): { node: MdiLayoutNode; weight: number }[] {
-	let result: { node: MdiLayoutNode; weight: number }[] = [];
-	let total = split.children.reduce((sum, child) => sum + (child.size ?? 1), 0) || 1;
-
-	for (let child of split.children) {
-		let weight = (child.size ?? 1) / total;
-
-		if (!isGroupSpec(child) && child.direction === split.direction) {
-			for (let inner of flattenChildren(child)) {
-				result.push({ node: inner.node, weight: weight * inner.weight });
-			}
-		} else {
-			result.push({ node: child, weight });
-		}
-	}
-
-	return result;
-}
-
-/**
- * A node's `size` is its extent along the parent's axis. A branch's children share the
- * branch's extent along its own axis, which equals the parent's `size`.
- */
-function serializeNode(
-	node: MdiLayoutNode,
-	size: number,
-	axisExtent: number,
-	context: BuildContext,
-): SerializedGridObject<MdiGroupState> {
-	if (isGroupSpec(node)) {
-		return { type: "leaf", data: serializeGroup(node, context), size };
-	}
-
-	let children = flattenChildren(node);
-
-	if (children.length === 0) {
-		throw new Error("Mdi: every split in the layout needs at least one child.");
-	}
-
-	return {
-		type: "branch",
-		size,
-		data: children.map((child) => serializeNode(child.node, child.weight * axisExtent, size, context)),
-	};
-}
-
-/** Builds the persisted layout for a layout spec. */
-export function layoutSpecToLayout(
-	spec: MdiLayoutSpec,
-	types: MdiDocumentTypes,
-	layoutVersion: string | number,
-): MdiLayout {
-	let context: BuildContext = { types, documents: {}, panels: {}, groupCount: 0 };
-	let root: SerializedGridObject<MdiGroupState>;
-	let orientation: Orientation;
-
-	if (isGroupSpec(spec.root)) {
-		orientation = Orientation.HORIZONTAL;
-		root = {
-			type: "branch",
-			size: NOMINAL_SIZE,
-			data: [serializeNode(spec.root, NOMINAL_SIZE, NOMINAL_SIZE, context)],
-		};
-	} else {
-		orientation = toOrientation(spec.root.direction);
-		root = serializeNode(spec.root, NOMINAL_SIZE, NOMINAL_SIZE, context);
-	}
-
-	let dockview: SerializedDockview = {
-		grid: { root, width: NOMINAL_SIZE, height: NOMINAL_SIZE, orientation },
-		panels: context.panels,
-		activeGroup: context.firstGroup,
-	};
-
-	return { format: 1, layoutVersion, documents: context.documents, dockview };
-}
+import type { GroupviewPanelState, SerializedDockview, SerializedGridObject } from "dockview-react";
+import { Orientation } from "dockview-react";
+
+import { panelId } from "./ids.js";
+import { resolveClosable, resolveTitle, resolveType } from "./registry.js";
+import type {
+	MdiDocumentSpec,
+	MdiDocumentState,
+	MdiDocumentTypes,
+	MdiGroupSpec,
+	MdiLayout,
+	MdiLayoutNode,
+	MdiLayoutSpec,
+	MdiLocked,
+	MdiSplitSpec,
+} from "./types.js";
+
+/** dockview does not export its group state type; derive it from the serialized layout. */
+export type MdiGroupState = SerializedDockview["grid"]["root"] extends SerializedGridObject<infer T> ? T : never;
+
+/** The single dockview component/tab renderer every Mdi panel uses */
+export const MDI_COMPONENT = "mdi";
+
+/**
+ * dockview scales the serialized sizes proportionally to the real container, so the
+ * numbers only need to be consistent relative to each other.
+ */
+const NOMINAL_SIZE = 1000;
+
+export function isGroupSpec(node: MdiLayoutNode): node is MdiGroupSpec {
+	return "tabs" in node;
+}
+
+/** A group without a tab bar refuses drops into it unless the spec says otherwise. */
+export function resolveLocked(group: MdiGroupSpec): MdiLocked {
+	if (group.locked !== undefined) return group.locked;
+	return group.hideHeader ? true : false;
+}
+
+export function specDocumentId(types: MdiDocumentTypes, tab: MdiDocumentSpec): string {
+	let definition = resolveType(types, tab.type);
+	return panelId(tab.type, definition.singleton ? undefined : tab.key);
+}
+
+export function listSpecDocuments(spec: MdiLayoutSpec): MdiDocumentSpec[] {
+	let result: MdiDocumentSpec[] = [];
+
+	function walk(node: MdiLayoutNode) {
+		if (isGroupSpec(node)) {
+			result.push(...node.tabs);
+		} else {
+			node.children.forEach(walk);
+		}
+	}
+
+	walk(spec.root);
+	return result;
+}
+
+type BuildContext = {
+	types: MdiDocumentTypes;
+	documents: Record<string, MdiDocumentState>;
+	panels: Record<string, GroupviewPanelState>;
+	groupCount: number;
+	firstGroup?: string;
+};
+
+function toOrientation(direction: MdiSplitSpec["direction"]): Orientation {
+	return direction === "horizontal" ? Orientation.HORIZONTAL : Orientation.VERTICAL;
+}
+
+function addDocument(tab: MdiDocumentSpec, context: BuildContext): string {
+	let definition = resolveType(context.types, tab.type);
+	let key = definition.singleton ? undefined : tab.key;
+	let id = panelId(tab.type, key);
+
+	if (context.documents[id]) {
+		throw new Error(`Mdi: the layout contains the document "${id}" more than once.`);
+	}
+
+	let params = { ...tab.params };
+	let title = tab.title ?? resolveTitle(definition, tab.type, params, key);
+
+	context.documents[id] = {
+		type: tab.type,
+		key,
+		params,
+		title,
+		closable: resolveClosable(definition, tab.closable),
+	};
+	context.panels[id] = {
+		id,
+		contentComponent: MDI_COMPONENT,
+		tabComponent: MDI_COMPONENT,
+		title,
+	};
+
+	return id;
+}
+
+function serializeGroup(group: MdiGroupSpec, context: BuildContext): MdiGroupState {
+	if (group.tabs.length === 0) {
+		throw new Error("Mdi: every group in the layout needs at least one tab.");
+	}
+
+	context.groupCount += 1;
+	let id = `mdi-g${context.groupCount}`;
+	let views = group.tabs.map((tab) => addDocument(tab, context));
+
+	if (group.active !== undefined && !views.includes(group.active)) {
+		throw new Error(`Mdi: active tab "${group.active}" is not part of its group.`);
+	}
+
+	context.firstGroup ??= id;
+
+	let state: MdiGroupState = {
+		id,
+		views,
+		activeView: group.active ?? views[0],
+	};
+	let locked = resolveLocked(group);
+
+	if (locked) {
+		state.locked = locked;
+	}
+
+	if (group.hideHeader) {
+		state.hideHeader = true;
+	}
+
+	return state;
+}
+
+/**
+ * The children of a split with their normalised weights. dockview alternates the
+ * orientation on every level of the tree, so a nested split with the same direction as
+ * its parent is inlined into the parent instead.
+ */
+function flattenChildren(split: MdiSplitSpec): { node: MdiLayoutNode; weight: number }[] {
+	let result: { node: MdiLayoutNode; weight: number }[] = [];
+	let total = split.children.reduce((sum, child) => sum + (child.size ?? 1), 0) || 1;
+
+	for (let child of split.children) {
+		let weight = (child.size ?? 1) / total;
+
+		if (!isGroupSpec(child) && child.direction === split.direction) {
+			for (let inner of flattenChildren(child)) {
+				result.push({ node: inner.node, weight: weight * inner.weight });
+			}
+		} else {
+			result.push({ node: child, weight });
+		}
+	}
+
+	return result;
+}
+
+/**
+ * A node's `size` is its extent along the parent's axis. A branch's children share the
+ * branch's extent along its own axis, which equals the parent's `size`.
+ */
+function serializeNode(
+	node: MdiLayoutNode,
+	size: number,
+	axisExtent: number,
+	context: BuildContext,
+): SerializedGridObject<MdiGroupState> {
+	if (isGroupSpec(node)) {
+		return { type: "leaf", data: serializeGroup(node, context), size };
+	}
+
+	let children = flattenChildren(node);
+
+	if (children.length === 0) {
+		throw new Error("Mdi: every split in the layout needs at least one child.");
+	}
+
+	return {
+		type: "branch",
+		size,
+		data: children.map((child) => serializeNode(child.node, child.weight * axisExtent, size, context)),
+	};
+}
+
+/** Builds the persisted layout for a layout spec. */
+export function layoutSpecToLayout(
+	spec: MdiLayoutSpec,
+	types: MdiDocumentTypes,
+	layoutVersion: string | number,
+): MdiLayout {
+	let context: BuildContext = { types, documents: {}, panels: {}, groupCount: 0 };
+	let root: SerializedGridObject<MdiGroupState>;
+	let orientation: Orientation;
+
+	if (isGroupSpec(spec.root)) {
+		orientation = Orientation.HORIZONTAL;
+		root = {
+			type: "branch",
+			size: NOMINAL_SIZE,
+			data: [serializeNode(spec.root, NOMINAL_SIZE, NOMINAL_SIZE, context)],
+		};
+	} else {
+		orientation = toOrientation(spec.root.direction);
+		root = serializeNode(spec.root, NOMINAL_SIZE, NOMINAL_SIZE, context);
+	}
+
+	let dockview: SerializedDockview = {
+		grid: { root, width: NOMINAL_SIZE, height: NOMINAL_SIZE, orientation },
+		panels: context.panels,
+		activeGroup: context.firstGroup,
+	};
+
+	return { format: 1, layoutVersion, documents: context.documents, dockview };
+}

package/src/mdi/layoutStore.test.ts

@@ -1,93 +1,93 @@
-import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
-
-import { layoutSpecToLayout } from "./layoutSpec.js";
-import { createLayoutStore } from "./layoutStore.js";
-import { createMemorySettingsStore } from "./memorySettingsStore.js";
-import { testSpec, testTypes } from "./testTypes.js";
-
-describe("layout store", () => {
-	beforeEach(() => {
-		vi.useFakeTimers();
-	});
-
-	afterEach(() => {
-		vi.useRealTimers();
-	});
-
-	it("prefixes keys with the article", () => {
-		let store = createLayoutStore(createMemorySettingsStore(), "my-article");
-		expect(store.key("dock")).toBe("my-article.dock");
-	});
-
-	it("prefetches layouts of the article and ignores other values", async () => {
-		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
-		let settings = createMemorySettingsStore({
-			"my-article.dock": layout,
-			"my-article.junk": { hello: "world" },
-			"other-article.dock": layout,
-		});
-		let store = createLayoutStore(settings, "my-article");
-
-		await store.loaded;
-
-		expect(store.get("my-article.dock", 1)).toEqual(layout);
-		expect(store.get("my-article.junk", 1)).toBeUndefined();
-		expect(store.get("other-article.dock", 1)).toBeUndefined();
-	});
-
-	it("returns nothing when the layout version differs", async () => {
-		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
-		let store = createLayoutStore(createMemorySettingsStore({ "a.dock": layout }), "a");
-
-		await store.loaded;
-
-		expect(store.get("a.dock", 2)).toBeUndefined();
-		expect(store.get("a.dock", "1")).toBeUndefined();
-		expect(store.get("a.dock", 1)).toEqual(layout);
-	});
-
-	it("caches immediately and writes after a delay, coalescing bursts", async () => {
-		let settings = createMemorySettingsStore();
-		let store = createLayoutStore(settings, "a");
-		let first = layoutSpecToLayout(testSpec, testTypes, 1);
-		let second = { ...first, layoutVersion: 1, documents: {} };
-
-		store.set("a.dock", first);
-		store.set("a.dock", second);
-
-		expect(store.get("a.dock", 1)).toBe(second);
-		expect(settings.data.has("a.dock")).toBe(false);
-
-		await vi.advanceTimersByTimeAsync(300);
-
-		expect(settings.data.get("a.dock")).toBe(second);
-	});
-
-	it("writes immediately with setNow and cancels a pending delayed write", async () => {
-		let settings = createMemorySettingsStore();
-		let store = createLayoutStore(settings, "a");
-		let first = layoutSpecToLayout(testSpec, testTypes, 1);
-		let second = { ...first, documents: {} };
-
-		store.set("a.dock", first);
-		await store.setNow("a.dock", second);
-
-		expect(settings.data.get("a.dock")).toBe(second);
-
-		await vi.advanceTimersByTimeAsync(300);
-
-		expect(settings.data.get("a.dock")).toBe(second);
-	});
-
-	it("removes from the cache and the store", async () => {
-		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
-		let settings = createMemorySettingsStore({ "a.dock": layout });
-		let store = createLayoutStore(settings, "a");
-
-		await store.loaded;
-		await store.remove("a.dock");
-
-		expect(store.get("a.dock", 1)).toBeUndefined();
-		expect(settings.data.has("a.dock")).toBe(false);
-	});
-});
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+
+import { layoutSpecToLayout } from "./layoutSpec.js";
+import { createLayoutStore } from "./layoutStore.js";
+import { createMemorySettingsStore } from "./memorySettingsStore.js";
+import { testSpec, testTypes } from "./testTypes.js";
+
+describe("layout store", () => {
+	beforeEach(() => {
+		vi.useFakeTimers();
+	});
+
+	afterEach(() => {
+		vi.useRealTimers();
+	});
+
+	it("prefixes keys with the article", () => {
+		let store = createLayoutStore(createMemorySettingsStore(), "my-article");
+		expect(store.key("dock")).toBe("my-article.dock");
+	});
+
+	it("prefetches layouts of the article and ignores other values", async () => {
+		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
+		let settings = createMemorySettingsStore({
+			"my-article.dock": layout,
+			"my-article.junk": { hello: "world" },
+			"other-article.dock": layout,
+		});
+		let store = createLayoutStore(settings, "my-article");
+
+		await store.loaded;
+
+		expect(store.get("my-article.dock", 1)).toEqual(layout);
+		expect(store.get("my-article.junk", 1)).toBeUndefined();
+		expect(store.get("other-article.dock", 1)).toBeUndefined();
+	});
+
+	it("returns nothing when the layout version differs", async () => {
+		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
+		let store = createLayoutStore(createMemorySettingsStore({ "a.dock": layout }), "a");
+
+		await store.loaded;
+
+		expect(store.get("a.dock", 2)).toBeUndefined();
+		expect(store.get("a.dock", "1")).toBeUndefined();
+		expect(store.get("a.dock", 1)).toEqual(layout);
+	});
+
+	it("caches immediately and writes after a delay, coalescing bursts", async () => {
+		let settings = createMemorySettingsStore();
+		let store = createLayoutStore(settings, "a");
+		let first = layoutSpecToLayout(testSpec, testTypes, 1);
+		let second = { ...first, layoutVersion: 1, documents: {} };
+
+		store.set("a.dock", first);
+		store.set("a.dock", second);
+
+		expect(store.get("a.dock", 1)).toBe(second);
+		expect(settings.data.has("a.dock")).toBe(false);
+
+		await vi.advanceTimersByTimeAsync(300);
+
+		expect(settings.data.get("a.dock")).toBe(second);
+	});
+
+	it("writes immediately with setNow and cancels a pending delayed write", async () => {
+		let settings = createMemorySettingsStore();
+		let store = createLayoutStore(settings, "a");
+		let first = layoutSpecToLayout(testSpec, testTypes, 1);
+		let second = { ...first, documents: {} };
+
+		store.set("a.dock", first);
+		await store.setNow("a.dock", second);
+
+		expect(settings.data.get("a.dock")).toBe(second);
+
+		await vi.advanceTimersByTimeAsync(300);
+
+		expect(settings.data.get("a.dock")).toBe(second);
+	});
+
+	it("removes from the cache and the store", async () => {
+		let layout = layoutSpecToLayout(testSpec, testTypes, 1);
+		let settings = createMemorySettingsStore({ "a.dock": layout });
+		let store = createLayoutStore(settings, "a");
+
+		await store.loaded;
+		await store.remove("a.dock");
+
+		expect(store.get("a.dock", 1)).toBeUndefined();
+		expect(settings.data.has("a.dock")).toBe(false);
+	});
+});