@peter.prib/renderengine 0.2.5 → 0.2.7

package/src/charting/datamodel/LevelMapping.js

@@ -0,0 +1,38 @@
+/**
+ * LevelMapping — which entities of one level realise which of another
+ * (conceptual → logical, logical → physical): pairs of ids, any number either
+ * way, so one concept may become several logical entities (Party → Person,
+ * Organisation), several one table (Person, Organisation → party), or many
+ * many.
+ */
+export class LevelMapping {
+    /**
+     * @param {{from: string, to: string, pairs?: Array<[string, string]>}} spec
+     *   `from`/`to` levels; each pair [id at `from`, id at `to`]
+     */
+    constructor({ from, to, pairs = [] } = {}) {
+        if (!from || !to) throw new TypeError('LevelMapping needs the levels it maps, from and to');
+        this.from = from;
+        this.to = to;
+        this.pairs = pairs.map(([a, b]) => [a, b]);
+    }
+
+    /** What realises an entity of `from` at `to`. */
+    targetsOf(id) {
+        return this.pairs.filter(([a]) => a === id).map(([, b]) => b);
+    }
+
+    /** What an entity of `to` realises at `from`. */
+    sourcesOf(id) {
+        return this.pairs.filter(([, b]) => b === id).map(([a]) => a);
+    }
+
+    /** Map one more pair (none twice). */
+    add(fromId, toId) {
+        if (!this.pairs.some(([a, b]) => a === fromId && b === toId)) this.pairs.push([fromId, toId]);
+    }
+
+    toJSON() {
+        return { from: this.from, to: this.to, pairs: this.pairs.map(p => [...p]) };
+    }
+}

package/src/charting/datamodel/LevelSchema.js

@@ -0,0 +1,41 @@
+/**
+ * LevelSchema — one level of a data model (conceptual, logical, physical) as
+ * its own structure: its entities (a concept; a logical entity with its
+ * attributes and keys; a table with its columns and types) and the
+ * relationships between them. The levels are not one-to-one: a concept may be
+ * realised by several logical entities, several by one table (LevelMapping
+ * says which).
+ *
+ * An entity: `{ id, name, description?, attributes?, x?, y?, color?, shape?,
+ * labelPosition? }` — `attributes` `[{name, type?, isPK?, isFK?}]` (none at the
+ * conceptual level); a relationship as dataModelDiagram takes it.
+ */
+export class LevelSchema {
+    /**
+     * @param {string} level - 'conceptual', 'logical' or 'physical'
+     * @param {{entities?: Array<Object>, relationships?: Array<Object>}} [spec]
+     */
+    constructor(level, { entities = [], relationships = [] } = {}) {
+        if (!level) throw new TypeError('LevelSchema needs its level');
+        this.level = level;
+        this.entities = entities;
+        this.relationships = relationships;
+    }
+
+    /** An entity by id, or null. */
+    entity(id) {
+        return this.entities.find(e => e.id === id) ?? null;
+    }
+
+    /** Add an entity (its id unique at this level). */
+    addEntity(entity) {
+        if (!entity?.id) throw new TypeError('An entity needs an id');
+        if (this.entity(entity.id)) throw new TypeError(`The ${this.level} level already has "${entity.id}"`);
+        this.entities.push(entity);
+        return entity;
+    }
+
+    toJSON() {
+        return { entities: this.entities, relationships: this.relationships };
+    }
+}

package/src/charting/datamodel/ServiceDomain.js

@@ -0,0 +1,177 @@
+import { DataModelPerspective } from './DataModelPerspective.js';
+import { BianNotation } from '../../bian.js';
+
+/** How a service domain's control record and behaviour qualifiers are coloured where it is seen through. */
+const CONTROL_RECORD_COLOR = '#fde68a';
+const QUALIFIER_COLOR = '#e0f2fe';
+
+/**
+ * ServiceDomain — a BIAN service domain as a kind of perspective: it sees the
+ * concepts it covers (as any perspective), and it is more. It sits in a business
+ * area and business domain, manages one kind of asset (`asset`) with one
+ * functional pattern (`pattern`, BianNotation), and keeps a control record (a
+ * logical entity: what its instances are, named for the asset and the
+ * pattern's generic artifact) broken down by behaviour qualifiers (each a
+ * logical entity, of a qualifier type). Its service operations (its semantic
+ * API) follow: the pattern's action terms on the control record and each
+ * qualifier (BianNotation.serviceOperations).
+ *
+ * Seen through at the logical level it shows its control record and qualifiers,
+ * whatever they realise, marked (colour, and what each is on hover), with a note
+ * of its service operations on the control record.
+ */
+export class ServiceDomain extends DataModelPerspective {
+    static kind = 'service-domain';
+    static kindLabel = 'Service domain';
+
+    /**
+     * @param {Object} spec - As DataModelPerspective, plus:
+     * @param {string} [spec.businessArea]
+     * @param {string} [spec.businessDomain]
+     * @param {string} [spec.asset] - What it manages ('Current Account'); its name when unset
+     * @param {string} [spec.pattern] - A BIAN functional pattern ('Fulfill')
+     * @param {string|null} [spec.controlRecord] - The logical entity its control record is
+     * @param {Array<{id?: string, name: string, type?: string, entity?: string}>} [spec.qualifiers]
+     *   Behaviour qualifiers: a name, a qualifier type (default the pattern's), the logical entity it is
+     * @param {string[]} [spec.owns] - Other business objects (logical entities) it owns
+     */
+    constructor({ businessArea = '', businessDomain = '', asset = '', pattern = 'Fulfill', controlRecord = null, qualifiers = [], owns = [], ...spec } = {}) {
+        super(spec);
+        /** Business objects (logical entities) it owns besides its control record and qualifiers. */
+        this.owns = [...owns];
+        this.businessArea = businessArea;
+        this.businessDomain = businessDomain;
+        this.asset = asset;
+        this.pattern = pattern;
+        this.controlRecord = controlRecord;
+        this.qualifiers = qualifiers.map((q, i) => ({ ...q, id: q.id ?? `${this.id}-bq-${i + 1}` }));
+    }
+
+    /** Its functional pattern (BianFunctionalPattern), or null for one BIAN does not have. */
+    get functionalPattern() {
+        return BianNotation.functionalPattern(this.pattern);
+    }
+
+    /** Its control record's name: the asset (else its name) and the pattern's generic artifact. */
+    get controlRecordName() {
+        return this.functionalPattern?.controlRecordName(this.asset || this.name) ?? (this.asset || this.name);
+    }
+
+    /** A qualifier's type: its own, else its pattern's. */
+    qualifierType(qualifier) {
+        return qualifier.type || this.functionalPattern?.qualifierType || '';
+    }
+
+    /** Its default service operations (BianNotation.serviceOperations). */
+    serviceOperations() {
+        return BianNotation.serviceOperations(this.pattern, {
+            serviceDomain: this.name, controlRecord: this.controlRecordName, qualifiers: this.qualifiers.map(q => q.name),
+        });
+    }
+
+    /** The business objects it owns: its control record, its qualifiers' entities, and those it names (`owns`). */
+    ownedEntities() {
+        return [...new Set([this.controlRecord, ...this.qualifiers.map(q => q.entity), ...this.owns].filter(Boolean))];
+    }
+
+    /** At the logical level, the business objects it owns. */
+    alsoShows(level) {
+        return level === 'logical' ? this.ownedEntities() : [];
+    }
+
+    /** At the logical level, its control record and qualifiers are coloured and say what they are. */
+    decorate(entity, level) {
+        if (level !== 'logical') return {};
+        if (entity.id === this.controlRecord) {
+            return { color: CONTROL_RECORD_COLOR, details: { 'control record': this.controlRecordName, 'functional pattern': this.pattern, 'service domain': this.name } };
+        }
+        const qualifier = this.qualifiers.find(q => q.entity === entity.id);
+        return qualifier
+            ? { color: QUALIFIER_COLOR, details: { 'behaviour qualifier': `${qualifier.name} (${this.qualifierType(qualifier)})`, 'service domain': this.name } }
+            : {};
+    }
+
+    /** At the logical level, a note of its service operations, on its control record. */
+    notes(level) {
+        if (level !== 'logical' || !this.controlRecord) return [];
+        return [{ id: `${this.id}-operations`, text: this.operationsSummary(), attachTo: [this.controlRecord] }];
+    }
+
+    /** Its service operations in a few lines: the terms, on what. */
+    operationsSummary() {
+        const ops = this.serviceOperations();
+        const terms = (pick) => [...new Set(ops.filter(pick).map(o => o.actionTerm))].join(', ');
+        const qualifiers = this.qualifiers.map(q => q.name);
+        return [
+            `${this.name}: ${terms(o => o.target === this.name)}`,
+            `${this.controlRecordName}: ${terms(o => o.target === this.controlRecordName && !o.qualifier)}`,
+            ...(qualifiers.length ? [`each of ${qualifiers.join(', ')}: the same`] : []),
+        ].join('\n');
+    }
+
+    toJSON() {
+        return {
+            ...super.toJSON(),
+            businessArea: this.businessArea, businessDomain: this.businessDomain, asset: this.asset, pattern: this.pattern,
+            controlRecord: this.controlRecord, qualifiers: this.qualifiers.map(q => ({ ...q })), owns: [...this.owns],
+        };
+    }
+
+    /**
+     * Its dialog's fields: a perspective's, then where it sits, its asset and
+     * pattern (BIAN's, each described), its control record (a logical entity),
+     * and its qualifiers a line each: `name | type | logical entity`.
+     */
+    static fields(model, domain = null) {
+        const logical = model.level('logical').entities;
+        const entityName = (id) => logical.find(e => e.id === id)?.name ?? id ?? '';
+        return [
+            ...DataModelPerspective.fields(model, domain),
+            { type: 'heading', label: 'Service domain' },
+            { key: 'businessArea', label: 'Business area', type: 'text', value: domain?.businessArea ?? '' },
+            { key: 'businessDomain', label: 'Business domain', type: 'text', value: domain?.businessDomain ?? '' },
+            { key: 'asset', label: 'Asset it manages', type: 'text', value: domain?.asset ?? '', placeholder: 'its name' },
+            {
+                key: 'pattern', label: 'Functional pattern', type: 'select', value: domain?.pattern ?? 'Fulfill',
+                choices: BianNotation.functionalPatterns().map(p => [p.name, `${p.name} — ${p.artifact}`]),
+            },
+            {
+                key: 'controlRecord', label: 'Control record', type: 'select', value: domain?.controlRecord ?? '',
+                choices: [['', 'None yet'], ...logical.map(e => [e.id, e.name])],
+            },
+            {
+                key: 'qualifiers', label: 'Behaviour qualifiers', type: 'textarea', rows: 4,
+                value: (domain?.qualifiers ?? []).map(q => [q.name, q.type ?? '', entityName(q.entity)].join(' | ')).join('\n'),
+                hint: `One a line: name | type (${BianNotation.qualifierTypes().slice(0, 4).join(', ')}…; blank: the pattern's) | logical entity (by name)`,
+            },
+            {
+                key: 'owns', label: 'Also owns', type: 'checklist', value: domain?.owns ?? [],
+                choices: logical.map(e => [e.id, e.name]),
+            },
+        ];
+    }
+
+    /** A service domain's spec from those fields (a qualifier kept keeps its id; a type BIAN lacks is left to the pattern). */
+    static specFrom(values, model, domain = null) {
+        const logical = model.level('logical').entities;
+        const entityOf = (word) => logical.find(e => e.id === word || e.name.toLowerCase() === word.toLowerCase())?.id ?? null;
+        const qualifiers = String(values.qualifiers ?? '').split('\n').map(l => l.trim()).filter(Boolean).map(line => {
+            const [name, type = '', entity = ''] = line.split('|').map(p => p.trim());
+            const kept = domain?.qualifiers.find(q => q.name === name);
+            return {
+                ...(kept && { id: kept.id }), name,
+                ...(BianNotation.isQualifierType(type) && { type }),
+                ...(entityOf(entity) && { entity: entityOf(entity) }),
+            };
+        });
+        return {
+            kind: ServiceDomain.kind,
+            ...DataModelPerspective.specFrom(values, model),
+            businessArea: (values.businessArea ?? '').trim(), businessDomain: (values.businessDomain ?? '').trim(),
+            asset: (values.asset ?? '').trim(), pattern: values.pattern || 'Fulfill',
+            controlRecord: values.controlRecord || null, qualifiers, owns: [...(values.owns ?? [])],
+        };
+    }
+}
+
+DataModelPerspective.register(ServiceDomain);

package/src/charting/datamodel/ServiceLandscape.js

@@ -0,0 +1,104 @@
+import { BianNotation } from '../../bian.js';
+
+/** The colour of a service domain's box, by its functional pattern's place among BIAN's (none: grey). */
+const PATTERN_COLORS = ['#fde68a', '#bbf7d0', '#bfdbfe', '#fbcfe8', '#ddd6fe', '#fed7aa', '#a5f3fc', '#e9d5ff', '#fecaca', '#d9f99d'];
+const NO_PATTERN_COLOR = '#e5e7eb';
+
+/**
+ * ServiceLandscape — a model's service domains laid out as BIAN draws its
+ * service landscape: a column per business area, in it a frame per business
+ * domain, in that the service domains (each a box coloured by its functional
+ * pattern, and on hover its pattern, control record and asset). Service
+ * domains with no area or domain go under "No business area" / "No business
+ * domain". The layout follows from the structure, so it is made anew each time.
+ *
+ * `view(serviceDomains)` gives what dataModelDiagram draws: entities (a box per
+ * service domain, its id `landscape:<id>`), and the frames as graphDiagram
+ * folders (`folders`, `elementFolders`).
+ */
+export class ServiceLandscape {
+    static BOX = Object.freeze({ width: 160, height: 56 });
+    static GAP = 16;
+    static HEADER = 24;
+    static PAD = 12;
+    /** Service domains side by side in a business domain's frame. */
+    static ACROSS = 2;
+    static NO_AREA = 'No business area';
+    static NO_DOMAIN = 'No business domain';
+    static PREFIX = 'landscape:';
+
+    /** A service domain's id from a landscape box's id, or null. */
+    static serviceDomainOf(nodeId) {
+        return String(nodeId).startsWith(ServiceLandscape.PREFIX) ? String(nodeId).slice(ServiceLandscape.PREFIX.length) : null;
+    }
+
+    /** The colour of a functional pattern's service domains. */
+    static colorOf(pattern) {
+        const i = BianNotation.functionalPatterns().findIndex(p => p.name === pattern);
+        return i < 0 ? NO_PATTERN_COLOR : PATTERN_COLORS[i % PATTERN_COLORS.length];
+    }
+
+    /**
+     * Business areas, each with its business domains, each with its service
+     * domains, in the order they first come.
+     * @param {Array<ServiceDomain>} serviceDomains
+     * @returns {Array<{name: string, domains: Array<{name: string, serviceDomains: Array}>}>}
+     */
+    static areas(serviceDomains) {
+        const areas = new Map();
+        for (const sd of serviceDomains) {
+            const area = sd.businessArea || ServiceLandscape.NO_AREA;
+            const domain = sd.businessDomain || ServiceLandscape.NO_DOMAIN;
+            if (!areas.has(area)) areas.set(area, new Map());
+            const domains = areas.get(area);
+            if (!domains.has(domain)) domains.set(domain, []);
+            domains.get(domain).push(sd);
+        }
+        return [...areas].map(([name, domains]) => ({ name, domains: [...domains].map(([d, list]) => ({ name: d, serviceDomains: list })) }));
+    }
+
+    /**
+     * What to draw (see the class).
+     * @param {Array<ServiceDomain>} serviceDomains
+     * @returns {{entities, relationships, annotations, links, folders, elementFolders}}
+     */
+    static view(serviceDomains) {
+        const { BOX, GAP, HEADER, PAD, ACROSS, PREFIX } = ServiceLandscape;
+        const domainWidth = ACROSS * BOX.width + (ACROSS - 1) * GAP + 2 * PAD;
+        const areaWidth = domainWidth + 2 * PAD;
+        const entities = [], areaFolders = [], domainFolders = [], elementFolders = [];
+        ServiceLandscape.areas(serviceDomains).forEach((area, a) => {
+            const areaId = `landscape-area-${a + 1}`;
+            const x = 20 + a * (areaWidth + GAP);
+            let y = 20 + HEADER + PAD;
+            area.domains.forEach((domain, d) => {
+                const domainId = `${areaId}-domain-${d + 1}`;
+                const rows = Math.ceil(domain.serviceDomains.length / ACROSS);
+                const height = HEADER + PAD + rows * BOX.height + (rows - 1) * GAP + PAD;
+                domainFolders.push({ id: domainId, name: domain.name, parentId: areaId, x: x + PAD, y, width: domainWidth, height });
+                domain.serviceDomains.forEach((sd, i) => {
+                    const id = `${PREFIX}${sd.id}`;
+                    const pattern = sd.functionalPattern;
+                    entities.push({
+                        id, name: sd.name, level: 'landscape',
+                        x: x + 2 * PAD + (i % ACROSS) * (BOX.width + GAP) + BOX.width / 2,
+                        y: y + HEADER + PAD + Math.floor(i / ACROSS) * (BOX.height + GAP) + BOX.height / 2,
+                        width: BOX.width, height: BOX.height,
+                        color: ServiceLandscape.colorOf(sd.pattern),
+                        description: sd.description,
+                        details: {
+                            'functional pattern': pattern ? `${pattern.name} (${pattern.artifact})` : (sd.pattern || 'none'),
+                            'control record': sd.controlRecordName,
+                            ...(sd.asset && { asset: sd.asset }),
+                        },
+                    });
+                    elementFolders.push([id, domainId]);
+                });
+                y += height + GAP;
+            });
+            areaFolders.push({ id: areaId, name: area.name, x, y: 20, width: areaWidth, height: y - 20 - GAP + PAD });
+        });
+        // Areas first, so they are drawn behind their domains.
+        return { entities, relationships: [], annotations: [], links: [], folders: [...areaFolders, ...domainFolders], elementFolders };
+    }
+}

package/src/charting/datamodel/StructuredType.js

@@ -0,0 +1,63 @@
+import { DataType } from './DataType.js';
+
+/**
+ * StructuredType — a data type made of named fields, each of a type (a plain
+ * type's name or another data type's): BIAN's Amount, Datetime, Identifier.
+ * `fields` as `[{ name, type?, description?, iso20022? }]`. Drawn as a box with
+ * a row per field, joined to the data types its fields are.
+ */
+export class StructuredType extends DataType {
+    static kind = 'structure';
+    static kindLabel = 'Structure';
+
+    /** @param {Object} spec - As DataType, plus `fields: [{ name, type?, description?, iso20022? }]` */
+    constructor({ fields = [], ...spec } = {}) {
+        super(spec);
+        this.fields = fields.map(f => ({
+            name: String(f.name),
+            ...(f.type && { type: String(f.type) }),
+            ...(f.description && { description: f.description }),
+            ...(f.iso20022 && { iso20022: f.iso20022 }),
+        }));
+    }
+
+    summary() {
+        return `${this.name}: ${this.fields.map(f => (f.type ? `${f.name} (${f.type})` : f.name)).join(', ')}`;
+    }
+
+    rows() {
+        return this.fields.map(f => ({ name: f.name, ...(f.type && { type: f.type }) }));
+    }
+
+    uses() {
+        return [...super.uses(), ...this.fields.map(f => f.type).filter(Boolean)];
+    }
+
+    toJSON() {
+        return { ...super.toJSON(), fields: this.fields.map(f => ({ ...f })) };
+    }
+
+    /** A plain type's fields, then its fields a line each: `name | type`. */
+    static fields(model, type = null) {
+        return [
+            ...DataType.fields(model, type),
+            {
+                key: 'fields', label: 'Fields', type: 'textarea', rows: 6,
+                value: (type?.fields ?? []).map(f => (f.type ? `${f.name} | ${f.type}` : f.name)).join('\n'),
+                hint: 'One a line: name | type (a plain type, or a data type by name)',
+            },
+        ];
+    }
+
+    static specFrom(values, model, type = null) {
+        return {
+            ...super.specFrom(values),
+            fields: DataType.lines(values.fields).map(([name, fieldType]) => {
+                const kept = type?.fields.find(f => f.name === name);
+                return { ...kept, name, ...(fieldType ? { type: fieldType } : { type: undefined }) };
+            }).map(f => JSON.parse(JSON.stringify(f))),
+        };
+    }
+}
+
+DataType.register(StructuredType);

package/src/charting/datamodel/index.js

@@ -0,0 +1,15 @@
+export { DataModel } from './DataModel.js';
+export { DataModelPerspective } from './DataModelPerspective.js';
+export { DataModelContext } from './DataModelContext.js';
+export { ServiceDomain } from './ServiceDomain.js';
+export { DataModelChecker } from './DataModelChecker.js';
+export { DataType } from './DataType.js';
+export { EnumerationType } from './EnumerationType.js';
+export { StructuredType } from './StructuredType.js';
+export { ServiceLandscape } from './ServiceLandscape.js';
+export { BianLandscapeReader } from './BianLandscapeReader.js';
+export { BianSemanticApiReader } from './BianSemanticApiReader.js';
+export { LevelSchema } from './LevelSchema.js';
+export { LevelMapping } from './LevelMapping.js';
+export { DataModelFileFormat } from './DataModelFileFormat.js';
+export { LevelEntitiesCompared, LevelRelationshipsCompared, MappingsCompared, ContextsCompared, PerspectivesCompared, DataTypesCompared } from './DataModelCompared.js';

package/src/charting/diagramModel/MergeModelCommand.js

@@ -1,37 +1,43 @@
-import { Command } from '../CommandHistory.js';
-
-/**
- * MergeModelCommand — things from another model brought into this one
- * (ModelComparison#mergeCommand): each step a ComparedKind's `bring`, in the
- * order given (what is needed first). One undo step; undo takes each back,
- * last first.
- */
-export class MergeModelCommand extends Command {
-    /** A merge is no edit on one view: undoing it shows no other. */
-    viewId = null;
-
-    /**
-     * @param {ViewSetModel} model - Merged into
-     * @param {ViewSetModel} from - Merged from
-     * @param {Array<{kind: ComparedKind, item: Object}>} steps
-     * @param {string} [label]
-     */
-    constructor(model, from, steps, label = `Merge ${steps.length} item${steps.length === 1 ? '' : 's'} from "${from.name || 'another model'}"`) {
-        super(label);
-        this.model = model;
-        this.from = from;
-        this.steps = steps;
-        this._undos = [];
-    }
-
-    execute() {
-        this._undos = this.steps.map(({ kind, item }) => kind.bring(this.model, item, this.from));
-        this.model._notify();
-    }
-
-    undo() {
-        for (const undo of [...this._undos].reverse()) undo();
-        this._undos = [];
-        this.model._notify();
-    }
-}
+import { Command } from '../CommandHistory.js';
+
+/**
+ * MergeModelCommand — things from another model brought into this one
+ * (ModelComparison#mergeCommand): each step a ComparedKind's `bring`, in the
+ * order given (what is needed first). One undo step; undo takes each back,
+ * last first.
+ */
+export class MergeModelCommand extends Command {
+    /** A merge is no edit on one view: undoing it shows no other. */
+    viewId = null;
+
+    /**
+     * @param {ViewSetModel} model - Merged into
+     * @param {ViewSetModel} from - Merged from
+     * @param {Array<{kind: ComparedKind, item: Object}>} steps
+     * @param {string} [label]
+     */
+    constructor(model, from, steps, label = `Merge ${steps.length} item${steps.length === 1 ? '' : 's'} from "${from.name || 'another model'}"`) {
+        super(label);
+        this.model = model;
+        this.from = from;
+        this.steps = steps;
+        this._undos = [];
+    }
+
+    execute() {
+        this._undos = this.steps.map(({ kind, item }) => kind.bring(this.model, item, this.from));
+        this._changed();
+    }
+
+    undo() {
+        for (const undo of [...this._undos].reverse()) undo();
+        this._undos = [];
+        this._changed();
+    }
+
+    /** The model changed: a view set tells its listeners; a model without views (a DataModel) says it was edited. @private */
+    _changed() {
+        this.model._notify?.();
+        this.model.edited?.();
+    }
+}

package/src/charting/diagramModel/OpenViewList.js

@@ -0,0 +1,75 @@
+/**
+ * OpenViewList — the views of a model that have a tab, in tab order, as a
+ * browser keeps its tabs: closing a tab leaves the view in the model, and a
+ * view is opened by going to it (from the tree, a search, a new view). It
+ * starts with the view in front only, so a model opened or imported with many
+ * views does not fill the tab strip.
+ *
+ * It follows the model: `sync()` drops views since deleted and opens the one in
+ * front, unless paused (`while`: a report passing through every view opens none).
+ */
+export class OpenViewList {
+    /**
+     * @param {ViewSetModel} model
+     * @param {Iterable<string>} [ids] - Those open to start with (default: the view in front)
+     */
+    constructor(model, ids = null) {
+        this.model = model;
+        this.ids = ids ? [...ids] : (model.currentViewId ? [model.currentViewId] : []);
+        this._paused = 0;
+        this.sync();
+    }
+
+    /** Follow the model: deleted views gone, the one in front open (last). Returns the open views. */
+    sync() {
+        this.ids = this.ids.filter(id => this.model.getView(id));
+        const current = this.model.currentViewId;
+        if (!this._paused && current && !this.ids.includes(current)) this.ids.push(current);
+        return this.views();
+    }
+
+    /** The open views, in tab order. */
+    views() {
+        return this.ids.map(id => this.model.getView(id)).filter(Boolean);
+    }
+
+    isOpen(id) {
+        return this.ids.includes(id);
+    }
+
+    /** Open a view's tab (if not open) and bring it to the front. */
+    open(id) {
+        if (!this.model.getView(id)) return false;
+        if (!this.ids.includes(id)) this.ids.push(id);
+        if (this.model.currentViewId !== id) this.model.switchTo(id);
+        return true;
+    }
+
+    /** Whether a tab may be closed: one always stays open. */
+    canClose(id) {
+        return this.ids.includes(id) && this.ids.length > 1;
+    }
+
+    /**
+     * Close a view's tab; the view stays in the model. Closing the tab in front
+     * brings its neighbour (the next, else the one before) to the front.
+     * @returns {boolean} whether it closed
+     */
+    close(id) {
+        if (!this.canClose(id)) return false;
+        const index = this.ids.indexOf(id);
+        this.ids.splice(index, 1);
+        if (this.model.currentViewId === id) this.model.switchTo(this.ids[Math.min(index, this.ids.length - 1)]);
+        return true;
+    }
+
+    /** Run `fn` with the list paused: going through views (a report's pictures) opens none. */
+    while(fn) {
+        this._paused++;
+        try { return fn(); } finally { this._paused--; }
+    }
+
+    toJSON() {
+        return [...this.ids];
+    }
+}

package/src/charting/diagramModel/ViewSetChecker.js

@@ -1,34 +1,22 @@
-/**
- * ViewSetChecker — checks over any ViewSetModel (a template editor's
- * DiagramModel, an ArchimateModel): what is wrong or worth a look across its
- * views. A notation adds its own checks in a subclass (ArchimateModelChecker).
- * DOM-free and advisory.
- *
- * Each finding: `{ code, severity: 'warning'|'info', message, kind, ids }`;
- * `kind` says what the ids name ('view' here; a subclass adds its own).
- * Each check is a method listed by `checks()`, so a subclass can add, drop or
- * reorder them.
- */
-export class ViewSetChecker {
-    /** @param {ViewSetModel} model */
-    constructor(model) {
-        this.model = model;
-    }
-
-    /** The checks to run, in the order their findings are listed. */
-    checks() {
-        return [this.emptyViews];
-    }
-
-    /** Every finding. @returns {Array<Object>} */
-    run() {
-        return this.checks().flatMap(check => check.call(this));
-    }
-
-    /** Views with nothing on them (a template is left out: an empty one is still a start). */
-    emptyViews() {
-        return this.model.views()
-            .filter(v => !v.template && v.isEmpty())
-            .map(v => ({ code: 'empty-view', severity: 'info', kind: 'view', ids: [v.id], message: `View "${v.title || v.name || v.id}" is empty` }));
-    }
-}
+import { ModelChecker } from '../ModelChecker.js';
+
+/**
+ * ViewSetChecker — checks over any ViewSetModel (a template editor's
+ * DiagramModel, an ArchimateModel): what is wrong or worth a look across its
+ * views (a ModelChecker: findings, checks listed by `checks()`). A notation
+ * adds its own checks in a subclass (ArchimateModelChecker). `kind` in a
+ * finding is 'view' here; a subclass adds its own.
+ */
+export class ViewSetChecker extends ModelChecker {
+    /** The checks to run, in the order their findings are listed. */
+    checks() {
+        return [this.emptyViews];
+    }
+
+    /** Views with nothing on them (a template is left out: an empty one is still a start). */
+    emptyViews() {
+        return this.model.views()
+            .filter(v => !v.template && v.isEmpty())
+            .map(v => ({ code: 'empty-view', severity: 'info', kind: 'view', ids: [v.id], message: `View "${v.title || v.name || v.id}" is empty` }));
+    }
+}